diff --git a/packages/twenty-front/src/modules/sign-in-background-mock/components/SignInAppNavigationDrawerMock.tsx b/packages/twenty-front/src/modules/sign-in-background-mock/components/SignInAppNavigationDrawerMock.tsx new file mode 100644 index 000000000..d29cf365f --- /dev/null +++ b/packages/twenty-front/src/modules/sign-in-background-mock/components/SignInAppNavigationDrawerMock.tsx @@ -0,0 +1,75 @@ +import { SupportDropdown } from '@/support/components/SupportDropdown'; +import { + NavigationDrawer, + NavigationDrawerProps, +} from '@/ui/navigation/navigation-drawer/components/NavigationDrawer'; + +import { NavigationDrawerSectionForObjectMetadataItems } from '@/object-metadata/components/NavigationDrawerSectionForObjectMetadataItems'; +import { NavigationDrawerItem } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerItem'; +import { NavigationDrawerSection } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSection'; +import styled from '@emotion/styled'; +import { IconSearch, IconSettings, useIsMobile } from 'twenty-ui'; +import { generatedMockObjectMetadataItems } from '~/testing/mock-data/generatedMockObjectMetadataItems'; + +const StyledMainSection = styled(NavigationDrawerSection)` + min-height: fit-content; +`; + +const WORKSPACE_FAVORITES = [ + 'person', + 'company', + 'opportunity', + 'task', + 'note', +]; + +export type SignInAppNavigationDrawerMockProps = { + className?: string; +}; + +export const SignInAppNavigationDrawerMock = ({ + className, +}: SignInAppNavigationDrawerMockProps) => { + const isMobile = useIsMobile(); + + const children = ( + <> + {!isMobile && ( + + {}} + keyboard={['⌘', 'K']} + /> + {}} + Icon={IconSettings} + /> + + )} + + WORKSPACE_FAVORITES.includes(item.nameSingular), + )} + /> + + ); + + const footer = ; + + const drawerProps: NavigationDrawerProps = { + children, + footer, + }; + + return ( + + {drawerProps.children} + + ); +}; diff --git a/packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx b/packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx index 94821fa81..1c7d76480 100644 --- a/packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx +++ b/packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx @@ -6,6 +6,7 @@ import { AppNavigationDrawer } from '@/navigation/components/AppNavigationDrawer import { MobileNavigationBar } from '@/navigation/components/MobileNavigationBar'; import { useIsSettingsPage } from '@/navigation/hooks/useIsSettingsPage'; import { OBJECT_SETTINGS_WIDTH } from '@/settings/data-model/constants/ObjectSettings'; +import { SignInAppNavigationDrawerMock } from '@/sign-in-background-mock/components/SignInAppNavigationDrawerMock'; import { SignInBackgroundMockPage } from '@/sign-in-background-mock/components/SignInBackgroundMockPage'; import { useShowAuthModal } from '@/ui/layout/hooks/useShowAuthModal'; import { NAV_DRAWER_WIDTHS } from '@/ui/navigation/navigation-drawer/constants/NavDrawerWidths'; @@ -52,6 +53,10 @@ const StyledAppNavigationDrawer = styled(AppNavigationDrawer)` flex-shrink: 0; `; +const StyledAppNavigationDrawerMock = styled(SignInAppNavigationDrawerMock)` + flex-shrink: 0; +`; + const StyledMainContainer = styled.div` display: flex; flex: 0 1 100%; @@ -93,7 +98,11 @@ export const DefaultLayout = () => { duration: theme.animation.duration.normal, }} > - + {showAuthModal ? ( + + ) : ( + + )} {showAuthModal ? ( <> diff --git a/packages/twenty-front/src/testing/mock-data/favorite.ts b/packages/twenty-front/src/testing/mock-data/favorite.ts index 3a9d3dfe1..f87ab361c 100644 --- a/packages/twenty-front/src/testing/mock-data/favorite.ts +++ b/packages/twenty-front/src/testing/mock-data/favorite.ts @@ -1,5 +1,6 @@ import { companiesQueryResult } from '~/testing/mock-data/companies'; import { mockedWorkspaceMemberData } from '~/testing/mock-data/users'; +import { mockedViewsData } from '~/testing/mock-data/views'; export const mockedFavoritesData = [ { @@ -33,4 +34,97 @@ export const mockedFavoritesData = [ note: null, __typename: 'Favorite', }, + { + id: '20202020-dede-koko-873b-de4264d89026', + createdAt: new Date().toISOString(), + updatedAt: new Date().toISOString(), + deletedAt: null, + position: 1, + recordId: null, + workflowId: null, + workflow: null, + workflowRunId: null, + workflowRun: null, + workflowVersionId: null, + workflowVersion: null, + workspaceMemberId: null, + workspaceMember: null, + companyId: null, + company: null, + viewId: mockedViewsData[0].id, + view: mockedViewsData[0], + taskId: null, + task: null, + rocketId: null, + rocket: null, + personId: null, + person: null, + opportunityId: null, + opportunity: null, + noteId: null, + note: null, + __typename: 'Favorite', + }, + { + id: '20202020-dede-koko-873b-de4264d89026', + createdAt: new Date().toISOString(), + updatedAt: new Date().toISOString(), + deletedAt: null, + position: 1, + recordId: null, + workflowId: null, + workflow: null, + workflowRunId: null, + workflowRun: null, + workflowVersionId: null, + workflowVersion: null, + workspaceMemberId: null, + workspaceMember: null, + companyId: null, + company: null, + viewId: mockedViewsData[1].id, + view: mockedViewsData[1], + taskId: null, + task: null, + rocketId: null, + rocket: null, + personId: null, + person: null, + opportunityId: null, + opportunity: null, + noteId: null, + note: null, + __typename: 'Favorite', + }, + { + id: '20202020-dede-koko-873b-de4264d89026', + createdAt: new Date().toISOString(), + updatedAt: new Date().toISOString(), + deletedAt: null, + position: 1, + recordId: null, + workflowId: null, + workflow: null, + workflowRunId: null, + workflowRun: null, + workflowVersionId: null, + workflowVersion: null, + workspaceMemberId: null, + workspaceMember: null, + companyId: null, + company: null, + viewId: mockedViewsData[1].id, + view: mockedViewsData[1], + taskId: null, + task: null, + rocketId: null, + rocket: null, + personId: null, + person: null, + opportunityId: null, + opportunity: null, + noteId: null, + note: null, + __typename: 'Favorite', + }, ]; diff --git a/packages/twenty-front/src/testing/mock-data/views.ts b/packages/twenty-front/src/testing/mock-data/views.ts index 2bb0edd27..77eab0142 100644 --- a/packages/twenty-front/src/testing/mock-data/views.ts +++ b/packages/twenty-front/src/testing/mock-data/views.ts @@ -67,7 +67,7 @@ export const mockedViewsData = [ objectMetadataId: companyObjectMetadata?.id, type: 'table', icon: 'IconSkyline', - key: 'INDEX', + key: null, kanbanFieldMetadataId: null, position: 0, createdAt: '2021-09-01T00:00:00.000Z',