fix(human-app): improvements after review

KacperKoza343 · Sep 23, 2024 · c2ea9c6 · c2ea9c6
1 parent 3c97187
commit c2ea9c6
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 9 deletions.
diff --git a/...s/human-app/frontend/src/components/layout/drawer-menu-items/drawer-menu-items-worker.tsx b/...s/human-app/frontend/src/components/layout/drawer-menu-items/drawer-menu-items-worker.tsx
@@ -10,7 +10,7 @@ import { routerPaths } from '@/router/router-paths';
 
 export const workerDrawerTopMenuItems = (
   addressRegistered: boolean,
-  hasSiteKey: boolean
+  labelingEnabled: boolean
 ): TopMenuItem[] => {
   return [
     <Grid
@@ -29,7 +29,7 @@ export const workerDrawerTopMenuItems = (
     </Grid>,
     {
       label: t('components.DrawerNavigation.captchaLabelling'),
-      link: hasSiteKey
+      link: labelingEnabled
         ? routerPaths.worker.HcaptchaLabeling
         : routerPaths.worker.enableLabeler,
       disabled: !addressRegistered,

diff --git a/packages/apps/human-app/frontend/src/components/layout/protected/drawer-navigation.tsx b/packages/apps/human-app/frontend/src/components/layout/protected/drawer-navigation.tsx
@@ -101,7 +101,7 @@ export function DrawerNavigation({
               }
 
               const { link, label, disabled, href, onClick } = item;
-              const isActive = link && location.pathname === link;
+              const isActive = Boolean(link && location.pathname === link);
 
               return (
                 <ListItem disablePadding key={link}>
@@ -126,10 +126,11 @@ export function DrawerNavigation({
                         navigate(link);
                       }
                     }}
+                    selected={isActive}
                     sx={{
-                      backgroundColor: isActive
-                        ? colorPalette.chip.main
-                        : 'transparent',
+                      '&.Mui-selected': {
+                        backgroundColor: colorPalette.primary.shades,
+                      },
                     }}
                   >
                     <Stack
@@ -184,10 +185,11 @@ export function DrawerNavigation({
                         navigate(link);
                       }
                     }}
+                    selected={isActive}
                     sx={{
-                      backgroundColor: isActive
-                        ? colorPalette.chip.main
-                        : 'transparent',
+                      '&.Mui-selected': {
+                        backgroundColor: colorPalette.primary.shades,
+                      },
                     }}
                   >
                     <Stack

diff --git a/packages/apps/human-app/frontend/src/styles/color-palette.ts b/packages/apps/human-app/frontend/src/styles/color-palette.ts
@@ -1,6 +1,7 @@
 export const colorPalette = {
   white: '#FFFFFF',
   black: '#000000',
+
   text: {
     primary: '#320A8D',
     secondary: '#858EC6',
@@ -12,6 +13,7 @@ export const colorPalette = {
     light: '#6309FF',
     dark: '#100735',
     contrastText: '#F9FAFF',
+    shades: '#DADEF0CC',
   },
   secondary: {
     main: '#6309FF',