bvandeusenandClaude Opus 4.8
590d3ff2f6
The Search / Timeline / Reminders views each hand-rolled the same items+loading+error scaffold, retry button, and editor-host glue. - useNoteList(fetcher, fallbackError) (new): the load-a-note-list scaffold (items/loading/error + a load() that never leaves a half-state). Views supply just the fetcher; the refs drive <AsyncState>. - SearchView / TimelineView / RemindersView: adopt useNoteList + useNoteEditor + <AsyncState>/<EmptyState>; drop the local list/loading/error refs, the duplicated retry blocks, and the notes.items-shadowing navigate glue. - GraphView: editor host now via useNoteEditor (openNode/closeEditor/onNavigate collapse to navigate); loading/error via <AsyncState>. Its two empty states keep inline markup/buttons, so they stay custom (not forced into EmptyState). - reminders store: fetchReminders() is the single owner of /api/notes/reminders; both the background poll (check) and RemindersView read through it. Frontend-only; CI vue-tsc is the type gate (no local typecheck, rule 10). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FRgehjoz7Yv8LkUfADxACm
39 lines
1.2 KiB
TypeScript
39 lines
1.2 KiB
TypeScript
import { ref, type Ref } from "vue";
|
|
import type { Note } from "../stores/notes";
|
|
|
|
// The load-a-list-of-notes scaffold every recall view (Search, Timeline, Reminders)
|
|
// hand-rolled: an items ref + loading/error flags + a load() that fills them and never
|
|
// leaves a half-state. The view supplies just the fetcher; wire the returned refs into
|
|
// <AsyncState> and pass `items` to <EmptyState>/cards.
|
|
//
|
|
// `fetcher` returns the notes to show (or [] — e.g. an empty search box). A thrown
|
|
// ApiError's `.error` becomes the message; otherwise `fallbackError` is shown.
|
|
export function useNoteList(
|
|
fetcher: () => Promise<Note[]>,
|
|
fallbackError = "Couldn't load your notes.",
|
|
): {
|
|
items: Ref<Note[]>;
|
|
loading: Ref<boolean>;
|
|
error: Ref<string>;
|
|
load: () => Promise<void>;
|
|
} {
|
|
const items = ref<Note[]>([]);
|
|
const loading = ref(false);
|
|
const error = ref("");
|
|
|
|
async function load(): Promise<void> {
|
|
loading.value = true;
|
|
error.value = "";
|
|
try {
|
|
items.value = await fetcher();
|
|
} catch (e) {
|
|
error.value = (e as { error?: string }).error ?? fallbackError;
|
|
items.value = [];
|
|
} finally {
|
|
loading.value = false;
|
|
}
|
|
}
|
|
|
|
return { items, loading, error, load };
|
|
}
|