Merge pull request #626 from kbss-cvut/fix/593-fix-moh-reset-button-i…

…n-fault-tree-editor Fix moh reset button in fault tree editor
kbss-cvut · Oct 8, 2024 · e434734 · e434734
2 parents 477683b + f33f105
commit e434734
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 15 deletions.
diff --git a/public/locales/cs/translation.json b/public/locales/cs/translation.json
@@ -47,7 +47,11 @@
   "diagramSidePanel": {
     "cutsetToggleToolTip": "Přepnout do pohledu řezu",
     "minimumOperationalHours": "Min. provozní doba",
-    "diagramOptions": "Možnosti diagramu"
+    "diagramOptions": "Možnosti diagramu",
+    "messages": {
+      "mohNewValue": "Nová hodnota, která se není použíta při vyhodnocování stromu chyb.",
+      "mohExperimental": "Hodnota se liší od min. hodnota provozní hodiny systému."
+    }
   },
   "faultEventScenariosTable": {
     "cutset": "Řez",

diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
@@ -47,7 +47,11 @@
   "diagramSidePanel": {
     "cutsetToggleToolTip": "Switch to cutsets view",
     "minimumOperationalHours": "Min. operational hours",
-    "diagramOptions": "Diagram Options"
+    "diagramOptions": "Diagram Options",
+    "messages": {
+      "mohNewValue": "New value, not used in fault tree evaluation.",
+      "mohExperimental": "Value is different from the system's min. operational hour value."
+    }
   },
   "faultEventScenariosTable": {
     "cutset": "Cutset",

diff --git a/src/components/editor/faultTree/canvas/EditorCanvas.tsx b/src/components/editor/faultTree/canvas/EditorCanvas.tsx
@@ -22,7 +22,6 @@ import { useTranslation } from "react-i18next";
 import RestartAltIcon from "@mui/icons-material/RestartAlt";
 import PlayArrow from "@mui/icons-material/PlayArrow";
 import { useCurrentFaultTree } from "@hooks/useCurrentFaultTree";
-import { useFaultTrees } from "@hooks/useFaultTrees";
 import { calculateCutSets } from "@services/faultTreeService";
 import { SnackbarType, useSnackbar } from "@hooks/useSnackbar";
 import { useNavigate } from "react-router-dom";
@@ -94,8 +93,8 @@ const EditorCanvas = ({
   const [rendering, setRendering] = useState<boolean>(false);
   const [faultTree] = useCurrentFaultTree();
   const initialMinOperationalHours = faultTree?.operationalDataFilter?.minOperationalHours || 0;
+  const systemMinOperationalHours = faultTree?.system?.operationalDataFilter?.minOperationalHours || 0;
   const [updatedMinOperationalHours, setUpdatedMinOperationalHours] = useState(initialMinOperationalHours);
-  const [inputColor, setInputColor] = useState("");
   const [showSnackbar] = useSnackbar();
   const { isModified, setShowUnsavedChangesDialog } = useAppBar();
 
@@ -295,16 +294,13 @@ const EditorCanvas = ({
   const handleMinOperationalHoursChange = (event) => {
     const newValue = event.target.value;
     setUpdatedMinOperationalHours(newValue);
-    if (newValue !== faultTree?.operationalDataFilter?.minOperationalHours) {
-      setInputColor(theme.notSynchronized.color);
-    } else {
-      setInputColor(theme.synchronized.color);
-    }
   };
 
   const handleReset = () => {
-    setUpdatedMinOperationalHours(initialMinOperationalHours);
-    setInputColor(theme.synchronized.color);
+    if (initialMinOperationalHours != updatedMinOperationalHours)
+      setUpdatedMinOperationalHours(initialMinOperationalHours);
+    else if (initialMinOperationalHours != systemMinOperationalHours)
+      setUpdatedMinOperationalHours(systemMinOperationalHours);
   };
 
   const handleSetNewDefaultOperationalHours = () => {
@@ -322,10 +318,26 @@ const EditorCanvas = ({
       .catch((reason) => {
         showSnackbar(reason, SnackbarType.ERROR);
       });
-
-    setInputColor(theme.synchronized.color);
   };
 
+  const dirty = initialMinOperationalHours != updatedMinOperationalHours;
+  const experimental = systemMinOperationalHours != updatedMinOperationalHours;
+  const inputColor = experimental ? theme.notSynchronized.color : theme.synchronized.color;
+  const inputProps =
+    updatedMinOperationalHours !== initialMinOperationalHours
+      ? { style: { borderStyle: "dashed", borderWidth: "4px", borderColor: theme.notSynchronized.color } }
+      : null;
+  const props = {};
+  if (inputProps) props.inputProps = inputProps;
+
+  if (dirty || experimental) {
+    const messages = [
+      dirty ? t("diagramSidePanel.messages.mohNewValue") : null,
+      experimental ? t("diagramSidePanel.messages.mohExperimental") : null,
+    ].filter((m) => m != null);
+    props.title = messages.length > 1 ? messages.map((m, i) => i + 1 + ") " + m).join("\n") : messages[0];
+  }
+
   return (
     <div className={classes.root}>
       <div id="jointjs-container" className={classes.konvaContainer} ref={containerRef}></div>
@@ -348,6 +360,7 @@ const EditorCanvas = ({
               sx={{ flex: 2, input: { color: inputColor } }}
               value={updatedMinOperationalHours}
               onChange={handleMinOperationalHoursChange}
+              {...props}
             />
             <IconButton aria-label="restore layout" size="large" onClick={handleReset}>
               <RestartAltIcon />

diff --git a/src/models/faultTreeModel.tsx b/src/models/faultTreeModel.tsx
@@ -3,18 +3,28 @@ import { FaultEvent, CONTEXT as EVENT_CONTEXT } from "@models/eventModel";
 import { AbstractModel, CONTEXT as ABSTRACT_CONTEXT } from "@models/abstractModel";
 import { FaultEventScenario, CONTEXT as SCENARIO_CONTEXT } from "@models/faultEventScenario";
 import { OperationalDataFilter, CONTEXT as FILTER_CONTEXT } from "@models/operationalDataFilterModel";
-import { System } from "@models/systemModel";
+import { System, CONTEXT as SYSTEM_CONTEXT } from "@models/systemModel";
 import { Status } from "@utils/constants";
 
 const ctx = {
   manifestingEvent: VocabularyUtils.PREFIX + "is-manifested-by",
   faultEventScenarios: VocabularyUtils.PREFIX + "has-scenario",
   operationalDataFilter: VocabularyUtils.PREFIX + "has-operational-data-filter",
+  system: VocabularyUtils.PREFIX + "is-artifact-of",
+  subSystem: VocabularyUtils.PREFIX + "is-performed-by",
   name: VocabularyUtils.PREFIX + "name",
   status: VocabularyUtils.PREFIX + "status",
 };
 
-export const CONTEXT = Object.assign({}, ctx, ABSTRACT_CONTEXT, EVENT_CONTEXT, SCENARIO_CONTEXT, FILTER_CONTEXT);
+export const CONTEXT = Object.assign(
+  {},
+  ctx,
+  ABSTRACT_CONTEXT,
+  EVENT_CONTEXT,
+  SCENARIO_CONTEXT,
+  FILTER_CONTEXT,
+  SYSTEM_CONTEXT,
+);
 
 export interface FaultTree extends AbstractModel {
   name: string;