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

21
packages/twenty-front/src/modules/navigation/components/MobileNavigationBar.tsx
View File

@ -1,11 +1,9 @@
import { useRecoilState } from 'recoil';
import { IconComponent, IconList, IconSearch, IconSettings } from 'twenty-ui';
import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
import { isCommandMenuOpenedState } from '@/command-menu/states/isCommandMenuOpenedState';
import { NavigationBar } from '@/ui/navigation/navigation-bar/components/NavigationBar';
import { isNavigationDrawerOpenState } from '@/ui/navigation/states/isNavigationDrawerOpenState';
import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNavigationDrawerExpanded';
import { useRecoilState } from 'recoil';
import { IconComponent, IconList, IconSearch, IconSettings } from 'twenty-ui';
import { useIsSettingsPage } from '../hooks/useIsSettingsPage';
import { currentMobileNavigationDrawerState } from '../states/currentMobileNavigationDrawerState';
@ -15,13 +13,12 @@ export const MobileNavigationBar = () => {
const [isCommandMenuOpened] = useRecoilState(isCommandMenuOpenedState);
const { closeCommandMenu, openCommandMenu } = useCommandMenu();
const isSettingsPage = useIsSettingsPage();
const [isNavigationDrawerOpen, setIsNavigationDrawerOpen] = useRecoilState(
isNavigationDrawerOpenState,
);
const [isNavigationDrawerExpanded, setIsNavigationDrawerExpanded] =
useRecoilState(isNavigationDrawerExpandedState);
const [currentMobileNavigationDrawer, setCurrentMobileNavigationDrawer] =
useRecoilState(currentMobileNavigationDrawerState);
const activeItemName = isNavigationDrawerOpen
const activeItemName = isNavigationDrawerExpanded
? currentMobileNavigationDrawer
: isCommandMenuOpened
? 'search'
@ -39,7 +36,7 @@ export const MobileNavigationBar = () => {
Icon: IconList,
onClick: () => {
closeCommandMenu();
setIsNavigationDrawerOpen(
setIsNavigationDrawerExpanded(
(previousIsOpen) => activeItemName !== 'main' || !previousIsOpen,
);
setCurrentMobileNavigationDrawer('main');
@ -52,7 +49,7 @@ export const MobileNavigationBar = () => {
if (!isCommandMenuOpened) {
openCommandMenu();
}
setIsNavigationDrawerOpen(false);
setIsNavigationDrawerExpanded(false);
},
},
{
@ -60,7 +57,7 @@ export const MobileNavigationBar = () => {
Icon: IconSettings,
onClick: () => {
closeCommandMenu();
setIsNavigationDrawerOpen(
setIsNavigationDrawerExpanded(
(previousIsOpen) => activeItemName !== 'settings' || !previousIsOpen,
);
setCurrentMobileNavigationDrawer('settings');