Rendering SNS number and label

src/components/editor/faultTree/Editor.tsx

@@ -50,7 +50,9 @@ const Editor = () => {
 
   useEffect(() => {
     if (faultTree) {
-      setAppBarTitle(faultTree.name);
+      setAppBarTitle(
+        faultTree?.subSystem?.ataCode ? `${faultTree.name} (${faultTree?.subSystem?.ataCode})` : faultTree.name,
+      );
       setRootEvent(faultTree.manifestingEvent);
 
       if (faultTree.faultEventScenarios) {

src/components/editor/faultTree/menu/faultEvent/FaultEventMenu.tsx

@@ -96,7 +96,8 @@ const FaultEventMenu = ({
   const [failureModeOverview, setFailureModeOverview] = useState<FailureMode | null>(null);
 
   const [criticality, setCriticality] = useState<string | undefined>(undefined);
-  const [ataSystem, setAtaSystem] = useState<string | undefined>("");
+  const [ataCode, setAtaCode] = useState<string | undefined>("");
+  const [ataNames, setAtaNames] = useState<string[] | undefined>(undefined);
   const [partNumber, setPartNumber] = useState<string | undefined>("");
   const [stock, setStock] = useState<string | undefined>("");
   const [quantity, setQuantity] = useState<number | undefined>(0);
@@ -213,10 +214,15 @@ const FaultEventMenu = ({
       const filteredPartNumber = superTypes.filter((sType) => sType?.partNumber);
 
       if (filteredAtaCode.length === 1 && filteredAtaCode[0].ataCode && filteredAtaCode[0].name) {
-        const ataSystemString = `${filteredAtaCode[0].ataCode} ${filteredAtaCode[0].name}`;
-        setAtaSystem(ataSystemString);
+        setAtaCode(filteredAtaCode[0].ataCode);
+        const altNames = asArray(filteredAtaCode[0]?.altNames);
+        if (filteredAtaCode[0].ataCode === filteredAtaCode[0].name) {
+          if (altNames.length > 0) setAtaNames(altNames);
+        } else {
+          setAtaNames([filteredAtaCode[0].name]);
+        }
       } else {
-        setAtaSystem(undefined);
+        setAtaCode(undefined);
       }
 
       if (filteredPartNumber.length === 1 && filteredPartNumber[0].partNumber) {
@@ -532,14 +538,24 @@ const FaultEventMenu = ({
       {shapeToolData && (
         <EventFailureModeProvider eventIri={shapeToolData?.iri}>
           <Box>
-            {(criticality || ataSystem || partNumber || stock || quantity || schematicDesignation) && (
+            {(criticality || ataCode || partNumber || stock || quantity || schematicDesignation) && (
               <Divider className={classes.divider} />
             )}
             {criticality && <Typography>{propertyWithValue("eventDescription.severity", criticality)}</Typography>}
-            {ataSystem && (
+            {ataCode && (
               <Typography>
                 <span className={classes.label}>{t("faultEventMenu.ataSystem")}:</span>
-                <span className={classes.notEditableValue}>{ataSystem}</span>
+                <Tooltip
+                  title={
+                    <Typography>
+                      {ataNames.map((n) => {
+                        return <div>{n}</div>;
+                      })}
+                    </Typography>
+                  }
+                >
+                  <span className={classes.notEditableValue}>{ataCode}</span>
+                </Tooltip>
               </Typography>
             )}
             {partNumber && (

src/components/table/FaultTreeTableBody.tsx

@@ -6,7 +6,7 @@ import { useTranslation } from "react-i18next";
 import useStyles from "./FaultTreeOverviewTable.styles";
 import { FaultTree, getFaultTreeCalculationStatus } from "@models/faultTreeModel";
 import { extractFragment } from "@services/utils/uriIdentifierUtils";
-import { findByIri, formatDate } from "@utils/utils";
+import { asArray, findByIri, formatDate } from "@utils/utils";
 import { ROUTES, Status } from "@utils/constants";
 import { useSelectedSystemSummaries } from "@hooks/useSelectedSystemSummaries";
 import { useSystems } from "@hooks/useSystems";
@@ -57,11 +57,29 @@ const FaultTreeTableBody: FC<FaultTreeTableBodyProps> = ({ faultTrees, handleFau
           : theme.main.black;
 
         const editor = faultTree?.editor || faultTree?.creator;
+
+        const ataNames = asArray(
+          faultTree?.subSystem?.name === faultTree?.subSystem?.ataCode
+            ? faultTree?.subSystem?.altNames
+            : faultTree?.subSystem?.name,
+        ).filter((n) => n);
         return (
           <TableRow key={rowIndex} className={classes.noBorder}>
             <TableCell className={classes.firstColumn}>{faultTree.name}</TableCell>
             <TableCell className={classes.tableCell}>{faultTree?.system?.name}</TableCell>
-            <TableCell className={classes.tableCell}>{faultTree?.subSystem?.name}</TableCell>
+            <TableCell className={classes.tableCell}>
+              <Tooltip
+                title={
+                  <Typography>
+                    {ataNames.map((n) => {
+                      return <div>{n}</div>;
+                    })}
+                  </Typography>
+                }
+              >
+                <Typography>{faultTree?.subSystem?.ataCode}</Typography>
+              </Tooltip>
+            </TableCell>
             <TableCell style={{ color: syncStatusColor }} className={classes.tableCell}>
               {failureRate(
                 faultTree?.calculatedFailureRate,

src/models/eventModel.tsx

@@ -121,6 +121,7 @@ export interface FaultEvent extends AbstractModel {
           ataCode?: string;
           partNumber?: string;
           name?: string;
+          altNames?: string;
         };
         stock?: string;
         schematicDesignation?: string;

src/models/faultTreeModel.tsx

@@ -45,6 +45,8 @@ export interface FaultTree extends AbstractModel {
   status?: string;
   subSystem?: {
     name?: string;
+    ataCode?: string;
+    altNames?: string;
   };
   operationalDataFilter: OperationalDataFilter;
 }

src/models/systemModel.tsx

@@ -5,6 +5,7 @@ import { OperationalDataFilter, CONTEXT as FILTER_CONTEXT } from "@models/operat
 
 const ctx = {
   name: VocabularyUtils.PREFIX + "name",
+  altNames: VocabularyUtils.PREFIX + "alt-name",
   globalOperationalDataFilter: VocabularyUtils.PREFIX + "has-global-operational-data-filter",
   operationalDataFilter: VocabularyUtils.PREFIX + "has-operational-data-filter",
   components: VocabularyUtils.PREFIX + "has-part-component",
@@ -14,6 +15,7 @@ export const CONTEXT = Object.assign({}, ctx, COMPONENT_CONTEXT, ABSTRACT_CONTEX
 
 export interface System extends AbstractModel {
   name: string;
+  altNames: string;
   iri?: string;
   components?: Component[];
   globalOperationalDataFilter: OperationalDataFilter;