From 3fba2b72e93c6432bd99419019e6345903f4342e Mon Sep 17 00:00:00 2001 From: Jessica Ho Date: Tue, 13 Feb 2024 00:00:36 -0800 Subject: [PATCH 01/40] refactor calendar page --- src/hooks.server.ts | 23 +- src/{routes => lib/components}/Button.svelte | 0 src/lib/components/Calendar/Notifier.svelte | 203 +++++ .../components/Calendar/ScheduleTable.svelte | 341 ++++++++ src/{routes => lib/components}/Legend.svelte | 0 src/{routes => lib/components}/Modal.svelte | 0 src/{routes => lib/components}/NavBar.svelte | 0 .../components}/PhoneInput.svelte | 0 src/lib/constants.ts | 34 - src/lib/logics/Calendar/Notifier/logic.ts | 62 ++ src/lib/logics/Calendar/Notifier/types.ts | 4 + .../Calendar/ScheduleTable/constants.ts | 3 + .../logics/Calendar/ScheduleTable/logic.ts | 398 ++++++++++ src/lib/logics/Calendar/Wrapper/logic.ts | 108 +++ src/lib/logics/Calendar/Wrapper/types.ts | 23 + src/lib/logics/Calendar/_shared/constants.ts | 14 + src/lib/logics/Calendar/_shared/types.ts | 13 + src/lib/parse.ts | 8 +- src/lib/server/db.ts | 4 +- src/lib/types.ts | 40 + src/routes/calendar/+page.server.ts | 72 +- src/routes/calendar/+page.svelte | 728 +----------------- src/routes/dashboard/+page.server.ts | 13 +- src/routes/dashboard/+page.svelte | 2 +- src/routes/household/+page.svelte | 9 +- 25 files changed, 1292 insertions(+), 810 deletions(-) rename src/{routes => lib/components}/Button.svelte (100%) create mode 100644 src/lib/components/Calendar/Notifier.svelte create mode 100644 src/lib/components/Calendar/ScheduleTable.svelte rename src/{routes => lib/components}/Legend.svelte (100%) rename src/{routes => lib/components}/Modal.svelte (100%) rename src/{routes => lib/components}/NavBar.svelte (100%) rename src/{routes => lib/components}/PhoneInput.svelte (100%) create mode 100644 src/lib/logics/Calendar/Notifier/logic.ts create mode 100644 src/lib/logics/Calendar/Notifier/types.ts create mode 100644 src/lib/logics/Calendar/ScheduleTable/constants.ts create mode 100644 src/lib/logics/Calendar/ScheduleTable/logic.ts create mode 100644 src/lib/logics/Calendar/Wrapper/logic.ts create mode 100644 src/lib/logics/Calendar/Wrapper/types.ts create mode 100644 src/lib/logics/Calendar/_shared/constants.ts create mode 100644 src/lib/logics/Calendar/_shared/types.ts create mode 100644 src/lib/types.ts diff --git a/src/hooks.server.ts b/src/hooks.server.ts index 7ce03fe..19b7b78 100644 --- a/src/hooks.server.ts +++ b/src/hooks.server.ts @@ -1,9 +1,9 @@ import type { Handle, RequestEvent } from '@sveltejs/kit'; -import type { User, PhoneContactPermissions } from '@prisma/client'; import * as cron from 'node-cron'; import { sendNotif } from '$lib/server/twilio'; import { toLocalTimezone } from '$lib/date'; import prisma from '$lib/prisma'; +import type { UserWithPermissions } from '$lib/types'; import { redirect } from '@sveltejs/kit'; import type { MaybePromise, ResolveOptions } from '@sveltejs/kit/types/internal'; @@ -15,7 +15,7 @@ if (import.meta.env.PROD) { } const setLocal = async ( - user: (User & { phonePermissions: PhoneContactPermissions }) | null, + user: UserWithPermissions | null, phone: string, event: RequestEvent>, string | null> ) => { @@ -121,16 +121,15 @@ export const handle = (async ({ event, resolve }) => { if (!session || session.expires < new Date()) throw redirect(303, '/'); // from hereon, it's a valid req with a cookie / session - const user: (User & { phonePermissions: PhoneContactPermissions }) | null = - await prisma.user.findUnique({ - where: { - phone: session.phone - }, - include: { - phonePermissions: true, - AvailabilityDate: true - } - }); + const user: UserWithPermissions | null = await prisma.user.findUnique({ + where: { + phone: session.phone + }, + include: { + phonePermissions: true, + AvailabilityDate: true + } + }); if (event.url.pathname === '/db') { event.locals.user = user; diff --git a/src/routes/Button.svelte b/src/lib/components/Button.svelte similarity index 100% rename from src/routes/Button.svelte rename to src/lib/components/Button.svelte diff --git a/src/lib/components/Calendar/Notifier.svelte b/src/lib/components/Calendar/Notifier.svelte new file mode 100644 index 0000000..b9d24fb --- /dev/null +++ b/src/lib/components/Calendar/Notifier.svelte @@ -0,0 +1,203 @@ + + +{#key schedDiffs} +

Notify Circle

+

Preview of your notification message(s)

+ +
+ {`${user.firstName}${user.lastName && user.lastName.length ? ` ${user.lastName}` : ''}`} (parent + of {kidNames}) has {showFullSched ? 'updated' : 'changed the following days on'} + {getObjectivePronoun(user.pronouns)} tentative schedule: +
+ Legend: 🏠(host) 🚗(visit) 👤(dropoff) 👥(together) 🏫(via school) ⭐(good) 🌟(great) 🙏(needed) +

+ + {#each showFullSched ? schedFull : schedDiffs as day} +

{day}

+ {/each} +
+ + + + {#each circleInfo as c} + {#each c.parents as p} + + + + + {/each} + {/each} +
+ {c.name} + + {#if notified.has(p.phone)} +

Notified!

+ {:else} + + {/if} +
+{/key} + + diff --git a/src/lib/components/Calendar/ScheduleTable.svelte b/src/lib/components/Calendar/ScheduleTable.svelte new file mode 100644 index 0000000..df42ca6 --- /dev/null +++ b/src/lib/components/Calendar/ScheduleTable.svelte @@ -0,0 +1,341 @@ + + + + {#each rows as row, i} + + + + + {#if !row.availRange} + + {:else} + + {/if} + + {#if openedRows.has(i)} + +
showEditor({ i, openedRows })} + on:keyup={() => showEditor({ i, openedRows })} + > + {row.englishDay} + showEditor({ i, openedRows })} + on:keyup={() => showEditor({ i, openedRows })} + > + {row.monthDay} + showEditor({ i, openedRows })} + on:keyup={() => showEditor({ i, openedRows })} + > + {#if !row.availRange} +

Unspecified (edit)

+ {:else if row.availRange === 'Busy'} +

Busy (edit)

+ {:else} +

{row.availRange}

+ {#if row.emoticons.size} +

+ {#each Array.from(row.emoticons) as emojiStr} + {EMOTICONS_REVERSE[emojiStr]} + {/each} +

+ {/if} + {#if row.notes} +

{row.notes}

+ {/if} +

(edit)

+ {/if} + 		{ + markRowAsUnavailable({ + i, + displayedRows: rows, + openedRows, + status: AvailabilityStatus.BUSY + }); + }} + on:keyup={() => + markRowAsUnavailable({ + i, + displayedRows: rows, + openedRows, + status: AvailabilityStatus.BUSY + })} + class="busy" + > + Busy + + markRowAsUnavailable({ + i, + displayedRows: rows, + openedRows, + status: AvailabilityStatus.UNSPECIFIED + })} + on:keyup={() => + markRowAsUnavailable({ + i, + displayedRows: rows, + openedRows, + status: AvailabilityStatus.UNSPECIFIED + })} + > + Clear +
+
{}}> +
+ + { + rowIndsWithTimeErrs.delete(i); + rowIndsWithTimeErrs = new Set(rowIndsWithTimeErrs); + + rows[i].availRange = e.currentTarget.value; + }} + /> + {#if rowIndsWithTimeErrs.has(i)} +

Enter a valid time range. Ex. "2:30pm-7 or 5-6"

+ {/if} +
+
+ {#key rows[i].emoticons} + {#each Object.entries(EMOTICONS) as [emoji, emojiDescrip]} +
+ toggleEmoticon({ i, displayedRows: rows, emoticon: emojiDescrip })} + on:keyup={() => + toggleEmoticon({ i, displayedRows: rows, emoticon: emojiDescrip })} + > + {emoji} +
+ {/each} + {/key} +
+

+ Legend + + + +

+
+
+
+