diff --git a/packages/twenty-front/src/modules/navigation/components/AppNavigationDrawer.tsx b/packages/twenty-front/src/modules/navigation/components/AppNavigationDrawer.tsx
index 1b15fbbc138..13f3194c497 100644
--- a/packages/twenty-front/src/modules/navigation/components/AppNavigationDrawer.tsx
+++ b/packages/twenty-front/src/modules/navigation/components/AppNavigationDrawer.tsx
@@ -1,7 +1,10 @@
+import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
+import { MainNavigationDrawerContent } from '@/navigation/components/MainNavigationDrawerContent';
+import { SettingsNavigationDrawerContent } from '@/navigation/components/SettingsNavigationDrawerContent';
import { useIsSettingsDrawer } from '@/navigation/hooks/useIsSettingsDrawer';
-
-import { MainNavigationDrawer } from '@/navigation/components/MainNavigationDrawer';
-import { SettingsNavigationDrawer } from '@/navigation/components/SettingsNavigationDrawer';
+import { NavigationDrawer } from '@/ui/navigation/navigation-drawer/components/NavigationDrawer';
+import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomStateValue';
+import { useLingui } from '@lingui/react/macro';
export type AppNavigationDrawerProps = {
className?: string;
@@ -11,10 +14,23 @@ export const AppNavigationDrawer = ({
className,
}: AppNavigationDrawerProps) => {
const isSettingsDrawer = useIsSettingsDrawer();
+ const { t } = useLingui();
+ const currentWorkspace = useAtomStateValue(currentWorkspaceState);
- return isSettingsDrawer ? (
-
- ) : (
-
+ return (
+
+ {isSettingsDrawer ? (
+
+ ) : (
+
+ )}
+
);
};
diff --git a/packages/twenty-front/src/modules/navigation/components/MainNavigationDrawer.tsx b/packages/twenty-front/src/modules/navigation/components/MainNavigationDrawerContent.tsx
similarity index 75%
rename from packages/twenty-front/src/modules/navigation/components/MainNavigationDrawer.tsx
rename to packages/twenty-front/src/modules/navigation/components/MainNavigationDrawerContent.tsx
index 839402e8864..1a8142e5969 100644
--- a/packages/twenty-front/src/modules/navigation/components/MainNavigationDrawer.tsx
+++ b/packages/twenty-front/src/modules/navigation/components/MainNavigationDrawerContent.tsx
@@ -1,25 +1,19 @@
-import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
import { NavigationDrawerAIChatContent } from '@/ai/components/NavigationDrawerAIChatContent';
import { MainNavigationDrawerNavigationContent } from '@/navigation/components/MainNavigationDrawerNavigationContent';
import { MainNavigationDrawerTabsRow } from '@/navigation/components/MainNavigationDrawerTabsRow';
-import { NavigationDrawer } from '@/ui/navigation/navigation-drawer/components/NavigationDrawer';
import { NavigationDrawerFixedContent } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerFixedContent';
import { NavigationDrawerScrollableContent } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerScrollableContent';
import { navigationDrawerActiveTabState } from '@/ui/navigation/states/navigationDrawerActiveTabState';
import { NAVIGATION_DRAWER_TABS } from '@/ui/navigation/states/navigationDrawerTabs';
import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomStateValue';
-export const MainNavigationDrawer = ({ className }: { className?: string }) => {
+export const MainNavigationDrawerContent = () => {
const navigationDrawerActiveTab = useAtomStateValue(
navigationDrawerActiveTabState,
);
- const currentWorkspace = useAtomStateValue(currentWorkspaceState);
return (
-
+ <>
@@ -32,6 +26,6 @@ export const MainNavigationDrawer = ({ className }: { className?: string }) => {
)}
-
+ >
);
};
diff --git a/packages/twenty-front/src/modules/navigation/components/MainNavigationDrawerScrollableItems.tsx b/packages/twenty-front/src/modules/navigation/components/MainNavigationDrawerScrollableItems.tsx
index cffe96eca2d..eda3145718c 100644
--- a/packages/twenty-front/src/modules/navigation/components/MainNavigationDrawerScrollableItems.tsx
+++ b/packages/twenty-front/src/modules/navigation/components/MainNavigationDrawerScrollableItems.tsx
@@ -1,28 +1,12 @@
import { NavigationDrawerOpenedSection } from '@/navigation-menu-item/display/sections/components/NavigationDrawerOpenedSection';
-import { NavigationDrawerWorkspaceSectionSkeletonLoader } from '@/object-metadata/components/NavigationDrawerWorkspaceSectionSkeletonLoader';
+import { FavoritesSectionDispatcher } from '@/navigation-menu-item/display/sections/favorites/components/FavoritesSectionDispatcher';
+import { WorkspaceSectionDispatcher } from '@/navigation-menu-item/display/sections/workspace/components/WorkspaceSectionDispatcher';
import { NavigationDrawerOtherSection } from '@/navigation/components/NavigationDrawerOtherSection';
import { styled } from '@linaria/react';
-import { lazy, Suspense } from 'react';
import { themeCssVariables } from 'twenty-ui/theme-constants';
-const FavoritesSectionDispatcher = lazy(() =>
- import(
- '@/navigation-menu-item/display/sections/favorites/components/FavoritesSectionDispatcher'
- ).then((module) => ({
- default: module.FavoritesSectionDispatcher,
- })),
-);
-
-const WorkspaceSectionDispatcher = lazy(() =>
- import(
- '@/navigation-menu-item/display/sections/workspace/components/WorkspaceSectionDispatcher'
- ).then((module) => ({
- default: module.WorkspaceSectionDispatcher,
- })),
-);
-
const StyledScrollableItemsContainer = styled.div`
display: flex;
flex-direction: column;
@@ -33,10 +17,8 @@ export const MainNavigationDrawerScrollableItems = () => {
return (
- }>
-
-
-
+
+
);
diff --git a/packages/twenty-front/src/modules/navigation/components/SettingsNavigationDrawer.tsx b/packages/twenty-front/src/modules/navigation/components/SettingsNavigationDrawerContent.tsx
similarity index 81%
rename from packages/twenty-front/src/modules/navigation/components/SettingsNavigationDrawer.tsx
rename to packages/twenty-front/src/modules/navigation/components/SettingsNavigationDrawerContent.tsx
index 36a149dc806..d01c91926ae 100644
--- a/packages/twenty-front/src/modules/navigation/components/SettingsNavigationDrawer.tsx
+++ b/packages/twenty-front/src/modules/navigation/components/SettingsNavigationDrawerContent.tsx
@@ -1,5 +1,4 @@
import { SettingsNavigationDrawerItems } from '@/settings/components/SettingsNavigationDrawerItems';
-import { NavigationDrawer } from '@/ui/navigation/navigation-drawer/components/NavigationDrawer';
import { NavigationDrawerFixedContent } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerFixedContent';
import { NavigationDrawerScrollableContent } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerScrollableContent';
import { isAdvancedModeEnabledState } from '@/ui/navigation/navigation-drawer/states/isAdvancedModeEnabledState';
@@ -7,18 +6,14 @@ import { useAtomState } from '@/ui/utilities/state/jotai/hooks/useAtomState';
import { useLingui } from '@lingui/react/macro';
import { AdvancedSettingsToggle } from 'twenty-ui/navigation';
-export const SettingsNavigationDrawer = ({
- className,
-}: {
- className?: string;
-}) => {
+export const SettingsNavigationDrawerContent = () => {
const { t } = useLingui();
const [isAdvancedModeEnabled, setIsAdvancedModeEnabled] = useAtomState(
isAdvancedModeEnabledState,
);
return (
-
+ <>
@@ -30,6 +25,6 @@ export const SettingsNavigationDrawer = ({
label={t`Advanced:`}
/>
-
+ >
);
};