From d4e365e5b5212fd6af3bb4a46287cb0e238a78b7 Mon Sep 17 00:00:00 2001
From: WangEn <WangEn@users.noreply.github.com>
Date: Fri, 18 Sep 2026 11:38:56 +0800
Subject: [PATCH 1/8] feat: route workspace sections by URL

---
 apps/web/src/App.tsx | 56 ++++++++++++++++++++++++++++++++++----------
 1 file changed, 44 insertions(+), 12 deletions(-)

diff --git a/apps/web/src/App.tsx b/apps/web/src/App.tsx
index 28824a6..986c011 100644
--- a/apps/web/src/App.tsx
+++ b/apps/web/src/App.tsx
@@ -52,6 +52,31 @@ const sourceLabel: Record<CommandResult["source"], string> = {
 
 type View = "launcher" | "workspaces" | "sessions" | "bookmarks" | "search" | "transfer" | "extension";
 
+const viewPaths: Record<View, string> = {
+  launcher: "/app",
+  workspaces: "/app/workspaces",
+  sessions: "/app/sessions",
+  bookmarks: "/app/bookmarks",
+  search: "/app/search",
+  transfer: "/app/transfer",
+  extension: "/app/extension",
+};
+
+function viewFromPath(pathname: string): View {
+  for (const [view, path] of Object.entries(viewPaths) as Array<[View, string]>) {
+    if (view === "launcher") continue;
+    if (pathname === path || pathname.startsWith(`${path}/`)) return view;
+  }
+  return "launcher";
+}
+
+function navigateView(view: View) {
+  const path = viewPaths[view];
+  if (window.location.pathname === path) return;
+  window.history.pushState({}, "", path);
+  window.dispatchEvent(new PopStateEvent("popstate"));
+}
+
 function openUrls(urls: string[]) {
   for (const url of urls) {
     const opened = window.open(url, "_blank", "noopener,noreferrer");
@@ -72,7 +97,7 @@ function collectionResultId(id: string) {
 }
 
 export function App() {
-  const [view, setView] = useState<View>("launcher");
+  const [view, setView] = useState<View>(() => viewFromPath(window.location.pathname));
   const [query, setQuery] = useState("");
   const [selectedIndex, setSelectedIndex] = useState(0);
   const [bookmarks, setBookmarks] = useState<Bookmark[]>([]);
@@ -146,6 +171,12 @@ export function App() {
     void refresh();
   }, [refresh]);
 
+  useEffect(() => {
+    const onPopState = () => setView(viewFromPath(window.location.pathname));
+    window.addEventListener("popstate", onPopState);
+    return () => window.removeEventListener("popstate", onPopState);
+  }, []);
+
   useEffect(() => {
     const unsubscribe = onBridgeEvent((event) => {
       if (event === "ready" || event === "tabs-changed") void refreshBridge();
@@ -161,6 +192,7 @@ export function App() {
 
   useEffect(() => {
     const focusLauncher = () => {
+      navigateView("launcher");
       setView("launcher");
       void refreshBridge();
       requestAnimationFrame(() => commandInputRef.current?.focus());
@@ -361,7 +393,7 @@ export function App() {
     }
 
     if (item.source === "navigation" && item.id === "navigation:extension") {
-      setView("extension");
+      navigateView("extension");
       return;
     }
 
@@ -493,18 +525,18 @@ export function App() {
   return (
     <main className="shell">
       <header className="topbar">
-        <button className="brand brand-button" type="button" onClick={() => setView("launcher")} aria-label="Dockmark home">
+        <button className="brand brand-button" type="button" onClick={() => navigateView("launcher")} aria-label="Dockmark home">
           <span className="brand-mark">D·</span>
           <span>Dockmark</span>
         </button>
         <nav className="workspace-section-nav" aria-label="Workspace sections">
-          <button className={`ghost ${view === "launcher" ? "active" : ""}`} type="button" aria-current={view === "launcher" ? "page" : undefined} onClick={() => setView("launcher")}>Launcher</button>
-          <button className={`ghost ${view === "workspaces" ? "active" : ""}`} type="button" aria-current={view === "workspaces" ? "page" : undefined} onClick={() => setView("workspaces")}>Workspaces</button>
-          <button className={`ghost ${view === "sessions" ? "active" : ""}`} type="button" aria-current={view === "sessions" ? "page" : undefined} onClick={() => setView("sessions")}>Sessions</button>
-          <button className={`ghost ${view === "bookmarks" ? "active" : ""}`} type="button" aria-current={view === "bookmarks" ? "page" : undefined} onClick={() => setView("bookmarks")}>Bookmarks</button>
-          <button className={`ghost ${view === "search" ? "active" : ""}`} type="button" aria-current={view === "search" ? "page" : undefined} onClick={() => setView("search")}>Search</button>
-          <button className={`ghost ${view === "transfer" ? "active" : ""}`} type="button" aria-current={view === "transfer" ? "page" : undefined} onClick={() => setView("transfer")}>Transfer</button>
-          <button className={`ghost ${view === "extension" ? "active" : ""}`} type="button" aria-current={view === "extension" ? "page" : undefined} onClick={() => setView("extension")}>Extension</button>
+          <button className={`ghost ${view === "launcher" ? "active" : ""}`} type="button" aria-current={view === "launcher" ? "page" : undefined} onClick={() => navigateView("launcher")}>Launcher</button>
+          <button className={`ghost ${view === "workspaces" ? "active" : ""}`} type="button" aria-current={view === "workspaces" ? "page" : undefined} onClick={() => navigateView("workspaces")}>Workspaces</button>
+          <button className={`ghost ${view === "sessions" ? "active" : ""}`} type="button" aria-current={view === "sessions" ? "page" : undefined} onClick={() => navigateView("sessions")}>Sessions</button>
+          <button className={`ghost ${view === "bookmarks" ? "active" : ""}`} type="button" aria-current={view === "bookmarks" ? "page" : undefined} onClick={() => navigateView("bookmarks")}>Bookmarks</button>
+          <button className={`ghost ${view === "search" ? "active" : ""}`} type="button" aria-current={view === "search" ? "page" : undefined} onClick={() => navigateView("search")}>Search</button>
+          <button className={`ghost ${view === "transfer" ? "active" : ""}`} type="button" aria-current={view === "transfer" ? "page" : undefined} onClick={() => navigateView("transfer")}>Transfer</button>
+          <button className={`ghost ${view === "extension" ? "active" : ""}`} type="button" aria-current={view === "extension" ? "page" : undefined} onClick={() => navigateView("extension")}>Extension</button>
         </nav>
       </header>
 
@@ -530,7 +562,7 @@ export function App() {
       ) : view === "search" ? (
         <SearchEngineManager engines={searchEngines} loading={loading} onChanged={refresh} />
       ) : view === "transfer" ? (
-        <TransferManager bookmarks={bookmarks} categories={categories} onChanged={refresh} onOpenExtension={() => setView("extension")} />
+        <TransferManager bookmarks={bookmarks} categories={categories} onChanged={refresh} onOpenExtension={() => navigateView("extension")} />
       ) : view === "extension" ? (
         <BrowserExtensionManager />
       ) : (
@@ -603,7 +635,7 @@ export function App() {
           </section>
 
           {!bridgeConnected && (
-            <button className="extension-nudge" type="button" onClick={() => setView("extension")}>
+            <button className="extension-nudge" type="button" onClick={() => navigateView("extension")}>
               <span className="extension-nudge-copy">
                 <strong>Unlock browser integration</strong>
                 <span>Install Dockmark Extension for open tabs, pinned Session restore and native bookmark import.</span>

From c0591054e061ffd75ade32e028fb45b240b7e7c3 Mon Sep 17 00:00:00 2001
From: WangEn <WangEn@users.noreply.github.com>
Date: Fri, 18 Sep 2026 11:38:59 +0800
Subject: [PATCH 2/8] feat: keep workspace utility state active on subroutes

---
 apps/web/src/PrivateRoot.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/apps/web/src/PrivateRoot.tsx b/apps/web/src/PrivateRoot.tsx
index 98ca6b4..c4085fa 100644
--- a/apps/web/src/PrivateRoot.tsx
+++ b/apps/web/src/PrivateRoot.tsx
@@ -21,6 +21,14 @@ function navigate(path: string) {
   window.dispatchEvent(new PopStateEvent("popstate"));
 }
 
+function isWorkspacePath(pathname: string) {
+  return pathname.startsWith("/app") &&
+    !pathname.startsWith("/app/settings") &&
+    !pathname.startsWith("/app/inbox") &&
+    !pathname.startsWith("/app/collections") &&
+    !pathname.startsWith("/app/duplicates");
+}
+
 function PrivateNavigation({ children, onLogout }: { children: ReactNode; onLogout: () => Promise<void> }) {
   const [path, setPath] = useState(window.location.pathname);
   const [inboxCount, setInboxCount] = useState<number | null>(null);
@@ -69,7 +77,7 @@ function PrivateNavigation({ children, onLogout }: { children: ReactNode; onLogo
       <div className="private-utility-bar">
         <a href="/" className="private-utility-brand"><span>D·</span> Public page</a>
         <nav>
-          <button className={path === "/app" ? "active" : ""} type="button" onClick={() => navigate("/app")}>Workspace</button>
+          <button className={isWorkspacePath(path) ? "active" : ""} type="button" onClick={() => navigate("/app")}>Workspace</button>
           <button
             className={`${path.startsWith("/app/inbox") ? "active " : ""}private-inbox-nav`}
             type="button"

From b0a7a6acc38542709e921c3460ddbf03b7c7d463 Mon Sep 17 00:00:00 2001
From: WangEn <WangEn@users.noreply.github.com>
Date: Fri, 18 Sep 2026 11:40:01 +0800
Subject: [PATCH 3/8] feat: add filtered bulk public bookmark publishing

---
 apps/web/src/PublicPageSettings.tsx | 227 +++++++++++++++++++++++++---
 1 file changed, 202 insertions(+), 25 deletions(-)

diff --git a/apps/web/src/PublicPageSettings.tsx b/apps/web/src/PublicPageSettings.tsx
index 2495562..dbf2d1d 100644
--- a/apps/web/src/PublicPageSettings.tsx
+++ b/apps/web/src/PublicPageSettings.tsx
@@ -1,5 +1,6 @@
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 import type { Bookmark, Category } from "@dockmark/core";
+import { textMatchesQuery } from "./bookmark-search";
 import { reorderBookmarks, reorderCategories } from "./reorder-api";
 
 interface Props {
@@ -8,6 +9,8 @@ interface Props {
   onChanged: () => Promise<void>;
 }
 
+type PublicationFilter = "all" | "published" | "unpublished";
+
 async function loadSelection() {
   const response = await fetch("/api/public/bookmarks/selection", { cache: "no-store" });
   const payload = await response.json().catch(() => ({})) as { bookmarkIds?: string[]; error?: { message?: string } };
@@ -37,8 +40,14 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
   const [published, setPublishedIds] = useState<Set<string>>(() => new Set());
   const [loading, setLoading] = useState(true);
   const [busyId, setBusyId] = useState<string | null>(null);
+  const [batchBusy, setBatchBusy] = useState<"publish" | "unpublish" | null>(null);
   const [sorting, setSorting] = useState(false);
+  const [query, setQuery] = useState("");
+  const [filter, setFilter] = useState<PublicationFilter>("all");
+  const [selectedIds, setSelectedIds] = useState<Set<string>>(() => new Set());
   const [error, setError] = useState<string | null>(null);
+  const [notice, setNotice] = useState<string | null>(null);
+  const selectVisibleRef = useRef<HTMLInputElement>(null);
 
   useEffect(() => {
     let cancelled = false;
@@ -57,6 +66,16 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
     };
   }, []);
 
+  useEffect(() => {
+    const activeIds = new Set(bookmarks.map((bookmark) => bookmark.id));
+    setSelectedIds((current) => new Set([...current].filter((id) => activeIds.has(id))));
+  }, [bookmarks]);
+
+  const categoryNameById = useMemo(
+    () => new Map(categories.map((category) => [category.id, category.name])),
+    [categories],
+  );
+
   const bookmarksByCategory = useMemo(() => {
     const map = new Map<string, Bookmark[]>();
     for (const bookmark of bookmarks) {
@@ -81,15 +100,38 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
     ];
   }, [bookmarksByCategory, categories, published]);
 
-  const unpublished = useMemo(
-    () => bookmarks.filter((bookmark) => !published.has(bookmark.id)),
-    [bookmarks, published],
+  const filteredBookmarks = useMemo(
+    () => bookmarks.filter((bookmark) => {
+      const isPublished = published.has(bookmark.id);
+      if (filter === "published" && !isPublished) return false;
+      if (filter === "unpublished" && isPublished) return false;
+      const categoryName = bookmark.categoryId ? categoryNameById.get(bookmark.categoryId) ?? "" : "Uncategorized";
+      return textMatchesQuery(query, [
+        bookmark.title,
+        bookmark.url,
+        bookmark.description ?? "",
+        categoryName,
+      ]);
+    }),
+    [bookmarks, categoryNameById, filter, published, query],
   );
 
+  const publishedCount = published.size;
+  const unpublishedCount = Math.max(0, bookmarks.length - publishedCount);
+  const visibleSelectedCount = filteredBookmarks.filter((bookmark) => selectedIds.has(bookmark.id)).length;
+  const allVisibleSelected = filteredBookmarks.length > 0 && visibleSelectedCount === filteredBookmarks.length;
+
+  useEffect(() => {
+    if (selectVisibleRef.current) {
+      selectVisibleRef.current.indeterminate = visibleSelectedCount > 0 && !allVisibleSelected;
+    }
+  }, [allVisibleSelected, visibleSelectedCount]);
+
   async function toggle(bookmark: Bookmark) {
     const nextPublished = !published.has(bookmark.id);
     setBusyId(bookmark.id);
     setError(null);
+    setNotice(null);
     try {
       await setPublished(bookmark.id, nextPublished);
       setPublishedIds((current) => {
@@ -98,6 +140,7 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
         else next.delete(bookmark.id);
         return next;
       });
+      setNotice(`${nextPublished ? "Published" : "Unpublished"} “${bookmark.title}”.`);
     } catch (caught) {
       setError(caught instanceof Error ? caught.message : "Could not update this bookmark.");
     } finally {
@@ -105,6 +148,76 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
     }
   }
 
+  function toggleSelected(id: string) {
+    setSelectedIds((current) => {
+      const next = new Set(current);
+      if (next.has(id)) next.delete(id);
+      else next.add(id);
+      return next;
+    });
+  }
+
+  function toggleVisibleSelection() {
+    const visibleIds = filteredBookmarks.map((bookmark) => bookmark.id);
+    setSelectedIds((current) => {
+      const next = new Set(current);
+      if (allVisibleSelected) visibleIds.forEach((id) => next.delete(id));
+      else visibleIds.forEach((id) => next.add(id));
+      return next;
+    });
+  }
+
+  async function updateSelection(nextPublished: boolean) {
+    const selected = [...selectedIds];
+    if (!selected.length) return;
+
+    const idsToUpdate = selected.filter((id) => published.has(id) !== nextPublished);
+    if (!idsToUpdate.length) {
+      setSelectedIds(new Set());
+      setNotice(nextPublished ? "Every selected bookmark is already published." : "Every selected bookmark is already unpublished.");
+      return;
+    }
+
+    setBatchBusy(nextPublished ? "publish" : "unpublish");
+    setError(null);
+    setNotice(null);
+    const failedIds = new Set<string>();
+    let updated = 0;
+
+    try {
+      const chunkSize = 12;
+      for (let offset = 0; offset < idsToUpdate.length; offset += chunkSize) {
+        const chunk = idsToUpdate.slice(offset, offset + chunkSize);
+        const results = await Promise.allSettled(chunk.map((id) => setPublished(id, nextPublished)));
+        results.forEach((result, index) => {
+          const id = chunk[index];
+          if (!id) return;
+          if (result.status === "fulfilled") updated += 1;
+          else failedIds.add(id);
+        });
+      }
+
+      setPublishedIds((current) => {
+        const next = new Set(current);
+        idsToUpdate.forEach((id) => {
+          if (failedIds.has(id)) return;
+          if (nextPublished) next.add(id);
+          else next.delete(id);
+        });
+        return next;
+      });
+      setSelectedIds(failedIds);
+
+      if (failedIds.size) {
+        setError(`${updated} bookmark${updated === 1 ? "" : "s"} updated; ${failedIds.size} failed and remain selected for retry.`);
+      } else {
+        setNotice(`${nextPublished ? "Published" : "Unpublished"} ${updated} bookmark${updated === 1 ? "" : "s"}.`);
+      }
+    } finally {
+      setBatchBusy(null);
+    }
+  }
+
   async function moveCategory(groupId: string, direction: -1 | 1) {
     if (!groupId) return;
     const publicCategoryIds = groups.map((group) => group.id).filter(Boolean);
@@ -114,6 +227,7 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
     const allIds = categories.map((category) => category.id);
     setSorting(true);
     setError(null);
+    setNotice(null);
     try {
       await reorderCategories(swapIds(allIds, groupId, targetId));
       await onChanged();
@@ -135,6 +249,7 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
     const allIds = (bookmarksByCategory.get(categoryKey) ?? []).map((candidate) => candidate.id);
     setSorting(true);
     setError(null);
+    setNotice(null);
     try {
       await reorderBookmarks(bookmark.categoryId ?? null, swapIds(allIds, bookmark.id, targetId));
       await onChanged();
@@ -145,6 +260,8 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
     }
   }
 
+  const mutationBusy = Boolean(batchBusy || busyId);
+
   return (
     <section className="public-settings-section" aria-labelledby="public-settings-title">
       <div className="settings-heading">
@@ -154,12 +271,13 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
           <p>Public groups reuse the canonical Library category and bookmark order. Reordering here updates that shared order, so Web, New Tab and the public page stay consistent instead of drifting into separate layouts.</p>
         </div>
         <div className="settings-sync-state">
-          <strong>{published.size} published</strong>
+          <strong>{publishedCount} published</strong>
           <a className="text-action" href="/" target="_blank" rel="noreferrer">Open public page ↗</a>
         </div>
       </div>
 
       {error && <div className="error-banner" role="alert">{error}</div>}
+      {notice && <div className="success-banner" role="status">{notice}</div>}
 
       <div className="public-curation-layout">
         <article className="form-card public-layout-card">
@@ -198,14 +316,14 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
                       <div className="public-order-actions">
                         <button className="text-action" type="button" disabled={sorting || index === 0} onClick={() => void moveBookmark(bookmark, -1)}>↑</button>
                         <button className="text-action" type="button" disabled={sorting || index === group.bookmarks.length - 1} onClick={() => void moveBookmark(bookmark, 1)}>↓</button>
-                        <button className="danger-text text-action" type="button" disabled={busyId === bookmark.id} onClick={() => void toggle(bookmark)}>Unpublish</button>
+                        <button className="danger-text text-action" type="button" disabled={busyId === bookmark.id || Boolean(batchBusy)} onClick={() => void toggle(bookmark)}>Unpublish</button>
                       </div>
                     </div>
                   ))}
                 </div>
               </section>
             ))}
-            {!loading && !groups.length && <p className="empty-copy">Nothing is public yet. Publish bookmarks from the list beside this preview.</p>}
+            {!loading && !groups.length && <p className="empty-copy">Nothing is public yet. Publish bookmarks from the manager beside this preview.</p>}
             {loading && <p className="empty-copy">Loading public selection…</p>}
           </div>
         </article>
@@ -214,27 +332,86 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
           <div className="card-heading">
             <div>
               <h2>Add to public page</h2>
-              <p>Private bookmarks remain private until explicitly published.</p>
+              <p>Search the full library, filter by publication state, then update one bookmark or a selected batch.</p>
             </div>
-            <span>{unpublished.length}</span>
+            <span>{filteredBookmarks.length} shown</span>
           </div>
-          <div className="public-bookmark-picker">
-            {unpublished.map((bookmark) => (
-              <button
-                className="public-bookmark-row public-bookmark-add"
-                type="button"
-                key={bookmark.id}
-                disabled={loading || busyId === bookmark.id}
-                onClick={() => void toggle(bookmark)}
-              >
-                <span>
-                  <strong>{bookmark.title}</strong>
-                  <small>{categories.find((category) => category.id === bookmark.categoryId)?.name ?? "Uncategorized"} · {bookmark.url}</small>
-                </span>
-                <em>＋ PUBLISH</em>
+
+          <div className="public-publish-tools">
+            <label className="public-publish-search">
+              <span aria-hidden="true">⌕</span>
+              <input
+                type="search"
+                value={query}
+                onChange={(event) => setQuery(event.target.value)}
+                placeholder="Filter title, URL, description or category…"
+                aria-label="Filter public page bookmarks"
+              />
+            </label>
+            <div className="settings-segmented public-publish-filter" aria-label="Publication status filter">
+              <button className={filter === "all" ? "active" : ""} type="button" onClick={() => setFilter("all")}>All · {bookmarks.length}</button>
+              <button className={filter === "published" ? "active" : ""} type="button" onClick={() => setFilter("published")}>Published · {publishedCount}</button>
+              <button className={filter === "unpublished" ? "active" : ""} type="button" onClick={() => setFilter("unpublished")}>Unpublished · {unpublishedCount}</button>
+            </div>
+          </div>
+
+          <div className="public-bulk-bar">
+            <label className="public-select-visible">
+              <input
+                ref={selectVisibleRef}
+                type="checkbox"
+                checked={allVisibleSelected}
+                disabled={!filteredBookmarks.length || mutationBusy}
+                onChange={toggleVisibleSelection}
+              />
+              <span>{allVisibleSelected ? "Clear visible" : "Select visible"}</span>
+            </label>
+            <span className="public-selected-count">{selectedIds.size} selected</span>
+            <div className="public-bulk-actions">
+              <button className="secondary" type="button" disabled={!selectedIds.size || mutationBusy} onClick={() => void updateSelection(true)}>
+                {batchBusy === "publish" ? "Publishing…" : "Publish"}
               </button>
-            ))}
-            {!loading && !unpublished.length && <p className="empty-copy">Every active bookmark is currently published.</p>}
+              <button className="secondary" type="button" disabled={!selectedIds.size || mutationBusy} onClick={() => void updateSelection(false)}>
+                {batchBusy === "unpublish" ? "Unpublishing…" : "Unpublish"}
+              </button>
+              <button className="text-action" type="button" disabled={!selectedIds.size || mutationBusy} onClick={() => setSelectedIds(new Set())}>Clear</button>
+            </div>
+          </div>
+
+          <div className="public-bookmark-picker public-bookmark-manager">
+            {filteredBookmarks.map((bookmark) => {
+              const isPublished = published.has(bookmark.id);
+              const categoryName = bookmark.categoryId ? categoryNameById.get(bookmark.categoryId) ?? "Uncategorized" : "Uncategorized";
+              return (
+                <div className={`public-bookmark-row public-bookmark-manage${isPublished ? " is-published" : ""}`} key={bookmark.id}>
+                  <label className="public-bookmark-select">
+                    <input
+                      type="checkbox"
+                      checked={selectedIds.has(bookmark.id)}
+                      disabled={mutationBusy}
+                      onChange={() => toggleSelected(bookmark.id)}
+                    />
+                    <span>
+                      <strong>{bookmark.title}</strong>
+                      <small>{categoryName} · {bookmark.url}</small>
+                    </span>
+                  </label>
+                  <em>{isPublished ? "PUBLISHED" : "PRIVATE"}</em>
+                  <button
+                    className={isPublished ? "danger-text text-action" : "text-action"}
+                    type="button"
+                    disabled={mutationBusy && busyId !== bookmark.id}
+                    onClick={() => void toggle(bookmark)}
+                  >
+                    {busyId === bookmark.id ? "Saving…" : isPublished ? "Unpublish" : "Publish"}
+                  </button>
+                </div>
+              );
+            })}
+            {!loading && !filteredBookmarks.length && (
+              <p className="empty-copy">{query.trim() ? "No bookmarks match this filter." : "No bookmarks match this publication state."}</p>
+            )}
+            {loading && <p className="empty-copy">Loading public selection…</p>}
           </div>
         </article>
       </div>

From 947b4cda22f650828a2c1f99edfba55605ed311e Mon Sep 17 00:00:00 2001
From: WangEn <WangEn@users.noreply.github.com>
Date: Fri, 18 Sep 2026 11:40:29 +0800
Subject: [PATCH 4/8] fix: lock public row actions during mutations

---
 apps/web/src/PublicPageSettings.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/web/src/PublicPageSettings.tsx b/apps/web/src/PublicPageSettings.tsx
index dbf2d1d..0afd0ce 100644
--- a/apps/web/src/PublicPageSettings.tsx
+++ b/apps/web/src/PublicPageSettings.tsx
@@ -400,7 +400,7 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
                   <button
                     className={isPublished ? "danger-text text-action" : "text-action"}
                     type="button"
-                    disabled={mutationBusy && busyId !== bookmark.id}
+                    disabled={mutationBusy}
                     onClick={() => void toggle(bookmark)}
                   >
                     {busyId === bookmark.id ? "Saving…" : isPublished ? "Unpublish" : "Publish"}

From 4458abc3bcc2717dea8cf46e6c1732c5a883b293 Mon Sep 17 00:00:00 2001
From: WangEn <WangEn@users.noreply.github.com>
Date: Fri, 18 Sep 2026 11:40:31 +0800
Subject: [PATCH 5/8] style: add public publishing search filters and bulk
 controls

---
 apps/web/src/settings.css | 88 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 88 insertions(+)

diff --git a/apps/web/src/settings.css b/apps/web/src/settings.css
index e3537f1..9d57b8e 100644
--- a/apps/web/src/settings.css
+++ b/apps/web/src/settings.css
@@ -104,3 +104,91 @@
   .public-layout-item { grid-template-columns: auto minmax(0, 1fr); }
   .public-layout-item .public-order-actions { grid-column: 2; }
 }
+
+
+.public-publish-tools { display: grid; gap: 10px; margin-bottom: 12px; }
+.public-publish-search {
+  display: flex;
+  align-items: center;
+  gap: 9px;
+  min-height: 42px;
+  padding: 0 11px;
+  border: 1px solid var(--dm-border);
+  border-radius: 10px;
+  background: var(--dm-bg-soft);
+}
+.public-publish-search > span { flex: 0 0 auto; color: var(--dm-text-muted); font-size: 18px; }
+.public-publish-search input {
+  flex: 1;
+  min-width: 0;
+  border: 0;
+  outline: 0;
+  color: var(--dm-text);
+  background: transparent;
+}
+.public-publish-search input::placeholder { color: var(--dm-text-muted); }
+.public-publish-search:focus-within { border-color: var(--dm-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--dm-accent) 14%, transparent); }
+.public-publish-filter { grid-template-columns: repeat(3, minmax(0, 1fr)); }
+.public-publish-filter button { padding-inline: 8px; font-size: 10px; }
+
+.public-bulk-bar {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-height: 46px;
+  margin-bottom: 10px;
+  padding: 8px 10px;
+  border: 1px solid var(--dm-border);
+  border-radius: 11px;
+  background: color-mix(in srgb, var(--dm-bg-soft) 78%, transparent);
+}
+.public-select-visible { display: inline-flex; align-items: center; gap: 7px; color: var(--dm-text-soft); font-size: 10px; cursor: pointer; white-space: nowrap; }
+.public-select-visible input,
+.public-bookmark-select input { width: 16px; height: 16px; margin: 0; accent-color: var(--dm-accent); }
+.public-selected-count { color: var(--dm-text-muted); font-size: 10px; white-space: nowrap; }
+.public-bulk-actions { display: flex; align-items: center; gap: 7px; margin-left: auto; }
+.public-bulk-actions .secondary { min-height: 32px; padding-inline: 9px; font-size: 10px; }
+
+.public-bookmark-manager { align-content: start; }
+.public-bookmark-manage {
+  grid-template-columns: minmax(0, 1fr) auto auto;
+  gap: 10px;
+  cursor: default;
+}
+.public-bookmark-manage.is-published { border-color: color-mix(in srgb, var(--dm-accent) 55%, var(--dm-border)); }
+.public-bookmark-select {
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+  cursor: pointer;
+}
+.public-bookmark-select > span { display: grid; gap: 3px; min-width: 0; }
+.public-bookmark-select strong,
+.public-bookmark-select small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.public-bookmark-select strong { font-size: 12px; }
+.public-bookmark-select small { color: var(--dm-text-muted); font-size: 10px; }
+.public-bookmark-manage em { min-width: 64px; color: var(--dm-text-muted); text-align: right; }
+.public-bookmark-manage.is-published em { color: var(--dm-accent-strong); }
+.public-bookmark-manage > button { min-width: 54px; text-align: right; }
+.public-bookmark-manage > button:disabled,
+.public-bookmark-select input:disabled,
+.public-select-visible input:disabled { opacity: .45; cursor: default; }
+
+html[data-theme="light"] .public-publish-search,
+html[data-theme="light"] .public-bulk-bar { border-color: var(--dm-border); background: #fff; }
+html[data-theme="light"] .public-bookmark-manage.is-published { border-color: #9fc5ae; background: var(--dm-selected-bg); }
+
+@media (max-width: 760px) {
+  .public-publish-filter { grid-template-columns: repeat(3, minmax(0, 1fr)); }
+  .public-bulk-bar { align-items: flex-start; flex-wrap: wrap; }
+  .public-bulk-actions { width: 100%; margin-left: 0; }
+}
+@media (max-width: 560px) {
+  .public-publish-filter { grid-template-columns: 1fr; }
+  .public-bookmark-manage { grid-template-columns: minmax(0, 1fr) auto; }
+  .public-bookmark-select { grid-column: 1 / -1; }
+  .public-bookmark-manage em { text-align: left; }
+  .public-bulk-actions { flex-wrap: wrap; }
+}

From 7f8603625f9dd8aba78c383516e7f165e3452fb0 Mon Sep 17 00:00:00 2001
From: WangEn <WangEn@users.noreply.github.com>
Date: Fri, 18 Sep 2026 11:41:24 +0800
Subject: [PATCH 6/8] fix: serialize public page mutations across views

---
 apps/web/src/PublicPageSettings.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/web/src/PublicPageSettings.tsx b/apps/web/src/PublicPageSettings.tsx
index 0afd0ce..2b3bd73 100644
--- a/apps/web/src/PublicPageSettings.tsx
+++ b/apps/web/src/PublicPageSettings.tsx
@@ -316,7 +316,7 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
                       <div className="public-order-actions">
                         <button className="text-action" type="button" disabled={sorting || index === 0} onClick={() => void moveBookmark(bookmark, -1)}>↑</button>
                         <button className="text-action" type="button" disabled={sorting || index === group.bookmarks.length - 1} onClick={() => void moveBookmark(bookmark, 1)}>↓</button>
-                        <button className="danger-text text-action" type="button" disabled={busyId === bookmark.id || Boolean(batchBusy)} onClick={() => void toggle(bookmark)}>Unpublish</button>
+                        <button className="danger-text text-action" type="button" disabled={mutationBusy} onClick={() => void toggle(bookmark)}>Unpublish</button>
                       </div>
                     </div>
                   ))}

From 5032a28982305bc6de18509522736f1b591a8153 Mon Sep 17 00:00:00 2001
From: WangEn <WangEn@users.noreply.github.com>
Date: Fri, 18 Sep 2026 11:41:26 +0800
Subject: [PATCH 7/8] fix: separate selection styling from publication state

---
 apps/web/src/settings.css | 31 +++++++++++++++++++++++--------
 1 file changed, 23 insertions(+), 8 deletions(-)

diff --git a/apps/web/src/settings.css b/apps/web/src/settings.css
index 9d57b8e..06385b8 100644
--- a/apps/web/src/settings.css
+++ b/apps/web/src/settings.css
@@ -150,12 +150,12 @@
 .public-bulk-actions .secondary { min-height: 32px; padding-inline: 9px; font-size: 10px; }
 
 .public-bookmark-manager { align-content: start; }
-.public-bookmark-manage {
+.public-bookmark-row.public-bookmark-manage {
   grid-template-columns: minmax(0, 1fr) auto auto;
   gap: 10px;
   cursor: default;
 }
-.public-bookmark-manage.is-published { border-color: color-mix(in srgb, var(--dm-accent) 55%, var(--dm-border)); }
+.public-bookmark-row.public-bookmark-manage.is-published { border-color: color-mix(in srgb, var(--dm-accent) 55%, var(--dm-border)); }
 .public-bookmark-select {
   display: grid;
   grid-template-columns: auto minmax(0, 1fr);
@@ -169,16 +169,16 @@
 .public-bookmark-select small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .public-bookmark-select strong { font-size: 12px; }
 .public-bookmark-select small { color: var(--dm-text-muted); font-size: 10px; }
-.public-bookmark-manage em { min-width: 64px; color: var(--dm-text-muted); text-align: right; }
-.public-bookmark-manage.is-published em { color: var(--dm-accent-strong); }
-.public-bookmark-manage > button { min-width: 54px; text-align: right; }
-.public-bookmark-manage > button:disabled,
+.public-bookmark-row.public-bookmark-manage em { min-width: 64px; color: var(--dm-text-muted); text-align: right; }
+.public-bookmark-row.public-bookmark-manage.is-published em { color: var(--dm-accent-strong); }
+.public-bookmark-row.public-bookmark-manage > button { min-width: 54px; text-align: right; }
+.public-bookmark-row.public-bookmark-manage > button:disabled,
 .public-bookmark-select input:disabled,
 .public-select-visible input:disabled { opacity: .45; cursor: default; }
 
 html[data-theme="light"] .public-publish-search,
 html[data-theme="light"] .public-bulk-bar { border-color: var(--dm-border); background: #fff; }
-html[data-theme="light"] .public-bookmark-manage.is-published { border-color: #9fc5ae; background: var(--dm-selected-bg); }
+html[data-theme="light"] .public-bookmark-row.public-bookmark-manage.is-published { border-color: #9fc5ae; background: var(--dm-selected-bg); }
 
 @media (max-width: 760px) {
   .public-publish-filter { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@@ -187,8 +187,23 @@ html[data-theme="light"] .public-bookmark-manage.is-published { border-color: #9
 }
 @media (max-width: 560px) {
   .public-publish-filter { grid-template-columns: 1fr; }
-  .public-bookmark-manage { grid-template-columns: minmax(0, 1fr) auto; }
+  .public-bookmark-row.public-bookmark-manage { grid-template-columns: minmax(0, 1fr) auto; }
   .public-bookmark-select { grid-column: 1 / -1; }
   .public-bookmark-manage em { text-align: left; }
   .public-bulk-actions { flex-wrap: wrap; }
 }
+
+
+.public-bookmark-row.public-bookmark-manage:has(input:checked) {
+  border-color: color-mix(in srgb, var(--dm-accent) 72%, var(--dm-border));
+  background: color-mix(in srgb, var(--dm-accent-bg) 58%, var(--dm-bg-card));
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dm-accent) 16%, transparent);
+}
+.public-bookmark-row.public-bookmark-manage:not(.is-published) em { color: var(--dm-text-muted); }
+.public-bookmark-row.public-bookmark-manage.is-published em { color: var(--dm-accent-strong); }
+html[data-theme="light"] .public-bookmark-row.public-bookmark-manage:has(input:checked) {
+  border-color: #8eb79c;
+  background: var(--dm-selected-bg);
+}
+html[data-theme="light"] .public-bookmark-row.public-bookmark-manage:not(.is-published) em { color: var(--dm-text-muted); }
+html[data-theme="light"] .public-bookmark-row.public-bookmark-manage.is-published em { color: var(--dm-accent-strong); }

From e02833986c5a0450f5d70ce5df3fba3b3a4554d2 Mon Sep 17 00:00:00 2001
From: WangEn <WangEn@users.noreply.github.com>
Date: Fri, 18 Sep 2026 11:42:35 +0800
Subject: [PATCH 8/8] fix: clear row selection after individual publication
 changes

---
 apps/web/src/PublicPageSettings.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/apps/web/src/PublicPageSettings.tsx b/apps/web/src/PublicPageSettings.tsx
index 2b3bd73..ae07135 100644
--- a/apps/web/src/PublicPageSettings.tsx
+++ b/apps/web/src/PublicPageSettings.tsx
@@ -140,6 +140,11 @@ export function PublicPageSettings({ bookmarks, categories, onChanged }: Props)
         else next.delete(bookmark.id);
         return next;
       });
+      setSelectedIds((current) => {
+        const next = new Set(current);
+        next.delete(bookmark.id);
+        return next;
+      });
       setNotice(`${nextPublished ? "Published" : "Unpublished"} “${bookmark.title}”.`);
     } catch (caught) {
       setError(caught instanceof Error ? caught.message : "Could not update this bookmark.");