From 9fd112a36bb2394faac79245278c946a1b87153c Mon Sep 17 00:00:00 2001
From: Kevin Wu <kevinwu098@gmail.com>
Date: Mon, 20 May 2024 15:27:38 -0700
Subject: [PATCH 1/5] =?UTF-8?q?fix:=20=F0=9F=90=9B=20correct=20type=20impo?=
 =?UTF-8?q?rt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/availability/PersonalAvailability.svelte | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/availability/PersonalAvailability.svelte b/src/lib/components/availability/PersonalAvailability.svelte
index 515b1759..d24733c2 100644
--- a/src/lib/components/availability/PersonalAvailability.svelte
+++ b/src/lib/components/availability/PersonalAvailability.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
   import { onMount } from "svelte";
 
-  import type { PageData } from "../../../routes/availability/$types";
+  import type { PageData } from "../../../routes/availability/[slug]/$types";
 
   import LoginFlow from "./LoginModal.svelte";
 
@@ -154,7 +154,7 @@
   }
 
   onMount(async () => {
-    $guestSession.meetingId = data.meetingId;
+    $guestSession.meetingId = data.meetingId ?? "";
 
     const generalAvailability = await getGeneralAvailability(data, $guestSession);
     const defaultMeetingDates = data.defaultDates.map((item) => new ZotDate(item.date, false, []));

From 76634cef595eb71ba342f431a3286f5d2e52a109 Mon Sep 17 00:00:00 2001
From: Kevin Wu <kevinwu098@gmail.com>
Date: Mon, 20 May 2024 15:50:57 -0700
Subject: [PATCH 2/5] =?UTF-8?q?feat:=20=E2=9C=A8=20read=20time=20start=20a?=
 =?UTF-8?q?nd=20end=20from=20db?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/stores/availabilityStores.ts | 28 +++++++++++++++++-----------
 1 file changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/lib/stores/availabilityStores.ts b/src/lib/stores/availabilityStores.ts
index b34cdd32..206adba5 100644
--- a/src/lib/stores/availabilityStores.ts
+++ b/src/lib/stores/availabilityStores.ts
@@ -2,22 +2,28 @@ import { readable, writable } from "svelte/store";
 
 import type { GuestSession, MemberAvailability } from "./../types/availability";
 
-import { TimeConstants } from "$lib/types/chrono";
+import { startTime, endTime } from "$lib/stores/meetingSetupStores";
+import { TimeConstants, type HourMinuteString } from "$lib/types/chrono";
 import { ZotDate } from "$lib/utils/ZotDate";
 
 export const BLOCK_LENGTH: number = 15;
-export const getTimeFromHoursAndMinutes = (hours: number, minutes: number = 0): number => {
-  return hours * TimeConstants.MINUTES_PER_HOUR + minutes;
-};
-export const getTimeFromString = (timeString: string): number => {
-  const [hourString, minuteString] = timeString.split(":");
-  const hours = parseInt(hourString, 10);
-  const minutes = parseInt(minuteString, 10);
-  return getTimeFromHoursAndMinutes(hours, minutes);
+
+const getTimeFromHourMinuteString = (hourMinuteString: HourMinuteString): number => {
+  const [hours, minutes] = hourMinuteString.split(":");
+
+  return Number(hours) * TimeConstants.MINUTES_PER_HOUR + Number(minutes);
 };
 
-const earliestTime: number = getTimeFromHoursAndMinutes(8);
-const latestTime: number = getTimeFromHoursAndMinutes(17, 30);
+let earliestTime: number = getTimeFromHourMinuteString("08:00");
+let latestTime: number = getTimeFromHourMinuteString("17:30");
+
+startTime.subscribe((value) => {
+  earliestTime = getTimeFromHourMinuteString(value ?? "08:00");
+});
+
+endTime.subscribe((value) => {
+  latestTime = getTimeFromHourMinuteString(value ?? "17:30");
+});
 
 const sampleMembers: MemberAvailability[] = [
   {

From a3ccf41932a4cfee3ab299996d18176fd8b766f5 Mon Sep 17 00:00:00 2001
From: Kevin Wu <kevinwu098@gmail.com>
Date: Mon, 20 May 2024 15:57:50 -0700
Subject: [PATCH 3/5] =?UTF-8?q?fix:=20=F0=9F=90=9B=20remove=20guestForm=20?=
 =?UTF-8?q?from=20pageData,=20correct=20type?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/availability/LoginModal.svelte | 6 +++---
 src/routes/availability/[slug]/+page.server.ts    | 6 ++----
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/lib/components/availability/LoginModal.svelte b/src/lib/components/availability/LoginModal.svelte
index c3a60ce6..c7de4214 100644
--- a/src/lib/components/availability/LoginModal.svelte
+++ b/src/lib/components/availability/LoginModal.svelte
@@ -2,7 +2,7 @@
   import type { ActionResult } from "@sveltejs/kit";
   import { superForm } from "sveltekit-superforms/client";
 
-  import type { PageData } from "../../../routes/availability/$types";
+  import type { PageData } from "../../../routes/availability/[slug]/$types";
 
   import { deserialize } from "$app/forms";
   import { userSchema } from "$lib/config/zod-schemas";
@@ -87,7 +87,7 @@
 
       $guestSession = {
         guestName: guestData.data?.username,
-        meetingId: data.meetingId,
+        meetingId: data.meetingId ?? "",
       };
 
       $isEditingAvailability = false;
@@ -182,7 +182,7 @@
           <form
             bind:this={guestForm}
             class="flex-center w-full grow flex-col items-center space-y-4 md:w-[250px]"
-            on:submit|preventDefault={() => handleGuestSubmit(data.meetingId)}
+            on:submit|preventDefault={() => handleGuestSubmit(data.meetingId ?? "")}
           >
             {#if formState === "failure"}
               <aside class="variant-filled-error alert">
diff --git a/src/routes/availability/[slug]/+page.server.ts b/src/routes/availability/[slug]/+page.server.ts
index 5f30ae6e..1adcf630 100644
--- a/src/routes/availability/[slug]/+page.server.ts
+++ b/src/routes/availability/[slug]/+page.server.ts
@@ -6,7 +6,6 @@ import { superValidate } from "sveltekit-superforms/server";
 import type { PageServerLoad } from "../$types";
 import { _loginSchema } from "../../auth/login/+page.server";
 
-import { guestSchema } from "$lib/config/zod-schemas";
 import { getExistingGuest, getExistingMeeting } from "$lib/db/databaseUtils.server";
 import { db } from "$lib/db/drizzle";
 import {
@@ -18,14 +17,13 @@ import {
 } from "$lib/db/schema";
 import type { ZotDate } from "$lib/utils/ZotDate";
 
-const guestLoginSchema = guestSchema.pick({ username: true });
-
 export const load: PageServerLoad = (async ({ locals, params }) => {
   const user = locals.user;
 
+  // TODO: If no slug is in the URL (i.e. no meeting ID), we should redirect to an error page
+
   return {
     form: await superValidate(_loginSchema),
-    guestForm: await superValidate(guestLoginSchema),
     availability: user ? await getAvailability(user, params?.slug) : null,
     meetingId: params?.slug as string | undefined,
     defaultDates: (await getMeetingDates(params?.slug)) ?? [],

From 7da6ade53f34a822760aa3eb83519c50fa47578e Mon Sep 17 00:00:00 2001
From: Kevin Wu <kevinwu098@gmail.com>
Date: Mon, 20 May 2024 16:18:21 -0700
Subject: [PATCH 4/5] =?UTF-8?q?feat:=20=E2=9C=A8=20update=20data=20on=20mo?=
 =?UTF-8?q?unt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../availability/PersonalAvailability.svelte  |  5 ++++-
 src/lib/stores/availabilityStores.ts          |  2 +-
 .../availability/[slug]/+page.server.ts       |  2 ++
 src/routes/availability/[slug]/+page.svelte   | 19 +++++++++++++++++++
 4 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/availability/PersonalAvailability.svelte b/src/lib/components/availability/PersonalAvailability.svelte
index d24733c2..c037bf0a 100644
--- a/src/lib/components/availability/PersonalAvailability.svelte
+++ b/src/lib/components/availability/PersonalAvailability.svelte
@@ -26,7 +26,7 @@
     itemsPerPage = columns;
   }
 
-  const lastPage: number = Math.floor(($availabilityDates.length - 1) / itemsPerPage);
+  let lastPage: number = Math.floor(($availabilityDates.length - 1) / itemsPerPage);
   const numPaddingDates: number =
     $availabilityDates.length % itemsPerPage === 0
       ? 0
@@ -37,6 +37,7 @@
 
   let currentPage = 0;
 
+  console.log(currentPage, lastPage);
   let currentPageAvailability: (ZotDate | null)[];
 
   let selectionState: SelectionStateType | null = null;
@@ -164,6 +165,8 @@
       generalAvailability && generalAvailability.length > 0
         ? generalAvailability
         : defaultMeetingDates;
+
+    lastPage = Math.floor(($availabilityDates.length - 1) / itemsPerPage);
   });
 </script>
 
diff --git a/src/lib/stores/availabilityStores.ts b/src/lib/stores/availabilityStores.ts
index 206adba5..12e64457 100644
--- a/src/lib/stores/availabilityStores.ts
+++ b/src/lib/stores/availabilityStores.ts
@@ -8,7 +8,7 @@ import { ZotDate } from "$lib/utils/ZotDate";
 
 export const BLOCK_LENGTH: number = 15;
 
-const getTimeFromHourMinuteString = (hourMinuteString: HourMinuteString): number => {
+export const getTimeFromHourMinuteString = (hourMinuteString: HourMinuteString): number => {
   const [hours, minutes] = hourMinuteString.split(":");
 
   return Number(hours) * TimeConstants.MINUTES_PER_HOUR + Number(minutes);
diff --git a/src/routes/availability/[slug]/+page.server.ts b/src/routes/availability/[slug]/+page.server.ts
index 1adcf630..068889d1 100644
--- a/src/routes/availability/[slug]/+page.server.ts
+++ b/src/routes/availability/[slug]/+page.server.ts
@@ -27,6 +27,8 @@ export const load: PageServerLoad = (async ({ locals, params }) => {
     availability: user ? await getAvailability(user, params?.slug) : null,
     meetingId: params?.slug as string | undefined,
     defaultDates: (await getMeetingDates(params?.slug)) ?? [],
+    startTime: (await getExistingMeeting(params?.slug)).from_time,
+    endTime: (await getExistingMeeting(params?.slug)).to_time,
   };
 }) satisfies PageServerLoad;
 
diff --git a/src/routes/availability/[slug]/+page.svelte b/src/routes/availability/[slug]/+page.svelte
index 9dcc7bf2..a94f7daf 100644
--- a/src/routes/availability/[slug]/+page.svelte
+++ b/src/routes/availability/[slug]/+page.svelte
@@ -1,15 +1,22 @@
 <script lang="ts">
+  import { onMount } from "svelte";
+
   import type { PageData } from "./$types";
 
   import { enhance } from "$app/forms";
   import { GroupAvailability, PersonalAvailability } from "$lib/components/availability";
   import {
     availabilityDates,
+    availabilityTimeBlocks,
     generateSampleDates,
+    generateTimeBlocks,
+    getTimeFromHourMinuteString,
     guestSession,
     isEditingAvailability,
     isStateUnsaved,
   } from "$lib/stores/availabilityStores";
+  import { endTime, startTime } from "$lib/stores/meetingSetupStores";
+  import type { HourMinuteString } from "$lib/types/chrono";
   import { getGeneralAvailability } from "$lib/utils/availability";
   import { cn } from "$lib/utils/utils";
   import CancelCircleOutline from "~icons/mdi/cancel-circle-outline";
@@ -48,6 +55,18 @@
   $: mobileView = innerWidth < 768;
 
   let form: HTMLFormElement;
+
+  onMount(async () => {
+    $startTime = data.startTime as HourMinuteString;
+    $endTime = data.endTime as HourMinuteString;
+  });
+
+  $: availabilityTimeBlocks.set(
+    generateTimeBlocks(
+      getTimeFromHourMinuteString($startTime),
+      getTimeFromHourMinuteString($endTime),
+    ),
+  );
 </script>
 
 <svelte:window bind:innerWidth />

From 43fc7ecefd037a2cdf2c48fb4d6519cc60cfd9d8 Mon Sep 17 00:00:00 2001
From: Kevin Wu <kevinwu098@gmail.com>
Date: Mon, 20 May 2024 17:07:45 -0700
Subject: [PATCH 5/5] =?UTF-8?q?feat:=20=E2=9C=A8=20read=20meeting=20name?=
 =?UTF-8?q?=20from=20db?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/availability/[slug]/+page.server.ts | 3 +--
 src/routes/availability/[slug]/+page.svelte    | 6 +++---
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/routes/availability/[slug]/+page.server.ts b/src/routes/availability/[slug]/+page.server.ts
index 068889d1..98e80ca4 100644
--- a/src/routes/availability/[slug]/+page.server.ts
+++ b/src/routes/availability/[slug]/+page.server.ts
@@ -26,9 +26,8 @@ export const load: PageServerLoad = (async ({ locals, params }) => {
     form: await superValidate(_loginSchema),
     availability: user ? await getAvailability(user, params?.slug) : null,
     meetingId: params?.slug as string | undefined,
+    meetingData: await getExistingMeeting(params?.slug),
     defaultDates: (await getMeetingDates(params?.slug)) ?? [],
-    startTime: (await getExistingMeeting(params?.slug)).from_time,
-    endTime: (await getExistingMeeting(params?.slug)).to_time,
   };
 }) satisfies PageServerLoad;
 
diff --git a/src/routes/availability/[slug]/+page.svelte b/src/routes/availability/[slug]/+page.svelte
index a94f7daf..a4f78dd1 100644
--- a/src/routes/availability/[slug]/+page.svelte
+++ b/src/routes/availability/[slug]/+page.svelte
@@ -57,8 +57,8 @@
   let form: HTMLFormElement;
 
   onMount(async () => {
-    $startTime = data.startTime as HourMinuteString;
-    $endTime = data.endTime as HourMinuteString;
+    $startTime = data.meetingData.from_time as HourMinuteString;
+    $endTime = data.meetingData.to_time as HourMinuteString;
   });
 
   $: availabilityTimeBlocks.set(
@@ -73,7 +73,7 @@
 
 <div class="flex-between px-2 pt-8 md:px-4 md:pt-10 lg:px-[60px]">
   <h1 class="line-clamp-1 h-8 pr-2 font-montserrat text-xl font-medium md:h-fit md:text-3xl">
-    Sample Meeting Winter 2024
+    {data.meetingData.title}
   </h1>
 
   {#if $isEditingAvailability}