diff --git a/frontend/src/components/DefenceBox/DefenceConfiguration.tsx b/frontend/src/components/DefenceBox/DefenceConfiguration.tsx index 78c21da1a..b56aa2be9 100644 --- a/frontend/src/components/DefenceBox/DefenceConfiguration.tsx +++ b/frontend/src/components/DefenceBox/DefenceConfiguration.tsx @@ -9,7 +9,7 @@ function DefenceConfiguration({ }: { config: DefenceConfig; isActive: boolean; - setConfigurationValue: (configId: string, value: string) => Promise; + setConfigurationValue: (value: string) => void; }) { function inputKeyDown(event: React.KeyboardEvent) { if (event.key === "Enter" && !event.shiftKey) { @@ -21,15 +21,13 @@ function DefenceConfiguration({ function inputKeyUp(event: React.KeyboardEvent) { if (event.key === "Enter" && !event.shiftKey) { const value = event.currentTarget.innerText.trim(); - // asynchronously set the configuration value - void setConfigurationValue(config.id, value); + setConfigurationValue(value); } } function focusLost(event: React.FocusEvent) { const value = event.target.innerText.trim(); - // asynchronously set the configuration value - void setConfigurationValue(config.id, value); + setConfigurationValue(value); } function getClassName() { diff --git a/frontend/src/components/DefenceBox/DefenceMechanism.tsx b/frontend/src/components/DefenceBox/DefenceMechanism.tsx index 9dab0ae7d..09dd13946 100644 --- a/frontend/src/components/DefenceBox/DefenceMechanism.tsx +++ b/frontend/src/components/DefenceBox/DefenceMechanism.tsx @@ -28,17 +28,19 @@ function DefenceMechanism({ const [isConfigured, setIsConfigured] = useState(false); const [configValidated, setConfigValidated] = useState(true); - async function setConfigurationValue(configId: string, value: string) { - const configName = - defenceDetail.config.find((config) => config.id === configId)?.name ?? ""; + async function setConfigurationValue(config: DefenceConfig, value: string) { + // don't set if the value is the same + if (config.value === value) { + return; + } - const configIsValid = validateDefence(defenceDetail.id, configName, value); + const configIsValid = validateDefence(defenceDetail.id, config.name, value); if (configIsValid) { - const newConfiguration = defenceDetail.config.map((config) => { - if (config.id === configId) { - config.value = value; + const newConfiguration = defenceDetail.config.map((oldConfig) => { + if (oldConfig.id === config.id) { + oldConfig.value = value; } - return config; + return oldConfig; }); const configured = await setDefenceConfiguration( @@ -78,7 +80,10 @@ function DefenceMechanism({ key={config.id} isActive={defenceDetail.isActive} config={config} - setConfigurationValue={setConfigurationValue} + setConfigurationValue={(value: string) => { + // asynchronously set the configuration value + void setConfigurationValue(config, value); + }} /> ); })}