More type Risk work

  - Add "unassessed" as an office `Risk` type option

  - Updated `RiskLabel` to handle undefined and arbitrary
    strings as risk inputs.  Consumers of the component
    don't need to worry about the prop quite as much anymore.

  - Where a string risk was getting looked at, force to
    lower case first so all the constants match up.

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

client/public/locales/en/translation.json

@@ -246,7 +246,8 @@
     "high": "High",
     "low": "Low",
     "medium": "Medium",
-    "unknown": "Unknown"
+    "unknown": "Unknown",
+    "unassessed": "Unassessed"
   },
   "sidebar": {
     "administrator": "Administration",

client/src/app/Constants.ts

@@ -118,6 +118,12 @@ export const RISK_LIST: RiskListType = {
     labelColor: "grey",
     sortFactor: 4,
   },
+  unassessed: {
+    i18Key: "risks.unassessed",
+    hexColor: black.value,
+    labelColor: "grey",
+    sortFactor: 5,
+  },
 };
 
 // Proposed action

client/src/app/components/RiskLabel.tsx

@@ -7,15 +7,44 @@ import { RISK_LIST } from "@app/Constants";
 import { Risk } from "@app/api/models";
 
 export interface IRiskLabelProps {
-  risk: Risk;
+  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,
+  risk = "unknown",
 }: IRiskLabelProps) => {
   const { t } = useTranslation();
 
-  const data = RISK_LIST[risk];
+  const asRisk = normalizeToRisk(risk);
+  const data = !asRisk ? undefined : RISK_LIST[asRisk];
 
   return (
     <Label color={data ? data.labelColor : "grey"}>

client/src/app/components/application-assessment-donut-chart/application-assessment-donut-chart.tsx

@@ -32,14 +32,14 @@ export const getChartDataFromCategories = (
     .flatMap((f) => f.answers)
     .filter((f) => f.selected === true)
     .forEach((f) => {
-      switch (f.risk) {
-        case "GREEN":
+      switch (f.risk.toLowerCase()) {
+        case "green":
           green++;
           break;
         case "yellow":
           amber++;
           break;
-        case "RED":
+        case "red":
           red++;
           break;
         default:

client/src/app/components/tests/RiskLabel.test.tsx

@@ -24,7 +24,8 @@ describe("RiskLabel", () => {
     expect(screen.getByText("risks.unknown")).toBeInTheDocument();
   });
   it("Not defined risk", () => {
-    const { container } = render(<RiskLabel risk={"ANYTHING_ELSE" as any} />);
+    const { container } = render(<RiskLabel risk={"ANYTHING_ELSE"} />);
+    expect(container.firstChild).toHaveClass("pf-v5-c-label");
     expect(screen.getByText("ANYTHING_ELSE")).toBeInTheDocument();
   });
 });

client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx

@@ -294,7 +294,7 @@ const TabDetailsContent: React.FC<{
           {t("terms.riskFromApplication")}
         </Title>
         <Text component="small" cy-data="comments">
-          <RiskLabel risk={application?.risk || "unknown"} />
+          <RiskLabel risk={application?.risk} />
         </Text>
       </TextContent>
 

client/src/app/pages/archetypes/components/archetype-detail-drawer.tsx

@@ -207,7 +207,7 @@ const ArchetypeDetailDrawer: React.FC<IArchetypeDetailDrawerProps> = ({
                 {t("terms.riskFromArchetype")}
               </Title>
               <Text component="small" cy-data="comments">
-                <RiskLabel risk={archetype?.risk || "unknown"} />
+                <RiskLabel risk={archetype?.risk} />
               </Text>
             </TextContent>
           </Tab>

client/src/app/pages/reports/components/adoption-candidate-table/adoption-candidate-table.tsx

@@ -126,7 +126,7 @@ const AdoptionCandidateTable: React.FC<AdoptionCandidateTableProps> = () => {
                     {item?.review?.effortEstimate ?? "N/A"}
                   </Td>
                   <Td {...getTdProps({ columnKey: "risk" })}>
-                    <RiskLabel risk={item.application.risk || "unknown"} />
+                    <RiskLabel risk={item.application.risk} />
                   </Td>
                 </TableRowContentWithControls>
               </Tr>