Review archetypes code implementation

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

client/src/app/Paths.ts

@@ -16,6 +16,7 @@ export enum Paths {
   applicationAssessmentSummary = "/applications/assessment-summary/:assessmentId",
   archetypeAssessmentSummary = "/archetypes/assessment-summary/:assessmentId",
   applicationsReview = "/applications/:applicationId/review",
+  archetypeReview = "/archetypes/:archetypeId/review",
   applicationsAnalysis = "/applications/analysis",
   archetypes = "/archetypes",
   controls = "/controls",

client/src/app/Routes.tsx

@@ -90,6 +90,11 @@ export const devRoutes: IRoute[] = [
     comp: Assessment,
     exact: false,
   },
+  {
+    path: Paths.archetypeReview,
+    comp: Review,
+    exact: false,
+  },
   {
     path: Paths.applicationsReview,
     comp: Review,

client/src/app/api/models.ts

@@ -139,6 +139,7 @@ export interface Review {
   workPriority: number;
   comments?: string;
   application?: Ref;
+  archetype?: Ref;
 }
 
 export interface ApplicationDependency {
@@ -753,4 +754,5 @@ export interface Archetype {
   stakeholderGroups?: Ref[];
   applications?: Ref[];
   assessments?: Ref[];
+  review?: Ref;
 }

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

@@ -20,7 +20,7 @@ import {
   ApplicationDetailDrawer,
   IApplicationDetailDrawerProps,
 } from "./application-detail-drawer";
-import { useGetReviewByAppId } from "@app/queries/reviews";
+import { useGetReviewByItemId } from "@app/queries/reviews";
 
 export interface IApplicationDetailDrawerAssessmentProps
   extends Pick<IApplicationDetailDrawerProps, "application" | "onCloseClick"> {
@@ -32,7 +32,7 @@ export const ApplicationDetailDrawerAssessment: React.FC<
 > = ({ application, onCloseClick, task }) => {
   const { t } = useTranslation();
 
-  const { review: appReview } = useGetReviewByAppId(application?.id || "");
+  const { review: appReview } = useGetReviewByItemId(application?.id);
   const notYetReviewed = (
     <EmptyTextMessage message={t("terms.notYetReviewed")} />
   );

client/src/app/pages/archetypes/archetypes-page.tsx

@@ -69,6 +69,7 @@ const Archetypes: React.FC = () => {
   const [archetypeToEdit, setArchetypeToEdit] = useState<Archetype | null>(
     null
   );
+  const [reviewToEdit, setReviewToEdit] = React.useState<number | null>(null);
 
   const [archetypeToDuplicate, setArchetypeToDuplicate] =
     useState<Archetype | null>(null);
@@ -186,16 +187,15 @@ const Archetypes: React.FC = () => {
     }
   };
   const reviewSelectedArchetype = (archetype: Archetype) => {
-    //TODO: Review archetype
-    // if (application.review) {
-    //   setReviewToEdit(application.id);
-    // } else {
-    //   history.push(
-    //     formatPath(Paths.applicationsReview, {
-    //       applicationId: application.id,
-    //     })
-    //   );
-    // }
+    if (archetype.review) {
+      setReviewToEdit(archetype.id);
+    } else {
+      history.push(
+        formatPath(Paths.archetypeReview, {
+          archetypeId: archetype.id,
+        })
+      );
+    }
   };
 
   return (
@@ -309,6 +309,11 @@ const Archetypes: React.FC = () => {
                                 onClick: () =>
                                   assessSelectedArchetype(archetype),
                               },
+                              {
+                                title: t("actions.review"),
+                                onClick: () =>
+                                  reviewSelectedArchetype(archetype),
+                              },
                               {
                                 title: t("actions.edit"),
                                 onClick: () => setArchetypeToEdit(archetype),

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

@@ -36,8 +36,8 @@ import {
 import { ApplicationSelectionContext } from "../../application-selection-context";
 import { CartesianSquare } from "./cartesian-square";
 import { Arrow } from "./arrow";
-import { useGetReviewByAppId } from "@app/queries/reviews";
 import useFetchApplicationDependencies from "@app/hooks/useFetchApplicationDependencies/useFetchApplicationDependencies";
+import { useGetReviewByItemId } from "@app/queries/reviews";
 
 interface Line {
   from: LinePoint;
@@ -165,7 +165,7 @@ export const AdoptionCandidateGraph: React.FC = () => {
       const appConfidence = confidences.find(
         (elem) => elem.applicationId === current.id
       );
-      const { review: appReview } = useGetReviewByAppId(current?.id || "");
+      const { review: appReview } = useGetReviewByItemId(current?.id);
 
       if (appConfidence && appReview) {
         const key = appReview.proposedAction;

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

@@ -22,7 +22,7 @@ import {
 } from "@app/api/models";
 
 import { ApplicationSelectionContext } from "../../application-selection-context";
-import { useGetReviewByAppId } from "@app/queries/reviews";
+import { useGetReviewByItemId } from "@app/queries/reviews";
 import { useQuery } from "@tanstack/react-query";
 import { useFetchRisks } from "@app/queries/risks";
 import { AppTableWithControls } from "@app/components/AppTableWithControls";
@@ -110,7 +110,7 @@ export const AdoptionCandidateTable: React.FC<IAdoptionCandidateTable> = () => {
       const confidenceData = confidence?.find(
         (e) => e.applicationId === app.id
       );
-      const { review: reviewData } = useGetReviewByAppId(app?.id || "");
+      const { review: reviewData } = useGetReviewByItemId(app?.id);
 
       const riskData = assessmentRisks?.find((e) => e.applicationId === app.id);
 

client/src/app/pages/review/components/review-form/review-form.tsx

@@ -15,6 +15,7 @@ import { PROPOSED_ACTION_LIST, EFFORT_ESTIMATE_LIST } from "@app/Constants";
 import { number } from "yup";
 import {
   Application,
+  Archetype,
   EffortEstimate,
   New,
   ProposedAction,
@@ -35,6 +36,7 @@ import { useQueryClient } from "@tanstack/react-query";
 import { useHistory } from "react-router-dom";
 import { Paths } from "@app/Paths";
 import { NotificationsContext } from "@app/components/NotificationsContext";
+import useIsArchetype from "@app/hooks/useIsArchetype";
 
 export interface FormValues {
   action: ProposedAction;
@@ -45,17 +47,20 @@ export interface FormValues {
 }
 
 export interface IReviewFormProps {
-  application: Application;
+  application?: Application;
+  archetype?: Archetype;
   review?: Review | null;
 }
 
 export const ReviewForm: React.FC<IReviewFormProps> = ({
+  archetype,
   application,
   review,
 }) => {
   const { t } = useTranslation();
   const history = useHistory();
   const { pushNotification } = React.useContext(NotificationsContext);
+  const isArchetype = useIsArchetype();
 
   const actionOptions: OptionWithValue<ProposedAction>[] = useMemo(() => {
     return Object.entries(PROPOSED_ACTION_LIST).map(([key, value]) => ({
@@ -107,39 +112,11 @@ export const ReviewForm: React.FC<IReviewFormProps> = ({
     console.log("Invalid form", errors);
   };
 
-  // const onSubmit = (formValues: FormValues) => {
-  //   const payload: Review = {
-  //     ...review,
-  //     proposedAction: formValues.action,
-  //     effortEstimate: formValues.effort,
-  //     businessCriticality: formValues.criticality || 0,
-  //     workPriority: formValues.priority || 0,
-  //     comments: formValues.comments.trim(),
-  //     // application: { ...application, review: undefined },
-  //     application: { id: application.id, name: application.name },
-  //   };
-
-  //   let promise: Promise<Review>;
-  //   if (review) {
-  //     promise = updateReview({
-  //       ...review,
-  //       ...payload,
-  //     });
-  //   } else {
-  //     promise = createReview(payload);
-  //   }
-
-  //   promise
-  //     .then((response) => {
-  //       onSaved(response);
-  //     })
-  //     .catch((error) => {});
-  // };
   const queryClient = useQueryClient();
   const onHandleUpdateReviewSuccess = () => {
     queryClient.invalidateQueries([
       reviewsByItemIdQueryKey,
-      application.review?.id,
+      application?.review?.id,
     ]);
   };
   const createReviewMutation = useCreateReviewMutation();
@@ -155,7 +132,15 @@ export const ReviewForm: React.FC<IReviewFormProps> = ({
       businessCriticality: formValues.criticality || 0,
       workPriority: formValues.priority || 0,
       comments: formValues.comments.trim(),
-      application: { id: application.id, name: application.name },
+      ...(isArchetype && archetype
+        ? {
+            archetype: { id: archetype.id, name: archetype.name },
+          }
+        : application
+        ? {
+            application: { id: application.id, name: application.name },
+          }
+        : undefined),
     };
 
     try {
@@ -178,7 +163,7 @@ export const ReviewForm: React.FC<IReviewFormProps> = ({
         });
       }
 
-      history.push(Paths.applications);
+      history.push(isArchetype ? Paths.archetypes : Paths.applications);
     } catch (error) {
       console.error("Error:", error);
       pushNotification({
@@ -309,7 +294,7 @@ export const ReviewForm: React.FC<IReviewFormProps> = ({
           aria-label="cancel"
           variant={ButtonVariant.link}
           onClick={() => {
-            history.push(Paths.applications);
+            history.push(isArchetype ? Paths.archetypes : Paths.applications);
           }}
         >
           {t("actions.cancel")}

client/src/app/pages/review/review-page.tsx

@@ -22,22 +22,44 @@ import QuestionnaireSummary, {
   SummaryType,
 } from "@app/components/questionnaire-summary/questionnaire-summary";
 import { PageHeader } from "@app/components/PageHeader";
-import { useGetReviewByAppId } from "@app/queries/reviews";
+import { useGetReviewByItemId } from "@app/queries/reviews";
+import useIsArchetype from "@app/hooks/useIsArchetype";
 
 const ReviewPage: React.FC = () => {
   const { t } = useTranslation();
 
   const { applicationId, archetypeId } = useParams<ReviewRoute>();
+  const isArchetype = useIsArchetype();
 
-  const { application, review, fetchError, isFetching } = useGetReviewByAppId(
-    applicationId || ""
+  const { application, review, fetchError, isFetching } = useGetReviewByItemId(
+    applicationId || archetypeId,
+    isArchetype
   );
 
   //TODO: Review archetypes?
   // const { archetype } = useFetchArchetypeById(archetypeId || "");
 
   //TODO: Add a dropdown with multiple assessments to choose from
   const assessment = undefined;
+  const breadcrumbs = [
+    ...(isArchetype
+      ? [
+          {
+            title: t("terms.archetypes"),
+            path: Paths.archetypes,
+          },
+        ]
+      : [
+          {
+            title: t("terms.applications"),
+            path: Paths.applications,
+          },
+        ]),
+    {
+      title: t("terms.review"),
+      path: Paths.applicationsReview,
+    },
+  ];
 
   if (fetchError) {
     return (
@@ -48,16 +70,7 @@ const ReviewPage: React.FC = () => {
             description={
               <Text component="p">{t("message.reviewInstructions")}</Text>
             }
-            breadcrumbs={[
-              {
-                title: t("terms.applications"),
-                path: Paths.applications,
-              },
-              {
-                title: t("terms.review"),
-                path: Paths.applicationsReview,
-              },
-            ]}
+            breadcrumbs={breadcrumbs}
             menuActions={[]}
           />
         </PageSection>