[Fix #621] Localize dialogs for renaming and deleting fault trees and…

… systems

public/locales/cs/translation.json

@@ -20,6 +20,14 @@
     "namePlaceholder": "Název systému",
     "create": "Vytvořit"
   },
+  "deleteSystemModal": {
+    "title": "Smazat systém",
+    "explanation": "Smazáním systému budou smazány i všechny komponenty, funkce a režimy poruch. Pokračovat ve smazání systému?"
+  },
+  "renameSystemModal": {
+    "title": "Přejmenovat systém",
+    "nameFieldLabel": "Název systému"
+  },
   "newFtaModal": {
     "title": "Vytvořit strom poruch",
     "namePlaceholder": "Systém",
@@ -34,6 +42,10 @@
     "gateType": "Typ hradla",
     "noSystemError": "Na panelu Navigační panel vyberte možnost Systém"
   },
+  "renameFtaModal": {
+    "title": "Přejmenujte strom poruch",
+    "nameFieldLabel": "Název stromu poruch"
+  },
   "deleteFtaModal": {
     "title": "Smazat strom poruch",
     "explanation": "Smazáním stromu chyb se smaže celá stromová struktura. Pokračovat ve smazání stromu?"
@@ -141,7 +153,9 @@
     "delete": "Smazat",
     "rename": "Přejmenovat",
     "save": "Uložit",
-    "discard": "Zahodit"
+    "discard": "Zahodit",
+    "cancel": "Zrušit",
+    "confirm": "Potvrdit"
   },
 
   "error": {

public/locales/en/translation.json

@@ -20,6 +20,14 @@
     "namePlaceholder": "System name",
     "create": "Create"
   },
+  "deleteSystemModal": {
+    "title": "Delete System",
+    "explanation": "By deleting the system, all components, functions and failure modes will be deleted as well. Proceed to delete the system?"
+  },
+  "renameSystemModal": {
+    "title": "Rename System",
+    "nameFieldLabel": "System Name"
+  },
   "newFtaModal": {
     "title": "Create Fault Tree",
     "namePlaceholder": "System",
@@ -34,6 +42,10 @@
     "gateType": "Gate type",
     "noSystemError": "Select the System from the Navbar"
   },
+  "renameFtaModal": {
+    "title": "Rename Fault Tree",
+    "nameFieldLabel": "Fault Tree Name"
+  },
   "deleteFtaModal": {
     "title": "Delete Fault Tree",
     "explanation": "Deleting fault tree will delete the whole tree structure. Proceed to delete the tree?"
@@ -141,7 +153,9 @@
     "delete": "Delete",
     "rename": "Rename",
     "save": "Save",
-    "discard": "Discard"
+    "discard": "Discard",
+    "cancel": "Cancel",
+    "confirm": "Confirm"
   },
   "error": {
     "default": "An error occurred",

src/components/dashboard/content/list/DashboardSystemList.tsx

@@ -22,8 +22,10 @@ import { System } from "@models/systemModel";
 import SystemEditDialog from "@components/dialog/system/SystemEditDialog";
 import { contextMenuDefaultAnchor, ElementContextMenuAnchor } from "@utils/contextMenu";
 import SystemContextMenu from "@components/editor/system/menu/SystemContextMenu";
+import { useTranslation } from "react-i18next";
 
 const DashboardSystemList = () => {
+  const { t } = useTranslation();
   const { classes } = useStyles();
   const [systems, , , removeSystem] = useSystems();
 
@@ -39,9 +41,8 @@ const DashboardSystemList = () => {
 
   const handleDelete = (systemToDelete: System) => {
     showConfirmDialog({
-      title: "Delete System",
-      explanation:
-        "By deleting the system, all components, functions and failure modes will be deleted as well. Proceed to delete the system?",
+      title: t("deleteSystemModal.title"),
+      explanation: t("deleteSystemModal.explanation"),
       onConfirm: () => {
         removeSystem(systemToDelete);
       },

src/components/dashboard/content/list/SystemOverview.tsx

@@ -55,9 +55,8 @@ const SystemOverview = () => {
 
   const handleDelete = (systemToDelete: System) => {
     showConfirmDialog({
-      title: "Delete System",
-      explanation:
-        "By deleting the system, all components, functions and failure modes will be deleted as well. Proceed to delete the system?",
+      title: t("deleteSystemModal.title"),
+      explanation: t("deleteSystemModal.explanation"),
       onConfirm: () => {
         removeSystem(systemToDelete);
       },

src/components/dialog/ConfirmDialog.tsx

@@ -4,6 +4,7 @@ import Dialog from "@mui/material/Dialog";
 import { DialogTitle } from "@components/materialui/dialog/DialogTitle";
 import { DialogContent } from "@components/materialui/dialog/DialogContent";
 import { DialogActions } from "@components/materialui/dialog/DialogActions";
+import { useTranslation } from "react-i18next";
 
 interface Props {
   title: string;
@@ -14,6 +15,7 @@ interface Props {
 }
 
 const ConfirmDialog = ({ title, explanation, open, onClose, onConfirm }: Props) => {
+  const { t } = useTranslation();
   return (
     <Dialog open={open} onClose={onClose} aria-labelledby="confirm-dialog">
       <DialogTitle id="confirm-dialog" onClose={onClose}>
@@ -22,7 +24,7 @@ const ConfirmDialog = ({ title, explanation, open, onClose, onConfirm }: Props)
       <DialogContent>{explanation}</DialogContent>
       <DialogActions>
         <Button color="primary" onClick={onClose}>
-          Cancel
+          {t("common.cancel")}
         </Button>
         <Button
           color="primary"
@@ -31,7 +33,7 @@ const ConfirmDialog = ({ title, explanation, open, onClose, onConfirm }: Props)
             onConfirm();
           }}
         >
-          Confirm
+          {t("common.confirm")}
         </Button>
       </DialogActions>
     </Dialog>

src/components/dialog/faultTree/FaultTreeEditDialog.tsx

@@ -10,6 +10,7 @@ import { DialogActions } from "@components/materialui/dialog/DialogActions";
 import { useFaultTrees } from "@hooks/useFaultTrees";
 import { FaultTree } from "@models/faultTreeModel";
 import { yupResolver } from "@hookform/resolvers/yup";
+import { useTranslation } from "react-i18next";
 
 interface Props {
   open: boolean;
@@ -18,6 +19,7 @@ interface Props {
 }
 
 const FaultTreeEditDialog = ({ open, handleCloseDialog, faultTree }: Props) => {
+  const { t } = useTranslation();
   const [, , updateTree] = useFaultTrees();
   const [processing, setIsProcessing] = useState(false);
 
@@ -46,13 +48,13 @@ const FaultTreeEditDialog = ({ open, handleCloseDialog, faultTree }: Props) => {
   return (
     <Dialog open={open} onClose={handleCloseDialog} aria-labelledby="tree-edit-dialog-title" maxWidth="md" fullWidth>
       <DialogTitle id="tree-edit-dialog-title" onClose={handleCloseDialog}>
-        Edit Fault Tree
+        {t("renameFtaModal.title")}
       </DialogTitle>
       <DialogContent dividers>
         <TextField
           autoFocus
           margin="dense"
-          label="Fault Tree Name"
+          label={t("renameFtaModal.nameFieldLabel")}
           name="faultTreeName"
           type="text"
           fullWidth
@@ -62,7 +64,7 @@ const FaultTreeEditDialog = ({ open, handleCloseDialog, faultTree }: Props) => {
       </DialogContent>
       <DialogActions>
         <Button disabled={processing} color="primary" onClick={handleSubmit(handleCreateFaultTree)}>
-          Save Fault Tree
+          {t("common.rename")}
         </Button>
       </DialogActions>
     </Dialog>

src/components/dialog/system/SystemEditDialog.tsx

@@ -10,6 +10,7 @@ import { yupResolver } from "@hookform/resolvers/yup";
 import { System } from "@models/systemModel";
 import { useSystems } from "@hooks/useSystems";
 import { schema } from "./SystemDialog.schema";
+import { useTranslation } from "react-i18next";
 
 interface Props {
   open: boolean;
@@ -18,6 +19,7 @@ interface Props {
 }
 
 const SystemEditDialog = ({ open, handleCloseDialog, system }: Props) => {
+  const { t } = useTranslation();
   const [, , updateSystem] = useSystems();
   const [processing, setIsProcessing] = useState(false);
 
@@ -51,13 +53,13 @@ const SystemEditDialog = ({ open, handleCloseDialog, system }: Props) => {
   return (
     <Dialog open={open} onClose={handleCloseDialog} aria-labelledby="system-edit-dialog-title" maxWidth="md" fullWidth>
       <DialogTitle id="system-edit-dialog-title" onClose={handleCloseDialog}>
-        Edit System
+        {t("renameSystemModal.title")}
       </DialogTitle>
       <DialogContent dividers>
         <TextField
           autoFocus
           margin="dense"
-          label="System Name"
+          label={t("renameSystemModal.nameFieldLabel")}
           name="systemName"
           type="text"
           fullWidth
@@ -67,7 +69,7 @@ const SystemEditDialog = ({ open, handleCloseDialog, system }: Props) => {
       </DialogContent>
       <DialogActions>
         <Button disabled={processing} color="primary" onClick={handleSubmit(handleUpdateSystem)}>
-          Save System
+          {t("common.rename")}
         </Button>
       </DialogActions>
     </Dialog>