From db805c35b768e47aa446c569bd8b24832714ba2b Mon Sep 17 00:00:00 2001
From: Alexis Jacomy <alexis.jacomy@gmail.com>
Date: Thu, 25 Jan 2024 10:45:46 +0100
Subject: [PATCH] front: editor: fixes #6439

Details:
- Adds the required attribute to the composition code input so that it
  is red when empty
- Adds a canSave optional function to rangeEdition/tool-factory, to
  allow disabling the save button when state is not correct
- Uses the new canSave function in SpeedEditionTool to disable the save
  button when there are empty composition codes
---
 .../speedSection/SpeedSectionMetadataForm.tsx             | 1 +
 .../editor/tools/rangeEdition/tool-factory.tsx            | 8 ++++++--
 front/src/applications/editor/tools/rangeEdition/tools.ts | 5 +++++
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/front/src/applications/editor/tools/rangeEdition/speedSection/SpeedSectionMetadataForm.tsx b/front/src/applications/editor/tools/rangeEdition/speedSection/SpeedSectionMetadataForm.tsx
index cc2bad65b97..fe17f6ac957 100644
--- a/front/src/applications/editor/tools/rangeEdition/speedSection/SpeedSectionMetadataForm.tsx
+++ b/front/src/applications/editor/tools/rangeEdition/speedSection/SpeedSectionMetadataForm.tsx
@@ -78,6 +78,7 @@ const SpeedSectionMetadataForm: FC = () => {
           <div key={key} className="form-group field field-string">
             <div className="d-flex flex-row align-items-center">
               <input
+                required
                 className="form-control flex-grow-2 flex-shrink-1 mr-2 px-2"
                 placeholder=""
                 type="text"
diff --git a/front/src/applications/editor/tools/rangeEdition/tool-factory.tsx b/front/src/applications/editor/tools/rangeEdition/tool-factory.tsx
index b940538a39c..3b2246110d1 100644
--- a/front/src/applications/editor/tools/rangeEdition/tool-factory.tsx
+++ b/front/src/applications/editor/tools/rangeEdition/tool-factory.tsx
@@ -48,6 +48,7 @@ interface RangeEditionToolParams<T extends EditorRange> {
   messagesComponent: ComponentType;
   layersComponent: ComponentType<{ map: Map }>;
   leftPanelComponent: ComponentType;
+  canSave?: (state: RangeEditionState<T>) => boolean;
 }
 
 function getRangeEditionTool<T extends EditorRange>({
@@ -57,6 +58,7 @@ function getRangeEditionTool<T extends EditorRange>({
   messagesComponent,
   layersComponent,
   leftPanelComponent,
+  canSave,
 }: RangeEditionToolParams<T>): Tool<RangeEditionState<T>> {
   const layersEntity = getNewEntity();
   function getInitialState(): RangeEditionState<T> {
@@ -91,8 +93,10 @@ function getRangeEditionTool<T extends EditorRange>({
           id: `save-${objectTypeAction}`,
           icon: AiFillSave,
           labelTranslationKey: `Editor.tools.${objectTypeEdition}-edition.actions.save-${objectTypeAction}`,
-          isDisabled({ isLoading }) {
-            return isLoading || false;
+          isDisabled({ isLoading, state }) {
+            if (isLoading) return true;
+            if (canSave) return !canSave(state);
+            return false;
           },
           async onClick({ state, setState, dispatch, infraID }) {
             const { initialEntity, entity } = state;
diff --git a/front/src/applications/editor/tools/rangeEdition/tools.ts b/front/src/applications/editor/tools/rangeEdition/tools.ts
index 9ca543204e8..1daba91f8e4 100644
--- a/front/src/applications/editor/tools/rangeEdition/tools.ts
+++ b/front/src/applications/editor/tools/rangeEdition/tools.ts
@@ -20,6 +20,11 @@ export const SpeedEditionTool = getRangeEditionTool<SpeedSectionEntity | SpeedSe
   messagesComponent: SpeedSectionMessages,
   layersComponent: SpeedSectionEditionLayers,
   leftPanelComponent: RangeEditionLeftPanel,
+  canSave(state) {
+    const records = state.entity.properties.speed_limit_by_tag || {};
+    const compositionCodes = Object.keys(records);
+    return compositionCodes.every((code) => !!code);
+  },
 });
 
 export const ElectrificationEditionTool = getRangeEditionTool<ElectrificationEntity>({