Use normalizeRisk() to enforce risk value stability

Signed-off-by: Scott J Dickerson <[email protected]>

Author: sjd78

client/src/app/components/RiskLabel.tsx

@@ -5,45 +5,18 @@ import { Label } from "@patternfly/react-core";
 
 import { RISK_LIST } from "@app/Constants";
 import { Risk } from "@app/api/models";
+import { normalizeRisk } from "@app/utils/type-utils";
 
 export interface IRiskLabelProps {
   risk?: Risk | string;
 }
 
-function normalizeToRisk(risk?: Risk | string): Risk | undefined {
-  let normal: Risk | undefined = undefined;
-
-  switch (risk) {
-    case "green":
-      normal = "green";
-      break;
-
-    case "yellow":
-      normal = "yellow";
-      break;
-
-    case "red":
-      normal = "red";
-      break;
-
-    case "unassessed":
-      normal = "unassessed";
-      break;
-
-    case "unknown":
-      normal = "unknown";
-      break;
-  }
-
-  return normal;
-}
-
 export const RiskLabel: React.FC<IRiskLabelProps> = ({
-  risk = "unknown",
+  risk,
 }: IRiskLabelProps) => {
   const { t } = useTranslation();
 
-  const asRisk = normalizeToRisk(risk);
+  const asRisk = normalizeRisk(risk);
   const data = !asRisk ? undefined : RISK_LIST[asRisk];
 
   return (

client/src/app/pages/applications/applications-table/applications-table.tsx

@@ -17,7 +17,12 @@ import {
   Modal,
   Tooltip,
 } from "@patternfly/react-core";
-import { PencilAltIcon, TagIcon } from "@patternfly/react-icons";
+import {
+  PencilAltIcon,
+  TagIcon,
+  WarningTriangleIcon,
+} from "@patternfly/react-icons";
+
 import {
   Table,
   Thead,
@@ -59,8 +64,8 @@ import {
   tasksReadScopes,
   tasksWriteScopes,
 } from "@app/rbac";
+import { normalizeRisk } from "@app/utils/type-utils";
 import { checkAccess } from "@app/utils/rbac-utils";
-import WarningTriangleIcon from "@patternfly/react-icons/dist/esm/icons/warning-triangle-icon";
 
 // Hooks
 import { useLocalTableControls } from "@app/hooks/table-controls";
@@ -486,13 +491,13 @@ export const ApplicationsTable: React.FC = () => {
             what: t("terms.risk").toLowerCase(),
           }) + "...",
         selectOptions: [
-          { value: "green", label: "Low" },
-          { value: "yellow", label: "Medium" },
-          { value: "red", label: "High" },
-          { value: "unknown", label: "Unknown" },
-          { value: "unassessed", label: "Unassessed" },
+          { value: "green", label: t("risks.low") },
+          { value: "yellow", label: t("risks.medium") },
+          { value: "red", label: t("risks.high") },
+          { value: "unknown", label: t("risks.unknown") },
+          { value: "unassessed", label: t("risks.unassessed") },
         ],
-        getItemValue: (item) => item.risk ?? "",
+        getItemValue: (item) => normalizeRisk(item.risk) ?? "",
       },
     ],
     initialItemsPerPage: 10,

client/src/app/utils/type-utils.ts

@@ -1,3 +1,5 @@
+import { Risk } from "@app/api/models";
+
 export type KeyWithValueType<T, V> = {
   [Key in keyof T]-?: T[Key] extends V ? Key : never;
 }[keyof T];
@@ -10,3 +12,38 @@ export type DisallowCharacters<
 export type DiscriminatedArgs<TBoolDiscriminatorKey extends string, TArgs> =
   | ({ [key in TBoolDiscriminatorKey]: true } & TArgs)
   | { [key in TBoolDiscriminatorKey]?: false };
+
+/**
+ * Normalize an optional `Risk` or `string` input and return either the matching
+ * `Risk` or the `defaultValue` (which defaults to `undefined`).
+ */
+export function normalizeRisk(
+  risk?: Risk | string,
+  defaultValue?: Risk
+): Risk | undefined {
+  let normal: Risk | undefined = defaultValue;
+
+  switch (risk) {
+    case "green":
+      normal = "green";
+      break;
+
+    case "yellow":
+      normal = "yellow";
+      break;
+
+    case "red":
+      normal = "red";
+      break;
+
+    case "unassessed":
+      normal = "unassessed";
+      break;
+
+    case "unknown":
+      normal = "unknown";
+      break;
+  }
+
+  return normal;
+}