Lucas WintherandClaude Opus 5.5
5fa59310f3
- Tags and custom fields update the cached entry optimistically and build from the latest cache; one entry's PATCHes run in order (mutation scope). - The review textarea follows server changes (Restore) unless edited. - friendlyError() maps validation reasons and 413 to plain copy everywhere. - Rating scale from me/preferences; /login and /register use auth/status; Attachments lists from the API. - Gelasio vendored (official OFL variable TTFs); minors from the review. - Docs: DESIGN (AA on orange, faint labels), DECISIONS, TODO, ARCHITECTURE. Co-Authored-By: Claude Opus 5.5 <[email protected]>
75 lines
3.0 KiB
TypeScript
75 lines
3.0 KiB
TypeScript
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
|
import { useEffect, useState } from "react";
|
|
import { api, type ChangeEvent, type EntryPatch, type EntryView } from "./api.ts";
|
|
import { applyEntryPatch } from "./edits.ts";
|
|
|
|
/** Pending Changes-inbox events (first 200; the badge shows "200+" beyond that). */
|
|
export function usePendingChanges() {
|
|
return useQuery({ queryKey: ["changes", "pending"], queryFn: api.changes, staleTime: 30_000 });
|
|
}
|
|
|
|
export function useMe() {
|
|
return useQuery({ queryKey: ["me"], queryFn: api.me, retry: false, staleTime: Infinity });
|
|
}
|
|
|
|
export function useSources() {
|
|
return useQuery({ queryKey: ["sources"], queryFn: api.sources, staleTime: 60_000 });
|
|
}
|
|
|
|
/** Pending events that touch an entry or one of its reads/plays. */
|
|
export function changesFor(items: ChangeEvent[] | undefined, entryId: string, engagementIds: Set<string>): ChangeEvent[] {
|
|
return (items ?? []).filter(
|
|
(c) => c.targetId !== null && ((c.targetEntity === "entry" && c.targetId === entryId) || (c.targetEntity === "engagement" && engagementIds.has(c.targetId))),
|
|
);
|
|
}
|
|
|
|
export function useDebounced<T>(value: T, ms = 220): T {
|
|
const [v, setV] = useState(value);
|
|
useEffect(() => {
|
|
const t = setTimeout(() => setV(value), ms);
|
|
return () => clearTimeout(t);
|
|
}, [value, ms]);
|
|
return v;
|
|
}
|
|
|
|
/**
|
|
* Shared save path for every detail edit. The cached entry is updated optimistically (rolled back on
|
|
* error) and PATCHes for one entry run one at a time (mutation scope), in the order they were made.
|
|
* Use `edit(cur => patch)` when the next value depends on the current one (tags, custom fields): it
|
|
* builds from the latest cache, so quick successive edits compose.
|
|
*/
|
|
export function useEntryPatch(id: string) {
|
|
const qc = useQueryClient();
|
|
const key = ["entry", id];
|
|
const mutationKey = ["entry-patch", id];
|
|
const m = useMutation({
|
|
mutationKey,
|
|
scope: { id: `entry-patch:${id}` },
|
|
mutationFn: (patch: EntryPatch) => api.patchEntry(id, patch),
|
|
onMutate: async (patch) => {
|
|
await qc.cancelQueries({ queryKey: key });
|
|
const prev = qc.getQueryData<EntryView>(key);
|
|
if (prev) qc.setQueryData<EntryView>(key, applyEntryPatch<EntryView>(prev, patch));
|
|
return { prev };
|
|
},
|
|
onError: (_e, _patch, ctx) => {
|
|
if (ctx?.prev) qc.setQueryData(key, ctx.prev);
|
|
void qc.invalidateQueries({ queryKey: key });
|
|
},
|
|
onSuccess: (entry) => {
|
|
// Only the last queued edit writes the server's answer, so earlier answers don't flash old values.
|
|
if (qc.isMutating({ mutationKey }) <= 1) qc.setQueryData(key, entry);
|
|
},
|
|
onSettled: () => {
|
|
void qc.invalidateQueries({ queryKey: ["entries"] });
|
|
void qc.invalidateQueries({ queryKey: ["history", id] });
|
|
},
|
|
});
|
|
const edit = (build: (cur: EntryView) => EntryPatch | null) => {
|
|
const cur = qc.getQueryData<EntryView>(key);
|
|
const patch = cur ? build(cur) : null;
|
|
if (patch) m.mutate(patch);
|
|
};
|
|
return { ...m, edit };
|
|
}
|