🐛 Adds spinner for isLoading prop in asessment status component (#1727)…

… (#1734) - Replaces erroneous not available status that is shown when no assessments are available on an app Signed-off-by: Ian Bolton <[email protected]> Signed-off-by: Cherry Picker <[email protected]> Signed-off-by: Ian Bolton <[email protected]> Signed-off-by: Cherry Picker <[email protected]> Co-authored-by: Ian Bolton <[email protected]>
konveyor · Mar 4, 2024 · 1611d82 · 1611d82
1 parent 07b3353
commit 1611d82
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 6 deletions.
diff --git a/client/src/app/pages/applications/applications-table/applications-table.tsx b/client/src/app/pages/applications/applications-table/applications-table.tsx
@@ -215,8 +215,9 @@ export const ApplicationsTable: React.FC = () => {
     refetch: fetchApplications,
   } = useFetchApplications();
 
-  const { assessments } = useFetchAssessments();
-  const { archetypes } = useFetchArchetypes();
+  const { assessments, isFetching: isFetchingAssesments } =
+    useFetchAssessments();
+  const { archetypes, isFetching: isFetchingArchetypes } = useFetchArchetypes();
 
   const onDeleteApplicationSuccess = (appIDCount: number) => {
     pushNotification({
@@ -915,6 +916,11 @@ export const ApplicationsTable: React.FC = () => {
                           application={application}
                           assessments={assessments}
                           archetypes={archetypes}
+                          isLoading={
+                            isFetchingApplications ||
+                            isFetchingArchetypes ||
+                            isFetchingAssesments
+                          }
                           key={`${application?.id}-assessment-status`}
                         />
                       </Td>

diff --git a/...s/applications/components/application-assessment-status/application-assessment-status.tsx b/...s/applications/components/application-assessment-status/application-assessment-status.tsx
@@ -1,8 +1,8 @@
 import React from "react";
 import { useTranslation } from "react-i18next";
-import { EmptyTextMessage } from "@app/components/EmptyTextMessage";
 import { Application, Archetype, Assessment } from "@app/api/models";
 import { IconedStatus, IconedStatusPreset } from "@app/components/IconedStatus";
+import { Spinner } from "@patternfly/react-core";
 interface ApplicationAssessmentStatusProps {
   application: Application;
   assessments: Assessment[];
@@ -12,7 +12,7 @@ interface ApplicationAssessmentStatusProps {
 
 export const ApplicationAssessmentStatus: React.FC<
   ApplicationAssessmentStatusProps
-> = ({ application, assessments, archetypes }) => {
+> = ({ application, assessments, archetypes, isLoading }) => {
   const { t } = useTranslation();
 
   const filteredAssessments = assessments?.filter(
@@ -80,8 +80,8 @@ export const ApplicationAssessmentStatus: React.FC<
     };
   }, [archetypes, assessments]);
 
-  if (archetypes?.length === 0 || assessments?.length === 0) {
-    return <EmptyTextMessage message={t("terms.notAvailable")} />;
+  if (isLoading) {
+    return <Spinner size="sm" />;
   }
 
   let statusPreset: IconedStatusPreset = "NotStarted"; // Default status