From 24c0b0f8733565912efda91077597773cb1909a1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rapha=C3=ABl=20Bosi?= <71827178+bosiraphael@users.noreply.github.com> Date: Wed, 20 Nov 2024 14:33:16 +0100 Subject: [PATCH] =?UTF-8?q?Remove=20"When=20no=20records=20are=20selected"?= =?UTF-8?q?=20actions=20on=20record=20page=20=E2=8C=98O=20(#8575)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Closes #8566 - Introduce the concept of scope for an ActionMenuEntry, scope is either `global` or `record-selection` --- .../components/WorkflowRunActionEffect.tsx | 1 + .../components/DeleteRecordsActionEffect.tsx | 1 + .../components/ExportRecordsActionEffect.tsx | 1 + .../ManageFavoritesActionEffect.tsx | 1 + .../WorkflowRunRecordActionEffect.tsx | 1 + .../RightDrawerActionMenuDropdown.tsx | 34 +++++++++++-------- .../RecordIndexActionMenuBar.stories.tsx | 1 + .../RecordIndexActionMenuBarEntry.stories.tsx | 3 ++ .../RecordIndexActionMenuDropdown.stories.tsx | 3 ++ .../RecordShowActionMenuBar.stories.tsx | 3 ++ .../action-menu/types/ActionMenuEntry.ts | 1 + 11 files changed, 35 insertions(+), 15 deletions(-) diff --git a/packages/twenty-front/src/modules/action-menu/actions/global-actions/workflow-run-actions/components/WorkflowRunActionEffect.tsx b/packages/twenty-front/src/modules/action-menu/actions/global-actions/workflow-run-actions/components/WorkflowRunActionEffect.tsx index e990911d74..0929ffc81d 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/global-actions/workflow-run-actions/components/WorkflowRunActionEffect.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/global-actions/workflow-run-actions/components/WorkflowRunActionEffect.tsx @@ -30,6 +30,7 @@ export const WorkflowRunActionEffect = () => { addActionMenuEntry({ type: 'workflow-run', key: `workflow-run-${activeWorkflowVersion.id}`, + scope: 'global', label: capitalize(activeWorkflowVersion.workflow.name), position: index, Icon: IconSettingsAutomation, diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/DeleteRecordsActionEffect.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/DeleteRecordsActionEffect.tsx index d19e77d12e..4f6d4f9142 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/DeleteRecordsActionEffect.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/DeleteRecordsActionEffect.tsx @@ -106,6 +106,7 @@ export const DeleteRecordsActionEffect = ({ if (canDelete) { addActionMenuEntry({ type: 'standard', + scope: 'record-selection', key: 'delete', label: 'Delete', position, diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx index 6bdc2e648d..4ca2af1d52 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx @@ -32,6 +32,7 @@ export const ExportRecordsActionEffect = ({ useEffect(() => { addActionMenuEntry({ type: 'standard', + scope: 'record-selection', key: 'export', position, label: displayedExportProgress( diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ManageFavoritesActionEffect.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ManageFavoritesActionEffect.tsx index 714f06c863..ecb31f1975 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ManageFavoritesActionEffect.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ManageFavoritesActionEffect.tsx @@ -51,6 +51,7 @@ export const ManageFavoritesActionEffect = ({ addActionMenuEntry({ type: 'standard', + scope: 'record-selection', key: 'manage-favorites', label: isFavorite ? 'Remove from favorites' : 'Add to favorites', position, diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/workflow-run-record-actions/components/WorkflowRunRecordActionEffect.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/workflow-run-record-actions/components/WorkflowRunRecordActionEffect.tsx index f724a7087c..8f7b1a85f7 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/workflow-run-record-actions/components/WorkflowRunRecordActionEffect.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/workflow-run-record-actions/components/WorkflowRunRecordActionEffect.tsx @@ -57,6 +57,7 @@ export const WorkflowRunRecordActionEffect = ({ addActionMenuEntry({ type: 'workflow-run', key: `workflow-run-${activeWorkflowVersion.id}`, + scope: 'record-selection', label: capitalize(activeWorkflowVersion.workflow.name), position: index, Icon: IconSettingsAutomation, diff --git a/packages/twenty-front/src/modules/action-menu/components/RightDrawerActionMenuDropdown.tsx b/packages/twenty-front/src/modules/action-menu/components/RightDrawerActionMenuDropdown.tsx index ed3c1ee227..2eeba81904 100644 --- a/packages/twenty-front/src/modules/action-menu/components/RightDrawerActionMenuDropdown.tsx +++ b/packages/twenty-front/src/modules/action-menu/components/RightDrawerActionMenuDropdown.tsx @@ -65,21 +65,25 @@ export const RightDrawerActionMenuDropdown = () => { }} dropdownComponents={ - {actionMenuEntries.map((item, index) => ( - { - closeDropdown( - getRightDrawerActionMenuDropdownIdFromActionMenuId( - actionMenuId, - ), - ); - item.onClick?.(); - }} - text={item.label} - /> - ))} + {actionMenuEntries + .filter( + (actionMenuEntry) => actionMenuEntry.scope === 'record-selection', + ) + .map((actionMenuEntry, index) => ( + { + closeDropdown( + getRightDrawerActionMenuDropdownIdFromActionMenuId( + actionMenuId, + ), + ); + actionMenuEntry.onClick?.(); + }} + text={actionMenuEntry.label} + /> + ))} } /> diff --git a/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuBar.stories.tsx b/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuBar.stories.tsx index b7752d42f6..dea3e8fc74 100644 --- a/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuBar.stories.tsx +++ b/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuBar.stories.tsx @@ -48,6 +48,7 @@ const meta: Meta = { map.set('delete', { isPinned: true, + scope: 'record-selection', type: 'standard', key: 'delete', label: 'Delete', diff --git a/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuBarEntry.stories.tsx b/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuBarEntry.stories.tsx index 275058bc27..6eda55a0c3 100644 --- a/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuBarEntry.stories.tsx +++ b/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuBarEntry.stories.tsx @@ -22,6 +22,7 @@ export const Default: Story = { args: { entry: { type: 'standard', + scope: 'record-selection', key: 'delete', label: 'Delete', position: 0, @@ -35,6 +36,7 @@ export const WithDangerAccent: Story = { args: { entry: { type: 'standard', + scope: 'record-selection', key: 'delete', label: 'Delete', position: 0, @@ -49,6 +51,7 @@ export const WithInteraction: Story = { args: { entry: { type: 'standard', + scope: 'record-selection', key: 'markAsDone', label: 'Mark as done', position: 0, diff --git a/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuDropdown.stories.tsx b/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuDropdown.stories.tsx index e9ba359dfa..ba8a22cf05 100644 --- a/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuDropdown.stories.tsx +++ b/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordIndexActionMenuDropdown.stories.tsx @@ -42,6 +42,7 @@ const meta: Meta = { map.set('delete', { type: 'standard', + scope: 'record-selection', key: 'delete', label: 'Delete', position: 0, @@ -51,6 +52,7 @@ const meta: Meta = { map.set('markAsDone', { type: 'standard', + scope: 'record-selection', key: 'markAsDone', label: 'Mark as done', position: 1, @@ -60,6 +62,7 @@ const meta: Meta = { map.set('addToFavorites', { type: 'standard', + scope: 'record-selection', key: 'addToFavorites', label: 'Add to favorites', position: 2, diff --git a/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordShowActionMenuBar.stories.tsx b/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordShowActionMenuBar.stories.tsx index 4a86046bd5..a400f43414 100644 --- a/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordShowActionMenuBar.stories.tsx +++ b/packages/twenty-front/src/modules/action-menu/components/__stories__/RecordShowActionMenuBar.stories.tsx @@ -55,6 +55,7 @@ const meta: Meta = { map.set('addToFavorites', { type: 'standard', + scope: 'record-selection', key: 'addToFavorites', label: 'Add to favorites', position: 0, @@ -64,6 +65,7 @@ const meta: Meta = { map.set('export', { type: 'standard', + scope: 'record-selection', key: 'export', label: 'Export', position: 1, @@ -73,6 +75,7 @@ const meta: Meta = { map.set('delete', { type: 'standard', + scope: 'record-selection', key: 'delete', label: 'Delete', position: 2, diff --git a/packages/twenty-front/src/modules/action-menu/types/ActionMenuEntry.ts b/packages/twenty-front/src/modules/action-menu/types/ActionMenuEntry.ts index 568bd3a33b..993cff704d 100644 --- a/packages/twenty-front/src/modules/action-menu/types/ActionMenuEntry.ts +++ b/packages/twenty-front/src/modules/action-menu/types/ActionMenuEntry.ts @@ -3,6 +3,7 @@ import { IconComponent, MenuItemAccent } from 'twenty-ui'; export type ActionMenuEntry = { type: 'standard' | 'workflow-run'; + scope: 'global' | 'record-selection'; key: string; label: string; position: number;