diff --git a/frontend/src/component/project/Project/ProjectInsights/LeadTimeForChanges/LeadTimeForChanges.test.tsx b/frontend/src/component/project/Project/ProjectInsights/LeadTimeForChanges/LeadTimeForChanges.test.tsx index 82b70c0104..05ac736462 100644 --- a/frontend/src/component/project/Project/ProjectInsights/LeadTimeForChanges/LeadTimeForChanges.test.tsx +++ b/frontend/src/component/project/Project/ProjectInsights/LeadTimeForChanges/LeadTimeForChanges.test.tsx @@ -18,7 +18,9 @@ test('Show outdated SDKs and apps using them', async () => { } + element={ + + } /> , { diff --git a/frontend/src/component/project/Project/ProjectInsights/LeadTimeForChanges/LeadTimeForChanges.tsx b/frontend/src/component/project/Project/ProjectInsights/LeadTimeForChanges/LeadTimeForChanges.tsx index 2c9dc2752e..82d5261158 100644 --- a/frontend/src/component/project/Project/ProjectInsights/LeadTimeForChanges/LeadTimeForChanges.tsx +++ b/frontend/src/component/project/Project/ProjectInsights/LeadTimeForChanges/LeadTimeForChanges.tsx @@ -45,9 +45,21 @@ const resolveDoraMetrics = (input: number) => { interface ILeadTimeForChangesProps { leadTime: ProjectDoraMetricsSchema; + loading: boolean; } -export const LeadTimeForChanges = ({ leadTime }: ILeadTimeForChangesProps) => { +const loadingLeadTimeFeatures = [ + { name: 'feature1', timeToProduction: 0 }, + { name: 'feature2', timeToProduction: 0 }, + { name: 'feature3', timeToProduction: 0 }, + { name: 'feature4', timeToProduction: 0 }, + { name: 'feature5', timeToProduction: 2 }, +]; + +export const LeadTimeForChanges = ({ + leadTime, + loading, +}: ILeadTimeForChangesProps) => { const columns = useMemo( () => [ { @@ -157,7 +169,7 @@ export const LeadTimeForChanges = ({ leadTime }: ILeadTimeForChangesProps) => { disableSortBy: true, }, ], - [JSON.stringify(leadTime.features)], + [JSON.stringify(leadTime.features), loading], ); const initialState = useMemo( @@ -185,7 +197,7 @@ export const LeadTimeForChanges = ({ leadTime }: ILeadTimeForChangesProps) => { } = useTable( { columns: columns as any[], - data: leadTime.features, + data: loading ? loadingLeadTimeFeatures : leadTime.features, initialState, autoResetGlobalFilter: false, autoResetSortBy: false, diff --git a/frontend/src/component/project/Project/ProjectInsights/ProjectInsights.tsx b/frontend/src/component/project/Project/ProjectInsights/ProjectInsights.tsx index de89803c4c..ea653d966c 100644 --- a/frontend/src/component/project/Project/ProjectInsights/ProjectInsights.tsx +++ b/frontend/src/component/project/Project/ProjectInsights/ProjectInsights.tsx @@ -52,7 +52,10 @@ export const ProjectInsights = () => { - + diff --git a/frontend/src/hooks/api/getters/useProjectInsights/useProjectInsights.ts b/frontend/src/hooks/api/getters/useProjectInsights/useProjectInsights.ts index fdb43ac4a5..8e4ae4faeb 100644 --- a/frontend/src/hooks/api/getters/useProjectInsights/useProjectInsights.ts +++ b/frontend/src/hooks/api/getters/useProjectInsights/useProjectInsights.ts @@ -31,13 +31,7 @@ const placeholderData: ProjectInsightsSchema = { ], leadTime: { projectAverage: 0, - features: [ - { name: 'feature1', timeToProduction: 0 }, - { name: 'feature2', timeToProduction: 0 }, - { name: 'feature3', timeToProduction: 0 }, - { name: 'feature4', timeToProduction: 0 }, - { name: 'feature5', timeToProduction: 2 }, - ], + features: [], }, health: { rating: 0,