fix: Show 100% instead of Infinity% if you've not created any flags (#10575)

JS gives you positive infinity if you divide a positive number by 0,
which isn't very helpful here. Instead, let's show 100%. If you divide 0
by 0, then you get NaN, which we also need to handle explicitly because
it doesn't work with math.min.

Before:
<img width="472" height="273" alt="image"
src="https://github.com/user-attachments/assets/006ba5c1-4783-4794-b876-f64085937258"
/>

<img width="1365" height="484" alt="image"
src="https://github.com/user-attachments/assets/beec7e18-758c-49eb-97c8-febe6cb63119"
/>


After:
<img width="388" height="252" alt="image"
src="https://github.com/user-attachments/assets/bc326c25-ee63-4055-a765-a6016b51e35a"
/>
<img width="1365" height="488" alt="image"
src="https://github.com/user-attachments/assets/eaafc5c3-79d6-49a3-b1f2-cd42c5d16dae"
/>


Fixes 1-4033.

frontend/src/component/insights/calculate-ratio/calculate-ratio.test.ts

@@ -0,0 +1,17 @@
+import { calculateRatio } from './calculate-ratio.ts';
+
+test('A ratio of anything to 0 is 100', () => {
+    expect(calculateRatio(0, 0)).toBe(100);
+    expect(calculateRatio(5, 0)).toBe(100);
+});
+
+test('Normal ratios work as expected', () => {
+    expect(calculateRatio(0, 1)).toBe(0);
+    expect(calculateRatio(1, 1)).toBe(100);
+    expect(calculateRatio(1, 2)).toBe(50);
+    expect(calculateRatio(5, 2)).toBe(250);
+});
+
+test('Numbers are rounded to the nearest integer', () => {
+    expect(calculateRatio(5, 9)).toBe(56);
+});

frontend/src/component/insights/calculate-ratio/calculate-ratio.ts

@@ -0,0 +1,12 @@
+export const calculateRatio = (
+    antecedent: number,
+    consequent: number,
+): number => {
+    const rawRatio = Math.round((antecedent / consequent) * 100);
+
+    if (Number.isNaN(rawRatio) || rawRatio === Number.POSITIVE_INFINITY) {
+        return 100;
+    }
+
+    return rawRatio;
+};

frontend/src/component/insights/componentsChart/CreationArchiveChart/CreationArchiveRatioTooltip.tsx

@@ -3,6 +3,7 @@ import { Paper, Typography, styled } from '@mui/material';
 import type { TooltipState } from 'component/insights/components/LineChart/ChartTooltip/ChartTooltip';
 import { ChartTooltipContainer } from 'component/insights/components/LineChart/ChartTooltip/ChartTooltip';
 import type { WeekData } from './types.ts';
+import { calculateRatio } from 'component/insights/calculate-ratio/calculate-ratio.ts';
 
 const StyledTooltipItemContainer = styled(Paper)(({ theme }) => ({
     padding: theme.spacing(2),
@@ -49,7 +50,8 @@ export const CreationArchiveRatioTooltip: FC<
     const rawData = tooltip.dataPoints[0].raw as WeekData;
     const archivedCount = rawData.archivedFlags || 0;
     const createdCount = rawData.totalCreatedFlags || 0;
-    const ratio = Math.round((archivedCount / createdCount) * 100);
+
+    const ratio = calculateRatio(archivedCount, createdCount);
 
     return (
         <ChartTooltipContainer tooltip={tooltip}>

frontend/src/component/insights/componentsStat/CreationArchiveStats/CreationArchiveStats.tsx

@@ -7,6 +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<
@@ -34,9 +35,7 @@ function getCurrentArchiveRatio(
         }
     });
 
-    return totalCreated > 0
-        ? Math.round((totalArchived / totalCreated) * 100)
-        : 0;
+    return calculateRatio(totalArchived, totalCreated);
 }
 
 const StyledRatioContainer = styled(Box)(({ theme }) => ({