use-pages.ts · Source

use-pages.tsapps/web/src/hooks/use-pages.tsraw ← hooks8,622 B← Back to the app
1"use client";
2 
3/**
4 * Page-level queries/mutations. All block mutations flow through
5 * use-blocks.ts; these cover page structure (tree, versions, favorite).
6 */
7import { useMemo } from "react";
8import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
9import { blockApi, pageApi, workspaceApi } from "@/lib/api";
10import { sortByPosition } from "@/lib/utils";
11import { useUiStore, type BulkAction } from "@/stores/ui-store";
12import type { Page } from "@/lib/types";
13 
14export function usePageTree(workspaceId: string, parentId?: string | null) {
15  const effectiveParent = parentId ?? null;
16  return useQuery({
17    queryKey: ["workspaces", workspaceId, "page-tree", effectiveParent],
18    queryFn: () => workspaceApi.pageTree(workspaceId, { parentId: effectiveParent }),
19    enabled: workspaceId.length > 0
20  });
21}
22 
23/** Load a single page by id (404 → null, rendered by the route). */
24export function usePage(id: string) {
25  return useQuery({
26    queryKey: ["pages", id],
27    queryFn: () => pageApi.get(id),
28    enabled: id.length > 0
29  });
30}
31 
32/**
33 * Direct-child blocks of a page (depth=1 under the requested parent),
34 * sorted client-side by fractional position (ARCHITECTURE.md invariant 4).
35 */
36export function usePageBlocks(pageId: string, parentId: string | null = null) {
37  const query = useQuery({
38    queryKey: ["pages", pageId, "blocks", parentId ?? "top"],
39    queryFn: () => blockApi.list(pageId, { parentId, depth: 1 }),
40    enabled: pageId.length > 0
41  });
42 
43  const blocks = useMemo(
44    () => (query.data ? sortByPosition(query.data) : []),
45    [query.data]
46  );
47 
48  return { ...query, blocks };
49}
50 
51/**
52 * T-140: permission-filtered backlinks (the pages that reference this one —
53 * child_page / linked_database blocks + comment mentions; the server drops
54 * sources the caller cannot view). 30 s staleTime mirrors the API's ≤60 s
55 * version-keyed cache — a re-open refetches only after it lapses.
56 */
57export function useBacklinks(pageId: string) {
58  return useQuery({
59    queryKey: ["pages", pageId, "backlinks"],
60    queryFn: () => pageApi.backlinks(pageId),
61    enabled: pageId.length > 0,
62    staleTime: 30 * 1000
63  });
64}
65 
66export function usePageVersions(pageId: string) {
67  return useQuery({
68    queryKey: ["pages", pageId, "versions"],
69    queryFn: () => pageApi.versions(pageId),
70    enabled: pageId.length > 0,
71    staleTime: 60 * 1000
72  });
73}
74 
75export interface NewPageInput {
76  workspaceId?: string;
77  parentId?: string | null;
78  title?: string;
79  type?: "page" | "database" | "whiteboard";
80}
81 
82export function useCreatePage(workspaceId: string) {
83  const qc = useQueryClient();
84 
85  return useMutation({
86    mutationFn: (input: NewPageInput) =>
87      // The SERVER owns page positions (appendPagePosition + rebalance in
88      // page.service.ts; CreatePageDto has no position field). No client
89      // position math — the old positionForInsert call ran the shared
90      // base-36 engine and would have thrown on any real position string.
91      pageApi.create({
92        workspaceId: input.workspaceId ?? workspaceId,
93        parentId: input.parentId ?? null,
94        title: input.title ?? "",
95        type: input.type
96      }),
97    onSuccess: (page) => {
98      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "page-tree"] });
99      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "pages"] });
100      qc.setQueryData(["pages", page.id], page);
101    }
102  });
103}
104 
105export function useUpdatePage(workspaceId: string) {
106  const qc = useQueryClient();
107  return useMutation({
108    mutationFn: (input: { id: string } & Partial<Pick<Page, "title" | "icon" | "cover" | "parentId" | "position">> & { archived?: boolean }) =>
109      pageApi.update(input.id, {
110        title: input.title,
111        icon: input.icon,
112        // `cover` is mapped to the server's `coverUrl` inside pageApi.update
113        // (recorded conflict, T-192) — pass the web field through unchanged.
114        cover: input.cover,
115        parentId: input.parentId,
116        position: input.position,
117        // TASK-0045 context menu "Archive" (PATCH /pages/:id accepts
118        // `archived` — the single-page archive endpoint from TASK-0035).
119        ...(input.archived !== undefined ? { archived: input.archived } : {})
120      }),
121    onSuccess: (page) => {
122      qc.setQueryData(["pages", page.id], page);
123      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "page-tree"] });
124    }
125  });
126}
127 
128/**
129 * "Delete" moves the page to the workspace trash (type=trash under the
130 * workspace root), matching PRODUCT-SPEC sidebar semantics.
131 */
132export function useDeletePage(workspaceId: string) {
133  const qc = useQueryClient();
134  return useMutation({
135    mutationFn: (id: string) => pageApi.remove(id),
136    onSuccess: (_data, id) => {
137      qc.removeQueries({ queryKey: ["pages", id, "blocks"] });
138      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "page-tree"] });
139      qc.invalidateQueries({ queryKey: ["pages", id] });
140      // T-192: a page trashed from the context menu must appear in an
141      // already-mounted Trash view (the trash page's own restore/purge
142      // mutations invalidate this list; the sidebar trash path did not).
143      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "trash"] });
144    }
145  });
146}
147 
148 
149/**
150 * T-138: recursive duplicate (blocks, child pages, database snapshot). The
151 * server defaults the copy's title to `<title> (copy)`; the page-tree cache is
152 * invalidated so the new row appears where it belongs.
153 */
154export function useDuplicatePage(workspaceId: string) {
155  const qc = useQueryClient();
156  return useMutation({
157    mutationFn: async (input: { id: string; parentId?: string | null; title?: string }) => {
158      // The endpoint returns the BARE `{ id, sourcePageId }` (the tested
159      // T-138 contract) — fetch the full new page (title etc.) by id.
160      const { id: newId } = await pageApi.duplicate(input.id, {
161        parentId: input.parentId ?? undefined,
162        title: input.title
163      });
164      return pageApi.get(newId);
165    },
166    onSuccess: (page) => {
167      qc.setQueryData(["pages", page.id], page);
168      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "page-tree"] });
169      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "pages"] });
170    }
171  });
172}
173 
174export function useToggleFavorite() {
175  const qc = useQueryClient();
176  return useMutation({
177    mutationFn: (id: string) => pageApi.toggleFavorite(id),
178    onSuccess: (data, id) => {
179      qc.invalidateQueries({ queryKey: ["pages", id] });
180      qc.invalidateQueries({ queryKey: ["favorites"] });
181    }
182  });
183}
184 
185/**
186 * T-157: watchlist — is the caller watching this page (get notified of
187 * updates)? VIEW-level, read from its own `GET /pages/:id/watch` (the page
188 * object embeds `favorite` but not `watching`, so we don't touch the page
189 * serializer).
190 */
191export function usePageWatch(pageId: string) {
192  return useQuery({
193    queryKey: ["pages", pageId, "watch"],
194    queryFn: () => pageApi.isWatching(pageId),
195    enabled: pageId.length > 0
196  });
197}
198 
199/** T-157: start/stop watching a page. Flips the `watch` query cache. */
200export function useToggleWatch() {
201  const qc = useQueryClient();
202  return useMutation({
203    mutationFn: ({ id, watching }: { id: string; watching: boolean }) =>
204      watching ? pageApi.unwatch(id) : pageApi.watch(id),
205    onSuccess: (data, { id }) => {
206      qc.setQueryData(["pages", id, "watch"], { watching: data.watching });
207    }
208  });
209}
210 
211/**
212 * T-139: bulk page action (trash / archive / unarchive / favorite /
213 * unfavorite). `pageApi.bulk` sends the ids + a `X-Factory-Workspace` header;
214 * the server applies per-item permission and returns `{ succeeded, failed }`
215 * (a page the caller lacks EDIT on is in `failed`, never silently skipped).
216 * On success we clear the selection + the bulk dialog and refresh the tree.
217 */
218export function useBulkPages(workspaceId: string) {
219  const qc = useQueryClient();
220  const setBulk = useUiStore((s) => s.setBulk);
221  const clearPageSelection = useUiStore((s) => s.clearPageSelection);
222 
223  return useMutation({
224    mutationFn: (input: { action: BulkAction; ids: string[] }) =>
225      pageApi.bulk(workspaceId, input.action, input.ids),
226    onSuccess: (_res, input) => {
227      setBulk(false);
228      clearPageSelection();
229      // trash/archive/favorite all change what the tree shows or its state.
230      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "page-tree"] });
231      qc.invalidateQueries({ queryKey: ["workspaces", workspaceId, "pages"] });
232      qc.invalidateQueries({ queryKey: ["favorites"] });
233      void input;
234    }
235  });
236}
237