Refactor to use ClientSchedule on client
Use the ClientSchedule data structure for deserialising and tracking edit state on the client instead of trying to directly deal with the ApiSchedule type which is not build for ease of edits or rendering.
This commit is contained in:
parent
ce9f758f84
commit
bb450fd583
15 changed files with 488 additions and 1297 deletions
|
@ -1,17 +1,17 @@
|
|||
import type { ApiSchedule } from "~/shared/types/api";
|
||||
import { applyUpdatesToArray } from "~/shared/utils/update";
|
||||
import { Info } from "~/shared/utils/luxon";
|
||||
|
||||
interface SyncOperation {
|
||||
controller: AbortController,
|
||||
promise: Promise<Ref<ApiSchedule>>,
|
||||
promise: Promise<Ref<ClientSchedule>>,
|
||||
}
|
||||
|
||||
export const useSchedulesStore = defineStore("schedules", () => {
|
||||
const sessionStore = useSessionStore();
|
||||
const accountStore = useAccountStore();
|
||||
|
||||
const state = {
|
||||
activeScheduleId: ref<number | undefined>(111),
|
||||
schedules: ref<Map<number, Ref<ApiSchedule>>>(new Map()),
|
||||
schedules: ref<Map<number, Ref<ClientSchedule>>>(new Map()),
|
||||
pendingSyncs: ref<Map<number, SyncOperation>>(new Map()),
|
||||
};
|
||||
|
||||
|
@ -44,9 +44,15 @@ export const useSchedulesStore = defineStore("schedules", () => {
|
|||
console.log("return new fetch");
|
||||
const requestFetch = useRequestFetch();
|
||||
const controller = new AbortController();
|
||||
const zone = Info.normalizeZone(accountStore.activeTimezone);
|
||||
const locale = accountStore.activeLocale;
|
||||
const promise = (async () => {
|
||||
try {
|
||||
const schedule = ref(await requestFetch("/api/schedule", { signal: controller.signal }));
|
||||
const apiSchedule = await requestFetch("/api/schedule", { signal: controller.signal });
|
||||
if (apiSchedule.deleted) {
|
||||
throw new Error("Unexpecetd deleted schedule");
|
||||
}
|
||||
const schedule = ref(ClientSchedule.fromApi(apiSchedule, { zone, locale })) as Ref<ClientSchedule>;
|
||||
state.schedules.value.set(id, schedule);
|
||||
state.pendingSyncs.value.delete(id);
|
||||
return schedule;
|
||||
|
@ -90,18 +96,9 @@ export const useSchedulesStore = defineStore("schedules", () => {
|
|||
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 ?? []);
|
||||
}
|
||||
const zone = Info.normalizeZone(accountStore.activeTimezone);
|
||||
const locale = accountStore.activeLocale;
|
||||
schedule.value.applyUpdate(update, { zone, locale })
|
||||
}
|
||||
});
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue