fix: Invisible content after closing the settings on mobile (#15971)
## Description - This PR address https://github.com/twentyhq/twenty/issues/15958 - updated settings and main with condition to navigate to defaultHomePagePath for main page - updated search with context before opening search hence it resolve the issue of search showing blank on settings page ## Before https://github.com/user-attachments/assets/26eb50a0-fb59-4f70-9647-b8150dfdfa40 ## After https://github.com/user-attachments/assets/436fd869-fc0f-4921-98b9-d5eafa67a07f --------- Co-authored-by: Marie Stoppa <marie.stoppa@essec.edu>
This commit is contained in:
@@ -1,8 +1,14 @@
|
||||
import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
|
||||
import { useOpenRecordsSearchPageInCommandMenu } from '@/command-menu/hooks/useOpenRecordsSearchPageInCommandMenu';
|
||||
import { isCommandMenuOpenedState } from '@/command-menu/states/isCommandMenuOpenedState';
|
||||
import { MAIN_CONTEXT_STORE_INSTANCE_ID } from '@/context-store/constants/MainContextStoreInstanceId';
|
||||
import { contextStoreCurrentObjectMetadataItemIdComponentState } from '@/context-store/states/contextStoreCurrentObjectMetadataItemIdComponentState';
|
||||
import { useDefaultHomePagePath } from '@/navigation/hooks/useDefaultHomePagePath';
|
||||
import { useOpenSettingsMenu } from '@/navigation/hooks/useOpenSettings';
|
||||
import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
|
||||
import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNavigationDrawerExpanded';
|
||||
import { useRecoilComponentState } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentState';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useRecoilState } from 'recoil';
|
||||
import {
|
||||
type IconComponent,
|
||||
@@ -17,6 +23,8 @@ import { currentMobileNavigationDrawerState } from '../states/currentMobileNavig
|
||||
type NavigationBarItemName = 'main' | 'search' | 'tasks' | 'settings';
|
||||
|
||||
export const MobileNavigationBar = () => {
|
||||
const navigate = useNavigate();
|
||||
const { defaultHomePagePath } = useDefaultHomePagePath();
|
||||
const [isCommandMenuOpened] = useRecoilState(isCommandMenuOpenedState);
|
||||
const { closeCommandMenu } = useCommandMenu();
|
||||
const { openRecordsSearchPage } = useOpenRecordsSearchPageInCommandMenu();
|
||||
@@ -26,6 +34,14 @@ export const MobileNavigationBar = () => {
|
||||
const [currentMobileNavigationDrawer, setCurrentMobileNavigationDrawer] =
|
||||
useRecoilState(currentMobileNavigationDrawerState);
|
||||
const { openSettingsMenu } = useOpenSettingsMenu();
|
||||
const { alphaSortedActiveNonSystemObjectMetadataItems } =
|
||||
useFilteredObjectMetadataItems();
|
||||
|
||||
const [, setContextStoreCurrentObjectMetadataItemId] =
|
||||
useRecoilComponentState(
|
||||
contextStoreCurrentObjectMetadataItemIdComponentState,
|
||||
MAIN_CONTEXT_STORE_INSTANCE_ID,
|
||||
);
|
||||
|
||||
const activeItemName = isNavigationDrawerExpanded
|
||||
? currentMobileNavigationDrawer
|
||||
@@ -49,12 +65,31 @@ export const MobileNavigationBar = () => {
|
||||
(previousIsOpen) => activeItemName !== 'main' || !previousIsOpen,
|
||||
);
|
||||
setCurrentMobileNavigationDrawer('main');
|
||||
|
||||
if (isSettingsPage) {
|
||||
navigate(defaultHomePagePath);
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'search',
|
||||
Icon: IconSearch,
|
||||
onClick: openRecordsSearchPage,
|
||||
onClick: () => {
|
||||
setIsNavigationDrawerExpanded(false);
|
||||
closeCommandMenu();
|
||||
|
||||
if (isSettingsPage) {
|
||||
const firstObjectMetadataItem =
|
||||
alphaSortedActiveNonSystemObjectMetadataItems[0];
|
||||
if (firstObjectMetadataItem !== undefined) {
|
||||
setContextStoreCurrentObjectMetadataItemId(
|
||||
firstObjectMetadataItem.id,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
openRecordsSearchPage();
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'settings',
|
||||
|
||||
Reference in New Issue
Block a user