diff --git a/public/locales/cs/translation.json b/public/locales/cs/translation.json index 107b808e..22402bac 100644 --- a/public/locales/cs/translation.json +++ b/public/locales/cs/translation.json @@ -61,7 +61,7 @@ "autoLayoutToolTip": "Automatické uspořádání stromu poruch", "exportToolTip": "Exportovat aktuální zobrazení", "minimumOperationalHours": "Min. provozní doba", - "diagramOptions": "Možnosti diagramu", + "diagramOptions": "Akce 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.", @@ -140,6 +140,7 @@ "linkedComponent": "Propojená komponenta" }, "faultEventMenu": { + "detailSectionTitle": "Podrobnosti o události", "eventName": "Název události", "criticality": "Kritičnost", "fhaBasedFailureRate": "Intenzita poruch založená na FHA", diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index af9dec9a..727775bd 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -61,7 +61,7 @@ "autoLayoutToolTip": "Automatic arrangement of the fault tree", "exportToolTip": "Export current view", "minimumOperationalHours": "Min. operational hours", - "diagramOptions": "Diagram Options", + "diagramOptions": "Diagram Actions", "messages": { "mohNewValue": "New value, not used in fault tree evaluation.", "mohExperimental": "Value is different from the system's min. operational hour value.", @@ -140,6 +140,7 @@ "linkedComponent": "Linked Component" }, "faultEventMenu": { + "detailSectionTitle": "Event Details", "eventName": "Event name", "criticality": "Criticality", "fhaBasedFailureRate": "FHA based failure rate", diff --git a/src/components/dialog/faultEvent/FaultEventCreation.styles.tsx b/src/components/dialog/faultEvent/FaultEventCreation.styles.tsx index b256cb3d..ce08f7cc 100644 --- a/src/components/dialog/faultEvent/FaultEventCreation.styles.tsx +++ b/src/components/dialog/faultEvent/FaultEventCreation.styles.tsx @@ -2,6 +2,13 @@ import { Theme } from "@mui/material"; import { makeStyles } from "tss-react/mui"; const useStyles = makeStyles()((theme: Theme) => ({ + menuTitle: { + backgroundColor: "#1976D256", + marginLeft: "-16px", + marginRight: "-16px", + paddingLeft: "8px", + borderBottom: "inset", + }, divForm: { flexGrow: 1, }, diff --git a/src/components/dialog/faultEvent/FaultEventCreation.tsx b/src/components/dialog/faultEvent/FaultEventCreation.tsx index cbc70be3..7c09ce43 100644 --- a/src/components/dialog/faultEvent/FaultEventCreation.tsx +++ b/src/components/dialog/faultEvent/FaultEventCreation.tsx @@ -101,10 +101,10 @@ const FaultEventCreation = ({ } return ( <> - - {`${t("newFtaModal.eventPlaceholder")}:`} + + {`${t("faultEventMenu.detailSectionTitle")}`} - +
= ({ const actionCall = useActionCall(isModified, setShowUnsavedChangesDialog); return ( - + actionCall(onExportDiagram)} onConvertToTable={() => actionCall(onConvertToTable)} diff --git a/src/components/editor/faultTree/menu/faultEvent/FaultEventMenu.tsx b/src/components/editor/faultTree/menu/faultEvent/FaultEventMenu.tsx index 4e657454..131604c7 100644 --- a/src/components/editor/faultTree/menu/faultEvent/FaultEventMenu.tsx +++ b/src/components/editor/faultTree/menu/faultEvent/FaultEventMenu.tsx @@ -435,7 +435,6 @@ const FaultEventMenu = ({ {basedFailureRate && ( {fhaFailureRateComponent(basedFailureRate, null, null)} )} - )} @@ -456,7 +455,6 @@ const FaultEventMenu = ({ {basedFailureRate && ( {fhaFailureRateComponent(basedFailureRate, null, null)} )} - )} @@ -533,7 +531,6 @@ const FaultEventMenu = ({ onChange={(event) => handleManuallyDefinedFailureRateChange(event, NodeTypeWithManualFailureRate.External)} inputProps={{ inputMode: "decimal" }} /> - )} @@ -547,6 +544,9 @@ const FaultEventMenu = ({ {shapeToolData && ( + {(criticality || ataSystem || partNumber || stock || quantity || schematicDesignation) && ( + + )} {criticality && {propertyWithValue("eventDescription.severity", criticality)}} {ataSystem && ( diff --git a/src/components/editor/menu/DiagramOptions.styles.tsx b/src/components/editor/menu/DiagramOptions.styles.tsx new file mode 100644 index 00000000..d475b410 --- /dev/null +++ b/src/components/editor/menu/DiagramOptions.styles.tsx @@ -0,0 +1,13 @@ +import { Theme } from "@mui/material"; +import { makeStyles } from "tss-react/mui"; + +const useStyles = makeStyles()((theme: Theme) => ({ + menuTitle: { + backgroundColor: "#1976D256", + marginRight: "-16px", + paddingLeft: "8px", + borderBottom: "inset", + }, +})); + +export default useStyles; diff --git a/src/components/editor/menu/DiagramOptions.tsx b/src/components/editor/menu/DiagramOptions.tsx index 1c927418..2152ba03 100644 --- a/src/components/editor/menu/DiagramOptions.tsx +++ b/src/components/editor/menu/DiagramOptions.tsx @@ -8,6 +8,7 @@ import * as React from "react"; import { useTranslation } from "react-i18next"; import CircularProgress from "@mui/material/CircularProgress"; import { ENVVariable } from "@utils/constants"; +import useStyles from "@components/editor/menu/DiagramOptions.styles"; export interface Props { onApplyAutomaticLayout: () => void; @@ -27,10 +28,11 @@ const DiagramOptions = ({ rendering, }: Props) => { const { t } = useTranslation(); + const { classes } = useStyles(); return ( - - + <> + {t("diagramSidePanel.diagramOptions")}
@@ -58,7 +60,7 @@ const DiagramOptions = ({ )}
-
+ ); }; diff --git a/src/components/editor/system/menu/component/ComponentSidebarMenu.styles.tsx b/src/components/editor/system/menu/component/ComponentSidebarMenu.styles.tsx new file mode 100644 index 00000000..cc5438e3 --- /dev/null +++ b/src/components/editor/system/menu/component/ComponentSidebarMenu.styles.tsx @@ -0,0 +1,22 @@ +import { Theme } from "@mui/material"; +import { makeStyles } from "tss-react/mui"; + +const useStyles = makeStyles()((theme: Theme) => ({ + menuTitle: { + backgroundColor: "#1976D256", + marginLeft: "-16px", + marginRight: "-16px", + paddingLeft: "8px", + borderBottom: "inset", + }, + emptyTitle: { + textAlign: "center", + fontStyle: "italic", + fontWeight: "bold", + color: theme.main.grey, + padding: theme.spacing(10, 2), + }, +})); + +// TODO jss-to-tss-react codemod: usages of this hook outside of this file will not be converted. +export default useStyles; diff --git a/src/components/editor/system/menu/component/ComponentSidebarMenu.tsx b/src/components/editor/system/menu/component/ComponentSidebarMenu.tsx index f1ad1976..b46a0a88 100644 --- a/src/components/editor/system/menu/component/ComponentSidebarMenu.tsx +++ b/src/components/editor/system/menu/component/ComponentSidebarMenu.tsx @@ -14,6 +14,7 @@ import { useForm } from "react-hook-form"; import { FailureModeProvider } from "@hooks/useFailureModes"; import { simplifyReferences } from "@utils/utils"; import { useTranslation } from "react-i18next"; +import useStyles from "@components/editor/system/menu/component/ComponentSidebarMenu.styles"; interface Props { component: Component; @@ -24,6 +25,7 @@ interface Props { const ComponentSidebarMenu = ({ component, onComponentUpdated, systemComponents }: Props) => { const [showSnackbar] = useSnackbar(); const { t } = useTranslation(); + const { classes } = useStyles(); const allowedComponents = filter(flatten([systemComponents]), (o) => o.iri !== component?.iri); @@ -62,17 +64,19 @@ const ComponentSidebarMenu = ({ component, onComponentUpdated, systemComponents return ( - - {t("systemComponentMenu.editComponent")} - + {component ? ( - + <> + + {t("systemComponentMenu.editComponent")} + + + ) : ( - + {t("systemComponentMenu.notSelected")} )} - {component && (