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

Refactor command menu input (#16773)

Browse Source 
- Open input on item click
- `CommandMenuItemNumberInput` and `CommandMenuItemTextInput` don't only
define the input but the whole menu item now
- Fixed behavior on escape

## Video QA


https://github.com/user-attachments/assets/bf2f03e9-d07c-4a1e-9bc8-6606839269ff
This commit is contained in:
Raphaël Bosi
2025-12-23 14:00:04 +01:00
committed by GitHub
parent 81918e8720
commit 7b6071619c
3 changed files with 173 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/twenty-front/src/modules/command-menu/pages/page-layout/components/chart-settings/ChartSettingItem.tsx
+20 -28
View File
@@ -110,28 +110,24 @@ export const ChartSettingItem = ({
return (
<SelectableListItem key={item.id} itemId={item.id}>
<CommandMenuItem
<CommandMenuItemNumberInput
id={item.id}
label={t(item.label)}
Icon={item.Icon}
RightComponent={
<CommandMenuItemNumberInput
value={stringValue}
onChange={handleInputChange}
onValidate={(value) =>
!isDefined(value) ||
isMinMaxRangeValid(
item.id as
| CHART_CONFIGURATION_SETTING_IDS.MIN_RANGE
| CHART_CONFIGURATION_SETTING_IDS.MAX_RANGE,
value,
configuration,
)
}
placeholder={
item.inputPlaceholder ? t(item.inputPlaceholder) : undefined
}
/>
value={stringValue}
onChange={handleInputChange}
onValidate={(value) =>
!isDefined(value) ||
isMinMaxRangeValid(
item.id as
| CHART_CONFIGURATION_SETTING_IDS.MIN_RANGE
| CHART_CONFIGURATION_SETTING_IDS.MAX_RANGE,
value,
configuration,
)
}
placeholder={
item.inputPlaceholder ? t(item.inputPlaceholder) : undefined
}
/>
</SelectableListItem>
@@ -144,18 +140,14 @@ export const ChartSettingItem = ({
return (
<SelectableListItem key={item.id} itemId={item.id}>
<CommandMenuItem
<CommandMenuItemTextInput
id={item.id}
label={t(item.label)}
Icon={item.Icon}
RightComponent={
<CommandMenuItemTextInput
value={stringValue}
onChange={handleTextInputChange}
placeholder={
item.inputPlaceholder ? t(item.inputPlaceholder) : undefined
}
/>
value={stringValue}
onChange={handleTextInputChange}
placeholder={
item.inputPlaceholder ? t(item.inputPlaceholder) : undefined
}
/>
</SelectableListItem>