multiple breakpoints

apps/dashboard/src/hooks/useVisibleSeries.ts

@@ -7,12 +7,12 @@ export type IVisibleSeries = ReturnType<typeof useVisibleSeries>['series'];
 export function useVisibleSeries(data: IChartData, limit?: number | undefined) {
   const max = limit ?? 5;
   const [visibleSeries, setVisibleSeries] = useState<string[]>(
-    data?.series?.slice(0, max).map((serie) => serie.name) ?? []
+    data?.series?.slice(0, max).map((serie) => serie.id) ?? []
   );
 
   useEffect(() => {
     setVisibleSeries(
-      data?.series?.slice(0, max).map((serie) => serie.name) ?? []
+      data?.series?.slice(0, max).map((serie) => serie.id) ?? []
     );
   }, [data, max]);
 
@@ -23,7 +23,7 @@ export function useVisibleSeries(data: IChartData, limit?: number | undefined) {
           ...serie,
           index,
         }))
-        .filter((serie) => visibleSeries.includes(serie.name)),
+        .filter((serie) => visibleSeries.includes(serie.id)),
       setVisibleSeries,
     } as const;
   }, [visibleSeries, data.series]);