✨ Fix missing archetype flow pieces (#1368)

Closes #1298 #1278 #1332 #1324 - Adjusts routes for archetype assessment flow vs application assessment flow - Creates a hook for looking up app or archetype based on their ID to avoid conditional hook calls. - Wire up create assessment override check <img width="1918" alt="Screenshot 2023-09-18 at 12 33 20 PM" src="https://github.com/konveyor/tackle2-ui/assets/11218376/53d91eba-ec43-46c2-ada7-68f384d9b3a7"> -Drive assessment wizard from assessment rather than questionnaire - With this PR, assessment flow is fully working for apps and archetypes against the hub outstanding PR. Signed-off-by: ibolton336 <[email protected]>
konveyor · Sep 19, 2023 · c36b614 · c36b614
1 parent 063e16a
commit c36b614
Show file tree

Hide file tree

Showing 20 changed files with 297 additions and 119 deletions.
diff --git a/client/public/locales/en/translation.json b/client/public/locales/en/translation.json
@@ -42,6 +42,7 @@
     "manageDependencies": "Manage dependencies",
     "manageImports": "Manage imports",
     "next": "Next",
+    "override": "Override",
     "review": "Review",
     "save": "Save",
     "saveAndReview": "Save and review",
@@ -51,7 +52,8 @@
     "selectPage": "Select page",
     "submitReview": "Submit review",
     "view": "View",
-    "viewErrorReport": "View error report"
+    "viewErrorReport": "View error report",
+    "viewArchetypes": "View archetypes"
   },
   "colors": {
     "black": "Black",
@@ -168,8 +170,8 @@
     "noDataAvailableTitle": "No data available",
     "noResultsFoundBody": "No results match the filter criteria. Remove all filters or clear all filters to show results.",
     "noResultsFoundTitle": "No results found",
-    "overrideAssessmentConfirmation": "This application has already been assessed. Do you want to continue?",
-    "overrideArchetypeConfirmation": "The archetype for this application already has an assessment. Do you want to create a dedicated assessment for this application?",
+    "overrideAssessmentDescription": "The archetype for {{what}} already has an assessment.",
+    "overrideAssessmentConfirmation": "Do you want to create a dedicated assessment for this application?",
     "overrideReviewConfirmation": "This application has already been reviewed. Do you want to continue?",
     "reasonForError": "The reported reason for the error:",
     "reviewInstructions": "Use this section to provide your assessment of the possible migration/modernization plan and effort estimation.",

diff --git a/client/src/app/Paths.ts b/client/src/app/Paths.ts
@@ -12,7 +12,8 @@ export enum Paths {
   applicationsAssessment = "/applications/assessment/:assessmentId",
   applicationAssessmentActions = "/applications/assessment-actions/:applicationId",
   archetypeAssessmentActions = "/archetypes/assessment-actions/:archetypeId",
-  assessmentSummary = "/applications/assessment-summary/:assessmentId",
+  applicationAssessmentSummary = "/applications/assessment-summary/:assessmentId",
+  archetypeAssessmentSummary = "/archetypes/assessment-summary/:assessmentId",
   applicationsReview = "/applications/:applicationId/review",
   applicationsAnalysis = "/applications/analysis",
   archetypes = "/archetypes",

diff --git a/client/src/app/Routes.tsx b/client/src/app/Routes.tsx
@@ -102,7 +102,12 @@ export const devRoutes: IRoute[] = [
     exact: false,
   },
   {
-    path: Paths.assessmentSummary,
+    path: Paths.applicationAssessmentSummary,
+    comp: AssessmentSummary,
+    exact: false,
+  },
+  {
+    path: Paths.archetypeAssessmentSummary,
     comp: AssessmentSummary,
     exact: false,
   },

diff --git a/client/src/app/api/models.ts b/client/src/app/api/models.ts
@@ -128,6 +128,7 @@ export interface Application {
   migrationWave: Ref | null;
   assessments?: Ref[];
   assessed?: boolean;
+  archetypes?: Ref[];
 }
 
 export interface Review {
@@ -749,6 +750,6 @@ export interface Archetype {
   assessmentTags?: Tag[];
   stakeholders?: Ref[];
   stakeholderGroups?: Ref[];
-  applications?: Application[];
+  applications?: Ref[];
   assessments?: Ref[];
 }
diff --git a/client/src/app/components/ConfirmDialog.tsx b/client/src/app/components/ConfirmDialog.tsx
@@ -4,6 +4,7 @@ import {
   Modal,
   ButtonVariant,
   ModalVariant,
+  Alert,
 } from "@patternfly/react-core";
 
 export interface ConfirmDialogProps {
@@ -20,13 +21,17 @@ export interface ConfirmDialogProps {
 
   confirmBtnLabel: string;
   cancelBtnLabel: string;
+  customActionLabel?: string;
 
   inProgress?: boolean;
   confirmBtnVariant: ButtonVariant;
 
+  alertMessage?: string;
+
   onClose: () => void;
   onConfirm: () => void;
   onCancel?: () => void;
+  onCustomAction?: () => void;
 }
 
 export const ConfirmDialog: React.FC<ConfirmDialogProps> = ({
@@ -36,11 +41,14 @@ export const ConfirmDialog: React.FC<ConfirmDialogProps> = ({
   message,
   confirmBtnLabel,
   cancelBtnLabel,
+  customActionLabel,
   inProgress,
   confirmBtnVariant,
   onClose,
   onConfirm,
   onCancel,
+  onCustomAction,
+  alertMessage,
 }) => {
   const confirmBtn = (
     <Button
@@ -68,6 +76,21 @@ export const ConfirmDialog: React.FC<ConfirmDialogProps> = ({
     </Button>
   ) : undefined;
 
+  const customActionBtn = onCustomAction ? (
+    <Button
+      key="custom-action"
+      id="custom-action-button"
+      aria-label={customActionLabel}
+      variant={ButtonVariant.secondary}
+      isDisabled={inProgress}
+      onClick={onCustomAction}
+    >
+      {customActionLabel}
+    </Button>
+  ) : undefined;
+
+  const actions = [confirmBtn, customActionBtn, cancelBtn].filter(Boolean);
+
   return (
     <Modal
       id="confirm-dialog"
@@ -77,8 +100,11 @@ export const ConfirmDialog: React.FC<ConfirmDialogProps> = ({
       isOpen={isOpen}
       onClose={onClose}
       aria-label="Confirm dialog"
-      actions={onCancel ? [confirmBtn, cancelBtn] : [confirmBtn]}
+      actions={actions}
     >
+      {alertMessage ? (
+        <Alert variant="warning" isInline title={alertMessage} />
+      ) : null}
       {message}
     </Modal>
   );

diff --git a/client/src/app/components/questionnaire-summary/questionnaire-summary.tsx b/client/src/app/components/questionnaire-summary/questionnaire-summary.tsx
@@ -16,7 +16,6 @@ import {
 } from "@patternfly/react-core";
 import AngleLeftIcon from "@patternfly/react-icons/dist/esm/icons/angle-left-icon";
 import { Link } from "react-router-dom";
-import { useTranslation } from "react-i18next";
 import { Paths } from "@app/Paths";
 import { ConditionalRender } from "@app/components/ConditionalRender";
 import { AppPlaceholder } from "@app/components/AppPlaceholder";
@@ -25,6 +24,7 @@ import { Assessment, Questionnaire } from "@app/api/models";
 import QuestionnaireSectionTabTitle from "./components/questionnaire-section-tab-title";
 import { AxiosError } from "axios";
 import { formatPath } from "@app/utils/utils";
+import useIsArchetype from "@app/hooks/useIsArchetype";
 
 export enum SummaryType {
   Assessment = "Assessment",
@@ -36,17 +36,15 @@ interface QuestionnaireSummaryProps {
   fetchError?: AxiosError | null;
   summaryData: Assessment | Questionnaire | undefined;
   summaryType: SummaryType;
-  isArchetype?: boolean;
 }
 
 const QuestionnaireSummary: React.FC<QuestionnaireSummaryProps> = ({
   summaryData,
   summaryType,
   isFetching = false,
   fetchError = null,
-  isArchetype,
 }) => {
-  const { t } = useTranslation();
+  const isArchetype = useIsArchetype();
 
   const [activeSectionIndex, setActiveSectionIndex] = useState<"all" | number>(
     "all"
@@ -86,17 +84,20 @@ const QuestionnaireSummary: React.FC<QuestionnaireSummaryProps> = ({
   if (!summaryData) {
     return <div>No data available.</div>;
   }
+
+  const dynamicPath = isArchetype
+    ? formatPath(Paths.archetypeAssessmentActions, {
+        archetypeId: (summaryData as Assessment)?.archetype?.id,
+      })
+    : formatPath(Paths.applicationAssessmentActions, {
+        applicationId: (summaryData as Assessment)?.application?.id,
+      });
+
   const BreadcrumbPath =
     summaryType === SummaryType.Assessment ? (
       <Breadcrumb>
         <BreadcrumbItem>
-          <Link
-            to={formatPath(Paths.applicationAssessmentActions, {
-              applicationId: (summaryData as Assessment)?.application?.id,
-            })}
-          >
-            Assessment
-          </Link>
+          <Link to={dynamicPath}>Assessment</Link>
         </BreadcrumbItem>
         <BreadcrumbItem to="#" isActive>
           {summaryData?.name}

diff --git a/client/src/app/hooks/useIsArchetype.ts b/client/src/app/hooks/useIsArchetype.ts
@@ -0,0 +1,5 @@
+import { useLocation } from "react-router-dom";
+
+const useIsArchetype = () => useLocation().pathname.includes("/archetypes/");
+
+export default useIsArchetype;
diff --git a/...rc/app/pages/applications/applications-table-assessment/applications-table-assessment.tsx b/...rc/app/pages/applications/applications-table-assessment/applications-table-assessment.tsx
@@ -669,6 +669,15 @@ export const ApplicationsTable: React.FC = () => {
                             title: t("actions.review"),
                             onClick: () => reviewSelectedApp(application),
                           },
+                          ...(application?.review
+                            ? [
+                                {
+                                  title: t("actions.discardAssessment"),
+                                  onClick: () =>
+                                    setAssessmentOrReviewToDiscard(application),
+                                },
+                              ]
+                            : []),
                           {
                             title: t("actions.delete"),
                             onClick: () =>

diff --git a/...s/applications/components/application-assessment-status/application-assessment-status.tsx b/...s/applications/components/application-assessment-status/application-assessment-status.tsx
@@ -32,7 +32,7 @@ export const ApplicationAssessmentStatus: React.FC<
 > = ({ assessments, isLoading = false, fetchError = null }) => {
   const { t } = useTranslation();
   //TODO: remove this once we have a proper assessment status
-  const { assessment } = useFetchAssessmentById(assessments?.[0]?.id || 0);
+  const { assessment } = useFetchAssessmentById(assessments?.[0]?.id);
 
   if (fetchError) {
     return <EmptyTextMessage message={t("terms.notAvailable")} />;

diff --git a/.../pages/assessment-management/import-questionnaire-form/questionnaire-upload-test-file.yml b/.../pages/assessment-management/import-questionnaire-form/questionnaire-upload-test-file.yml
@@ -1,6 +1,5 @@
 name: Test questionnaire
 description: This is a sample questionnaire in YAML format
-revision: 1
 required: true
 sections:
   - order: 1
@@ -22,7 +21,6 @@ sections:
             applyTags: []
             autoAnswerFor: [{ category: Category1, tag: Tag1 }]
             selected: false
-            autoAnswered: false
           - order: 2
             text: Blue
             risk: green
@@ -31,14 +29,12 @@ sections:
             applyTags: []
             autoAnswerFor: []
             selected: false
-            autoAnswered: false
       - order: 2
         text: What is your favorite sport?
         explanation: Please select your favorite sport.
-        includeFor:
+        excludeFor:
           - category: Category1
             tag: Tag1
-        excludeFor: []
         answers:
           - order: 1
             text: Soccer
@@ -48,7 +44,6 @@ sections:
             applyTags: []
             autoAnswerFor: []
             selected: false
-            autoAnswered: false
           - order: 2
             text: Cycling
             risk: red
@@ -57,7 +52,6 @@ sections:
             applyTags: []
             autoAnswerFor: []
             selected: false
-            autoAnswered: false
           - order: 3
             text: Climbing
             risk: yellow
@@ -66,7 +60,6 @@ sections:
             applyTags: []
             autoAnswerFor: []
             selected: false
-            autoAnswered: false
           - order: 4
             text: Swimming
             risk: yellow
@@ -75,7 +68,6 @@ sections:
             applyTags: []
             autoAnswerFor: []
             selected: false
-            autoAnswered: false
           - order: 5
             text: Running
             risk: red
@@ -84,7 +76,6 @@ sections:
             applyTags: []
             autoAnswerFor: []
             selected: false
-            autoAnswered: false
 thresholds:
   red: 5
   yellow: 10

diff --git a/client/src/app/pages/assessment/assessment-page.tsx b/client/src/app/pages/assessment/assessment-page.tsx
@@ -23,6 +23,7 @@ const AssessmentPage: React.FC = () => {
   const { t } = useTranslation();
 
   const { assessmentId } = useParams<AssessmentRoute>();
+
   const { assessment, isFetching, fetchError } =
     useFetchAssessmentById(assessmentId);
 

diff --git a/client/src/app/pages/assessment/components/assessment-actions/assessment-actions-page.tsx b/client/src/app/pages/assessment/components/assessment-actions/assessment-actions-page.tsx
@@ -11,19 +11,18 @@ import { Link, useParams } from "react-router-dom";
 import { AssessmentActionsRoute, Paths } from "@app/Paths";
 import { ConditionalRender } from "@app/components/ConditionalRender";
 import { AppPlaceholder } from "@app/components/AppPlaceholder";
-import { useFetchApplicationByID } from "@app/queries/applications";
 import AssessmentActionsTable from "./components/assessment-actions-table";
 import { useFetchArchetypeById } from "@app/queries/archetypes";
+import { useFetchApplicationById } from "@app/queries/applications";
+import useIsArchetype from "@app/hooks/useIsArchetype";
 
 const AssessmentActions: React.FC = () => {
   const { applicationId, archetypeId } = useParams<AssessmentActionsRoute>();
-  const isArchetype = location.pathname.includes("/archetypes/");
-  console.log("isArchetype", isArchetype);
+  const isArchetype = useIsArchetype();
 
-  const { application } = useFetchApplicationByID(applicationId || "");
-  const { archetype } = useFetchArchetypeById(archetypeId || "");
+  const { archetype } = useFetchArchetypeById(archetypeId);
+  const { application } = useFetchApplicationById(applicationId);
 
-  console.log("archetype", archetype);
   return (
     <>
       <PageSection variant={PageSectionVariants.light}>
@@ -41,7 +40,7 @@ const AssessmentActions: React.FC = () => {
             </BreadcrumbItem>
           )}
           <BreadcrumbItem to="#" isActive>
-            Assessment
+            {isArchetype ? archetype?.name : application?.name}
           </BreadcrumbItem>
         </Breadcrumb>
       </PageSection>