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

[Command Menu] Refactor layout customization conditional availability [Warning] (#19974)

Browse Source 
closes
https://discord.com/channels/1130383047699738754/1494312529286004837
This commit is contained in:
nitin
2026-04-24 15:48:02 +05:30
committed by GitHub
parent 3deb467845
commit 097432d3a2
20 changed files with 374 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/twenty-front/src/modules/command-menu-item/components/StandalonePageCommandMenu.tsx
+12 -2
View File
@@ -6,6 +6,7 @@ import { CommandMenuItemEditButton } from '@/command-menu-item/edit/components/C
import { commandMenuItemsSelector } from '@/command-menu-item/states/commandMenuItemsSelector';
import { doesCommandMenuItemMatchObjectMetadataId } from '@/command-menu-item/utils/doesCommandMenuItemMatchObjectMetadataId';
import { doesCommandMenuItemMatchPageLayoutId } from '@/command-menu-item/utils/doesCommandMenuItemMatchPageLayoutId';
import { isLayoutCustomizationModeEnabledState } from '@/layout-customization/states/isLayoutCustomizationModeEnabledState';
import { useObjectMetadataItems } from '@/object-metadata/hooks/useObjectMetadataItems';
import { currentPageLayoutIdState } from '@/page-layout/states/currentPageLayoutIdState';
import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomStateValue';
@@ -25,6 +26,9 @@ export const StandalonePageCommandMenu = () => {
const commandMenuItems = useAtomStateValue(commandMenuItemsSelector);
const currentWorkspace = useAtomStateValue(currentWorkspaceState);
const currentPageLayoutId = useAtomStateValue(currentPageLayoutIdState);
const isLayoutCustomizationModeEnabled = useAtomStateValue(
isLayoutCustomizationModeEnabledState,
);
const { objectMetadataItems } = useObjectMetadataItems();
const commandMenuContextApi = useMemo<CommandMenuContextApi>(() => {
@@ -52,7 +56,8 @@ export const StandalonePageCommandMenu = () => {
return {
pageType: ContextStorePageType.Standalone,
isInSidePanel: false,
isPageInEditMode: false,
isDashboardPageLayoutInEditMode: false,
isLayoutCustomizationModeEnabled,
favoriteRecordIds: [],
isSelectAll: false,
hasAnySoftDeleteFilterOnView: false,
@@ -74,7 +79,12 @@ export const StandalonePageCommandMenu = () => {
objectMetadataItem: {},
objectMetadataLabel: '',
};
}, [currentWorkspace?.featureFlags, objectMetadataItems, store]);
}, [
currentWorkspace?.featureFlags,
isLayoutCustomizationModeEnabled,
objectMetadataItems,
store,
]);
const filteredCommandMenuItems = useMemo(() => {
return commandMenuItems
packages/twenty-front/src/modules/command-menu-item/constants/EmptyCommandMenuContextApi.ts
+2 -1
View File
@@ -6,7 +6,8 @@ import {
export const EMPTY_COMMAND_MENU_CONTEXT_API: CommandMenuContextApi = {
pageType: ContextStorePageType.Index,
isInSidePanel: false,
isPageInEditMode: false,
isDashboardPageLayoutInEditMode: false,
isLayoutCustomizationModeEnabled: false,
favoriteRecordIds: [],
isSelectAll: false,
hasAnySoftDeleteFilterOnView: false,
packages/twenty-front/src/modules/command-menu-item/hooks/__tests__/useCloseCommandMenu.test.tsx
+2 -1
View File
@@ -46,7 +46,8 @@ const getWrapper =
commandMenuContextApi: {
pageType: ContextStorePageType.Index,
isInSidePanel,
isPageInEditMode: false,
isDashboardPageLayoutInEditMode: false,
isLayoutCustomizationModeEnabled: false,
favoriteRecordIds: [],
isSelectAll: false,
hasAnySoftDeleteFilterOnView: false,
packages/twenty-front/src/modules/command-menu-item/hooks/useCommandMenuContextApi.ts
+19 -5
View File
@@ -4,15 +4,17 @@ import { ContextStoreComponentInstanceContext } from '@/context-store/states/con
import { contextStoreCurrentObjectMetadataItemIdComponentState } from '@/context-store/states/contextStoreCurrentObjectMetadataItemIdComponentState';
import { contextStoreCurrentViewIdComponentState } from '@/context-store/states/contextStoreCurrentViewIdComponentState';
import { contextStoreCurrentPageTypeComponentState } from '@/context-store/states/contextStoreCurrentPageTypeComponentState';
import { contextStoreIsPageInEditModeComponentState } from '@/context-store/states/contextStoreIsPageInEditModeComponentState';
import { contextStoreNumberOfSelectedRecordsComponentState } from '@/context-store/states/contextStoreNumberOfSelectedRecordsComponentState';
import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState';
import { useNavigationMenuItemsData } from '@/navigation-menu-item/display/hooks/useNavigationMenuItemsData';
import { useObjectMetadataItems } from '@/object-metadata/hooks/useObjectMetadataItems';
import { useObjectPermissionsForObject } from '@/object-record/hooks/useObjectPermissionsForObject';
import { isLayoutCustomizationModeEnabledState } from '@/layout-customization/states/isLayoutCustomizationModeEnabledState';
import { hasAnySoftDeleteFilterOnViewComponentSelector } from '@/object-record/record-filter/states/hasAnySoftDeleteFilterOnView';
import { recordStoreRecordsSelector } from '@/object-record/record-store/states/selectors/recordStoreRecordsSelector';
import { getRecordIndexIdFromObjectNamePluralAndViewId } from '@/object-record/utils/getRecordIndexIdFromObjectNamePluralAndViewId';
import { currentPageLayoutIdState } from '@/page-layout/states/currentPageLayoutIdState';
import { isDashboardInEditModeComponentState } from '@/page-layout/states/isDashboardInEditModeComponentState';
import { SIDE_PANEL_COMPONENT_INSTANCE_ID } from '@/side-panel/constants/SidePanelComponentInstanceId';
import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
import { useAtomComponentSelectorValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentSelectorValue';
@@ -20,7 +22,7 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use
import { useAtomFamilySelectorValue } from '@/ui/utilities/state/jotai/hooks/useAtomFamilySelectorValue';
import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomStateValue';
import { isNonEmptyArray } from '@sniptt/guards';
import { useStore } from 'jotai';
import { useAtomValue, useStore } from 'jotai';
import {
ContextStorePageType,
type CommandMenuContextApi,
@@ -77,6 +79,11 @@ export const useCommandMenuContextApi = (): CommandMenuContextApi => {
{ recordIds: recordIds ?? [] },
);
const currentPageLayoutId = useAtomStateValue(currentPageLayoutIdState);
const dashboardPageLayoutIdForCommandMenu =
selectedRecords[0]?.pageLayoutId ?? currentPageLayoutId ?? '';
const objectPermissionsFromHook = useObjectPermissionsForObject(
objectMetadataItem?.id ?? '',
);
@@ -111,8 +118,14 @@ export const useCommandMenuContextApi = (): CommandMenuContextApi => {
contextStoreCurrentPageTypeComponentState,
);
const contextStoreIsPageInEditMode = useAtomComponentStateValue(
contextStoreIsPageInEditModeComponentState,
const isDashboardInEditMode = useAtomValue(
isDashboardInEditModeComponentState.atomFamily({
instanceId: dashboardPageLayoutIdForCommandMenu,
}),
);
const isLayoutCustomizationModeEnabled = useAtomStateValue(
isLayoutCustomizationModeEnabledState,
);
const pageType = isDefined(contextStoreCurrentPageType)
@@ -154,7 +167,8 @@ export const useCommandMenuContextApi = (): CommandMenuContextApi => {
return {
pageType,
isInSidePanel,
isPageInEditMode: contextStoreIsPageInEditMode,
isDashboardPageLayoutInEditMode: isDashboardInEditMode,
isLayoutCustomizationModeEnabled,
favoriteRecordIds,
isSelectAll,
hasAnySoftDeleteFilterOnView,