canopycms 0.0.68-int.98 → 0.1.0

package/dist/editor/hooks/useEditorLayout.d.ts

@@ -1,13 +1,59 @@
-import type { PaneLayout } from '../EditorPanes.js';
+import { type PaneArrangement } from '../shell/PaneLayout.js';
+/** @internal The preview toolbar's width choice; see `preview-scale.ts`. */
+export type PreviewWidth = 'fit' | 'desktop' | 'tablet' | 'mobile';
+export declare const CONTENT_PANEL_WIDTH_MIN = 240;
+export declare const CONTENT_PANEL_WIDTH_MAX = 400;
+/** The persisted layout preferences: one JSON object under one storage key. */
+interface EditorLayoutPrefs {
+    /** Unset until the user picks one, so it follows `defaultLayout`; JSON drops it while unset. */
+    layout?: PaneArrangement;
+    highlightEnabled: boolean;
+    sideSplitPercent: number;
+    stackedSplitPercent: number;
+    previewWidth: PreviewWidth;
+    contentPanelOpen: boolean;
+    contentPanelWidth: number;
+}
+/**
+ * @internal Exported for tests. Module-level so its identity is stable: Mantine memoises its
+ * storage reader on the default value.
+ */
+export declare const DEFAULT_EDITOR_LAYOUT_PREFS: EditorLayoutPrefs;
+/** One key per deployment prefix, so two editors on one origin keep separate preferences. */
+export declare const editorLayoutStorageKey: (basePath?: string) => string;
+/**
+ * @internal Exported for tests. Reads stored preferences, validating each field on its own: an invalid or missing field takes
+ * its default and the valid ones are kept. Mantine does not guard `deserialize`, so this never
+ * throws, whatever is under the key.
+ */
+export declare function parseEditorLayoutPrefs(raw: string | undefined): EditorLayoutPrefs;
+export interface UseEditorLayoutOptions {
+    /** Where the preferences persist; defaults to `editorLayoutStorageKey()`. */
+    storageKey?: string;
+    /** The layout until the user picks one; defaults to side by side. */
+    defaultLayout?: PaneArrangement;
+}
 export interface UseEditorLayoutReturn {
-    layout: PaneLayout;
-    setLayout: (layout: PaneLayout) => void;
+    /** The stored preferences have been read; until then every value is its default. */
+    loaded: boolean;
+    layout: PaneArrangement;
+    setLayout: (layout: PaneArrangement) => void;
     highlightEnabled: boolean;
     setHighlightEnabled: (enabled: boolean) => void;
-    headerRef: React.RefObject<HTMLDivElement>;
-    headerHeight: number;
+    sideSplitPercent: number;
+    stackedSplitPercent: number;
+    /** Stores the clamped primary-pane size for one layout; a non-finite percent is ignored. */
+    setSplitPercent: (layout: PaneArrangement, percent: number) => void;
+    previewWidth: PreviewWidth;
+    setPreviewWidth: (width: PreviewWidth) => void;
+    contentPanelOpen: boolean;
+    setContentPanelOpen: (open: boolean) => void;
+    contentPanelWidth: number;
+    setContentPanelWidth: (width: number) => void;
 }
 /**
- * Custom hook for managing Editor layout state and measurements.
+ * Editor layout preferences, persisted to localStorage (read after mount, so SSR renders the
+ * defaults; a throwing storage keeps them in memory).
  */
-export declare function useEditorLayout(): UseEditorLayoutReturn;
+export declare function useEditorLayout(options?: UseEditorLayoutOptions): UseEditorLayoutReturn;
+export {};

package/dist/editor/hooks/useEditorLayout.js

@@ -1,28 +1,106 @@
-import { useEffect, useRef, useState } from 'react';
+import { useCallback } from 'react';
+import { useLocalStorage, useMounted } from '@mantine/hooks';
+import { DEFAULT_SIDE_SPLIT_PERCENT, DEFAULT_STACKED_SPLIT_PERCENT, SPLIT_PERCENT_MAX, SPLIT_PERCENT_MIN, } from '../shell/PaneLayout.js';
+import { isPlainRecord } from '../../validation/field-traversal.js';
+const PREVIEW_WIDTHS = ['fit', 'desktop', 'tablet', 'mobile'];
+const PANE_LAYOUTS = ['side', 'stacked'];
+export const CONTENT_PANEL_WIDTH_MIN = 240;
+export const CONTENT_PANEL_WIDTH_MAX = 400;
 /**
- * Custom hook for managing Editor layout state and measurements.
+ * @internal Exported for tests. Module-level so its identity is stable: Mantine memoises its
+ * storage reader on the default value.
  */
-export function useEditorLayout() {
-    const [layout, setLayout] = useState('side');
-    const [highlightEnabled, setHighlightEnabled] = useState(false);
-    const [headerHeight, setHeaderHeight] = useState(80);
-    const headerRef = useRef(null);
-    useEffect(() => {
-        if (!headerRef.current)
+export const DEFAULT_EDITOR_LAYOUT_PREFS = {
+    highlightEnabled: false,
+    sideSplitPercent: DEFAULT_SIDE_SPLIT_PERCENT,
+    stackedSplitPercent: DEFAULT_STACKED_SPLIT_PERCENT,
+    previewWidth: 'fit',
+    contentPanelOpen: false,
+    contentPanelWidth: 280,
+};
+/** One key per deployment prefix, so two editors on one origin keep separate preferences. */
+export const editorLayoutStorageKey = (basePath) => `canopycms:editor-layout:${basePath || '/'}`;
+const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
+const clampSplitPercent = (percent) => clamp(percent, SPLIT_PERCENT_MIN, SPLIT_PERCENT_MAX);
+const clampContentPanelWidth = (width) => clamp(width, CONTENT_PANEL_WIDTH_MIN, CONTENT_PANEL_WIDTH_MAX);
+const oneOf = (options, value, fallback) => options.find((option) => option === value) ?? fallback;
+const boolOr = (value, fallback) => typeof value === 'boolean' ? value : fallback;
+const numberOr = (value, fallback, normalise) => typeof value === 'number' && Number.isFinite(value) ? normalise(value) : fallback;
+/**
+ * @internal Exported for tests. Reads stored preferences, validating each field on its own: an invalid or missing field takes
+ * its default and the valid ones are kept. Mantine does not guard `deserialize`, so this never
+ * throws, whatever is under the key.
+ */
+export function parseEditorLayoutPrefs(raw) {
+    const defaults = DEFAULT_EDITOR_LAYOUT_PREFS;
+    if (!raw)
+        return defaults;
+    let parsed;
+    try {
+        parsed = JSON.parse(raw);
+    }
+    catch {
+        return defaults;
+    }
+    if (!isPlainRecord(parsed))
+        return defaults;
+    return {
+        layout: PANE_LAYOUTS.find((layout) => layout === parsed.layout),
+        highlightEnabled: boolOr(parsed.highlightEnabled, defaults.highlightEnabled),
+        sideSplitPercent: numberOr(parsed.sideSplitPercent, defaults.sideSplitPercent, clampSplitPercent),
+        stackedSplitPercent: numberOr(parsed.stackedSplitPercent, defaults.stackedSplitPercent, clampSplitPercent),
+        previewWidth: oneOf(PREVIEW_WIDTHS, parsed.previewWidth, defaults.previewWidth),
+        contentPanelOpen: boolOr(parsed.contentPanelOpen, defaults.contentPanelOpen),
+        contentPanelWidth: numberOr(parsed.contentPanelWidth, defaults.contentPanelWidth, clampContentPanelWidth),
+    };
+}
+/**
+ * Editor layout preferences, persisted to localStorage (read after mount, so SSR renders the
+ * defaults; a throwing storage keeps them in memory).
+ */
+export function useEditorLayout(options) {
+    const [prefs, setPrefs] = useLocalStorage({
+        key: options?.storageKey ?? editorLayoutStorageKey(),
+        defaultValue: DEFAULT_EDITOR_LAYOUT_PREFS,
+        deserialize: parseEditorLayoutPrefs,
+        // Each tab keeps its own layout; a change elsewhere reaches only tabs opened later.
+        sync: false,
+    });
+    // Mounted in the same effect pass as the storage read above, and after it, so the render that
+    // first sees `loaded` also sees the stored values.
+    const loaded = useMounted();
+    const setLayout = useCallback((layout) => setPrefs((prev) => ({ ...prev, layout })), [setPrefs]);
+    const setHighlightEnabled = useCallback((highlightEnabled) => setPrefs((prev) => ({ ...prev, highlightEnabled })), [setPrefs]);
+    const setSplitPercent = useCallback((layout, percent) => {
+        if (!Number.isFinite(percent))
+            return;
+        const clamped = clampSplitPercent(percent);
+        setPrefs((prev) => layout === 'side'
+            ? { ...prev, sideSplitPercent: clamped }
+            : { ...prev, stackedSplitPercent: clamped });
+    }, [setPrefs]);
+    const setPreviewWidth = useCallback((previewWidth) => setPrefs((prev) => ({ ...prev, previewWidth })), [setPrefs]);
+    const setContentPanelOpen = useCallback((contentPanelOpen) => setPrefs((prev) => ({ ...prev, contentPanelOpen })), [setPrefs]);
+    const setContentPanelWidth = useCallback((width) => {
+        if (!Number.isFinite(width))
             return;
-        const node = headerRef.current;
-        const updateHeight = () => setHeaderHeight(node.getBoundingClientRect().height || 80);
-        updateHeight();
-        const observer = new ResizeObserver(updateHeight);
-        observer.observe(node);
-        return () => observer.disconnect();
-    }, []);
+        const contentPanelWidth = clampContentPanelWidth(width);
+        setPrefs((prev) => ({ ...prev, contentPanelWidth }));
+    }, [setPrefs]);
     return {
-        layout,
+        loaded,
+        layout: prefs.layout ?? options?.defaultLayout ?? 'side',
         setLayout,
-        highlightEnabled,
+        highlightEnabled: prefs.highlightEnabled,
         setHighlightEnabled,
-        headerRef,
-        headerHeight,
+        sideSplitPercent: prefs.sideSplitPercent,
+        stackedSplitPercent: prefs.stackedSplitPercent,
+        setSplitPercent,
+        previewWidth: prefs.previewWidth,
+        setPreviewWidth,
+        contentPanelOpen: prefs.contentPanelOpen,
+        setContentPanelOpen,
+        contentPanelWidth: prefs.contentPanelWidth,
+        setContentPanelWidth,
     };
 }

package/dist/editor/hooks/useEntriesData.d.ts

@@ -1,4 +1,4 @@
-import type { CollectionItem } from '../../api/entries.js';
+import type { CollectionAccess, CollectionItem } from '../../api/entries.js';
 import type { ApiClient } from '../context/index.js';
 import type { EditorEntry, EditorCollection } from '../Editor.js';
 /** Cache key for a branch's combined schema + entries data. */
@@ -25,6 +25,7 @@ export declare function listAllEntries(apiClient: {
 }, branch: string): Promise<{
     entries: CollectionItem[];
     truncated: boolean;
+    collectionAccess: CollectionAccess[];
 }>;
 /**
  * Fetch a branch's schema and full entry list, and build the EditorEntry/

package/dist/editor/hooks/useEntriesData.js

@@ -32,6 +32,7 @@ export const entriesKey = (branch) => `canopy:entries:${branch}`;
  */
 export async function listAllEntries(apiClient, branch) {
     const byPath = new Map();
+    let collectionAccess = [];
     let cursor;
     for (let page = 0; page < MAX_ENTRY_PAGES; page++) {
         const result = await apiClient.entries.list({
@@ -44,12 +45,25 @@ export async function listAllEntries(apiClient, branch) {
         const data = result.data;
         for (const entry of data.entries)
             byPath.set(entry.logicalPath, entry);
+        collectionAccess = data.collectionAccess ?? collectionAccess;
         if (!data.pagination?.hasMore || !data.pagination.cursor) {
-            return { entries: [...byPath.values()], truncated: false };
+            return { entries: [...byPath.values()], truncated: false, collectionAccess };
         }
         cursor = data.pagination.cursor;
     }
-    return { entries: [...byPath.values()], truncated: true };
+    return { entries: [...byPath.values()], truncated: true, collectionAccess };
+}
+/** Marks each collection the listing says this user may not add an entry to. */
+function withAddAccess(collections, access) {
+    if (access.length === 0)
+        return collections;
+    const canAdd = new Map(access.map((a) => [a.logicalPath, a.canAddEntry]));
+    const mark = (c) => ({
+        ...c,
+        ...(canAdd.get(c.path) === false && { canAddEntry: false }),
+        ...(c.children && { children: c.children.map(mark) }),
+    });
+    return collections.map(mark);
 }
 /**
  * Fetch a branch's schema and full entry list, and build the EditorEntry/
@@ -68,9 +82,9 @@ export async function fetchEntriesAndSchema(apiClient, branch, params) {
     // Build editor collections from hydrated flatSchema
     // Dynamic import: lazy-load heavier editor config; only needed after API data arrives
     const { buildEditorCollections } = await import('../editor-config.js');
-    const collections = buildEditorCollections(hydratedFlatSchema);
     // Fetch ALL entries, following the pagination cursor
-    const { entries: allEntries, truncated } = await listAllEntries(apiClient, branch);
+    const { entries: allEntries, truncated, collectionAccess, } = await listAllEntries(apiClient, branch);
+    const collections = withAddAccess(buildEditorCollections(hydratedFlatSchema), collectionAccess);
     if (truncated) {
         console.warn(`Entry list truncated at ${MAX_ENTRY_PAGES * ENTRIES_PAGE_LIMIT} entries for branch "${branch}"`);
         notifications.show({

package/dist/editor/hooks/useEntryManager.d.ts

@@ -1,3 +1,4 @@
+import type { ApiErrorCode } from '../../api/types.js';
 import type { EditorEntry, EditorCollection } from '../Editor.js';
 import type { LogicalPath } from '../../paths/types.js';
 import type { FormValue } from '../FormRenderer.js';
@@ -12,8 +13,20 @@ export { listAllEntries } from './useEntriesData.js';
  */
 export declare class SaveApiError extends Error {
     readonly status: number;
+    /** The server's (or saveEntry's own) explanation, if any; `message` falls back to the status. */
+    readonly serverMessage?: string | undefined;
     readonly fieldErrors?: EntryFieldError[] | undefined;
-    constructor(status: number, serverMessage?: string, fieldErrors?: EntryFieldError[] | undefined);
+    readonly code?: ApiErrorCode | undefined;
+    constructor(status: number, 
+    /** The server's (or saveEntry's own) explanation, if any; `message` falls back to the status. */
+    serverMessage?: string | undefined, fieldErrors?: EntryFieldError[] | undefined, code?: ApiErrorCode | undefined);
+}
+/**
+ * Thrown by a read for editing when the API answers `SCHEMA_UNAVAILABLE`: the entry's type
+ * names a schema the running code lacks, so the entry cannot be opened until that changes.
+ */
+export declare class EntrySchemaUnavailableError extends Error {
+    constructor(serverMessage?: string);
 }
 export interface UseEntryManagerOptions {
     initialEntries: EditorEntry[];
@@ -26,6 +39,8 @@ export interface UseEntryManagerOptions {
 export interface UseEntryManagerReturn {
     selectedPath: string;
     setSelectedPath: (path: string) => void;
+    /** Leaves no entry open, as after deleting the open one, instead of opening the first. */
+    closeEntry: () => void;
     entries: EditorEntry[];
     setEntries: (entries: EditorEntry[]) => void;
     collections: EditorCollection[];
@@ -39,12 +54,21 @@ export interface UseEntryManagerReturn {
     availableSchemas: string[];
     /** True while the first entry load for the current branch is in flight (initial load, per branch). */
     entriesInitializing: boolean;
+    /** The branch's last entries fetch failed; its "Could not load content" toast offers Retry. */
+    entriesLoadFailed: boolean;
     navigatorOpen: boolean;
     setNavigatorOpen: (open: boolean) => void;
     refreshEntries: (branch?: string) => Promise<EditorEntry[]>;
+    /** `refreshEntries`, resolving to the collections it read too. */
+    refreshContent: (branch?: string) => Promise<{
+        entries: EditorEntry[];
+        collections: EditorCollection[];
+    }>;
     handleCreateEntry: (collectionPath: LogicalPath, entryTypeName?: string) => Promise<void>;
     renameEntry: (path: string, newSlug: string) => Promise<void>;
     loadEntry: (entry: EditorEntry) => Promise<FormValue>;
+    /** Reads an entry's server value without recording the OCC token that `loadEntry` records. */
+    readEntryValue: (entry: EditorEntry) => Promise<FormValue>;
     saveEntry: (entry: EditorEntry, value: FormValue) => Promise<FormValue>;
     /**
      * The OCC version token currently held for `contentId` ON THE BRANCH BEING
@@ -60,6 +84,20 @@ export interface UseEntryManagerReturn {
      * server's conflict check and revert whoever wrote that newer version).
      */
     getEntryVersion: (contentId: string) => number | undefined;
+    /** Holds `version` as the token for `contentId`, for a change the server made itself. */
+    adoptEntryVersion: (contentId: string, version: number) => void;
+    /**
+     * Opens an entry a save reported gone (`ENTRY_GONE`) at its new path, found by content ID,
+     * which a rename keeps. Undefined if deleted; the list is then not refreshed, which would close
+     * the form holding its unsaved changes.
+     */
+    followMovedEntry: (entry: EditorEntry) => Promise<EditorEntry | undefined>;
+    /**
+     * Creates `entry` again at its path from `value` (`expectedVersion: null`, so refused if the
+     * path is taken) and opens the new entry. An unanswered create counts as created when the list
+     * then shows it. Undefined when the list does not show it yet, or the branch changed.
+     */
+    recreateEntry: (entry: EditorEntry, value: FormValue) => Promise<EditorEntry | undefined>;
     collectionByPath: Map<LogicalPath, EditorCollection>;
     createModalOpen: boolean;
     createModalCollection: EditorCollection | null;
@@ -72,7 +110,8 @@ export interface UseEntryManagerReturn {
      * server's authoritative 409 guard.
      */
     createModalExistingSlugs: Set<string>;
-    handleCreateModalSubmit: (slug: string, entryTypeName: string) => Promise<void>;
+    /** `title` is written to the entry type's `titleField`, so the new entry opens already titled. */
+    handleCreateModalSubmit: (slug: string, entryTypeName: string, title?: string) => Promise<void>;
     closeCreateModal: () => void;
 }
 /**