fix(human-app/frontend/logo-icon): handle logo icon click on mobile d…

…rawers
humanprotocol · Oct 25, 2024 · 9726053 · 9726053
1 parent 846223a
commit 9726053
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 3 deletions.
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
@@ -76,7 +76,7 @@ export function DrawerNavigation({
         {!isMobile && (
           <Stack
             alignItems="flex-start"
-            sx={{ paddingLeft: '26px', cursor: 'pointer' }}
+            sx={{ paddingLeft: '60px', cursor: 'pointer' }}
             onClick={handleMainNavIconClick}
           >
             <HumanLogoNavbarIcon />

diff --git a/packages/apps/human-app/frontend/src/components/layout/protected/navbar.tsx b/packages/apps/human-app/frontend/src/components/layout/protected/navbar.tsx
@@ -84,6 +84,9 @@ export function Navbar({
       <Grid
         sx={{ cursor: 'pointer', paddingLeft: '8px' }}
         onClick={() => {
+          if (isMobile) {
+            setOpen(false);
+          }
           handleMainNavIconClick();
         }}
         role="button"

diff --git a/...d/src/pages/worker/jobs/components/available-jobs/mobile/available-jobs-drawer-mobile.tsx b/...d/src/pages/worker/jobs/components/available-jobs/mobile/available-jobs-drawer-mobile.tsx
@@ -13,13 +13,15 @@ import { AvailableJobsNetworkFilterMobile } from '@/pages/worker/jobs/components
 import { AvailableJobsStatusFilterMobile } from '@/pages/worker/jobs/components/available-jobs/mobile/available-jobs-status-filter-mobile';
 import { AvailableJobsJobTypeFilterMobile } from '@/pages/worker/jobs/components/available-jobs/mobile/available-jobs-job-type-filter-mobile';
 import { useColorMode } from '@/hooks/use-color-mode';
+import { useHandleMainNavIconClick } from '@/hooks/use-handle-main-nav-icon-click';
 
 interface DrawerMobileProps {
   setIsMobileFilterDrawerOpen: Dispatch<SetStateAction<boolean>>;
 }
 export function AvailableJobsDrawerMobile({
   setIsMobileFilterDrawerOpen,
 }: DrawerMobileProps) {
+  const handleMainNavIconClick = useHandleMainNavIconClick();
   const { colorPalette } = useColorMode();
   const { t } = useTranslation();
   const { setFilterParams, filterParams } = useJobsFilterStore();
@@ -58,7 +60,15 @@ export function AvailableJobsDrawerMobile({
             zIndex: '999999',
           }}
         >
-          <HumanLogoIcon />
+          <Stack
+            sx={{ cursor: 'pointer' }}
+            onClick={() => {
+              handleMainNavIconClick();
+              // setIsMobileFilterDrawerOpen(false);
+            }}
+          >
+            <HumanLogoIcon />
+          </Stack>
 
           <IconButton
             onClick={() => {

diff --git a/...an-app/frontend/src/pages/worker/jobs/components/my-jobs/mobile/my-jobs-drawer-mobile.tsx b/...an-app/frontend/src/pages/worker/jobs/components/my-jobs/mobile/my-jobs-drawer-mobile.tsx
@@ -10,6 +10,7 @@ import { Button } from '@/components/ui/button';
 import { HumanLogoIcon, SortArrow } from '@/components/ui/icons';
 import { useMyJobsFilterStore } from '@/hooks/use-my-jobs-filter-store';
 import { useColorMode } from '@/hooks/use-color-mode';
+import { useHandleMainNavIconClick } from '@/hooks/use-handle-main-nav-icon-click';
 import { MyJobsNetworkFilterMobile } from './my-jobs-network-filter-mobile';
 import { MyJobsJobTypeFilterMobile } from './my-jobs-job-type-filter-mobile';
 import { MyJobsStatusFilterMobile } from './my-jobs-status-filter-mobile';
@@ -20,6 +21,7 @@ interface DrawerMobileProps {
 export function MyJobsDrawerMobile({
   setIsMobileFilterDrawerOpen,
 }: DrawerMobileProps) {
+  const handleMainNavIconClick = useHandleMainNavIconClick();
   const { colorPalette } = useColorMode();
   const { t } = useTranslation();
   const { setFilterParams, filterParams } = useMyJobsFilterStore();
@@ -58,7 +60,15 @@ export function MyJobsDrawerMobile({
             zIndex: '999999',
           }}
         >
-          <HumanLogoIcon />
+          <Stack
+            sx={{ cursor: 'pointer' }}
+            onClick={() => {
+              handleMainNavIconClick();
+              // setIsMobileFilterDrawerOpen(false);
+            }}
+          >
+            <HumanLogoIcon />
+          </Stack>
 
           <IconButton
             onClick={() => {