mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +01:00 
			
		
		
		
	fix: show average ratio for the period of collected data (#10735)
Instead of showing the current ratio of archived to created flags, we show you the average ratio for the selected period. Before: <img width="1153" height="391" alt="image" src="https://github.com/user-attachments/assets/efe87982-544e-485a-aa4d-04faa7d552fc" /> After: <img width="1143" height="385" alt="image" src="https://github.com/user-attachments/assets/25f8ee4d-3eaa-4e01-a793-2cc0321a55ed" />
This commit is contained in:
		
							parent
							
								
									b1f4ebd5eb
								
							
						
					
					
						commit
						236addbe23
					
				| @ -7,36 +7,7 @@ import { StatsExplanation } from 'component/insights/InsightsCharts.styles'; | ||||
| import type { GroupedDataByProject } from 'component/insights/hooks/useGroupedProjectTrends'; | ||||
| import type { InstanceInsightsSchema } from 'openapi'; | ||||
| import { Link } from 'react-router-dom'; | ||||
| import { calculateRatio } from 'component/insights/calculate-ratio/calculate-ratio'; | ||||
| 
 | ||||
| function getCurrentArchiveRatio( | ||||
|     groupedCreationArchiveData: GroupedDataByProject< | ||||
|         InstanceInsightsSchema['creationArchiveTrends'] | ||||
|     >, | ||||
| ) { | ||||
|     if (!groupedCreationArchiveData) { | ||||
|         return 0; | ||||
|     } | ||||
| 
 | ||||
|     let totalArchived = 0; | ||||
|     let totalCreated = 0; | ||||
| 
 | ||||
|     Object.values(groupedCreationArchiveData).forEach((projectData) => { | ||||
|         const latestData = projectData[0]; | ||||
|         if (latestData) { | ||||
|             totalArchived += latestData.archivedFlags || 0; | ||||
|             const createdSum = latestData.createdFlags | ||||
|                 ? Object.values(latestData.createdFlags).reduce( | ||||
|                       (sum: number, count: number) => sum + count, | ||||
|                       0, | ||||
|                   ) | ||||
|                 : 0; | ||||
|             totalCreated += createdSum; | ||||
|         } | ||||
|     }); | ||||
| 
 | ||||
|     return calculateRatio(totalArchived, totalCreated); | ||||
| } | ||||
| import { calculateArchiveRatio } from './calculateArchiveRatio.ts'; | ||||
| 
 | ||||
| const StyledRatioContainer = styled(Box)(({ theme }) => ({ | ||||
|     backgroundColor: theme.palette.background.elevation1, | ||||
| @ -83,20 +54,20 @@ export const CreationArchiveStats: FC<CreationArchiveStatsProps> = ({ | ||||
|     groupedCreationArchiveData, | ||||
|     isLoading, | ||||
| }) => { | ||||
|     const currentRatio = getCurrentArchiveRatio(groupedCreationArchiveData); | ||||
|     const averageRatio = calculateArchiveRatio(groupedCreationArchiveData); | ||||
| 
 | ||||
|     return ( | ||||
|         <> | ||||
|             <StyledRatioContainer> | ||||
|                 <StyledPercentageRow> | ||||
|                     <StyledRatioTypography> | ||||
|                         {isLoading ? '...' : currentRatio} | ||||
|                         {isLoading ? '...' : averageRatio} | ||||
|                     </StyledRatioTypography> | ||||
|                     <HelpIcon tooltip='Ratio of archived flags to created flags'> | ||||
|                     <HelpIcon tooltip='Ratio of archived flags to created flags in the selected period'> | ||||
|                         <StyledInfoIcon /> | ||||
|                     </HelpIcon> | ||||
|                 </StyledPercentageRow> | ||||
|                 <Typography variant='body2'>Current ratio</Typography> | ||||
|                 <Typography variant='body2'>Average ratio</Typography> | ||||
|             </StyledRatioContainer> | ||||
|             <StatsExplanation> | ||||
|                 <Lightbulb color='primary' /> | ||||
|  | ||||
| @ -0,0 +1,114 @@ | ||||
| import type { GroupedDataByProject } from 'component/insights/hooks/useGroupedProjectTrends.ts'; | ||||
| import { calculateArchiveRatio } from './calculateArchiveRatio.ts'; | ||||
| import type { InstanceInsightsSchema } from 'openapi/index.ts'; | ||||
| 
 | ||||
| describe('calculateArchiveRatio', () => { | ||||
|     it('should return "N/A" when the data is empty', () => { | ||||
|         expect(calculateArchiveRatio({})).toBe('N/A'); | ||||
|     }); | ||||
| 
 | ||||
|     it('should return "N/A" when no flags have been created', () => { | ||||
|         const result = calculateArchiveRatio({ | ||||
|             a: [ | ||||
|                 { | ||||
|                     week: '2024-53', | ||||
|                     date: '2025-01-05T01:00:00.000Z', | ||||
|                     project: 'a', | ||||
|                     createdFlags: { | ||||
|                         release: 0, | ||||
|                     }, | ||||
|                     archivedFlags: 10, | ||||
|                 }, | ||||
|             ], | ||||
|         }); | ||||
|         expect(result).toBe('N/A'); | ||||
|     }); | ||||
| 
 | ||||
|     it('should count missing `createdFlags` and `archivedFlags` properties as 0', () => { | ||||
|         const result = calculateArchiveRatio({ | ||||
|             project: [ | ||||
|                 // @ts-expect-error: the type requires `createdFlags` to be present
 | ||||
|                 { | ||||
|                     week: '2024-53', | ||||
|                     date: '2025-01-05T01:00:00.000Z', | ||||
|                     project: 'a', | ||||
|                     archivedFlags: 1, | ||||
|                 }, | ||||
|                 // @ts-expect-error: the type requires `archivedFlags` to be present
 | ||||
|                 { | ||||
|                     week: '2024-53', | ||||
|                     date: '2025-01-05T01:00:00.000Z', | ||||
|                     project: 'a', | ||||
|                     createdFlags: { | ||||
|                         release: 1, | ||||
|                     }, | ||||
|                 }, | ||||
|             ], | ||||
|         }); | ||||
|         expect(result).toBe('100%'); | ||||
|     }); | ||||
| 
 | ||||
|     it('should count all flag types listed under createdFlags', () => { | ||||
|         const input: GroupedDataByProject< | ||||
|             InstanceInsightsSchema['creationArchiveTrends'] | ||||
|         > = { | ||||
|             projectA: [ | ||||
|                 { | ||||
|                     week: '2025-40', | ||||
|                     date: '2025-10-05T00:21:42.617Z', | ||||
|                     project: 'projectA', | ||||
|                     createdFlags: { | ||||
|                         release: 1, | ||||
|                         killswitch: 1, | ||||
|                         experiment: 1, | ||||
|                         operational: 1, | ||||
|                         bogus: 1, | ||||
|                     }, | ||||
|                     archivedFlags: 5, | ||||
|                 }, | ||||
|             ], | ||||
|         }; | ||||
| 
 | ||||
|         expect(calculateArchiveRatio(input)).toBe('100%'); | ||||
|     }); | ||||
| 
 | ||||
|     it('should take the average of all data points', () => { | ||||
|         const input: GroupedDataByProject< | ||||
|             InstanceInsightsSchema['creationArchiveTrends'] | ||||
|         > = { | ||||
|             projectA: [ | ||||
|                 { | ||||
|                     week: '2025-40', | ||||
|                     date: '2025-10-05T00:21:42.617Z', | ||||
|                     project: 'projectA', | ||||
|                     createdFlags: { | ||||
|                         release: 1, | ||||
|                     }, | ||||
|                     archivedFlags: 2, | ||||
|                 }, | ||||
|                 { | ||||
|                     week: '2025-38', | ||||
|                     date: '2025-09-22T10:36:58.612Z', | ||||
|                     project: 'projectA', | ||||
|                     createdFlags: { | ||||
|                         killswitch: 6, | ||||
|                     }, | ||||
|                     archivedFlags: 7, | ||||
|                 }, | ||||
|             ], | ||||
|             projectB: [ | ||||
|                 { | ||||
|                     week: '2025-03', | ||||
|                     date: '2025-01-19T01:00:00.000Z', | ||||
|                     project: 'projectB', | ||||
|                     createdFlags: { | ||||
|                         release: 0, | ||||
|                     }, | ||||
|                     archivedFlags: 5, | ||||
|                 }, | ||||
|             ], | ||||
|         }; | ||||
| 
 | ||||
|         expect(calculateArchiveRatio(input)).toBe('200%'); | ||||
|     }); | ||||
| }); | ||||
| @ -0,0 +1,37 @@ | ||||
| import { calculateRatio } from 'component/insights/calculate-ratio/calculate-ratio'; | ||||
| import type { GroupedDataByProject } from 'component/insights/hooks/useGroupedProjectTrends'; | ||||
| import type { InstanceInsightsSchema } from 'openapi'; | ||||
| 
 | ||||
| export const calculateArchiveRatio = ( | ||||
|     groupedCreationArchiveData: GroupedDataByProject< | ||||
|         InstanceInsightsSchema['creationArchiveTrends'] | ||||
|     >, | ||||
| ): string => { | ||||
|     const { totalCreated, totalArchived } = Object.values( | ||||
|         groupedCreationArchiveData, | ||||
|     ).reduce( | ||||
|         (totalAcc, totalCurr) => { | ||||
|             const { created, archived } = totalCurr.reduce( | ||||
|                 (acc, curr) => { | ||||
|                     const createdSum = curr.createdFlags | ||||
|                         ? Object.values(curr.createdFlags).reduce( | ||||
|                               (sum, count) => sum + count, | ||||
|                               0, | ||||
|                           ) | ||||
|                         : 0; | ||||
|                     return { | ||||
|                         created: acc.created + createdSum, | ||||
|                         archived: acc.archived + (curr.archivedFlags ?? 0), | ||||
|                     }; | ||||
|                 }, | ||||
|                 { created: 0, archived: 0 }, | ||||
|             ); | ||||
|             return { | ||||
|                 totalCreated: totalAcc.totalCreated + created, | ||||
|                 totalArchived: totalAcc.totalArchived + archived, | ||||
|             }; | ||||
|         }, | ||||
|         { totalCreated: 0, totalArchived: 0 }, | ||||
|     ); | ||||
|     return calculateRatio(totalArchived, totalCreated); | ||||
| }; | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user