Office Hour block, codebase clean up for schemas and utils

This commit is contained in:
Antoine Phan
2025-07-19 12:32:47 -04:00
parent fe3495227d
commit e0a4aa1fa8
11 changed files with 57 additions and 67 deletions

View File

@@ -1,10 +0,0 @@
<script lang="ts">
let { member, startTime, endTime } = $props();
</script>
<div class="card w-full bg-ecsess-200 text-ecsess-black max-w-md p-4 m-4 text-center rounded-xl">
<p>{member.name}</p>
<p>{member.position}</p>
<hr>
<p>{startTime} - {endTime}</p>
</div>

View File

@@ -1,10 +1,9 @@
<script lang="ts">
import OhBlock from './OHBlock.svelte';
import type { OhCMSResponse } from '$lib/schemas';
function parseTime(timeStr: string) {
function parseTime(timeStr: string): number {
let a = timeStr.match(/^(\d{1,2})(?::(\d{2}))?(AM|PM)$/i);
if (!a) return;
if (!a) return 0;
let hours = parseInt(a[1], 10);
let minutes = parseInt(a[2] || '0', 10);
@@ -13,7 +12,7 @@
if (period.toUpperCase() === 'PM' && hours !== 12) hours += 12;
if (period.toUpperCase() === 'AM' && hours === 12) hours = 0;
return hours * 60 + minutes; // total minutes since midnight
return Number(hours * 60 + minutes); // total minutes since midnight
}
let { allOhs }: { allOhs: OhCMSResponse } = $props();
let sortedOHs = $state(
@@ -21,15 +20,22 @@
return parseTime(a.startTime) - parseTime(b.startTime);
})
);
const daysOfTheWeek = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'];
</script>
<div class="grid grid-cols-5 gap-8">
{#each daysOfTheWeek as DOTW}
<div class="grid min-w-2/3 grid-cols-5 gap-2 place-self-center">
{#each ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'] as day}
<div>
{DOTW}
{#each sortedOHs.filter((OH) => OH.day == DOTW) as OH}
<OhBlock member={OH.member} startTime={OH.startTime} endTime={OH.endTime}></OhBlock>
<p>- {day} -</p>
{#each sortedOHs.filter((OH) => OH.day == day) as OH}
<div
class="
card w-64 grid h-38 grid-rows-[3fr_2fr_3fr] bg-ecsess-200 text-ecsess-black m-3 place-content-center rounded-xl
p-4 text-center"
>
<p class="text-lg">{OH.startTime} - {OH.endTime}</p>
<p class="text-2xl">{OH.member.name.split(" ")[0]}</p>
<p class="text-sm italic">{OH.member.position}</p>
</div>
{/each}
</div>
{/each}