fixes for correct labels

src/utils/dashboardLoader.ts

@@ -1,6 +1,6 @@
 import { api } from "../../react-openapi";
 import { LatestItem } from "../components/LatestItemsList";
-import { ChartDataPoint } from "../components/HistoryChart";
+import { ChartDataPoint } from "../types/historyChart";
 import * as React from "react";
 import { format } from "./dateUtils";
 import MonetizationOnIcon from "@mui/icons-material/MonetizationOn";
@@ -126,15 +126,29 @@ export async function fetchAggregatedData(
     apply(monthlyCalendar);
   }
 
-  const toPoints = (arr: any[]): ChartDataPoint[] =>
-    arr.map((x) => ({
-      id: x.label,
-      amount: x.amount,
-      compareAmount: x.compare,
-      compareLabel: x.prevStart && x.prevEnd
-        ? `${format(x.prevStart)} - ${format(x.prevEnd)}`
-        : undefined
-    }));
+  const toPoints = (arr: any[], type: "weekly" | "monthly"): ChartDataPoint[] =>
+    arr.map((x) => {
+      let compareLabel: string | undefined;
+
+      if (x.prevStart && x.prevEnd) {
+        if (type === "monthly") {
+          const year = String(x.prevStart.getFullYear()).slice(2);
+          compareLabel = `${x.prevStart.toLocaleString("default", {
+            month: "short"
+          })}-${year}`;
+        } else {
+          const year = String(x.prevEnd.getFullYear()).slice(2);
+          compareLabel = `${format(x.prevStart)} - ${format(x.prevEnd)} ${year}`;
+        }
+      }
+
+      return {
+        id: x.label,
+        amount: x.amount,
+        compareAmount: x.compare,
+        compareLabel
+      };
+    });
 
   const chartData = {
     daily: Object.entries(dailyBuckets).map(([k, v]: any) => ({
@@ -143,12 +157,12 @@ export async function fetchAggregatedData(
       compareAmount: v.compare
     })),
     weekly: {
-      rolling: toPoints(weeklyRolling),
-      calendar: toPoints(weeklyCalendar)
+      rolling: toPoints(weeklyRolling, "weekly"),
+      calendar: toPoints(weeklyCalendar, "weekly")
     },
     monthly: {
-      rolling: toPoints(monthlyRolling),
-      calendar: toPoints(monthlyCalendar)
+      rolling: toPoints(monthlyRolling, "monthly"),
+      calendar: toPoints(monthlyCalendar, "monthly")
     }
   };