a lot

apps/web/src/hooks/useNumerFormatter.ts

@@ -1,8 +1,13 @@
+import { isNil } from 'ramda';
+
 export function useNumber() {
   const locale = 'en-gb';
 
   return {
-    format: (value: number) => {
+    format: (value: number | null | undefined) => {
+      if (isNil(value)) {
+        return 'N/A';
+      }
       return new Intl.NumberFormat(locale, {
         maximumSignificantDigits: 20,
       }).format(value);

apps/web/src/hooks/useRechartDataModel.ts

@@ -4,20 +4,20 @@ import { getChartColor } from '@/utils/theme';
 
 export type IRechartPayloadItem = IChartSerieDataItem & { color: string };
 
-export function useRechartDataModel(data: IChartData) {
+export function useRechartDataModel(series: IChartData['series']) {
   return useMemo(() => {
     return (
-      data.series[0]?.data.map(({ date }) => {
+      series[0]?.data.map(({ date }) => {
         return {
           date,
-          ...data.series.reduce((acc, serie, idx) => {
+          ...series.reduce((acc, serie, idx) => {
             return {
               ...acc,
               ...serie.data.reduce(
                 (acc2, item) => {
                   if (item.date === date) {
                     if (item.previous) {
-                      acc2[`${idx}:prev:count`] = item.previous.count;
+                      acc2[`${idx}:prev:count`] = item.previous.value;
                     }
                     acc2[`${idx}:count`] = item.count;
                     acc2[`${idx}:payload`] = {
@@ -34,5 +34,5 @@ export function useRechartDataModel(data: IChartData) {
         };
       }) ?? []
     );
-  }, [data]);
+  }, [series]);
 }

apps/web/src/hooks/useVisibleSeries.ts

@@ -1,6 +1,7 @@
 import { useEffect, useMemo, useRef, useState } from 'react';
 import type { IChartData } from '@/app/_trpc/client';
 
+export type IVisibleSeries = ReturnType<typeof useVisibleSeries>['series'];
 export function useVisibleSeries(data: IChartData, limit?: number | undefined) {
   const max = limit ?? 5;
   const [visibleSeries, setVisibleSeries] = useState<string[]>([]);