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

271 remove is command menu v2 enabled (#10809)

Browse Source 
Closes https://github.com/twentyhq/core-team-issues/issues/271

This PR
- Removes the feature flag IS_COMMAND_MENU_V2_ENABLED
- Removes all old Right drawer components
- Removes the Action menu bar
- Removes unused Copilot page
This commit is contained in:
Raphaël Bosi
2025-03-12 16:26:29 +01:00
committed by GitHub
parent 1b0413bf8b
commit daa501549e
124 changed files with 281 additions and 4222 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx
View File

@ -24,7 +24,6 @@ export const CommandMenu = () => {
const {
noResults,
copilotCommands,
matchingStandardActionRecordSelectionCommands,
matchingStandardActionObjectCommands,
matchingWorkflowRunRecordSelectionCommands,
@ -47,10 +46,6 @@ export const CommandMenu = () => {
);
const commandGroups: CommandGroupConfig[] = [
{
heading: t`Copilot`,
items: copilotCommands,
},
{
heading: t`Record Selection`,
items: matchingStandardActionRecordSelectionCommands.concat(

95
packages/twenty-front/src/modules/command-menu/components/CommandMenuTopBar.tsx
View File

@ -11,7 +11,6 @@ import { commandMenuSearchState } from '@/command-menu/states/commandMenuSearchS
import { CommandMenuPages } from '@/command-menu/types/CommandMenuPages';
import { contextStoreCurrentObjectMetadataItemComponentState } from '@/context-store/states/contextStoreCurrentObjectMetadataItemComponentState';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { useLingui } from '@lingui/react/macro';
@ -24,11 +23,9 @@ import {
Button,
IconChevronLeft,
IconX,
LightIconButton,
getOsControlSymbol,
useIsMobile,
} from 'twenty-ui';
import { FeatureFlagKey } from '~/generated-metadata/graphql';
const StyledInputContainer = styled.div`
align-items: center;
@ -75,13 +72,6 @@ const StyledContentContainer = styled.div`
gap: ${({ theme }) => theme.spacing(1)};
`;
const StyledCloseButtonContainer = styled.div`
align-items: center;
display: flex;
height: 32px;
justify-content: center;
`;
const StyledCloseButtonWrapper = styled.div<{ isVisible: boolean }>`
visibility: ${({ isVisible }) => (isVisible ? 'visible' : 'hidden')};
`;
@ -110,10 +100,6 @@ export const CommandMenuTopBar = () => {
const theme = useTheme();
const isCommandMenuV2Enabled = useIsFeatureEnabled(
FeatureFlagKey.IsCommandMenuV2Enabled,
);
const { contextChips } = useCommandMenuContextChips();
const location = useLocation();
@ -127,34 +113,30 @@ export const CommandMenuTopBar = () => {
return (
<StyledInputContainer>
<StyledContentContainer>
{isCommandMenuV2Enabled && (
<>
<AnimatePresence>
{commandMenuPage !== CommandMenuPages.Root && (
<motion.div
exit={{ opacity: 0, width: 0 }}
transition={{
duration: backButtonAnimationDuration,
}}
>
<CommandMenuContextChip
Icons={[<IconChevronLeft size={theme.icon.size.sm} />]}
onClick={goBackFromCommandMenu}
testId="command-menu-go-back-button"
/>
</motion.div>
)}
</AnimatePresence>
{isDefined(contextStoreCurrentObjectMetadataItem) &&
commandMenuPage !== CommandMenuPages.SearchRecords ? (
<CommandMenuContextChipGroupsWithRecordSelection
contextChips={contextChips}
objectMetadataItemId={contextStoreCurrentObjectMetadataItem.id}
<AnimatePresence>
{commandMenuPage !== CommandMenuPages.Root && (
<motion.div
exit={{ opacity: 0, width: 0 }}
transition={{
duration: backButtonAnimationDuration,
}}
>
<CommandMenuContextChip
Icons={[<IconChevronLeft size={theme.icon.size.sm} />]}
onClick={goBackFromCommandMenu}
testId="command-menu-go-back-button"
/>
) : (
<CommandMenuContextChipGroups contextChips={contextChips} />
)}
</>
</motion.div>
)}
</AnimatePresence>
{isDefined(contextStoreCurrentObjectMetadataItem) &&
commandMenuPage !== CommandMenuPages.SearchRecords ? (
<CommandMenuContextChipGroupsWithRecordSelection
contextChips={contextChips}
objectMetadataItemId={contextStoreCurrentObjectMetadataItem.id}
/>
) : (
<CommandMenuContextChipGroups contextChips={contextChips} />
)}
{(commandMenuPage === CommandMenuPages.Root ||
commandMenuPage === CommandMenuPages.SearchRecords) && (
@ -171,27 +153,16 @@ export const CommandMenuTopBar = () => {
</StyledContentContainer>
{!isMobile && (
<StyledCloseButtonWrapper isVisible={isButtonVisible}>
{isCommandMenuV2Enabled ? (
<Button
Icon={IconX}
dataTestId="page-header-close-command-menu-button"
size={'small'}
variant="secondary"
accent="default"
hotkeys={[getOsControlSymbol(), 'K']}
ariaLabel="Close command menu"
onClick={closeCommandMenu}
/>
) : (
<StyledCloseButtonContainer>
<LightIconButton
accent={'tertiary'}
size={'medium'}
Icon={IconX}
onClick={closeCommandMenu}
/>
</StyledCloseButtonContainer>
)}
<Button
Icon={IconX}
dataTestId="page-header-close-command-menu-button"
size={'small'}
variant="secondary"
accent="default"
hotkeys={[getOsControlSymbol(), 'K']}
ariaLabel="Close command menu"
onClick={closeCommandMenu}
/>
</StyledCloseButtonWrapper>
)}
</StyledInputContainer>

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

@ -1,4 +1,3 @@
import { RightDrawerAIChat } from '@/activities/copilot/right-drawer/components/RightDrawerAIChat';
import { CommandMenu } from '@/command-menu/components/CommandMenu';
import { CommandMenuCalendarEventPage } from '@/command-menu/pages/calendar-event/components/CommandMenuCalendarEventPage';
import { CommandMenuMessageThreadPage } from '@/command-menu/pages/message-thread/components/CommandMenuMessageThreadPage';
@ -19,7 +18,6 @@ export const COMMAND_MENU_PAGES_CONFIG = new Map<
[CommandMenuPages.ViewRecord, <CommandMenuRecordPage />],
[CommandMenuPages.ViewEmailThread, <CommandMenuMessageThreadPage />],
[CommandMenuPages.ViewCalendarEvent, <CommandMenuCalendarEventPage />],
[CommandMenuPages.Copilot, <RightDrawerAIChat />],
[
CommandMenuPages.WorkflowStepSelectTriggerType,
<CommandMenuWorkflowSelectTriggerType />,

30
packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuCommands.tsx
View File

@ -3,49 +3,20 @@ import {
ActionMenuEntryScope,
ActionMenuEntryType,
} from '@/action-menu/types/ActionMenuEntry';
import { useOpenCopilotRightDrawer } from '@/activities/copilot/right-drawer/hooks/useOpenCopilotRightDrawer';
import { copilotQueryState } from '@/activities/copilot/right-drawer/states/copilotQueryState';
import { COMMAND_MENU_NAVIGATE_COMMANDS } from '@/command-menu/constants/CommandMenuNavigateCommands';
import { commandMenuSearchState } from '@/command-menu/states/commandMenuSearchState';
import {
Command,
CommandScope,
CommandType,
} from '@/command-menu/types/Command';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { i18n } from '@lingui/core';
import { useRecoilValue, useSetRecoilState } from 'recoil';
import { IconSparkles } from 'twenty-ui';
import { useDebounce } from 'use-debounce';
import { FeatureFlagKey } from '~/generated/graphql';
export const useCommandMenuCommands = () => {
const actionMenuEntries = useRecoilComponentValueV2(
actionMenuEntriesComponentSelector,
);
const commandMenuSearch = useRecoilValue(commandMenuSearchState);
const [deferredCommandMenuSearch] = useDebounce(commandMenuSearch, 300); // 200ms - 500ms
const isCopilotEnabled = useIsFeatureEnabled(FeatureFlagKey.IsCopilotEnabled);
const setCopilotQuery = useSetRecoilState(copilotQueryState);
const openCopilotRightDrawer = useOpenCopilotRightDrawer();
const copilotCommand: Command = {
id: 'copilot',
to: '', // TODO
Icon: IconSparkles,
label: 'Open Copilot',
type: CommandType.Navigate,
onCommandClick: () => {
setCopilotQuery(deferredCommandMenuSearch);
openCopilotRightDrawer();
},
};
const copilotCommands: Command[] = isCopilotEnabled ? [copilotCommand] : [];
const navigateCommands = Object.values(COMMAND_MENU_NAVIGATE_COMMANDS);
const actionRecordSelectionCommands: Command[] = actionMenuEntries
@ -144,7 +115,6 @@ export const useCommandMenuCommands = () => {
}));
return {
copilotCommands,
navigateCommands,
actionRecordSelectionCommands,
actionGlobalCommands,

8
packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuHotKeys.ts
View File

@ -8,11 +8,9 @@ import { useKeyboardShortcutMenu } from '@/keyboard-shortcut-menu/hooks/useKeybo
import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { isNonEmptyString } from '@sniptt/guards';
import { useRecoilValue } from 'recoil';
import { Key } from 'ts-key-enum';
import { FeatureFlagKey } from '~/generated-metadata/graphql';
export const useCommandMenuHotKeys = () => {
const {
@ -33,10 +31,6 @@ export const useCommandMenuHotKeys = () => {
COMMAND_MENU_COMPONENT_INSTANCE_ID,
);
const isCommandMenuV2Enabled = useIsFeatureEnabled(
FeatureFlagKey.IsCommandMenuV2Enabled,
);
useScopedHotkeys(
'ctrl+k,meta+k',
() => {
@ -71,7 +65,7 @@ export const useCommandMenuHotKeys = () => {
useScopedHotkeys(
[Key.Backspace, Key.Delete],
() => {
if (isNonEmptyString(commandMenuSearch) || !isCommandMenuV2Enabled) {
if (isNonEmptyString(commandMenuSearch)) {
return;
}

2
packages/twenty-front/src/modules/command-menu/hooks/useMatchingCommandMenuCommands.ts
View File

@ -9,7 +9,6 @@ export const useMatchingCommandMenuCommands = ({
const { matchCommands } = useMatchCommands({ commandMenuSearch });
const {
copilotCommands,
navigateCommands,
actionRecordSelectionCommands,
actionObjectCommands,
@ -49,7 +48,6 @@ export const useMatchingCommandMenuCommands = ({
return {
noResults,
copilotCommands,
matchingStandardActionRecordSelectionCommands,
matchingStandardActionObjectCommands,
matchingWorkflowRunRecordSelectionCommands,

22
packages/twenty-front/src/modules/command-menu/hooks/useSearchRecords.tsx
View File

@ -1,4 +1,4 @@
import { useOpenActivityRightDrawer } from '@/activities/hooks/useOpenActivityRightDrawer';
import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
import { commandMenuSearchState } from '@/command-menu/states/commandMenuSearchState';
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
import { t } from '@lingui/core/macro';
@ -24,13 +24,7 @@ export const useSearchRecords = () => {
},
});
const openNoteRightDrawer = useOpenActivityRightDrawer({
objectNameSingular: CoreObjectNameSingular.Note,
});
const openTaskRightDrawer = useOpenActivityRightDrawer({
objectNameSingular: CoreObjectNameSingular.Task,
});
const { openRecordInCommandMenu } = useCommandMenu();
const commands = useMemo(() => {
return (globalSearchData?.globalSearch ?? []).map((searchRecord) => {
@ -63,14 +57,20 @@ export const useSearchRecords = () => {
to: '',
onCommandClick: () => {
searchRecord.objectSingularName === 'task'
? openTaskRightDrawer(searchRecord.recordId)
: openNoteRightDrawer(searchRecord.recordId);
? openRecordInCommandMenu({
recordId: searchRecord.recordId,
objectNameSingular: CoreObjectNameSingular.Task,
})
: openRecordInCommandMenu({
recordId: searchRecord.recordId,
objectNameSingular: CoreObjectNameSingular.Note,
});
},
};
}
return command;
});
}, [globalSearchData, openTaskRightDrawer, openNoteRightDrawer]);
}, [globalSearchData, openRecordInCommandMenu]);
return {
loading,

25
packages/twenty-front/src/modules/command-menu/pages/workflow/trigger-type/components/CommandMenuWorkflowSelectTriggerTypeContent.tsx
View File

@ -1,7 +1,5 @@
import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer';
import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages';
import {
WorkflowTriggerType,
WorkflowWithCurrentVersion,
@ -14,10 +12,8 @@ import { OTHER_TRIGGER_TYPES } from '@/workflow/workflow-trigger/constants/Other
import { TRIGGER_STEP_ID } from '@/workflow/workflow-trigger/constants/TriggerStepId';
import { useUpdateWorkflowVersionTrigger } from '@/workflow/workflow-trigger/hooks/useUpdateWorkflowVersionTrigger';
import { getTriggerDefaultDefinition } from '@/workflow/workflow-trigger/utils/getTriggerDefaultDefinition';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { useSetRecoilState } from 'recoil';
import { MenuItemCommand, useIcons } from 'twenty-ui';
import { FeatureFlagKey } from '~/generated-metadata/graphql';
export const CommandMenuWorkflowSelectTriggerTypeContent = ({
workflow,
@ -29,12 +25,8 @@ export const CommandMenuWorkflowSelectTriggerTypeContent = ({
const { activeObjectMetadataItems } = useFilteredObjectMetadataItems();
const { openRightDrawer } = useRightDrawer();
const setWorkflowSelectedNode = useSetRecoilState(workflowSelectedNodeState);
const { openWorkflowEditStepInCommandMenu } = useCommandMenu();
const isCommandMenuV2Enabled = useIsFeatureEnabled(
FeatureFlagKey.IsCommandMenuV2Enabled,
);
const handleTriggerTypeClick = ({
type,
@ -56,18 +48,11 @@ export const CommandMenuWorkflowSelectTriggerTypeContent = ({
setWorkflowSelectedNode(TRIGGER_STEP_ID);
if (isCommandMenuV2Enabled) {
openWorkflowEditStepInCommandMenu(
workflow.id,
defaultLabel,
getIcon(icon),
);
} else {
openRightDrawer(RightDrawerPages.WorkflowStepEdit, {
title: defaultLabel,
Icon: getIcon(icon),
});
}
openWorkflowEditStepInCommandMenu(
workflow.id,
defaultLabel,
getIcon(icon),
);
};
};