Merge branch 'main' into feature/81-add-totals-to-logbook-table

* adding logbook page totals

* adding logbook page totals

* adding logbook page totals

app/package.json

@@ -13,7 +13,7 @@
   "dependencies": {
     "@azure/msal-browser": "^4.0.1",
     "@azure/msal-react": "^3.0.1",
-    "@noahspan/noahspan-components": "1.6.0",
+    "@noahspan/noahspan-components": "^1.9.1",
     "axios": "^1.7.2",
     "dotenv": "^16.4.7",
     "leaflet": "^1.9.4",

app/src/components/logTrackMaps/LogTrackMaps.tsx

@@ -4,8 +4,6 @@ import { useHttpClient } from '../../hooks/httpClient/UseHttpClient';
 import { AxiosInstance, AxiosResponse } from 'axios';
 import { useAccessToken } from '../../hooks/accessToken/UseAcessToken';
 import { useIsAuthenticated } from '@azure/msal-react';
-import { Swiper, SwiperSlide } from 'swiper/react';
-import { Pagination } from 'swiper/modules';
 import { MapContainer, TileLayer } from 'react-leaflet';
 import ReactLeafletKml from 'react-leaflet-kml';
 import 'swiper/css';
@@ -46,18 +44,6 @@ const LogTrackMaps = ({ rowKey, trackUrls }: LogTrackMapsProps) => {
   }, [trackUrls])
 
   return (
-    <>
-      <Swiper
-        spaceBetween={30}
-        pagination={{
-          clickable: true,
-        }}
-        modules={[Pagination]}
-        className="mySwiper"
-      >
-        {tracks.length > 0 && tracks.map((track) => {
-          return (
-            <SwiperSlide>
     <MapContainer 
       center={[45.14489, -93.21019]} 
       scrollWheelZoom={false}
@@ -68,13 +54,10 @@ const LogTrackMaps = ({ rowKey, trackUrls }: LogTrackMapsProps) => {
         attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
         url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
       />
+      {tracks.length > 0 && tracks.map((track) => (
         <ReactLeafletKml kml={track} />
+      ))}
     </MapContainer>
-            </SwiperSlide>
-          )
-        })}
-      </Swiper>
-    </>
   );
 }
 

app/src/components/logbook/columns.tsx

@@ -1,15 +1,26 @@
 import {
+  CellContext,
   ColumnDef,
-  Icon,
+  HeaderContext,
-  IconButton,
-  IconName
 } from '@noahspan/noahspan-components';
 import { ILogbookEntry } from './ILogbookEntry';
 
+const columnTotal = (info: HeaderContext<ILogbookEntry, unknown>): number => {
+  const values: number[] = info.table.getFilteredRowModel().rows.map((row: any) => Number(row.getValue(info.column.id))).filter((value: any) => !Number.isNaN(value));
+  let total: number = 0;
+  
+  if (values.length > 0) {
+    total = values.reduce((accumulator, currentValue) => accumulator + currentValue, total)
+  }
+
+  return total;
+} 
+
 const pilotName: ColumnDef<ILogbookEntry> = {
   id: 'pilotName',
   accessorKey: 'pilotName',
-  header: 'Pilot'
+  header: 'Pilot',
+  footer: 'PAGE TOTALS'
 }
 const date: ColumnDef<ILogbookEntry> = {
   id: 'date',
@@ -48,8 +59,9 @@ const durationOfFlight: ColumnDef<ILogbookEntry> = {
     align: 'right',
     headerAlign: 'right'
   },
-  cell: (info: any) =>
+  cell: (info: CellContext<ILogbookEntry, unknown>) =>
-    info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+    info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : '',
+  footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : ''
 }
 const notes: ColumnDef<ILogbookEntry> = {
   id: 'notes',
@@ -85,8 +97,9 @@ export const authColumns: ColumnDef<ILogbookEntry>[] = [
       align: 'right',
       headerAlign: 'right'
     },
-    cell: (info: any) =>
+    cell: (info: CellContext<ILogbookEntry, unknown>) =>
-      info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+      info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : '',
+    footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : ''
   },
   {
     id: 'landings',
@@ -99,6 +112,7 @@ export const authColumns: ColumnDef<ILogbookEntry>[] = [
         id: 'landingsDay',
         accessorKey: 'landingsDay',
         header: 'Day',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
@@ -108,6 +122,7 @@ export const authColumns: ColumnDef<ILogbookEntry>[] = [
         id: 'landingsNight',
         accessorKey: 'landingsNight',
         header: 'Night',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
@@ -126,28 +141,31 @@ export const authColumns: ColumnDef<ILogbookEntry>[] = [
         id: 'instrumentActual',
         accessorKey: 'instrumentActual',
         header: 'Actual',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
         },
-        cell: (info: any) =>
+        cell: (info: CellContext<ILogbookEntry, unknown>) =>
-          info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+          info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : '',
       },
       {
         id: 'instrumentSimulated',
         accessorKey: 'instrumentSimulated',
         header: 'Simulated',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
         },
-        cell: (info: any) =>
+        cell: (info: CellContext<ILogbookEntry, unknown>) =>
-          info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+          info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : ''
       },
       {
         id: 'instrumentApproaches',
         accessorKey: 'instrumentApproaches',
         header: 'Approaches',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
@@ -157,6 +175,7 @@ export const authColumns: ColumnDef<ILogbookEntry>[] = [
         id: 'instrumentHolds',
         accessorKey: 'instrumentHolds',
         header: 'Holds',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
@@ -166,6 +185,7 @@ export const authColumns: ColumnDef<ILogbookEntry>[] = [
         id: 'instrumentNavTrack',
         accessorKey: 'instrumentNavTrack',
         header: 'Nav/Track',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
@@ -184,67 +204,73 @@ export const authColumns: ColumnDef<ILogbookEntry>[] = [
         id: 'groundTrainingReceived',
         accessorKey: 'groundTrainingReceived',
         header: 'Ground Training Received',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
         },
-        cell: (info: any) =>
+        cell: (info: CellContext<ILogbookEntry, unknown>) =>
-          info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+          info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : ''
       },
       {
         id: 'flightTrainingReceived',
         accessorKey: 'flightTrainingReceived',
         header: 'Flight Training Received',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
         },
-        cell: (info: any) =>
+        cell: (info: CellContext<ILogbookEntry, unknown>) =>
-          info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+          info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : ''
       },
       {
         id: 'crossCountry',
         accessorKey: 'crossCountry',
         header: 'Cross Country',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
         },
-        cell: (info: any) =>
+        cell: (info: CellContext<ILogbookEntry, unknown>) =>
-          info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+          info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : ''
       },
       {
         id: 'night',
         accessorKey: 'night',
         header: 'Night',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
         },
-        cell: (info: any) =>
+        cell: (info: CellContext<ILogbookEntry, unknown>) =>
-          info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+          info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : ''
       },
       {
         id: 'solo',
         accessorKey: 'solo',
         header: 'Solo',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
         },
-        cell: (info: any) =>
+        cell: (info: CellContext<ILogbookEntry, unknown>) =>
-          info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+          info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : ''
       },
       {
         id: 'pilotInCommand',
         accessorKey: 'pilotInCommand',
         header: 'Pilot In Command',
+        footer: (info: HeaderContext<ILogbookEntry, unknown>) => columnTotal(info) > 0 ? columnTotal(info).toFixed(1) : '',
         meta: {
           align: 'right',
           headerAlign: 'right'
         },
-        cell: (info: any) =>
+        cell: (info: CellContext<ILogbookEntry, unknown>) =>
-          info.getValue() ? parseFloat(info.getValue()).toFixed(1) : ''
+          info.getValue() ? parseFloat(info.getValue() as string).toFixed(1) : ''
       }
     ]
   },