diff --git a/client/src/app/pages/applications/applications-table/applications-table.tsx b/client/src/app/pages/applications/applications-table/applications-table.tsx index 8e776a4d3a..59412be6df 100644 --- 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`} /> diff --git a/client/src/app/pages/applications/components/application-assessment-status/application-assessment-status.tsx b/client/src/app/pages/applications/components/application-assessment-status/application-assessment-status.tsx index 8f2314f032..b6fba08f30 100644 --- a/client/src/app/pages/applications/components/application-assessment-status/application-assessment-status.tsx +++ b/client/src/app/pages/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 ; + if (isLoading) { + return ; } let statusPreset: IconedStatusPreset = "NotStarted"; // Default status