diff --git a/packages/twenty-front/src/modules/layout-customization/hooks/useSaveLayoutCustomization.ts b/packages/twenty-front/src/modules/layout-customization/hooks/useSaveLayoutCustomization.ts index eff91bd5ff..b4570b84f6 100644 --- a/packages/twenty-front/src/modules/layout-customization/hooks/useSaveLayoutCustomization.ts +++ b/packages/twenty-front/src/modules/layout-customization/hooks/useSaveLayoutCustomization.ts @@ -16,6 +16,7 @@ import { type DraftPageLayout } from '@/page-layout/types/DraftPageLayout'; import { type PageLayout } from '@/page-layout/types/PageLayout'; import { convertPageLayoutDraftToUpdateInput } from '@/page-layout/utils/convertPageLayoutDraftToUpdateInput'; import { convertPageLayoutToTabLayouts } from '@/page-layout/utils/convertPageLayoutToTabLayouts'; +import { isDefaultPageLayoutId } from '@/page-layout/utils/isDefaultPageLayoutId'; import { reInjectDynamicRelationWidgetsFromDraft } from '@/page-layout/utils/reInjectDynamicRelationWidgetsFromDraft'; import { transformPageLayout } from '@/page-layout/utils/transformPageLayout'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; @@ -76,6 +77,10 @@ export const useSaveLayoutCustomization = () => { let hasAnyFailure = false; for (const pageLayoutId of activePageLayoutIds) { + if (isDefaultPageLayoutId(pageLayoutId)) { + continue; + } + const draft = store.get( pageLayoutDraftComponentState.atomFamily({ instanceId: pageLayoutId, diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutEditModeProvider.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutEditModeProvider.tsx index 4631b377bc..ee748c56b2 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutEditModeProvider.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutEditModeProvider.tsx @@ -25,7 +25,7 @@ export const PageLayoutEditModeProvider = ({ if (layoutType === PageLayoutType.RECORD_PAGE) { return ( - + {children} ); diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutRecordPageCustomizationSessionRegistrationEffect.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutRecordPageCustomizationSessionRegistrationEffect.tsx index b3b650764c..7a52f11440 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutRecordPageCustomizationSessionRegistrationEffect.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutRecordPageCustomizationSessionRegistrationEffect.tsx @@ -1,6 +1,7 @@ import { activeCustomizationPageLayoutIdsState } from '@/layout-customization/states/activeCustomizationPageLayoutIdsState'; import { isLayoutCustomizationModeEnabledState } from '@/layout-customization/states/isLayoutCustomizationModeEnabledState'; import { pageLayoutPersistedComponentState } from '@/page-layout/states/pageLayoutPersistedComponentState'; +import { isDefaultPageLayoutId } from '@/page-layout/utils/isDefaultPageLayoutId'; import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentStateValue'; import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomStateValue'; import { useStore } from 'jotai'; @@ -31,6 +32,10 @@ export const PageLayoutRecordPageCustomizationSessionRegistrationEffect = return; } + if (isDefaultPageLayoutId(pageLayoutPersisted.id)) { + return; + } + store.set(activeCustomizationPageLayoutIdsState.atom, (activeIds) => activeIds.includes(pageLayoutPersisted.id) ? activeIds diff --git a/packages/twenty-front/src/modules/page-layout/components/RecordPageLayoutEditModeProvider.tsx b/packages/twenty-front/src/modules/page-layout/components/RecordPageLayoutEditModeProvider.tsx index f571bd890c..309d98b989 100644 --- a/packages/twenty-front/src/modules/page-layout/components/RecordPageLayoutEditModeProvider.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/RecordPageLayoutEditModeProvider.tsx @@ -1,14 +1,17 @@ import { isLayoutCustomizationModeEnabledState } from '@/layout-customization/states/isLayoutCustomizationModeEnabledState'; import { PageLayoutEditModeProviderContext } from '@/page-layout/contexts/PageLayoutEditModeContext'; +import { isDefaultPageLayoutId } from '@/page-layout/utils/isDefaultPageLayoutId'; import { useLayoutRenderingContext } from '@/ui/layout/contexts/LayoutRenderingContext'; import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomStateValue'; import { type ReactNode } from 'react'; type RecordPageLayoutEditModeProviderProps = { + pageLayoutId: string; children: ReactNode; }; export const RecordPageLayoutEditModeProvider = ({ + pageLayoutId, children, }: RecordPageLayoutEditModeProviderProps) => { const isLayoutCustomizationModeEnabled = useAtomStateValue( @@ -17,10 +20,13 @@ export const RecordPageLayoutEditModeProvider = ({ const { isInSidePanel } = useLayoutRenderingContext(); + const isEditable = !isDefaultPageLayoutId(pageLayoutId); + return ( {children} diff --git a/packages/twenty-front/src/modules/page-layout/hooks/useBasePageLayout.ts b/packages/twenty-front/src/modules/page-layout/hooks/useBasePageLayout.ts index 722db4cb7b..97f20a4030 100644 --- a/packages/twenty-front/src/modules/page-layout/hooks/useBasePageLayout.ts +++ b/packages/twenty-front/src/modules/page-layout/hooks/useBasePageLayout.ts @@ -20,6 +20,7 @@ import { DEFAULT_WORKFLOW_VERSION_PAGE_LAYOUT } from '@/page-layout/constants/De import { DEFAULT_WORKFLOW_VERSION_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultWorkflowVersionPageLayoutId'; import { recordPageLayoutFromIdFamilySelector } from '@/page-layout/states/selectors/recordPageLayoutFromIdFamilySelector'; import { type PageLayout } from '@/page-layout/types/PageLayout'; +import { isDefaultPageLayoutId } from '@/page-layout/utils/isDefaultPageLayoutId'; import { transformPageLayout } from '@/page-layout/utils/transformPageLayout'; import { useAtomFamilySelectorValue } from '@/ui/utilities/state/jotai/hooks/useAtomFamilySelectorValue'; import { useQuery } from '@apollo/client/react'; @@ -52,22 +53,10 @@ const getDefaultLayoutById = (layoutId: string): PageLayout => { } }; -const isDefaultLayoutId = (layoutId: string): boolean => - layoutId === DEFAULT_RECORD_PAGE_LAYOUT_ID || - layoutId === DEFAULT_COMPANY_RECORD_PAGE_LAYOUT_ID || - layoutId === DEFAULT_PERSON_RECORD_PAGE_LAYOUT_ID || - layoutId === DEFAULT_OPPORTUNITY_RECORD_PAGE_LAYOUT_ID || - layoutId === DEFAULT_NOTE_RECORD_PAGE_LAYOUT_ID || - layoutId === DEFAULT_TASK_RECORD_PAGE_LAYOUT_ID || - layoutId === DEFAULT_WORKFLOW_PAGE_LAYOUT_ID || - layoutId === DEFAULT_WORKFLOW_VERSION_PAGE_LAYOUT_ID || - layoutId === DEFAULT_WORKFLOW_RUN_PAGE_LAYOUT_ID || - layoutId === DEFAULT_MESSAGE_THREAD_RECORD_PAGE_LAYOUT_ID; - export const useBasePageLayout = ( pageLayoutId: string, ): PageLayout | undefined => { - const isDefaultLayout = isDefaultLayoutId(pageLayoutId); + const isDefaultLayout = isDefaultPageLayoutId(pageLayoutId); const cachedRecordPageLayout = useAtomFamilySelectorValue( recordPageLayoutFromIdFamilySelector, diff --git a/packages/twenty-front/src/modules/page-layout/utils/isDefaultPageLayoutId.ts b/packages/twenty-front/src/modules/page-layout/utils/isDefaultPageLayoutId.ts new file mode 100644 index 0000000000..1ada161ca1 --- /dev/null +++ b/packages/twenty-front/src/modules/page-layout/utils/isDefaultPageLayoutId.ts @@ -0,0 +1,26 @@ +import { DEFAULT_COMPANY_RECORD_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultCompanyRecordPageLayoutId'; +import { DEFAULT_MESSAGE_THREAD_RECORD_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultMessageThreadRecordPageLayoutId'; +import { DEFAULT_NOTE_RECORD_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultNoteRecordPageLayoutId'; +import { DEFAULT_OPPORTUNITY_RECORD_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultOpportunityRecordPageLayoutId'; +import { DEFAULT_PERSON_RECORD_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultPersonRecordPageLayoutId'; +import { DEFAULT_RECORD_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultRecordPageLayoutId'; +import { DEFAULT_TASK_RECORD_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultTaskRecordPageLayoutId'; +import { DEFAULT_WORKFLOW_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultWorkflowPageLayoutId'; +import { DEFAULT_WORKFLOW_RUN_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultWorkflowRunPageLayoutId'; +import { DEFAULT_WORKFLOW_VERSION_PAGE_LAYOUT_ID } from '@/page-layout/constants/DefaultWorkflowVersionPageLayoutId'; + +const DEFAULT_PAGE_LAYOUT_IDS = new Set([ + DEFAULT_RECORD_PAGE_LAYOUT_ID, + DEFAULT_COMPANY_RECORD_PAGE_LAYOUT_ID, + DEFAULT_PERSON_RECORD_PAGE_LAYOUT_ID, + DEFAULT_OPPORTUNITY_RECORD_PAGE_LAYOUT_ID, + DEFAULT_NOTE_RECORD_PAGE_LAYOUT_ID, + DEFAULT_TASK_RECORD_PAGE_LAYOUT_ID, + DEFAULT_WORKFLOW_PAGE_LAYOUT_ID, + DEFAULT_WORKFLOW_VERSION_PAGE_LAYOUT_ID, + DEFAULT_WORKFLOW_RUN_PAGE_LAYOUT_ID, + DEFAULT_MESSAGE_THREAD_RECORD_PAGE_LAYOUT_ID, +]); + +export const isDefaultPageLayoutId = (pageLayoutId: string): boolean => + DEFAULT_PAGE_LAYOUT_IDS.has(pageLayoutId);