canopycms 0.1.0 → 0.2.0-int.121

package/dist/editor/Editor.js

@@ -9,6 +9,8 @@ const noop = () => { };
 import { EntryNavigator } from './EntryNavigator.js';
 import { FormRenderer } from './FormRenderer.js';
 import { PreviewPane } from './PreviewPane.js';
+import { displayPreviewPath, previewPageKey } from './preview-path.js';
+import { showPreviewLinkOutcome } from './components/PreviewLinkToast.js';
 import { clientOperatingStrategy } from '../operating-mode/client.js';
 import { EditorShell } from './shell/EditorShell.js';
 import { PaneLayout } from './shell/PaneLayout.js';
@@ -23,7 +25,7 @@ import { SystemHealthPanel } from './admin/SystemHealthPanel.js';
 // Import directly from helpers to avoid server-only code in authorization barrel
 import { isAdmin, isPrivileged, isReviewer } from '../authorization/helpers.js';
 import { fieldBreadcrumb } from './field-breadcrumb.js';
-import { buildPreviewRoute, buildPreviewSrc, buildCollectionLabels, entryStatusLabel, entryTypeLabel, buildBreadcrumbSegments, } from './editor-utils.js';
+import { buildPreviewRoute, buildPreviewSrc, buildCollectionLabels, entryStatusLabel, entryTypeLabel, entryTypeLine, buildBreadcrumbSegments, entryNameSource, } from './editor-utils.js';
 import { useEditorLayout, useDraftManager, useEntryManager, useGroupManager, usePermissionManager, useCommentSystem, useBranchManager, useUserContext, useSchemaManager, } from './hooks/index.js';
 import { useBranchActions } from './hooks/useBranchActions.js';
 import { CONTENT_PANEL_WIDTH_MAX, CONTENT_PANEL_WIDTH_MIN, editorLayoutStorageKey, } from './hooks/useEditorLayout.js';
@@ -31,7 +33,7 @@ import { EntrySchemaUnavailableError } from './hooks/useEntryManager.js';
 import { useEntryLinkResolution } from './hooks/useEntryLinkResolution.js';
 import { useReferenceResolution } from './hooks/useReferenceResolution.js';
 import { usePreviewMarks } from './hooks/usePreviewMarks.js';
-import { BranchLockBanner, EditorHeader, EditorRail } from './components/index.js';
+import { BranchLockBanner, describeBranchLock, EditorHeader, EditorRail } from './components/index.js';
 import { showSaveAllResult } from './components/SaveAllResult.js';
 import { RenameEntryModal } from './components/RenameEntryModal.js';
 import { QuickOpenPalette } from './components/QuickOpenPalette.js';
@@ -52,7 +54,7 @@ import { hideCollectionOutcomeUnknown } from './hooks/useSchemaManager.js';
 import { AssetContextProvider, SiteMdxAllowContext, authenticatedAssetBase, useApiClient, } from './context/index.js';
 import { EntryLinkContext } from './fields/entry-link/index.js';
 import { MediaLibrary } from './media/MediaLibrary.js';
-import { removalAnchors, restoreRemoval, openThreadsWithin, restoredFieldPath, } from './undo-removal.js';
+import { removalAnchors, restoreRemoval, movedThreadsNote, openThreadsWithin, restoredFieldPath, } from './undo-removal.js';
 import { formatCanopyPath } from './canopy-path.js';
 import { itemKeysOnPath, resolveThreadPath, withItemKeys } from '../item-keys.js';
 import { ENTRY_NOT_LOADED_COMMENT_MESSAGE, NEW_ITEM_COMMENT_MESSAGE, } from './comments/item-anchor-copy.js';
@@ -122,7 +124,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
     const [deleteInProgress, setDeleteInProgress] = useState(false);
     // A rename or delete asked for from the top bar's entry menu, whose item is gone once it acts.
     const [entryChangeFromMenu, setEntryChangeFromMenu] = useState(false);
-    const allContentCrumbRef = useRef(null);
+    const contentToggleRef = useRef(null);
     // Draft compile/render error reported by the preview page (null = renders cleanly)
     const [previewError, setPreviewError] = useState(null);
     const apiClient = useApiClient();
@@ -140,12 +142,13 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
     const commentUserId = userContext?.userId ?? currentUser;
     // Below 64em (1024px) the editor starts stacked and the content panel never docks.
     const wideWindow = useMediaQuery('(min-width: 64em)', true, { getInitialValueInEffect: false }) !== false;
-    const { loaded: layoutLoaded, layout, setLayout, highlightEnabled, setHighlightEnabled, sideSplitPercent, stackedSplitPercent, setSplitPercent, previewWidth, setPreviewWidth, contentPanelOpen, setContentPanelOpen, contentPanelWidth, setContentPanelWidth, } = useEditorLayout({
+    const { loaded: layoutLoaded, layout, setLayout, highlightEnabled, setHighlightEnabled, sideSplitPercent, stackedSplitPercent, setSplitPercent, previewWidth, setPreviewWidth, siteChrome, setSiteChrome, contentPanelOpen, setContentPanelOpen, contentPanelWidth, setContentPanelWidth, } = useEditorLayout({
         storageKey: editorLayoutStorageKey(basePath),
         defaultLayout: wideWindow ? 'side' : 'stacked',
     });
-    // In the stacked layout the content panel lays over the form only, so the preview stays in view.
-    const contentPanelDocked = layout === 'side' && wideWindow;
+    // A wide window docks the content panel: beside the panes side by side, and beside the form row
+    // only when stacked, so the preview keeps its full width. A narrow one lays it over the form.
+    const contentPanelDocked = wideWindow;
     // Comments state (shared between useCommentSystem and useBranchManager)
     const [commentsForBranchSummaries, setCommentsForBranchSummaries] = useState([]);
     // 1. Branch manager (provides branchNameState, no dependencies)
@@ -154,7 +157,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
         labels: [],
     }));
     const applySubmitStampsRef = useRef(() => { });
-    const { branchName: branchNameState, setBranchName, branchSummaries, currentBranch, addCreatedBranch, handleSubmit, handleWithdraw, handleRequestChanges, handleDelete, handleReloadBranchData, loadBranches, } = useBranchManager({
+    const { branchName: branchNameState, setBranchName, branchSummaries, currentBranch, branchesLoadFailed, addCreatedBranch, handleSubmit, handleWithdraw, handleRequestChanges, handleDelete, handleReloadBranchData, loadBranches, } = useBranchManager({
         initialBranch: branchName,
         operatingMode,
         setBusy: setBranchesLoading,
@@ -175,6 +178,10 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
     // of unlocked that invites a click the server rejects -- and the pane shows a
     // loading state during that window anyway.
     const branchContentLocked = currentBranch?.writeBlocked ?? true;
+    const branchLoading = !currentBranch && (branchesLoading || branchSummaries.length === 0);
+    // A row's lock reason on an unanswered branch would be "details could not be loaded", which is
+    // not yet true; once the fetch has failed it is, and the lock says so.
+    const branchRowsPending = branchLoading && !branchesLoadFailed;
     // 2. Entry manager (depends on branchNameState, owns selectedPath)
     const { selectedPath, setSelectedPath, closeEntry, entries: entriesState, collections: collectionsFromApi, currentEntry, availableSchemas, entriesInitializing, entriesLoadFailed, navigatorOpen, setNavigatorOpen, refreshEntries, refreshContent, handleCreateEntry, renameEntry, loadEntry, readEntryValue, saveEntry, getEntryVersion, adoptEntryVersion, followMovedEntry, recreateEntry, createModalOpen, createModalCollection, createModalError, createModalCreating, createModalExistingSlugs, handleCreateModalSubmit, closeCreateModal, } = useEntryManager({
         initialEntries: entries,
@@ -188,6 +195,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
             contentRoot,
             basePath,
         }),
+        resolvePreviewRoute: (entry) => buildPreviewRoute(entry, { previewBaseByCollection, contentRoot }),
         setBusy: setEntriesLoading,
     });
     // The content overlay and a maximized preview hide the form; `navigatorOpen` is only the
@@ -203,9 +211,29 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
         setSelectedPath(path);
         setNavigatorOpen(false);
     };
+    // A preview link opens its entry, or a page no entry has in a new tab. The opener is cut by hand,
+    // since `noopener` would hide whether the browser blocked the tab.
+    const openPreviewLink = (href) => {
+        const mount = { basePath, previewPrefix };
+        const base = window.location.href;
+        const page = previewPageKey(href, mount, base);
+        const entry = page === undefined
+            ? undefined
+            : entriesState.find((e) => e.previewSrc && previewPageKey(e.previewSrc, mount, base) === page);
+        if (entry) {
+            openEntry(entry.path);
+            return;
+        }
+        const opened = window.open(href, '_blank');
+        if (opened)
+            opened.opener = null;
+        const url = new URL(href);
+        const shown = url.origin === window.location.origin ? `${url.pathname}${url.search}` : href;
+        showPreviewLinkOutcome(href, displayPreviewPath(shown, mount), Boolean(opened));
+    };
     // An open overlay docks open, as the URL's ask for no entry does at load; `navigatorOpen` is only
-    // the overlay's, so a docked panel never resurfaces as one. Waits for the stored layout, whose
-    // arrival could otherwise dock an overlay the stacked layout keeps.
+    // the overlay's, so a docked panel never resurfaces as one. Waits for the stored preferences, so
+    // the open state it sets lands on them, not on the defaults they replace.
     useEffect(() => {
         if (layoutLoaded && contentPanelDocked && navigatorOpen) {
             setContentPanelOpen(true);
@@ -305,7 +333,8 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
     contentReadOnlyRef.current = contentReadOnly;
     // Undo for a form Remove: a toast whose Undo puts the item back into the entry's draft as it
     // is then, through a functional update, so edits made since are kept. It acts only on the
-    // branch and entry it was raised for, and its toast closes when either changes.
+    // branch and entry it was raised for, and its toast closes when either changes. An object's
+    // Clear offers its Undo in the form instead (FormRenderer), which a save ends via `savedValue`.
     const loadedValuesRef = useRef(loadedValues);
     loadedValuesRef.current = loadedValues;
     const draftsRef = useRef(drafts);
@@ -332,7 +361,6 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
             ...removal,
             anchors: displayValue ? removalAnchors(fields, displayValue, removal) : undefined,
         };
-        const doing = removal.action === 'clear' ? 'clearing' : 'removing';
         // Open threads keyed inside what was removed leave their fields for the entry's thread list.
         const movedThreads = currentEntry
             ? openThreadsWithin(displayComments, currentEntry.path, removal.kind === 'list-item' ? [...removal.listPath, removal.index] : removal.path)
@@ -350,7 +378,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
             undoToastsRef.current.delete(id);
             if (!open) {
                 notifications.show({
-                    message: `Too late to undo ${doing} ${removal.label}.`,
+                    message: `Too late to undo removing ${removal.label}.`,
                     color: 'yellow',
                 });
                 return;
@@ -363,7 +391,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
             const now = draftsRef.current[contentId] ?? loadedValuesRef.current[contentId];
             if (!now || !restoreRemoval(fields, now, anchored)) {
                 notifications.show({
-                    message: `Couldn't undo ${doing} ${removal.label}: that part of the entry has changed. ${removal.action === 'clear' ? 'Fill it in again' : 'Add it again'} if you still need it.`,
+                    message: `Couldn't undo removing ${removal.label}: that part of the entry has changed. Add it again if you still need it.`,
                     color: 'yellow',
                 });
                 return;
@@ -385,9 +413,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
         undoToastsRef.current.set(id, contentId);
         const toast = {
             id,
-            message: (_jsx(UndoToastMessage, { label: removal.label, action: removal.action, note: movedThreads > 0
-                    ? `Its ${movedThreads === 1 ? 'comment thread' : `${movedThreads} comment threads`} moved to "Comment on this entry".`
-                    : undefined, onUndo: undo, onHold: () => notifications.update({ ...toast, autoClose: false }), onRelease: () => notifications.update(toast) })),
+            message: (_jsx(UndoToastMessage, { label: removal.label, note: movedThreadsNote(movedThreads), onUndo: undo, onHold: () => notifications.update({ ...toast, autoClose: false }), onRelease: () => notifications.update(toast) })),
             autoClose: getNotificationDuration(8000),
             withCloseButton: true,
             onClose: () => undoToastsRef.current.delete(id),
@@ -976,8 +1002,11 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
             list.push({
                 path: entry.path,
                 label: entry.label,
+                title: entry.title,
                 slug: entry.slug,
                 status: entryStatusLabel(activeCollections, entry),
+                missing: entry.status === 'missing' || undefined,
+                noPage: !entry.previewSrc || undefined,
                 contentId: entry.contentId,
                 readOnly: entry.canEdit === false || undefined,
                 conflictNotice: !!(entry.contentId && currentBranch?.conflictFiles?.includes(entry.contentId)),
@@ -1048,13 +1077,15 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
     const [contentPanelFocusRequest, setContentPanelFocusRequest] = useState(0);
     const openNavigator = () => {
         navigatorOpenerRef.current = rememberOpener();
-        // In the same commit as the overlay mounts, so its focus request meets no inert form panel.
+        // In the commit that opens the overlay, so the form panel is no longer inert when the overlay
+        // mounts, then or a frame later as its slide starts, and serves its focus request.
         if (!contentPanelDocked)
             setPreviewMaximized(false);
         setContentPanelShown(true);
         setContentPanelFocusRequest((request) => request + 1);
     };
-    // A collection crumb opens the panel as "All content" does, then its collection's row takes focus.
+    // A collection crumb opens the panel as the rail's Content button does, then its collection's row
+    // takes focus.
     const [collectionReveal, setCollectionReveal] = useState();
     // Only ever rises: the navigator serves each seq once, and the request is cleared once served.
     const revealSeqRef = useRef(0);
@@ -1084,9 +1115,10 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
         })
             .catch(console.error);
     };
-    // The entry menu's trigger stands in for its item; once the entry is deleted, "All content".
+    // The entry menu's trigger stands in for its item; once the entry is deleted, the rail's Content
+    // button, where another entry is found.
     const entryChangeReturnTarget = entryChangeFromMenu
-        ? () => navigatorToggleRef.current ?? allContentCrumbRef.current
+        ? () => navigatorToggleRef.current ?? contentToggleRef.current
         : undefined;
     const navigatorReturnTarget = () => returnTarget(navigatorOpenerRef.current, () => navigatorToggleRef.current);
     const branchReturnTarget = () => returnTarget(branchOpenerRef.current, () => branchToggleRef.current);
@@ -1145,11 +1177,23 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
         entries: entriesState.map((e) => ({
             contentId: e.contentId,
             label: e.label,
+            title: e.title,
             slug: e.slug,
             collectionPath: e.collectionPath,
             collectionName: e.collectionName,
         })),
     }), [entriesState]);
+    // Quick open names each entry's type and route under its label.
+    const quickOpenEntries = useMemo(() => entriesState.map((e) => ({
+        path: e.path,
+        label: e.label,
+        title: e.title,
+        slug: e.slug,
+        collectionPath: e.collectionPath,
+        collectionName: e.collectionName,
+        typeLabel: entryTypeLine(activeCollections, e),
+        route: buildPreviewRoute(e, { previewBaseByCollection, contentRoot }),
+    })), [entriesState, activeCollections, previewBaseByCollection, contentRoot]);
     const CenteredMessage = ({ children }) => (_jsx("div", { style: {
             display: 'flex',
             alignItems: 'center',
@@ -1162,11 +1206,15 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
         fields: schema,
         data: displayValue,
     });
-    // Only the default preview has the toolbar that maximizes and restores it. With no value to
-    // preview (an entry loading, or failed to load, with no draft) the form shows instead, and the
-    // choice reapplies once a value arrives.
+    // Only the default preview has the toolbar that maximizes and restores it. It stays maximized
+    // while an entry loads. With no value after a failed load and no draft, the form shows instead,
+    // and the choice reapplies once a value arrives.
     const previewCanMaximize = !renderPreview && Boolean(currentEntry?.previewSrc) && !currentEntryUnavailable;
-    const previewShownMaximized = previewMaximized && previewCanMaximize && Boolean(previewFrameData);
+    // The open entry's data is loading, not failed: the preview keeps its last page, dimmed.
+    const previewPending = previewCanMaximize &&
+        !previewFrameData &&
+        loadFailedKey !== `${branchNameState}:${currentEntry?.contentId}`;
+    const previewShownMaximized = previewMaximized && previewCanMaximize && (Boolean(previewFrameData) || previewPending);
     useEffect(() => {
         if (!previewCanMaximize)
             setPreviewMaximized(false);
@@ -1176,8 +1224,9 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
         ? fieldBreadcrumb(schema, displayValue, previewError.fieldPath).join(' › ')
         : '';
     // An unavailable entry previews nothing: the site cannot read it, and a stored draft would
-    // otherwise mount the frame at a page that answers not-found.
-    const defaultPreview = currentEntry?.previewSrc && previewFrameData && !currentEntryUnavailable ? (_jsx(PreviewPane, { src: currentEntry.previewSrc, data: previewFrameData, isLoading: previewLoadingState, highlightEnabled: highlightEnabled, onPreviewError: setPreviewError, onMarks: onPreviewMarks, assetBase: authenticatedAssetBase(basePath), mount: { basePath, previewPrefix }, previewWidth: previewWidth, onPreviewWidthChange: setPreviewWidth, onHighlightToggle: () => {
+    // otherwise mount the frame at a page that answers not-found. The pane stays mounted while an
+    // entry loads, so its toolbar never leaves on a switch.
+    const defaultPreview = currentEntry?.previewSrc && (previewFrameData || previewPending) && !currentEntryUnavailable ? (_jsx(PreviewPane, { src: currentEntry.previewSrc, pending: previewPending, data: previewFrameData, isLoading: previewLoadingState, highlightEnabled: highlightEnabled, onPreviewError: setPreviewError, onMarks: onPreviewMarks, assetBase: authenticatedAssetBase(basePath), mount: { basePath, previewPrefix }, previewWidth: previewWidth, onPreviewWidthChange: setPreviewWidth, onHighlightToggle: () => {
             setHighlightEnabled(!highlightEnabled);
             clearPreviewMarks();
         }, marksNothing: previewMarksNothing, inexactMarks: previewInexactMarks, showMarkDiagnostics: userIsAdmin, layout: layout, maximized: previewShownMaximized, onMaximizedChange: (maximized) => {
@@ -1185,7 +1234,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
             if (maximized && !contentPanelDocked)
                 setNavigatorOpen(false);
             setPreviewMaximized(maximized);
-        }, resizing: paneResizing, notice: previewError && (_jsx(Alert, { color: "red", title: "Preview error", withCloseButton: true, onClose: () => setPreviewError(null), radius: 0, children: previewErrorField
+        }, resizing: paneResizing, siteChrome: siteChrome, onSiteChromeChange: setSiteChrome, onNavigate: openPreviewLink, notice: previewError && (_jsx(Alert, { color: "red", title: "Preview error", withCloseButton: true, onClose: () => setPreviewError(null), radius: 0, children: previewErrorField
                 ? `${previewErrorField}: ${previewError.message}`
                 : previewError.message })) })) : (_jsx(Paper, { withBorder: true, shadow: "xs", h: "100%", bg: "var(--mantine-color-body)", style: {
             display: 'flex',
@@ -1237,10 +1286,19 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
                     : entriesState.map((e) => ({
                         path: e.path,
                         label: e.label,
+                        title: e.title,
                         slug: e.slug,
                         status: entryStatusLabel(activeCollections, e),
+                        missing: e.status === 'missing' || undefined,
+                        noPage: !e.previewSrc || undefined,
                         readOnly: e.canEdit === false || undefined,
-                    })), selectedPath: selectedPath, onSelect: openEntry, onTreeControllerReady: handleTreeControllerReady, expandedStateRef: treeExpandedStateRef, onExpandedStateChange: handleExpandedStateChange, onDeleteEntry: handleDeleteEntry, onRenameEntry: handleRenameEntry, onReorderEntry: userIsAdmin ? handleReorderEntry : undefined, hiddenRootPath: hiddenRootPath, loading: entriesInitializing, readOnly: branchContentLocked, dirtyPaths: dirtyPaths, revealCollection: collectionReveal, onRevealed: () => setCollectionReveal(undefined) }) }) }));
+                    })), selectedPath: selectedPath, onSelect: openEntry, onTreeControllerReady: handleTreeControllerReady, expandedStateRef: treeExpandedStateRef, onExpandedStateChange: handleExpandedStateChange, onDeleteEntry: handleDeleteEntry, onRenameEntry: handleRenameEntry, onReorderEntry: userIsAdmin ? handleReorderEntry : undefined, hiddenRootPath: hiddenRootPath, loading: entriesInitializing, readOnly: branchContentLocked, readOnlyReason: branchRowsPending
+                    ? undefined
+                    : describeBranchLock({
+                        branchStatus: currentBranch?.status,
+                        branchReadOnly: currentBranch?.readOnly,
+                        branchWriteBlocked: branchContentLocked,
+                    }), dirtyPaths: dirtyPaths, revealCollection: collectionReveal, onRevealed: () => setCollectionReveal(undefined) }) }) }));
     return (_jsx(CanopyCMSProvider, { ...(themeOptions ?? {}), children: _jsx(AssetContextProvider, { basePath: basePath, children: _jsx(EditorShell, { topBar: _jsx(EditorHeader, { currentEntry: currentEntry, branchName: branchNameState, operatingMode: operatingMode, branchStatus: currentBranch?.status, busy: busy, breadcrumbSegments: breadcrumbSegments, editedFiles: editedFiles, modifiedCount: modifiedCount, 
                     // A draft kept for an unavailable entry stays in storage but cannot be saved.
                     hasUnsavedChanges: !currentEntryUnavailable && !contentReadOnly && isSelectedDirty(), entryHasDraft: isSelectedDirty(), entryReadOnly: currentEntry?.canEdit === false, draftStorageFailed: draftStorageFailed, userContext: userContext, branchCreatedBy: currentBranch?.createdBy, branchAccess: currentBranch?.access, 
@@ -1253,7 +1311,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
                     // fail-closed computation of "are writes blocked" in this component.
                     branchIsProtected: currentBranch?.isProtected ?? true, branchReadOnly: currentBranch?.readOnly, branchWriteBlocked: branchContentLocked, 
                     // A failed fetch leaves the list empty too; the banner says that one.
-                    branchLoading: !currentBranch && (branchesLoading || branchSummaries.length === 0), onNavigatorOpen: openNavigator, onCollectionOpen: revealCollection, navigatorToggleRef: navigatorToggleRef, branchToggleRef: branchToggleRef, onFileReload: () => handleReload(() => navigatorToggleRef.current), onFileDiscardDraft: () => handleDiscardFileDraft(() => navigatorToggleRef.current), onEntryRename: () => currentEntry && handleRenameEntry(currentEntry.path, true), onEntryDelete: () => currentEntry && handleDeleteEntry(currentEntry.path, true), allContentRef: allContentCrumbRef, entryUnavailable: currentEntryUnavailable, onEntrySelect: openEntry, onBranchReloadData: () => {
+                    branchLoading: branchLoading, onCollectionOpen: revealCollection, navigatorToggleRef: navigatorToggleRef, branchToggleRef: branchToggleRef, onFileReload: () => handleReload(() => navigatorToggleRef.current), onFileDiscardDraft: () => handleDiscardFileDraft(() => navigatorToggleRef.current), onEntryRename: () => currentEntry && handleRenameEntry(currentEntry.path, true), onEntryDelete: () => currentEntry && handleDeleteEntry(currentEntry.path, true), entryUnavailable: currentEntryUnavailable, onEntrySelect: openEntry, onBranchReloadData: () => {
                         void Promise.all([handleReloadBranchData(), refreshEntries(branchNameState)]).catch(console.error);
                     }, onBranchDiscardDrafts: () => handleDiscardDrafts(() => branchToggleRef.current), onBranchManagerOpen: openBranchManager, onSave: currentEntryUnavailable ? noop : handleSave, onSaveAll: runSaveAll, saveAllProgress: saveAllProgress, saving: singleSaving?.branch === branchNameState &&
                         singleSaving.contentId === currentEntry?.contentId, savedSignal: lastSaved?.seq, savedHere: lastSaved?.branch === branchNameState &&
@@ -1267,14 +1325,10 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
                         if (branchNameState && !isSaveAllRunning()) {
                             handleWithdraw(branchNameState).catch(console.error);
                         }
-                    } }), banner: _jsx(BranchLockBanner, { branchName: branchNameState, branchStatus: currentBranch?.status, branchReadOnly: currentBranch?.readOnly, branchWriteBlocked: branchContentLocked, onBranchManagerOpen: openBranchManager }), rail: _jsx(EditorRail, { siteTitle: siteTitle, onHomeOpen: () => {
-                        const first = entriesState[0];
-                        if (first)
-                            openEntry(first.path);
-                    }, contentPanelOpen: contentPanelShown, contentPanelId: CONTENT_PANEL_ID, onContentToggle: () => contentPanelShown ? setContentPanelShown(false) : openNavigator(), onQuickOpen: openQuickOpen, quickOpenShortcut: quickOpenShortcut, quickOpenKeys: quickOpenKeys, branchesOpen: branchManagerOpen, onBranchesOpen: openBranchManager, onCommentsOpen: clientOperatingStrategy(operatingMode ?? 'prod').supportsComments() &&
+                    } }), banner: _jsx(BranchLockBanner, { branchName: branchNameState, branchStatus: currentBranch?.status, branchReadOnly: currentBranch?.readOnly, branchWriteBlocked: branchContentLocked, onBranchManagerOpen: openBranchManager }), rail: _jsx(EditorRail, { contentPanelOpen: contentPanelShown, contentPanelId: CONTENT_PANEL_ID, onContentToggle: () => contentPanelShown ? setContentPanelShown(false) : openNavigator(), contentToggleRef: contentToggleRef, onQuickOpen: openQuickOpen, quickOpenShortcut: quickOpenShortcut, quickOpenKeys: quickOpenKeys, branchesOpen: branchManagerOpen, onBranchesOpen: openBranchManager, onCommentsOpen: clientOperatingStrategy(operatingMode ?? 'prod').supportsComments() &&
                         branchNameState
                         ? () => setCommentsPanelOpen(true)
-                        : undefined, commentsOpen: commentsPanelOpen, unresolvedCommentCount: comments.filter((t) => !t.resolved).length, mediaLibraryOpen: mediaLibraryOpen, onMediaLibraryOpen: () => setMediaLibraryOpen(true), mediaButtonRef: mediaButtonRef, layout: layout, onLayoutChange: setLayout, layoutBlocked: previewShownMaximized, onPermissionManagerOpen: userIsAdmin ? () => setPermissionManagerOpen(true) : undefined, onGroupManagerOpen: userIsAdmin ? () => setGroupManagerOpen(true) : undefined, onSystemHealthOpen: userIsAdmin ? () => setSystemHealthOpen(true) : undefined, settingsToggleRef: settingsToggleRef, AccountComponent: AccountComponent, onAccountClick: onAccountClick, onLogoutClick: onLogoutClick }), panel: contentPanelDocked ? contentPanel : undefined, main: _jsx(Box, { h: "100%", children: _jsx(PaneLayout, { formOverlay: contentPanelDocked ? undefined : contentPanel, formInert: contentOverlayShown, previewMaximized: previewShownMaximized, 
+                        : undefined, commentsOpen: commentsPanelOpen, unresolvedCommentCount: comments.filter((t) => !t.resolved).length, mediaLibraryOpen: mediaLibraryOpen, onMediaLibraryOpen: () => setMediaLibraryOpen(true), mediaButtonRef: mediaButtonRef, layout: layout, onLayoutChange: setLayout, layoutBlocked: previewShownMaximized, onPermissionManagerOpen: userIsAdmin ? () => setPermissionManagerOpen(true) : undefined, onGroupManagerOpen: userIsAdmin ? () => setGroupManagerOpen(true) : undefined, onSystemHealthOpen: userIsAdmin ? () => setSystemHealthOpen(true) : undefined, settingsToggleRef: settingsToggleRef, AccountComponent: AccountComponent, onAccountClick: onAccountClick, onLogoutClick: onLogoutClick }), panel: contentPanelDocked && layout === 'side' ? contentPanel : undefined, main: _jsx(Box, { h: "100%", children: _jsx(PaneLayout, { formAside: contentPanelDocked && layout === 'stacked' ? contentPanel : undefined, formOverlay: contentPanelDocked ? undefined : contentPanel, formInert: contentOverlayShown, previewMaximized: previewShownMaximized, 
                         // Sizing the pane, by pointer or key, gives the page the pane's width.
                         onSeparatorDrag: (dragging) => {
                             setPaneResizing(dragging);
@@ -1294,7 +1348,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
                                         // A hidden draft's discard changes nothing on screen, so it says so.
                                         onDiscard: () => handleDiscardFileDraft(() => navigatorToggleRef.current, {
                                             announce: true,
-                                        }) })), fields: schema, value: displayValue, readOnly: contentReadOnly, onRemoved: handleFieldRemoved, commentBlockedReason: commentBlockedReason, removedItemFieldLabel: commentFieldLabel, onGetUserMetadata: getCommentUserMetadata, header: {
+                                        }) })), fields: schema, value: displayValue, readOnly: contentReadOnly, onRemoved: handleFieldRemoved, savedValue: loadedValue, commentBlockedReason: commentBlockedReason, removedItemFieldLabel: commentFieldLabel, onGetUserMetadata: getCommentUserMetadata, header: {
                                         title: currentEntry.label,
                                         typeLabel: entryTypeLabel(activeCollections, currentEntry),
                                     }, 
@@ -1311,7 +1365,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
                                         currentBranch?.conflictFiles?.includes(currentEntry.contentId)) }) }) })) : schema.length === 0 ? (_jsx(CenteredMessage, { children: "No fields to edit." })) : loadFailedKey !== `${branchNameState}:${currentEntry.contentId}` ? (_jsx(Stack, { gap: "lg", p: "md", "data-testid": "entry-loading-skeleton", children: [0, 1, 2].map((row) => (_jsxs(Stack, { gap: 6, children: [_jsx(Skeleton, { h: 12, w: 120 }), _jsx(Skeleton, { h: 36 })] }, row))) })) : (_jsx(Alert, { color: "red", variant: "light", m: "md", title: "This entry couldn't be loaded.", "data-testid": "entry-load-failed", children: _jsx(Button, { variant: "default", onClick: () => {
                                     setLoadFailedKey(null);
                                     setLoadAttempt((attempt) => attempt + 1);
-                                }, children: "Retry" }) })) }) }), overlays: _jsxs(_Fragment, { children: [_jsx(QuickOpenPalette, { opened: quickOpenOpen, onOpen: openQuickOpen, onClose: () => setQuickOpenOpen(false), returnFocusTo: quickOpenFromOverlay ? navigatorReturnTarget : undefined, entries: entriesState, 
+                                }, children: "Retry" }) })) }) }), overlays: _jsxs(_Fragment, { children: [_jsx(QuickOpenPalette, { opened: quickOpenOpen, onOpen: openQuickOpen, onClose: () => setQuickOpenOpen(false), returnFocusTo: quickOpenFromOverlay ? navigatorReturnTarget : undefined, entries: quickOpenEntries, 
                             // The hidden root's entries sit at the top of the tree, so they get no heading here either.
                             collectionLabel: (path) => path === hiddenRootPath ? '' : collectionLabels.get(path), onSelect: setSelectedPath }), _jsx(BranchesDrawer, { opened: branchManagerOpen, onClose: () => setBranchManagerOpen(false), confirmOpen: branchConfirmOpen, returnFocusTo: branchReturnTarget, children: _jsx(BranchManager, { branches: branchSummaries, mode: operatingMode, user: userContext, currentBranchName: currentBranch?.name ?? branchNameState, currentWorkflowBlockedReason: saveAllProgress ? 'Wait for Save all to finish.' : undefined, onSelect: async (name) => {
                                     try {
@@ -1343,7 +1397,7 @@ const EditorContent = ({ entries, title, siteTitle = title, branchName = '', col
                                 : undefined, onRemoveEntryType: editingCollection ? (path, name) => removeEntryType(path, name) : undefined, onReloadEntryTypes: editingCollection ? readEntryTypes : undefined, onClose: handleCloseCollectionEditor, isSaving: schemaLoading, error: collectionEditorError, restored: restoredCollectionInput, onDiscardRestored: () => {
                                 collectionDraftRef.current = null;
                                 setRestoredCollectionInput(null);
-                            } })), renamingEntry && (_jsx(RenameEntryModal, { isOpen: renameModalOpen, entryLabel: renamingEntry.label, currentSlug: renamingEntry.slug || '', onSave: handleRenameSubmit, 
+                            } })), renamingEntry && (_jsx(RenameEntryModal, { isOpen: renameModalOpen, entryLabel: renamingEntry.label, nameSource: entryNameSource(activeCollections, renamingEntry, entryValue(renamingEntry)), hasPage: !!renamingEntry.previewSrc, currentSlug: renamingEntry.slug || '', onSave: handleRenameSubmit, 
                             // `renamingEntry` stays until the next rename, so the dialog plays its exit and
                             // returns focus.
                             onClose: () => {

package/dist/editor/EntryNavigator.d.ts

@@ -5,9 +5,16 @@ type TreeController = ReturnType<typeof useTree>;
 export interface EntryNavItem {
     path: LogicalPath;
     label: string;
+    /** The entry's title, matched by the filter where the label is a singleton's type label. */
+    title?: string;
     /** Matched by the filter; the last segment of `path` when absent. */
     slug?: string;
+    /** The row's second line: the entry's type, or "Missing" (`entryStatusLabel`). */
     status?: string;
+    /** The entry's file is gone: its second line is error text. */
+    missing?: boolean;
+    /** The entry has no page on the site, so its menu changes its slug rather than its URL. */
+    noPage?: boolean;
     collectionPath?: LogicalPath;
     contentId?: ContentId;
     /** True when this entry's file conflicted during rebase */
@@ -46,7 +53,7 @@ export interface EntryNavigatorProps {
     onExpandedStateChange?: (state: Record<string, boolean>) => void;
     /** Called when user requests to delete an entry */
     onDeleteEntry?: (path: LogicalPath) => void;
-    /** Called when user requests to rename an entry */
+    /** Called when the user asks to change an entry's URL (its slug) */
     onRenameEntry?: (path: LogicalPath) => void;
     /** Called when user reorders an entry within a collection */
     onReorderEntry?: (collectionPath: LogicalPath, contentId: string, direction: 'up' | 'down') => void;
@@ -55,12 +62,17 @@ export interface EntryNavigatorProps {
     /** When true and the tree is empty, show a loading indicator instead of "No content" */
     loading?: boolean;
     /**
-     * When true, hides all entry/collection mutation affordances (create,
-     * rename, delete, reorder, add/edit collection) -- selection/navigation
-     * stays enabled. Set on a read-only protected base branch, where writes
-     * would only 403 after the fact. Default false.
+     * When true, replaces each row's mutation menu (create, rename, delete, reorder, add/edit
+     * collection) with a lock -- selection/navigation stays enabled. Set on a branch that takes no
+     * writes, where they would only 403 after the fact. An entry the user may not edit keeps its own
+     * lock and gets none here. Default false.
      */
     readOnly?: boolean;
+    /**
+     * Why the branch takes no writes (`describeBranchLock`), the tooltip of each row's lock. While
+     * readOnly without one, the lock's slot stays empty.
+     */
+    readOnlyReason?: string;
     /** Entry paths with unsaved changes; each shows a dot, and so does every collection holding one. */
     dirtyPaths?: ReadonlySet<string>;
     /**