diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/ChartSettings.tsx b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/ChartSettings.tsx index b687d2ef8f..4245e57d61 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/ChartSettings.tsx +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/ChartSettings.tsx @@ -66,6 +66,10 @@ export const ChartSettings = ({ widget }: { widget: PageLayoutWidget }) => { COMMAND_MENU_LIST_SELECTABLE_LIST_ID, ); + const isGroupByEnabled = getChartSettingsValues( + CHART_CONFIGURATION_SETTING_IDS.GROUP_BY, + ); + return ( { {group.items.map((item) => { const isDisabled = - !isNonEmptyString(widget.objectMetadataId) && - (item?.dependsOn?.includes( - CHART_CONFIGURATION_SETTING_IDS.SOURCE, - ) ?? - false); + (!isNonEmptyString(widget.objectMetadataId) && + (item?.dependsOn?.includes( + CHART_CONFIGURATION_SETTING_IDS.SOURCE, + ) ?? + false)) || + (!isGroupByEnabled && + item?.dependsOn?.includes( + CHART_CONFIGURATION_SETTING_IDS.GROUP_BY, + )); const handleToggleChange = () => { const configKey = diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/dropdown-content/ChartGroupByFieldSelectionDropdownContentBase.tsx b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/dropdown-content/ChartGroupByFieldSelectionDropdownContentBase.tsx index ca40bef19d..3fbc798e0c 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/dropdown-content/ChartGroupByFieldSelectionDropdownContentBase.tsx +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/dropdown-content/ChartGroupByFieldSelectionDropdownContentBase.tsx @@ -106,6 +106,16 @@ export const ChartGroupByFieldSelectionDropdownContentBase = < } }; + const handleSelectNone = () => { + updateCurrentWidgetConfig({ + configToUpdate: { + [fieldMetadataIdKey]: null, + [subFieldNameKey]: null, + }, + }); + closeDropdown(); + }; + const handleBack = () => { setSelectedCompositeField(null); }; @@ -146,41 +156,47 @@ export const ChartGroupByFieldSelectionDropdownContentBase = < /> - {availableFieldMetadataItems.length === 0 ? ( - - ) : ( - item.id, - )} - > - {availableFieldMetadataItems.map((fieldMetadataItem) => ( - { + item.id), + ]} + > + + + + + {availableFieldMetadataItems.map((fieldMetadataItem) => ( + { + handleSelectField(fieldMetadataItem); + }} + > + { handleSelectField(fieldMetadataItem); }} - > - { - handleSelectField(fieldMetadataItem); - }} - /> - - ))} - - )} + /> + + ))} + ); diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/constants/settings/SortByGroupByFieldSetting.ts b/packages/twenty-front/src/modules/command-menu/pages/page-layout/constants/settings/SortByGroupByFieldSetting.ts index 1a08e6108b..131b342d1f 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/constants/settings/SortByGroupByFieldSetting.ts +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/constants/settings/SortByGroupByFieldSetting.ts @@ -9,5 +9,6 @@ export const SORT_BY_GROUP_BY_FIELD_SETTING: ChartSettingsItem = { Icon: IconArrowsSort, label: CHART_CONFIGURATION_SETTING_LABELS.SORT_BY_GROUP_BY_FIELD, id: CHART_CONFIGURATION_SETTING_IDS.SORT_BY_GROUP_BY_FIELD, + dependsOn: [CHART_CONFIGURATION_SETTING_IDS.GROUP_BY], DropdownContent: ChartSortByGroupByFieldDropdownContent, };