chore(1-3335): filters data coming from the API to remove data points…

… we're not interested in (#9205)

Implements a function that cleans and filters incoming data from the
new traffic API.

Specifically, it:
- Removes `/edge` data points
- Removes any data from before may 2024, which is the first full month
we have on record

Because all uses of the existing hook do this filtering themselves, I
have added the filtering at the hook level. This is to avoid
forgetting this filtering later. If we find out we need this data, we
can move the filtering.

frontend/src/component/admin/network/NetworkTrafficUsage/endpoint-info.ts

@@ -1,10 +1,14 @@
+import type { METERED_TRAFFIC_ENDPOINTS } from 'utils/traffic-calculations';
 export type EndpointInfo = {
     label: string;
     color: string;
     order: number;
 };
 
-export const endpointsInfo: Record<string, EndpointInfo> = {
+export const endpointsInfo: Record<
+    (typeof METERED_TRAFFIC_ENDPOINTS)[number],
+    EndpointInfo
+> = {
     '/api/admin': {
         label: 'Admin',
         color: '#6D66D9',

frontend/src/component/admin/network/NetworkTrafficUsage/selectable-periods.ts

@@ -1,5 +1,6 @@
 import { getDaysInMonth, subMonths } from 'date-fns';
 import { currentDate, formatMonth } from './dates';
+import { TRAFFIC_MEASUREMENT_START_DATE } from 'utils/traffic-calculations';
 
 export type Period = {
     key: string;
@@ -45,7 +46,11 @@ const generateSelectablePeriodsFromDate = (now: Date) => {
     ) {
         const date = subMonths(now, subtractMonthCount);
         selectablePeriods.push(
-            toSelectablePeriod(date, undefined, date >= new Date('2024-05')),
+            toSelectablePeriod(
+                date,
+                undefined,
+                date >= TRAFFIC_MEASUREMENT_START_DATE,
+            ),
         );
     }
     return selectablePeriods;

frontend/src/hooks/api/getters/useInstanceTrafficMetrics/useInstanceTrafficMetrics.ts

@@ -6,6 +6,7 @@ import type {
     TrafficUsageDataSegmentedCombinedSchema,
     TrafficUsageDataSegmentedSchema,
 } from 'openapi';
+import { cleanTrafficData } from 'utils/traffic-calculations';
 
 export interface IInstanceTrafficMetricsResponse {
     usage: TrafficUsageDataSegmentedSchema;
@@ -62,7 +63,7 @@ export const useInstanceTrafficMetrics2 = (
 
     return useMemo(
         () => ({
-            usage: data,
+            usage: cleanTrafficData(data) as any,
             loading: !error && !data,
             refetch: () => mutate(),
             error,

frontend/src/utils/traffic-calculations.test.ts

@@ -3,8 +3,10 @@ import {
     calculateEstimatedMonthlyCost,
     calculateOverageCost,
     calculateProjectedUsage,
+    cleanTrafficData,
 } from './traffic-calculations';
 import { toSelectablePeriod } from '../component/admin/network/NetworkTrafficUsage/selectable-periods';
+import type { TrafficUsageDataSegmentedCombinedSchema } from 'openapi';
 
 const testData4Days = [
     {
@@ -142,3 +144,71 @@ describe('traffic overage calculation', () => {
         expect(result).toBe(total);
     });
 });
+
+describe('filtering out unwanted data', () => {
+    test('it removes the /edge endpoint data', () => {
+        const input: TrafficUsageDataSegmentedCombinedSchema = {
+            grouping: 'daily',
+            dateRange: { from: '2025-02-01', to: '2025-02-28' },
+            apiData: [
+                { apiPath: '/api/client', dataPoints: [] },
+                { apiPath: '/edge', dataPoints: [] },
+                { apiPath: '/api/admin', dataPoints: [] },
+                { apiPath: '/api/frontend', dataPoints: [] },
+            ],
+        };
+
+        const expected = {
+            grouping: 'daily',
+            dateRange: { from: '2025-02-01', to: '2025-02-28' },
+            apiData: [
+                { apiPath: '/api/client', dataPoints: [] },
+                { apiPath: '/api/admin', dataPoints: [] },
+                { apiPath: '/api/frontend', dataPoints: [] },
+            ],
+        };
+
+        expect(cleanTrafficData(input)).toStrictEqual(expected);
+    });
+
+    test('it removes any data from before the traffic measuring was put in place', () => {
+        const input: TrafficUsageDataSegmentedCombinedSchema = {
+            grouping: 'monthly',
+            dateRange: {
+                from: '2024-02-01',
+                to: '2025-06-31',
+            },
+            apiData: [
+                {
+                    apiPath: '/api/client',
+                    dataPoints: [
+                        { period: '2024-06', trafficTypes: [] },
+                        { period: '2024-05', trafficTypes: [] },
+                        { period: '2024-04', trafficTypes: [] },
+                        { period: '2024-03', trafficTypes: [] },
+                        { period: '2024-02', trafficTypes: [] },
+                    ],
+                },
+            ],
+        };
+
+        const expected = {
+            grouping: 'monthly',
+            dateRange: {
+                from: '2024-02-01',
+                to: '2025-06-31',
+            },
+            apiData: [
+                {
+                    apiPath: '/api/client',
+                    dataPoints: [
+                        { period: '2024-06', trafficTypes: [] },
+                        { period: '2024-05', trafficTypes: [] },
+                    ],
+                },
+            ],
+        };
+
+        expect(cleanTrafficData(input)).toStrictEqual(expected);
+    });
+});

frontend/src/utils/traffic-calculations.ts

@@ -11,18 +11,35 @@ import type { ChartDatasetType } from '../component/admin/network/NetworkTraffic
 const DEFAULT_TRAFFIC_DATA_UNIT_COST = 5;
 const DEFAULT_TRAFFIC_DATA_UNIT_SIZE = 1_000_000;
 
-// todo: implement and test
-export const filterData = (
+export const TRAFFIC_MEASUREMENT_START_DATE = new Date('2024-05-01');
+
+export const METERED_TRAFFIC_ENDPOINTS = [
+    '/api/admin',
+    '/api/frontend',
+    '/api/client',
+];
+
+export const cleanTrafficData = (
     data?: TrafficUsageDataSegmentedCombinedSchema,
 ): TrafficUsageDataSegmentedCombinedSchema | undefined => {
     if (!data) {
         return;
     }
-    // filter out endpoints not mentioned in endpointsInfo
-    // filter out any data from before May 2024
-    return data;
+
+    const { apiData, ...rest } = data;
+    const cleanedApiData = apiData
+        .filter((item) => METERED_TRAFFIC_ENDPOINTS.includes(item.apiPath))
+        .map((item) => {
+            item.dataPoints = item.dataPoints.filter(
+                ({ period }) =>
+                    new Date(period) >= TRAFFIC_MEASUREMENT_START_DATE,
+            );
+            return item;
+        });
+    return { apiData: cleanedApiData, ...rest };
 };
 
+// todo: extract "currentMonth" into a function argument instead
 const monthlyTrafficDataToCurrentUsage = (
     apiData: TrafficUsageDataSegmentedCombinedSchemaApiDataItem[],
 ) => {