diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutGraphTypeSelect.tsx b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutGraphTypeSelect.tsx index 0237bff1b2..8addcd8ec9 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutGraphTypeSelect.tsx +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutGraphTypeSelect.tsx @@ -2,11 +2,13 @@ import { SidePanelHeader } from '@/command-menu/components/SidePanelHeader'; import { ChartSettings } from '@/command-menu/pages/page-layout/components/ChartSettings'; import { GRAPH_TYPE_INFORMATION } from '@/command-menu/pages/page-layout/constants/GraphTypeInformation'; import { usePageLayoutIdFromContextStoreTargetedRecord } from '@/command-menu/pages/page-layout/hooks/usePageLayoutFromContextStoreTargetedRecord'; +import { useUpdatePageLayoutWidget } from '@/page-layout/hooks/useUpdatePageLayoutWidget'; import { pageLayoutDraftComponentState } from '@/page-layout/states/pageLayoutDraftComponentState'; import { pageLayoutEditingWidgetIdComponentState } from '@/page-layout/states/pageLayoutEditingWidgetIdComponentState'; import { useRecoilComponentValue } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValue'; import { useTheme } from '@emotion/react'; import { t } from '@lingui/core/macro'; +import { isNonEmptyString } from '@sniptt/guards'; import { isDefined } from 'twenty-shared/utils'; export const CommandMenuPageLayoutGraphTypeSelect = () => { @@ -22,14 +24,26 @@ export const CommandMenuPageLayoutGraphTypeSelect = () => { pageLayoutId, ); + const { updatePageLayoutWidget } = useUpdatePageLayoutWidget(pageLayoutId); + + if (!isDefined(pageLayoutEditingWidgetId)) { + throw new Error('Widget ID must be present while editing the widget'); + } + const widgetInEditMode = draftPageLayout.tabs .flatMap((tab) => tab.widgets) .find((widget) => widget.id === pageLayoutEditingWidgetId); + if (!isDefined(widgetInEditMode)) { + throw new Error( + `Widget with ID ${pageLayoutEditingWidgetId} not found in page layout`, + ); + } + const theme = useTheme(); if ( - !isDefined(widgetInEditMode?.configuration) || + !isDefined(widgetInEditMode.configuration) || !('graphType' in widgetInEditMode.configuration) ) { return null; @@ -43,9 +57,15 @@ export const CommandMenuPageLayoutGraphTypeSelect = () => { {}} + onTitleChange={(newTitle) => { + if (isNonEmptyString(newTitle)) { + updatePageLayoutWidget(widgetInEditMode.id, { + title: newTitle, + }); + } + }} />