From 91f6da1f5e740884e1937a558bdb8e36a1968bfe Mon Sep 17 00:00:00 2001
From: april <aprl.petersen@gmail.com>
Date: Thu, 11 Jan 2024 16:40:54 -0600
Subject: [PATCH] Add totals by class

---
 web/app/routes/logbook.dashboard/route.tsx | 84 ++++++++++++++++++----
 1 file changed, 69 insertions(+), 15 deletions(-)

diff --git a/web/app/routes/logbook.dashboard/route.tsx b/web/app/routes/logbook.dashboard/route.tsx
index 6185e7c..6cefbee 100644
--- a/web/app/routes/logbook.dashboard/route.tsx
+++ b/web/app/routes/logbook.dashboard/route.tsx
@@ -3,17 +3,31 @@ import { VerticalLogItem } from "@/ui/display/log-item";
 import ErrorDisplay from "@/ui/error-display";
 import { useApi } from "@/util/api";
 import { Center, Group, Loader, Container, Stack, Title } from "@mantine/core";
+import { randomId } from "@mantine/hooks";
 import { useQuery } from "@tanstack/react-query";
+import { useEffect, useState } from "react";
 
 export default function Dashboard() {
   const client = useApi();
 
+  const [totalsData, setTotalsData] = useState<{
+    by_class: object;
+    totals: object;
+  } | null>(null);
+
   const totals = useQuery({
     queryKey: ["totals"],
     queryFn: async () =>
       await client.get(`/flights/totals`).then((res) => res.data),
   });
 
+  useEffect(() => {
+    if (totals.isFetched && !!totals.data) {
+      console.log(totals.data);
+      setTotalsData(totals.data);
+    }
+  }, [totals.data]);
+
   return (
     <Container>
       {totals.isLoading ? (
@@ -29,50 +43,90 @@ export default function Dashboard() {
           <Title order={3}>Totals</Title>
           <CollapsibleFieldset legend="Time" w="100%">
             <Group grow>
-              <VerticalLogItem label="All" content={totals.data.time_total} />
-              <VerticalLogItem label="Solo" content={totals.data.time_solo} />
-              <VerticalLogItem label="PIC" content={totals.data.time_pic} />
-              <VerticalLogItem label="SIC" content={totals.data.time_sic} />
+              <VerticalLogItem
+                label="All"
+                content={totalsData?.totals?.time_total ?? 0.0}
+              />
+              <VerticalLogItem
+                label="Solo"
+                content={totalsData?.totals?.time_solo ?? 0.0}
+              />
+              <VerticalLogItem
+                label="PIC"
+                content={totalsData?.totals?.time_pic ?? 0.0}
+              />
+              <VerticalLogItem
+                label="SIC"
+                content={totalsData?.totals?.time_sic ?? 0.0}
+              />
               <VerticalLogItem
                 label="Instrument"
-                content={totals.data.time_instrument}
+                content={totalsData?.totals?.time_instrument ?? 0.0}
               />
               <VerticalLogItem
                 label="Simulator"
-                content={totals.data.time_sim}
+                content={totalsData?.totals?.time_sim ?? 0.0}
               />
             </Group>
           </CollapsibleFieldset>
+          <CollapsibleFieldset legend="By Class" w="100%">
+            <Group grow>
+              {totalsData?.by_class?.map((total: object[]) => (
+                <>
+                  <VerticalLogItem
+                    key={randomId()}
+                    label={total.aircraft_class}
+                    content={total.time_total ?? 0.0}
+                  />
+                </>
+              ))}
+            </Group>
+          </CollapsibleFieldset>
           <CollapsibleFieldset legend="Landings" w="100%">
             <Group grow>
-              <VerticalLogItem label="Day" content={totals.data.landings_day} />
+              <VerticalLogItem
+                label="Day"
+                content={totalsData?.totals?.landings_day ?? 0}
+              />
               <VerticalLogItem
                 label="Night"
-                content={totals.data.landings_night}
+                content={totalsData?.totals?.landings_night ?? 0}
               />
             </Group>
           </CollapsibleFieldset>
           <CollapsibleFieldset legend="Cross-Country" w="100%">
             <Group grow>
-              <VerticalLogItem label="Hours" content={totals.data.time_xc} />
+              <VerticalLogItem
+                label="Hours"
+                content={totalsData?.totals?.time_xc ?? 0.0}
+              />
               <VerticalLogItem
                 label="Dual Recvd"
-                content={totals.data.xc_dual_recvd}
+                content={totalsData?.totals?.xc_dual_recvd ?? 0.0}
+              />
+              <VerticalLogItem
+                label="Solo"
+                content={totalsData?.totals?.xc_solo ?? 0.0}
+              />
+              <VerticalLogItem
+                label="PIC"
+                content={totalsData?.totals?.xc_pic ?? 0.0}
               />
-              <VerticalLogItem label="Solo" content={totals.data.xc_solo} />
-              <VerticalLogItem label="PIC" content={totals.data.xc_pic} />
             </Group>
           </CollapsibleFieldset>
           <CollapsibleFieldset legend="Night" w="100%">
             <Group grow>
-              <VerticalLogItem label="Hours" content={totals.data.time_night} />
+              <VerticalLogItem
+                label="Hours"
+                content={totalsData?.totals?.time_night ?? 0.0}
+              />
               <VerticalLogItem
                 label="Night Dual Received"
-                content={totals.data.night_dual_recvd}
+                content={totalsData?.totals?.night_dual_recvd ?? 0.0}
               />
               <VerticalLogItem
                 label="Night PIC"
-                content={totals.data.night_pic}
+                content={totalsData?.totals?.night_pic ?? 0.0}
               />
             </Group>
           </CollapsibleFieldset>