admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat - Compact sidebar (#7414)

Browse Source
This commit is contained in:
nitin
2024-10-15 17:32:28 +05:30
committed by GitHub
parent c0610419c2
commit a9deede9ba
26 changed files with 524 additions and 292 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
packages/twenty-front/src/modules/navigation/components/AppNavigationDrawer.tsx
View File

@ -8,14 +8,14 @@ import {
NavigationDrawer,
NavigationDrawerProps,
} from '@/ui/navigation/navigation-drawer/components/NavigationDrawer';
import { isNavigationDrawerOpenState } from '@/ui/navigation/states/isNavigationDrawerOpenState';
import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
import { getImageAbsoluteURI } from '~/utils/image/getImageAbsoluteURI';
import { useIsSettingsPage } from '../hooks/useIsSettingsPage';
import { currentMobileNavigationDrawerState } from '../states/currentMobileNavigationDrawerState';
import { useIsSettingsDrawer } from '@/navigation/hooks/useIsSettingsDrawer';
import { AdvancedSettingsToggle } from '@/ui/navigation/link/components/AdvancedSettingsToggle';
import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNavigationDrawerExpanded';
import { MainNavigationDrawerItems } from './MainNavigationDrawerItems';
export type AppNavigationDrawerProps = {
@ -26,22 +26,14 @@ export const AppNavigationDrawer = ({
className,
}: AppNavigationDrawerProps) => {
const isMobile = useIsMobile();
const isSettingsPage = useIsSettingsPage();
const currentMobileNavigationDrawer = useRecoilValue(
currentMobileNavigationDrawerState,
);
const setIsNavigationDrawerOpen = useSetRecoilState(
isNavigationDrawerOpenState,
const isSettingsDrawer = useIsSettingsDrawer();
const setIsNavigationDrawerExpanded = useSetRecoilState(
isNavigationDrawerExpandedState,
);
const currentWorkspace = useRecoilValue(currentWorkspaceState);
const isSettingsDrawer = isMobile
? currentMobileNavigationDrawer === 'settings'
: isSettingsPage;
const drawerProps: NavigationDrawerProps = isSettingsDrawer
? {
isSubMenu: true,
title: 'Exit Settings',
children: <SettingsNavigationDrawerItems />,
footer: <AdvancedSettingsToggle />,
@ -57,13 +49,12 @@ export const AppNavigationDrawer = ({
};
useEffect(() => {
setIsNavigationDrawerOpen(!isMobile);
}, [isMobile, setIsNavigationDrawerOpen]);
setIsNavigationDrawerExpanded(!isMobile);
}, [isMobile, setIsNavigationDrawerExpanded]);
return (
<NavigationDrawer
className={className}
isSubMenu={drawerProps.isSubMenu}
logo={drawerProps.logo}
title={drawerProps.title}
footer={drawerProps.footer}