From 8243742f5d37851bebc48f1edcc5255901e96f5f Mon Sep 17 00:00:00 2001
From: ibolton336 <ibolton@redhat.com>
Date: Fri, 15 Sep 2023 16:51:28 -0400
Subject: [PATCH] Remove redundant query

---
 ...FetchArchetypeOrApplicationByAssessment.ts | 42 -------------------
 .../assessment-actions-page.tsx               | 24 +++++------
 .../components/assessment-page-header.tsx     | 22 +++++-----
 client/src/app/queries/applications.ts        |  7 +++-
 client/src/app/queries/reviews.ts             |  4 +-
 5 files changed, 29 insertions(+), 70 deletions(-)
 delete mode 100644 client/src/app/hooks/useFetchArchetypeOrApplicationByAssessment.ts

diff --git a/client/src/app/hooks/useFetchArchetypeOrApplicationByAssessment.ts b/client/src/app/hooks/useFetchArchetypeOrApplicationByAssessment.ts
deleted file mode 100644
index 5bf632fec7..0000000000
--- a/client/src/app/hooks/useFetchArchetypeOrApplicationByAssessment.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-import { useQuery } from "@tanstack/react-query";
-import { getApplicationById, getArchetypeById } from "@app/api/rest";
-
-const ArchetypeOrApplicationByAssessmentQueryKey =
-  "archetypeOrApplicationByAssessment";
-
-export function useFetchArchetypeOrApplicationByAssessment(
-  isArchetype?: boolean,
-  itemId?: number | string
-) {
-  const { data, isLoading, isError, error } = useQuery(
-    [
-      ArchetypeOrApplicationByAssessmentQueryKey,
-      isArchetype ? "archetype" : "application",
-      itemId,
-    ],
-    async () => {
-      if (!itemId) {
-        return null;
-      }
-
-      if (isArchetype) {
-        const archetypeData = await getArchetypeById(itemId);
-        return archetypeData;
-      } else {
-        const applicationData = await getApplicationById(itemId);
-        return applicationData;
-      }
-    },
-    {
-      enabled: !!itemId,
-    }
-  );
-
-  return {
-    data,
-    isLoading,
-    isError,
-    error,
-    isArchetype,
-  };
-}
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
index 5ff855ec5c..df12920c0b 100644
--- 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
@@ -12,20 +12,16 @@ import { AssessmentActionsRoute, Paths } from "@app/Paths";
 import { ConditionalRender } from "@app/components/ConditionalRender";
 import { AppPlaceholder } from "@app/components/AppPlaceholder";
 import AssessmentActionsTable from "./components/assessment-actions-table";
-import { useFetchArchetypeOrApplicationByAssessment } from "@app/hooks/useFetchArchetypeOrApplicationByAssessment";
-import { Archetype, Application } from "@app/api/models";
+import { useFetchArchetypeById } from "@app/queries/archetypes";
+import { useFetchApplicationById } from "@app/queries/applications";
 
 const AssessmentActions: React.FC = () => {
   const { applicationId, archetypeId } = useParams<AssessmentActionsRoute>();
   const isArchetype = location.pathname.includes("/archetypes/");
-  console.log("isArchetype", isArchetype);
 
-  const { data } = useFetchArchetypeOrApplicationByAssessment(
-    isArchetype,
-    isArchetype ? archetypeId : applicationId
-  );
+  const { archetype } = useFetchArchetypeById(archetypeId);
+  const { application } = useFetchApplicationById(applicationId);
 
-  console.log("archetype or app data", data);
   return (
     <>
       <PageSection variant={PageSectionVariants.light}>
@@ -49,18 +45,18 @@ const AssessmentActions: React.FC = () => {
       </PageSection>
       <PageSection>
         {isArchetype ? (
-          <ConditionalRender when={!data} then={<AppPlaceholder />}>
+          <ConditionalRender when={!archetype} then={<AppPlaceholder />}>
             <TextContent>
-              {data ? (
-                <AssessmentActionsTable archetype={data as Archetype} />
+              {archetype ? (
+                <AssessmentActionsTable archetype={archetype} />
               ) : null}
             </TextContent>
           </ConditionalRender>
         ) : (
-          <ConditionalRender when={!data} then={<AppPlaceholder />}>
+          <ConditionalRender when={!application} then={<AppPlaceholder />}>
             <TextContent>
-              {data ? (
-                <AssessmentActionsTable application={data as Application} />
+              {application ? (
+                <AssessmentActionsTable application={application} />
               ) : null}
             </TextContent>
           </ConditionalRender>
diff --git a/client/src/app/pages/assessment/components/assessment-page-header.tsx b/client/src/app/pages/assessment/components/assessment-page-header.tsx
index 96c01f4f08..2e3d0a4bdf 100644
--- a/client/src/app/pages/assessment/components/assessment-page-header.tsx
+++ b/client/src/app/pages/assessment/components/assessment-page-header.tsx
@@ -8,7 +8,8 @@ import { PageHeader } from "@app/components/PageHeader";
 import { ApplicationDependenciesFormContainer } from "@app/components/ApplicationDependenciesFormContainer";
 import { Paths } from "@app/Paths";
 import { Application, Assessment } from "@app/api/models";
-import { useFetchArchetypeOrApplicationByAssessment } from "@app/hooks/useFetchArchetypeOrApplicationByAssessment";
+import { useFetchApplicationById } from "@app/queries/applications";
+import { useFetchArchetypeById } from "@app/queries/archetypes";
 
 export interface AssessmentPageHeaderProps {
   assessment?: Assessment;
@@ -20,10 +21,9 @@ export const AssessmentPageHeader: React.FC<AssessmentPageHeaderProps> = ({
   const { t } = useTranslation();
   const history = useHistory();
   const isArchetype = location.pathname.includes("/archetypes/");
-  const { data } = useFetchArchetypeOrApplicationByAssessment(
-    isArchetype,
-    isArchetype ? assessment?.archetype?.id : assessment?.archetype?.id
-  );
+
+  const { archetype } = useFetchArchetypeById(assessment?.archetype?.id);
+  const { application } = useFetchApplicationById(assessment?.application?.id);
 
   const [isConfirmDialogOpen, setIsConfirmDialogOpen] =
     React.useState<boolean>(false);
@@ -35,7 +35,11 @@ export const AssessmentPageHeader: React.FC<AssessmentPageHeaderProps> = ({
     <>
       <PageHeader
         title={t("composed.applicationAssessment")}
-        description={<Text component="p">{data?.name}</Text>}
+        description={
+          <Text component="p">
+            {isArchetype ? archetype?.name : application?.name}
+          </Text>
+        }
         breadcrumbs={[
           {
             title: isArchetype ? t("terms.archetype") : t("terms.applications"),
@@ -52,11 +56,9 @@ export const AssessmentPageHeader: React.FC<AssessmentPageHeaderProps> = ({
         ]}
         btnActions={
           <>
-            {!isArchetype && data && (
+            {application && (
               <Button
-                onClick={() =>
-                  setApplicationDependenciesToManage(data as Application)
-                }
+                onClick={() => setApplicationDependenciesToManage(application)}
               >
                 {t("actions.manageDependencies")}
               </Button>
diff --git a/client/src/app/queries/applications.ts b/client/src/app/queries/applications.ts
index fe118541f4..10211f6813 100644
--- a/client/src/app/queries/applications.ts
+++ b/client/src/app/queries/applications.ts
@@ -42,12 +42,15 @@ export const useFetchApplications = () => {
 
 export const ApplicationQueryKey = "application";
 
-export const useFetchApplicationByID = (id: number | string) => {
+export const useFetchApplicationById = (id?: number | string) => {
   const { data, isLoading, error } = useQuery({
     queryKey: [ApplicationQueryKey, id],
-    queryFn: () => getApplicationById(id),
+    queryFn: () =>
+      id === undefined ? Promise.resolve(undefined) : getApplicationById(id),
     onError: (error: AxiosError) => console.log("error, ", error),
+    enabled: id !== undefined,
   });
+
   return {
     application: data,
     isFetching: isLoading,
diff --git a/client/src/app/queries/reviews.ts b/client/src/app/queries/reviews.ts
index 9af0e66976..b49541ddf8 100644
--- a/client/src/app/queries/reviews.ts
+++ b/client/src/app/queries/reviews.ts
@@ -9,7 +9,7 @@ import {
 } from "@app/api/rest";
 import { New, Review } from "@app/api/models";
 import { AxiosError } from "axios";
-import { useFetchApplicationByID } from "./applications";
+import { useFetchApplicationById } from "./applications";
 
 export const reviewQueryKey = "review";
 export const reviewsByItemIdQueryKey = "reviewsByItemId";
@@ -94,7 +94,7 @@ export function useGetReviewByAppId(applicationId: string | number) {
     application,
     isFetching: isApplicationFetching,
     fetchError: applicationError,
-  } = useFetchApplicationByID(applicationId || "");
+  } = useFetchApplicationById(applicationId);
 
   let review = null;
   let isLoading = false;