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

Open emails and calendar events inside command menu (#9477)

Browse Source 
https://github.com/user-attachments/assets/cfc8f85e-d49d-4aa1-a8c2-2410aca19444
This commit is contained in:
Raphaël Bosi
2025-01-09 14:09:30 +01:00
committed by GitHub
parent b61db75fc5
commit e62079ab6d
6 changed files with 32 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/twenty-front/src/modules/activities/calendar/components/CalendarEventDetails.tsx
View File

@ -1,4 +1,3 @@
import React from 'react';
import { css, useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import {

5
packages/twenty-front/src/modules/activities/calendar/right-drawer/components/RightDrawerCalendarEvent.tsx
View File

@ -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 (
<>
<RecordFieldValueSelectorContextProvider>
<CalendarEventDetailsEffect record={calendarEvent} />
<RecordValueSetterEffect recordId={calendarEvent.id} />
<CalendarEventDetails calendarEvent={calendarEvent} />
</>
</RecordFieldValueSelectorContextProvider>
);
};

2
packages/twenty-front/src/modules/command-menu/components/CommandMenuPages.ts
View File

@ -1,4 +1,6 @@
export enum CommandMenuPages {
Root = 'root',
ViewRecord = 'view-record',
ViewEmailThread = 'view-email-thread',
ViewCalendarEvent = 'view-calendar-event',
}

4
packages/twenty-front/src/modules/command-menu/constants/CommandMenuPagesConfig.tsx
View File

@ -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, <CommandMenu />],
[CommandMenuPages.ViewRecord, <RightDrawerRecord />],
[CommandMenuPages.ViewEmailThread, <RightDrawerEmailThread />],
[CommandMenuPages.ViewCalendarEvent, <RightDrawerCalendarEvent />],
]);

12
packages/twenty-front/src/modules/ui/layout/right-drawer/hooks/useRightDrawer.ts
View File

@ -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;
}

17
packages/twenty-front/src/modules/ui/layout/right-drawer/utils/mapRightDrawerPageToCommandMenuPage.ts Normal file
View File

@ -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;
}
};