@drawnagency/primitives 0.1.63 → 0.1.64

package/dist/components/shell/view-branch.d.ts

@@ -9,4 +9,30 @@ export type ViewBranch = "saved" | "live";
  *   `archived` — so edits to live content show alongside drafts.
  */
 export declare function isSectionVisibleInViewBranch(status: string, viewBranch: ViewBranch): boolean;
+/**
+ * Which sections to render in the editor's view mode.
+ *
+ * - Edit mode: the in-memory sections as-is (edit chrome handles them).
+ * - "Unpublished" (saved): the editor's CURRENT in-memory content — all edits
+ *   minus archived. It must NOT depend on a re-fetched branch: after a publish
+ *   the `saved` branch is deleted and `/api/content?branch=saved` falls back to
+ *   `main`, which would clobber unsaved edits (they'd flash then vanish).
+ * - "Published" (live): the deployed site — the fetched `main` branch filtered to
+ *   `status === "live"`, in page order. Renders nothing until the fetch resolves
+ *   so in-memory edits never flash as if they were published.
+ */
+export declare function computeDisplaySections<T extends {
+    section: {
+        id: string;
+    };
+    meta: {
+        status: string;
+    };
+}>(args: {
+    isEditMode: boolean;
+    viewBranch: ViewBranch;
+    sections: T[];
+    viewSections: T[] | null;
+    activePageSectionIds: string[];
+}): T[];
 //# sourceMappingURL=view-branch.d.ts.map

package/dist/components/shell/view-branch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"view-branch.d.ts","sourceRoot":"","sources":["../../../src/components/shell/view-branch.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;AAE1C;;;;;;;;GAQG;AACH,wBAAgB,4BAA4B,CAAC,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,GAAG,OAAO,CAE5F"}
+{"version":3,"file":"view-branch.d.ts","sourceRoot":"","sources":["../../../src/components/shell/view-branch.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;AAE1C;;;;;;;;GAQG;AACH,wBAAgB,4BAA4B,CAAC,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,GAAG,OAAO,CAE5F;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS;IAAE,OAAO,EAAE;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC;IAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,EAAE,IAAI,EAAE;IAC5G,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,UAAU,CAAC;IACvB,QAAQ,EAAE,CAAC,EAAE,CAAC;IACd,YAAY,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC;IACzB,oBAAoB,EAAE,MAAM,EAAE,CAAC;CAChC,GAAG,CAAC,EAAE,CAaN"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drawnagency/primitives",
-  "version": "0.1.63",
+  "version": "0.1.64",
   "type": "module",
   "exports": {
     "./package.json": "./package.json",

package/src/components/shell/EditorShell.tsx

@@ -69,7 +69,7 @@ import { Button } from "../shared/Button";
 import { SplitButton } from "../shared/SplitButton";
 import { IconButton } from "../shared/IconButton";
 import { SegmentedControl } from "../shared/SegmentedControl";
-import { isSectionVisibleInViewBranch } from "./view-branch";
+import { computeDisplaySections } from "./view-branch";
 import { SettingsIcon } from "../shared/icons";
 import { ImageIcon, ListOrderedIcon, FilesIcon, X } from "lucide-react";
 import { ErrorBoundary } from "../shared/ErrorBoundary";
@@ -1053,14 +1053,16 @@ function ViewBranchWatcher({
   const { isEditMode, viewBranch } = useEditorContext();
 
   useEffect(() => {
-    if (isEditMode) {
+    // Only "Published" (live) needs a fetch — it previews the deployed main
+    // branch. "Unpublished" (saved) renders the editor's in-memory edits, so no
+    // fetch (fetching `saved` would 404 after a publish and fall back to main,
+    // clobbering unsaved edits). Null viewSections routes to the in-memory path.
+    if (isEditMode || viewBranch !== "live") {
       setViewSections(null);
       return;
     }
 
-    const branch = viewBranch === "live" ? "main" : "saved";
-
-    fetch(`/api/content?branch=${branch}`)
+    fetch(`/api/content?branch=main`)
       .then((res) => res.json())
       .then((data) => {
         setViewSections(data.sections);
@@ -1216,15 +1218,16 @@ function EditorContent({
 
   const editingEnabled = isEditMode && !isPublishing;
 
-  // View mode: render the active page's sections from the fetched branch, in page
-  // order. "Published" (live) shows only status === "live"; "Unpublished" (saved)
-  // shows all in-progress edits except archived (see view-branch.ts). Edit mode:
-  // the active page's in-memory sections (the `sections` prop is already `activeSections`).
-  const displaySections = !isEditMode && viewSections !== null
-    ? activePageSectionIds
-        .map((id) => viewSections.find((s) => s.section.id === id))
-        .filter((s): s is LoadedSection => !!s && isSectionVisibleInViewBranch(s.meta.status, viewBranch))
-    : sections;
+  // "Published" (live) previews the deployed main branch (status === "live");
+  // "Unpublished" (saved) previews the editor's current in-memory edits (all
+  // statuses except archived) — see computeDisplaySections in view-branch.ts.
+  const displaySections = computeDisplaySections({
+    isEditMode,
+    viewBranch,
+    sections,
+    viewSections,
+    activePageSectionIds,
+  });
 
   useEffect(() => {
     return combine(

package/src/components/shell/view-branch.ts

@@ -12,3 +12,36 @@ export type ViewBranch = "saved" | "live";
 export function isSectionVisibleInViewBranch(status: string, viewBranch: ViewBranch): boolean {
   return viewBranch === "live" ? status === "live" : status !== "archived";
 }
+
+/**
+ * Which sections to render in the editor's view mode.
+ *
+ * - Edit mode: the in-memory sections as-is (edit chrome handles them).
+ * - "Unpublished" (saved): the editor's CURRENT in-memory content — all edits
+ *   minus archived. It must NOT depend on a re-fetched branch: after a publish
+ *   the `saved` branch is deleted and `/api/content?branch=saved` falls back to
+ *   `main`, which would clobber unsaved edits (they'd flash then vanish).
+ * - "Published" (live): the deployed site — the fetched `main` branch filtered to
+ *   `status === "live"`, in page order. Renders nothing until the fetch resolves
+ *   so in-memory edits never flash as if they were published.
+ */
+export function computeDisplaySections<T extends { section: { id: string }; meta: { status: string } }>(args: {
+  isEditMode: boolean;
+  viewBranch: ViewBranch;
+  sections: T[];
+  viewSections: T[] | null;
+  activePageSectionIds: string[];
+}): T[] {
+  const { isEditMode, viewBranch, sections, viewSections, activePageSectionIds } = args;
+
+  if (isEditMode) return sections;
+
+  if (viewBranch === "saved") {
+    return sections.filter((s) => isSectionVisibleInViewBranch(s.meta.status, "saved"));
+  }
+
+  if (viewSections === null) return [];
+  return activePageSectionIds
+    .map((id) => viewSections.find((s) => s.section.id === id))
+    .filter((s): s is T => !!s && isSectionVisibleInViewBranch(s.meta.status, "live"));
+}