Fix trailing 7-day stats and add 14-day totals legend

web-app/app/home/chart.tsx

@@ -4,6 +4,7 @@ import { useState } from "react";
 import {
   type DailyOrderCount,
   type RobotDayRow,
+  type RobotTotal,
   formatDay,
 } from "./data";
 
@@ -290,38 +291,31 @@ function HoverTooltip({
 // --- Legend ---
 
 interface ChartLegendProps {
-  robotNames: string[];
-  colorByRobot: Map<string, string>;
-  totalByRobot: Map<string, number>;
-  errorsByRobot: Map<string, number>;
+  title: string;
+  totals: RobotTotal[];
 }
 
-function ChartLegend({
-  robotNames,
-  colorByRobot,
-  totalByRobot,
-  errorsByRobot,
-}: ChartLegendProps) {
-  const sorted = [...robotNames].sort(
-    (a, b) => (totalByRobot.get(b) ?? 0) - (totalByRobot.get(a) ?? 0)
+function ChartLegend({ title, totals }: ChartLegendProps) {
+  const sorted = [...totals].sort(
+    (a, b) => b.count - b.errorCount - (a.count - a.errorCount)
   );
   return (
     <div className="text-sm shrink-0 md:w-44">
-      <div className="text-neutral-900 font-medium">Last 7 days</div>
+      <div className="text-neutral-900 font-medium">{title}</div>
       <div className="text-xs text-neutral-500 mb-2">Successes (Errors)</div>
       <ul className="flex flex-col gap-1.5">
-        {sorted.map((name) => {
-          const errors = errorsByRobot.get(name) ?? 0;
+        {sorted.map((t) => {
+          const okCount = Math.max(0, t.count - t.errorCount);
           return (
-            <li key={name} className="inline-flex items-center gap-1.5">
+            <li key={t.robotId} className="inline-flex items-center gap-1.5">
               <span
                 className="inline-block w-3 h-3 rounded-sm shrink-0"
-                style={{ background: colorByRobot.get(name) }}
+                style={{ background: colorFor(t.robotName) }}
               />
               <span className="truncate">
-                {name}: <strong>{totalByRobot.get(name) ?? 0}</strong>
-                {errors > 0 && (
-                  <span className="text-neutral-500"> ({errors})</span>
+                {t.robotName}: <strong>{okCount}</strong>
+                {t.errorCount > 0 && (
+                  <span className="text-neutral-500"> ({t.errorCount})</span>
                 )}
               </span>
             </li>
@@ -336,34 +330,49 @@ function ChartLegend({
 
 export function OrdersChart({
   data,
+  totals14d,
   onBarClick,
   selected,
 }: {
   data: DailyOrderCount[];
+  totals14d: RobotTotal[];
   onBarClick: (day: Date, row: RobotDayRow) => void;
   selected: { dayMs: number; robotId: string } | null;
 }) {
   const [hover, setHover] = useState<HoverInfo | null>(null);
 
-  const days = [...data].slice(0, 7).reverse();
+  const dayMap = new Map(data.map((d) => [d.day.getTime(), d]));
+  const today = new Date();
+  today.setHours(0, 0, 0, 0);
+  const firstDay = new Date(today);
+  firstDay.setDate(firstDay.getDate() - 7);
+  const days: DailyOrderCount[] = [];
+  for (let dt = new Date(firstDay); dt.getTime() <= today.getTime(); ) {
+    const dayDate = new Date(dt);
+    days.push(dayMap.get(dayDate.getTime()) ?? { day: dayDate, rows: [] });
+    dt.setDate(dt.getDate() + 1);
+  }
   const robotNames = [
     ...new Set(days.flatMap((d) => d.rows.map((r) => r.robotName))),
   ].sort();
   const colorByRobot = new Map(
     robotNames.map((name) => [name, colorFor(name)])
   );
-  const totalByRobot = new Map<string, number>();
-  const errorsByRobot = new Map<string, number>();
+  const totals7dByRobot = new Map<string, RobotTotal>();
   for (const d of days) {
     for (const r of d.rows) {
-      const okCount = Math.max(0, r.count - r.errorCount);
-      totalByRobot.set(r.robotName, (totalByRobot.get(r.robotName) ?? 0) + okCount);
-      errorsByRobot.set(
-        r.robotName,
-        (errorsByRobot.get(r.robotName) ?? 0) + r.errorCount
-      );
+      const cur = totals7dByRobot.get(r.robotId) ?? {
+        robotId: r.robotId,
+        robotName: r.robotName,
+        count: 0,
+        errorCount: 0,
+      };
+      cur.count += r.count;
+      cur.errorCount += r.errorCount;
+      totals7dByRobot.set(r.robotId, cur);
     }
   }
+  const totals7d = [...totals7dByRobot.values()];
 
   const width = 800;
   const height = 230;
@@ -511,12 +520,10 @@ export function OrdersChart({
         )}
       </svg>
 
-      <ChartLegend
-        robotNames={robotNames}
-        colorByRobot={colorByRobot}
-        totalByRobot={totalByRobot}
-        errorsByRobot={errorsByRobot}
-      />
+      <div className="flex flex-row gap-4">
+        <ChartLegend title="Last 7 days" totals={totals7d} />
+        <ChartLegend title="Last 14 days" totals={totals14d} />
+      </div>
     </div>
   );
 }

web-app/app/home/data.ts

@@ -21,6 +21,13 @@ export interface RobotDayRow {
   errorCount: number;
 }
 
+export interface RobotTotal {
+  robotId: string;
+  robotName: string;
+  count: number;
+  errorCount: number;
+}
+
 export interface DailyOrderCount {
   day: Date;
   rows: RobotDayRow[];
@@ -161,7 +168,7 @@ export async function loadDailyOrderCounts(
 ): Promise<DailyOrderCount[]> {
   const nameById = new Map(machines.map((m) => [m.id, m.name]));
   const tz = browserTimezone();
-  const since = new Date(Date.now() - 14 * 24 * 60 * 60 * 1000);
+  const since = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000);
 
   const results = await runMQL<{
     time: Date | string;
@@ -236,6 +243,64 @@ export async function loadDailyOrderCounts(
     .sort((a, b) => b.day.getTime() - a.day.getTime());
 }
 
+export async function loadRobotTotalsLastNDays(
+  client: VIAM.ViamClient,
+  machines: Machine[],
+  days: number
+): Promise<RobotTotal[]> {
+  const nameById = new Map(machines.map((m) => [m.id, m.name]));
+  const since = new Date(Date.now() - days * 24 * 60 * 60 * 1000);
+
+  const results = await runMQL<{
+    robot_id: string;
+    order_ok: boolean | null;
+    value: number;
+  }>(client, [
+    {
+      $match: {
+        location_id: LOCATION_ID,
+        component_name: RESOURCE_NAME,
+        time_received: { $gte: since },
+      },
+    },
+    {
+      $group: {
+        _id: {
+          robot_id: "$robot_id",
+          order_ok: "$data.readings.order_ok",
+        },
+        value: { $sum: 1 },
+      },
+    },
+    {
+      $project: {
+        _id: 0,
+        robot_id: "$_id.robot_id",
+        order_ok: "$_id.order_ok",
+        value: 1,
+      },
+    },
+  ]);
+
+  type Tally = { count: number; errorCount: number };
+  const byRobot = new Map<string, Tally>();
+  for (const row of results) {
+    if (!nameById.has(row.robot_id)) continue;
+    const tally = byRobot.get(row.robot_id) ?? { count: 0, errorCount: 0 };
+    tally.count += row.value;
+    if (row.order_ok === false) tally.errorCount += row.value;
+    byRobot.set(row.robot_id, tally);
+  }
+  return [...byRobot.entries()]
+    .map(([robotId, tally]) => ({
+      robotId,
+      robotName: nameById.get(robotId) ?? robotId,
+      count: tally.count,
+      errorCount: tally.errorCount,
+    }))
+    .sort((a, b) => a.robotName.localeCompare(b.robotName));
+}
+
 export async function loadLeaderboard(
   client: VIAM.ViamClient,
   groupByField: string,

web-app/app/page.tsx

@@ -16,12 +16,14 @@ import {
   type OrderRecord,
   type LeaderboardEntry,
   type Panel,
+  type RobotTotal,
   panelKey,
   listMachines,
   loadDailyOrderCounts,
   loadLeaderboard,
   loadOrdersForDay,
   loadErrorsLast7Days,
+  loadRobotTotalsLastNDays,
 } from "./home/data";
 import { OrdersChart } from "./home/chart";
 import { OrdersPanel } from "./home/orders-panel";
@@ -38,6 +40,7 @@ export default function Home() {
   const [error, setError] = useState<string | null>(null);
   const [machines, setMachines] = useState<Machine[]>([]);
   const [orderCounts, setOrderCounts] = useState<DailyOrderCount[] | null>(null);
+  const [totals14d, setTotals14d] = useState<RobotTotal[]>([]);
   const [customerLeaderboard, setCustomerLeaderboard] = useState<
     LeaderboardEntry[] | null
   >(null);
@@ -107,6 +110,11 @@ export default function Home() {
         .catch((e) =>
           console.error("failed to load daily order counts:", e)
         );
+      loadRobotTotalsLastNDays(currentClient, currentMachines, 14)
+        .then((d) => !cancelled && setTotals14d(d))
+        .catch((e) =>
+          console.error("failed to load 14-day robot totals:", e)
+        );
       loadLeaderboard(currentClient, "data.readings.customer_name")
         .then((d) => !cancelled && setCustomerLeaderboard(d))
         .catch((e) =>
@@ -272,6 +280,7 @@ export default function Home() {
           <>
             <OrdersChart
               data={orderCounts}
+              totals14d={totals14d}
               selected={
                 panel?.kind === "day"
                   ? { dayMs: panel.day.getTime(), robotId: panel.robotId }