From e62079ab6da82d9c535f2f7f0f50a13d139854f0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rapha=C3=ABl=20Bosi?= <71827178+bosiraphael@users.noreply.github.com> Date: Thu, 9 Jan 2025 14:09:30 +0100 Subject: [PATCH] Open emails and calendar events inside command menu (#9477) https://github.com/user-attachments/assets/cfc8f85e-d49d-4aa1-a8c2-2410aca19444 --- .../components/CalendarEventDetails.tsx | 1 - .../components/RightDrawerCalendarEvent.tsx | 5 +++-- .../command-menu/components/CommandMenuPages.ts | 2 ++ .../constants/CommandMenuPagesConfig.tsx | 4 ++++ .../layout/right-drawer/hooks/useRightDrawer.ts | 12 ++++++------ .../mapRightDrawerPageToCommandMenuPage.ts | 17 +++++++++++++++++ 6 files changed, 32 insertions(+), 9 deletions(-) create mode 100644 packages/twenty-front/src/modules/ui/layout/right-drawer/utils/mapRightDrawerPageToCommandMenuPage.ts diff --git a/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventDetails.tsx b/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventDetails.tsx index 581e6599e..641a99d68 100644 --- a/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventDetails.tsx +++ b/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventDetails.tsx @@ -1,4 +1,3 @@ -import React from 'react'; import { css, useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { diff --git a/packages/twenty-front/src/modules/activities/calendar/right-drawer/components/RightDrawerCalendarEvent.tsx b/packages/twenty-front/src/modules/activities/calendar/right-drawer/components/RightDrawerCalendarEvent.tsx index 24f78d715..4e3ee38ae 100644 --- a/packages/twenty-front/src/modules/activities/calendar/right-drawer/components/RightDrawerCalendarEvent.tsx +++ b/packages/twenty-front/src/modules/activities/calendar/right-drawer/components/RightDrawerCalendarEvent.tsx @@ -7,6 +7,7 @@ import { CalendarEvent } from '@/activities/calendar/types/CalendarEvent'; import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord'; import { viewableRecordIdState } from '@/object-record/record-right-drawer/states/viewableRecordIdState'; import { RecordValueSetterEffect } from '@/object-record/record-store/components/RecordValueSetterEffect'; +import { RecordFieldValueSelectorContextProvider } from '@/object-record/record-store/contexts/RecordFieldValueSelectorContext'; import { useUpsertRecordsInStore } from '@/object-record/record-store/hooks/useUpsertRecordsInStore'; export const RightDrawerCalendarEvent = () => { @@ -26,10 +27,10 @@ export const RightDrawerCalendarEvent = () => { } return ( - <> + - + ); }; diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuPages.ts b/packages/twenty-front/src/modules/command-menu/components/CommandMenuPages.ts index e783f76de..378585df6 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuPages.ts +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuPages.ts @@ -1,4 +1,6 @@ export enum CommandMenuPages { Root = 'root', ViewRecord = 'view-record', + ViewEmailThread = 'view-email-thread', + ViewCalendarEvent = 'view-calendar-event', } diff --git a/packages/twenty-front/src/modules/command-menu/constants/CommandMenuPagesConfig.tsx b/packages/twenty-front/src/modules/command-menu/constants/CommandMenuPagesConfig.tsx index ca1a09097..ff0307874 100644 --- a/packages/twenty-front/src/modules/command-menu/constants/CommandMenuPagesConfig.tsx +++ b/packages/twenty-front/src/modules/command-menu/constants/CommandMenuPagesConfig.tsx @@ -1,3 +1,5 @@ +import { RightDrawerCalendarEvent } from '@/activities/calendar/right-drawer/components/RightDrawerCalendarEvent'; +import { RightDrawerEmailThread } from '@/activities/emails/right-drawer/components/RightDrawerEmailThread'; import { CommandMenu } from '@/command-menu/components/CommandMenu'; import { CommandMenuPages } from '@/command-menu/components/CommandMenuPages'; import { RightDrawerRecord } from '@/object-record/record-right-drawer/components/RightDrawerRecord'; @@ -8,4 +10,6 @@ export const COMMAND_MENU_PAGES_CONFIG = new Map< >([ [CommandMenuPages.Root, ], [CommandMenuPages.ViewRecord, ], + [CommandMenuPages.ViewEmailThread, ], + [CommandMenuPages.ViewCalendarEvent, ], ]); diff --git a/packages/twenty-front/src/modules/ui/layout/right-drawer/hooks/useRightDrawer.ts b/packages/twenty-front/src/modules/ui/layout/right-drawer/hooks/useRightDrawer.ts index 57640c7ee..05c2c4e99 100644 --- a/packages/twenty-front/src/modules/ui/layout/right-drawer/hooks/useRightDrawer.ts +++ b/packages/twenty-front/src/modules/ui/layout/right-drawer/hooks/useRightDrawer.ts @@ -3,10 +3,10 @@ import { useRecoilCallback, useRecoilValue } from 'recoil'; import { isRightDrawerMinimizedState } from '@/ui/layout/right-drawer/states/isRightDrawerMinimizedState'; import { rightDrawerCloseEventState } from '@/ui/layout/right-drawer/states/rightDrawerCloseEventsState'; -import { CommandMenuPages } from '@/command-menu/components/CommandMenuPages'; import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu'; import { commandMenuPageState } from '@/command-menu/states/commandMenuPageState'; import { emitRightDrawerCloseEvent } from '@/ui/layout/right-drawer/utils/emitRightDrawerCloseEvent'; +import { mapRightDrawerPageToCommandMenuPage } from '@/ui/layout/right-drawer/utils/mapRightDrawerPageToCommandMenuPage'; import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled'; import { FeatureFlagKey } from '~/generated-metadata/graphql'; import { isRightDrawerOpenState } from '../states/isRightDrawerOpenState'; @@ -28,11 +28,11 @@ export const useRightDrawer = () => { const openRightDrawer = useRecoilCallback( ({ set }) => (rightDrawerPage: RightDrawerPages) => { - if ( - isCommandMenuV2Enabled && - rightDrawerPage === RightDrawerPages.ViewRecord - ) { - set(commandMenuPageState, CommandMenuPages.ViewRecord); + if (isCommandMenuV2Enabled) { + const commandMenuPage = + mapRightDrawerPageToCommandMenuPage(rightDrawerPage); + + set(commandMenuPageState, commandMenuPage); openCommandMenu(); return; } diff --git a/packages/twenty-front/src/modules/ui/layout/right-drawer/utils/mapRightDrawerPageToCommandMenuPage.ts b/packages/twenty-front/src/modules/ui/layout/right-drawer/utils/mapRightDrawerPageToCommandMenuPage.ts new file mode 100644 index 000000000..6a90ea080 --- /dev/null +++ b/packages/twenty-front/src/modules/ui/layout/right-drawer/utils/mapRightDrawerPageToCommandMenuPage.ts @@ -0,0 +1,17 @@ +import { CommandMenuPages } from '@/command-menu/components/CommandMenuPages'; +import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages'; + +export const mapRightDrawerPageToCommandMenuPage = ( + rightDrawerPage: RightDrawerPages, +) => { + switch (rightDrawerPage) { + case RightDrawerPages.ViewRecord: + return CommandMenuPages.ViewRecord; + case RightDrawerPages.ViewEmailThread: + return CommandMenuPages.ViewEmailThread; + case RightDrawerPages.ViewCalendarEvent: + return CommandMenuPages.ViewCalendarEvent; + default: + return CommandMenuPages.Root; + } +};