✨ Add assessed archetypes section in drawer:

Signed-off-by: ibolton336 <[email protected]>

client/public/locales/en/translation.json

@@ -237,6 +237,7 @@
     "associatedApplications": "Associated applications",
     "associatedArchetypes": "Associated archetypes",
     "archetypesReviewed": "Archetypes reviewed",
+    "archetypesAssessed": "Archetypes assessed",
     "add": "Add",
     "additionalNotesOrComments": "Additional notes or comments",
     "adoptionCandidateDistribution": "Application confidence and risk",

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

@@ -49,6 +49,7 @@ import { LabelsFromItems } from "@app/components/labels/labels-from-items/labels
 import { ReviewedArchetypeItem } from "./reviewed-archetype-item";
 import { RiskLabel } from "@app/components/RiskLabel";
 import { ApplicationDetailFields } from "./application-detail-fields";
+import { AssessedArchetypeItem } from "./assessed-archetype-item";
 
 export interface IApplicationDetailDrawerProps
   extends Pick<IPageDrawerContentProps, "onCloseClick"> {
@@ -180,6 +181,23 @@ export const ApplicationDetailDrawer: React.FC<
                     )}
                   </DescriptionListDescription>
                 </DescriptionListGroup>
+                <DescriptionListGroup>
+                  <DescriptionListTerm>
+                    {t("terms.archetypesAssessed")}
+                  </DescriptionListTerm>
+                  <DescriptionListDescription>
+                    {application?.archetypes?.length ?? 0 > 0 ? (
+                      application?.archetypes?.map((archetypeRef) => (
+                        <AssessedArchetypeItem
+                          key={archetypeRef.id}
+                          id={archetypeRef.id}
+                        />
+                      ))
+                    ) : (
+                      <EmptyTextMessage message={t("terms.none")} />
+                    )}
+                  </DescriptionListDescription>
+                </DescriptionListGroup>
                 <DescriptionListGroup>
                   <DescriptionListTerm>
                     {t("terms.archetypesReviewed")}

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

@@ -0,0 +1,15 @@
+import { useFetchArchetypeById } from "@app/queries/archetypes";
+import { Label } from "@patternfly/react-core";
+import React from "react";
+
+export const AssessedArchetypeItem = ({ id }: { id: number }) => {
+  const { archetype } = useFetchArchetypeById(id);
+
+  if (!archetype?.assessed) return null;
+
+  return (
+    <Label color="grey" key={id}>
+      {archetype.name}
+    </Label>
+  );
+};