feat: ✨ update data on mount

icssc · May 20, 2024 · 7da6ade · 7da6ade
1 parent a3ccf41
commit 7da6ade
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 2 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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 />