Refactor API types and sync logic

Rename and refactor the types passed over the API to be based on an
entity that's either living or a tombstone.  A living entity has a
deleted property that's either undefined or false, while a tombstone
has a deleted property set to true.  All entities have a numeric id
and an updatedAt timestamp.

To sync entities, an array of replacements are passed around. Living
entities are replaced with tombstones when they're deleted. And
tombstones are replaced with living entities when restored.

stores/account.ts

@@ -1,4 +1,4 @@
-import type { Account } from "~/shared/types/account";
+import type { ApiAccount, ApiAccountPatch } from "~/shared/types/api";
 
 export const useAccountStore = defineStore("account", () => {
 	const runtimeConfig = useRuntimeConfig();
@@ -8,8 +8,9 @@ export const useAccountStore = defineStore("account", () => {
 		id: ref<number>(),
 		name: ref<string>(),
 		timezone: ref<string>(),
-		type: ref<Account["type"]>(),
-		interestedIds: ref<Set<string>>(new Set()),
+		type: ref<ApiAccount["type"]>(),
+		interestedEventIds: ref<Set<number>>(new Set()),
+		interestedEventSlotIds: ref<Set<number>>(new Set()),
 	};
 
 	watchEffect(() => {
@@ -19,7 +20,8 @@ export const useAccountStore = defineStore("account", () => {
 		state.name.value = account?.name;
 		state.timezone.value = account?.timezone;
 		state.type.value = account?.type;
-		state.interestedIds.value = new Set(account?.interestedIds ?? []);
+		state.interestedEventIds.value = new Set(account?.interestedEventIds ?? []);
+		state.interestedEventSlotIds.value = new Set(account?.interestedEventSlotIds ?? []);
 	});
 
 	const getters = {
@@ -31,23 +33,34 @@ export const useAccountStore = defineStore("account", () => {
 	};
 
 	const actions = {
-		async toggleInterestedId(id: string, slotIds?: string[]) {
-			if (!state.interestedIds.value) {
-				throw Error("accountStore.toggleInterestedId: Invalid state")
-			}
-			let newIds = [...state.interestedIds.value ?? []];
-			if (state.interestedIds.value.has(id)) {
-				newIds = newIds.filter(newId => newId !== id);
-			} else {
-				newIds.push(id);
-				if (slotIds) {
-					const filterIds = new Set(slotIds);
-					newIds = newIds.filter(newId => !filterIds.has(newId));
+		async toggleInterestedId(type: "event" | "slot", id: number, slotIds?: number[]) {
+			let newEventIds = new Set(state.interestedEventIds.value);
+			let newSlotIds = new Set(state.interestedEventSlotIds.value);
+			if (type === "event") {
+				if (newEventIds.has(id)) {
+					newEventIds.delete(id)
+				} else {
+					newEventIds.add(id);
+					if (slotIds) {
+						for (const slotId of slotIds) {
+							newSlotIds.delete(slotId)
+						}
+					}
 				}
+			} else if (type === "slot") {
+				if (newSlotIds.has(id)) {
+					newSlotIds.delete(id);
+				} else {
+					newSlotIds.add(id);
+				}
+			}
+			const patch: ApiAccountPatch = {
+				interestedEventIds: [...newEventIds],
+				interestedEventSlotIds: [...newSlotIds],
 			}
 			await $fetch("/api/auth/account", {
 				method: "PATCH",
-				body: { interestedIds: newIds },
+				body: patch,
 			})
 			await sessionStore.fetch();
 		},

stores/schedules.ts

@@ -1,8 +1,9 @@
-import type { Schedule } from "~/shared/types/schedule";
+import type { ApiSchedule } from "~/shared/types/api";
+import { applyUpdatesToArray } from "~/shared/utils/update";
 
 interface SyncOperation {
 	controller: AbortController,
-	promise: Promise<Ref<Schedule>>,
+	promise: Promise<Ref<ApiSchedule>>,
 }
 
 export const useSchedulesStore = defineStore("schedules", () => {
@@ -10,7 +11,7 @@ export const useSchedulesStore = defineStore("schedules", () => {
 
 	const state = {
 		activeScheduleId: ref<number | undefined>(111),
-		schedules: ref<Map<number, Ref<Schedule>>>(new Map()),
+		schedules: ref<Map<number, Ref<ApiSchedule>>>(new Map()),
 		pendingSyncs: ref<Map<number, SyncOperation>>(new Map()),
 	};
 
@@ -82,9 +83,25 @@ export const useSchedulesStore = defineStore("schedules", () => {
 	})
 
 	appEventSource?.addEventListener("update", (event) => {
+		if (event.data.type !== "schedule-update") {
+			return;
+		}
 		const schedule = state.schedules.value.get(111);
-		if (schedule) {
-			schedule.value = event.data;
+		const update = event.data.data;
+		// XXX validate updatedFrom/updatedAt here
+		if (schedule && !schedule.value.deleted && !update.deleted) {
+			if (update.locations) {
+				applyUpdatesToArray(update.locations, schedule.value.locations = schedule.value.locations ?? []);
+			}
+			if (update.events) {
+				applyUpdatesToArray(update.events, schedule.value.events = schedule.value.events ?? []);
+			}
+			if (update.roles) {
+				applyUpdatesToArray(update.roles, schedule.value.roles = schedule.value.roles ?? []);
+			}
+			if (update.shifts) {
+				applyUpdatesToArray(update.shifts, schedule.value.shifts = schedule.value.shifts ?? []);
+			}
 		}
 	});
 

stores/session.ts

@@ -1,6 +1,6 @@
 import { appendResponseHeader } from "h3";
 import type { H3Event } from "h3";
-import type { Account } from "~/shared/types/account";
+import type { ApiAccount } from "~/shared/types/api";
 
 const fetchSessionWithCookie = async (event?: H3Event) => {
 	// Client side
@@ -21,7 +21,7 @@ const fetchSessionWithCookie = async (event?: H3Event) => {
 
 export const useSessionStore = defineStore("session", () => {
 	const state = {
-		account: ref<Account>(),
+		account: ref<ApiAccount>(),
 		id: ref<number>(),
 		push: ref<boolean>(false),
 	};