Merge pull request #19 from EyeSeeTea/feat/disable-form-config

allow updating the name after a step has been executed.
EyeSeeTea · Mar 7, 2024 · 03e3000 · 03e3000
2 parents ede6c47 + abd0bc1
commit 03e3000
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 13 deletions.
diff --git a/src/domain/usecases/SaveConfigAnalysisUseCase.ts b/src/domain/usecases/SaveConfigAnalysisUseCase.ts
@@ -1,17 +1,26 @@
+import { Id } from "$/domain/entities/Ref";
 import { FutureData } from "../../data/api-futures";
 import { QualityAnalysis } from "../entities/QualityAnalysis";
-import { Future } from "../entities/generic/Future";
 import { QualityAnalysisRepository } from "../repositories/QualityAnalysisRepository";
 
 export class SaveConfigAnalysisUseCase {
     constructor(private qualityAnalysisRepository: QualityAnalysisRepository) {}
 
     execute(options: SaveQualityAnalysisOptions): FutureData<void> {
-        if (QualityAnalysis.hasExecutedSections(options.qualityAnalysis)) {
-            return Future.error(new Error("Cannot change analysis with executed sections"));
-        }
-        const qualityAnalysisToSave = QualityAnalysis.build(options.qualityAnalysis).get();
-        return this.qualityAnalysisRepository.save([qualityAnalysisToSave]);
+        return this.getAnalysis(options.qualityAnalysis.id).flatMap(analysis => {
+            const wasExecuted = QualityAnalysis.hasExecutedSections(analysis);
+            const qualityAnalysisToSave = wasExecuted
+                ? QualityAnalysis.build({
+                      ...analysis,
+                      name: options.qualityAnalysis.name,
+                  }).get()
+                : QualityAnalysis.build(options.qualityAnalysis).get();
+            return this.qualityAnalysisRepository.save([qualityAnalysisToSave]);
+        });
+    }
+
+    private getAnalysis(id: Id): FutureData<QualityAnalysis> {
+        return this.qualityAnalysisRepository.getById(id);
     }
 }
 

diff --git a/src/webapp/components/configuration-form/ConfigurationForm.tsx b/src/webapp/components/configuration-form/ConfigurationForm.tsx
@@ -109,7 +109,8 @@ export const ConfigurationForm: React.FC<ConfigurationFormProps> = React.memo(pr
         setSelectedOrgUnits(value);
     };
 
-    const canBeUpdated = QualityAnalysis.hasExecutedSections(formData);
+    const disableSave = QualityAnalysis.hasExecutedSections(formData);
+    const selectorClass = disableSave ? "config-form-selector disabled" : "config-form-selector";
 
     return (
         <form onSubmit={onFormSubmit}>
@@ -122,7 +123,7 @@ export const ConfigurationForm: React.FC<ConfigurationFormProps> = React.memo(pr
                 />
 
                 <Dropdown
-                    className="config-form-selector"
+                    className={selectorClass}
                     hideEmpty
                     items={moduleItems}
                     onChange={onChangeModule}
@@ -131,7 +132,7 @@ export const ConfigurationForm: React.FC<ConfigurationFormProps> = React.memo(pr
                 />
 
                 <Dropdown
-                    className="config-form-selector"
+                    className={selectorClass}
                     hideEmpty
                     items={periods}
                     onChange={value => onChangePeriod(value, "startDate")}
@@ -140,7 +141,7 @@ export const ConfigurationForm: React.FC<ConfigurationFormProps> = React.memo(pr
                 />
 
                 <Dropdown
-                    className="config-form-selector"
+                    className={selectorClass}
                     hideEmpty
                     items={periods}
                     onChange={value => onChangePeriod(value, "endDate")}
@@ -150,7 +151,7 @@ export const ConfigurationForm: React.FC<ConfigurationFormProps> = React.memo(pr
             </FormControlsContainer>
 
             {initialCountries.length > 0 && (
-                <OrgUnitContainer>
+                <OrgUnitContainer $disabled={disableSave}>
                     <OrgUnitsSelector
                         api={api}
                         onChange={onOrgUnitsChange}
@@ -163,7 +164,7 @@ export const ConfigurationForm: React.FC<ConfigurationFormProps> = React.memo(pr
                 </OrgUnitContainer>
             )}
             <ActionsContainer>
-                <Button disabled={canBeUpdated} type="submit" variant="contained" color="primary">
+                <Button type="submit" variant="contained" color="primary">
                     {i18n.t("Save Config Analysis")}
                 </Button>
             </ActionsContainer>
@@ -184,8 +185,10 @@ const FormControlsContainer = styled.div`
     gap: 1em;
 `;
 
-const OrgUnitContainer = styled.div`
+const OrgUnitContainer = styled.div<{ $disabled?: boolean }>`
     padding: 0;
+    pointer-events: ${props => (props.$disabled ? "none" : "auto")};
+    opacity: ${props => (props.$disabled ? "0.7" : "1")};
 `;
 
 const ActionsContainer = styled.div`

diff --git a/src/webapp/pages/app/App.css b/src/webapp/pages/app/App.css
@@ -15,3 +15,9 @@ li {
 .config-form-selector > div {
     min-height: 40px !important;
 }
+
+.config-form-selector.disabled > div {
+    cursor: none;
+    opacity: 0.7;
+    pointer-events: none !important;
+}