bro.config.js

@@ -14,8 +14,8 @@ module.exports = {
     'dry-wash.main': '/dry-wash',
     'dry-wash.create': '/order',
     'dry-wash.view.order': '/order/:orderId',
-    'dry-wash.arm.master': 'master',
-    'dry-wash.arm.order': 'order',
+    'dry-wash.arm.master': '/master',
+    'dry-wash.arm.order': '/order',
     'dry-wash.arm': '/arm/*',
   },
   features: {

src/components/Sidebar/Sidebar.tsx

@@ -1,14 +1,11 @@
 import { Box, Button, Heading, VStack, Divider } from '@chakra-ui/react';
 import React from 'react';
-import { useLocation, Link } from 'react-router-dom';
+import { Link } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 
 import { URLs } from '../../__data__/urls';
 
 const Sidebar = () => {
-  const location = useLocation();
-  const isActive = (keyword: string) => location.pathname.includes(keyword);
-
   const { t } = useTranslation('~', {
     keyPrefix: 'dry-wash.arm.master.sideBar',
   });
@@ -33,8 +30,8 @@ const Sidebar = () => {
             as={Link}
             to={URLs.armOrder.url}
             w='100%'
-            colorScheme={isActive(URLs.armOrder.url) ? 'green' : 'blue'}
-            variant={isActive(URLs.armOrder.url) ? 'solid' : 'ghost'}
+            colorScheme='green'
+            variant='ghost'
           >
             {t('orders')}
           </Button>
@@ -45,8 +42,8 @@ const Sidebar = () => {
             as={Link}
             to={URLs.armMaster.url}
             w='100%'
-            colorScheme={isActive(URLs.armMaster.url) ? 'green' : 'blue'}
-            variant={isActive(URLs.armMaster.url) ? 'solid' : 'ghost'}
+            colorScheme='green'
+            variant='ghost'
           >
             {t('master')}
           </Button>