Merge pull request #193 from mikepsinn/develop

Measurements list page

apps/nextjs/app/dashboard/measurements/page.tsx

@@ -0,0 +1,44 @@
+import { redirect } from "next/navigation"
+
+import { authOptions } from "@/lib/auth"
+import { getCurrentUser } from "@/lib/session"
+import { Shell } from "@/components/layout/shell"
+import {DashboardHeader} from "@/components/pages/dashboard/dashboard-header";
+import {DateRangePicker} from "@/components/date-range-picker";
+import {MeasurementsList} from "@/components/userVariable/measurements/measurements-list";
+
+
+interface MeasurementsPageProps {
+  params: { variableId: number }
+  searchParams: { from: string; to: string }
+}
+
+export default async function MeasurementsPage({
+                                                 params,
+                                                 searchParams,
+                                               }: MeasurementsPageProps) {
+  const user = await getCurrentUser()
+
+  if (!user) {
+    redirect(authOptions?.pages?.signIn || "/signin")
+  }
+
+  return (
+    <Shell>
+      <>
+        <DashboardHeader
+          heading={`Measurements`}
+          text={`Here are your recent measurements.`}
+        >
+          <div className="flex flex-col items-stretch gap-2 md:items-end">
+            <DateRangePicker />
+          </div>
+        </DashboardHeader>
+        <MeasurementsList user={user} measurementsDateRange={{
+          from: searchParams.from,
+          to: searchParams.to
+        }}></MeasurementsList>
+      </>
+    </Shell>
+  )
+}

apps/nextjs/components/userVariable/measurements/measurements-list.tsx

@@ -8,7 +8,7 @@ type MeasurementsListProps = {
   user: {
     id: string;
   };
-  variableId: number;
+  variableId?: number;  // Make variableId optional
   measurementsDateRange: {
     from: string;
     to: string;
@@ -22,25 +22,28 @@ export const MeasurementsList: FC<MeasurementsListProps> = ({ user, variableId,
 
   useEffect(() => {
     setIsLoading(true); // Set loading to true when starting to fetch
-    let url = `/api/dfda/measurements?variableId=${variableId}`;
-    if(measurementsDateRange.from) {
-      url += `&earliestMeasurementTime=${measurementsDateRange.from}`;
+    let url = `/api/dfda/measurements`;
+    if (variableId) {  // Check if variableId is provided
+      url += `?variableId=${variableId}`;
     }
-    if(measurementsDateRange.to) {
-      url += `&latestMeasurementTime=${measurementsDateRange.to}`;
+    if (measurementsDateRange.from) {
+      url += `${variableId ? '&' : '?'}earliestMeasurementTime=${measurementsDateRange.from}`;
+    }
+    if (measurementsDateRange.to) {
+      url += `${variableId || measurementsDateRange.from ? '&' : '?'}latestMeasurementTime=${measurementsDateRange.to}`;
     }
 
     fetch(url)
       .then(response => response.json())
       .then(measurements => {
-        if(measurementsDateRange.from){
+        if (measurementsDateRange.from) {
           measurements = measurements.filter((measurement: Measurement) => {
             const measurementTime = new Date(measurement.startAt);
             const fromDate = new Date(measurementsDateRange.from);
             return measurementTime >= fromDate;
           });
         }
-        if(measurementsDateRange.to){
+        if (measurementsDateRange.to) {
           measurements = measurements.filter((measurement: Measurement) => {
             const measurementTime = new Date(measurement.startAt);
             const toDate = new Date(measurementsDateRange.to);
@@ -56,7 +59,7 @@ export const MeasurementsList: FC<MeasurementsListProps> = ({ user, variableId,
         setIsLoading(false); // Ensure loading is set to false even if there's an error
       });
 
-  }, [user, variableId]);
+  }, [user, variableId, measurementsDateRange.from, measurementsDateRange.to]);
 
   if (isLoading) {
     return <div>Loading...</div>; // Show a loader or a loading component