@jant/core 0.3.24 → 0.3.26

package/src/routes/dash/pages.tsx

@@ -1,101 +1,27 @@
-import { getSiteName } from "../../lib/config.js";
 /**
- * Dashboard Pages Routes
+ * Dashboard Pages & Navigation Routes
  *
- * Management for standalone pages (about, now, etc.)
+ * Unified management for pages and navigation items.
  */
 
 import { Hono } from "hono";
 import { useLingui } from "@lingui/react/macro";
 import type { Bindings, Page } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import { DashLayout } from "../../theme/layouts/index.js";
-import {
-  PageForm,
-  EmptyState,
-  ListItemRow,
-  ActionButtons,
-  CrudPageHeader,
-  DangerZone,
-} from "../../theme/components/index.js";
-import * as time from "../../lib/time.js";
-import { dsRedirect } from "../../lib/sse.js";
+import { DashLayout } from "../../ui/layouts/DashLayout.js";
+import { PageForm, ActionButtons, DangerZone } from "../../ui/dash/index.js";
+import { dsRedirect, dsToast } from "../../lib/sse.js";
+import { getSiteName } from "../../lib/config.js";
+import { UnifiedPagesContent } from "../../ui/dash/pages/UnifiedPagesContent.js";
+import { LinkFormContent } from "../../ui/dash/pages/LinkFormContent.js";
 
 type Env = { Bindings: Bindings; Variables: AppVariables };
 
 export const pagesRoutes = new Hono<Env>();
 
-function PagesListContent({ pages }: { pages: Page[] }) {
-  const { t } = useLingui();
-
-  return (
-    <>
-      <CrudPageHeader
-        title={t({ message: "Pages", comment: "@context: Pages main heading" })}
-        ctaLabel={t({
-          message: "New Page",
-          comment: "@context: Button to create new page",
-        })}
-        ctaHref="/dash/pages/new"
-      />
-
-      {pages.length === 0 ? (
-        <EmptyState
-          message={t({
-            message: "No pages yet.",
-            comment: "@context: Empty state message when no pages exist",
-          })}
-          ctaText={t({
-            message: "Create your first page",
-            comment: "@context: Button in empty state to create first page",
-          })}
-          ctaHref="/dash/pages/new"
-        />
-      ) : (
-        <div class="flex flex-col divide-y">
-          {pages.map((page) => (
-            <ListItemRow
-              key={page.id}
-              actions={
-                <ActionButtons
-                  editHref={`/dash/pages/${page.id}/edit`}
-                  editLabel={t({
-                    message: "Edit",
-                    comment: "@context: Button to edit page",
-                  })}
-                  viewHref={
-                    page.status !== "draft" ? `/${page.slug}` : undefined
-                  }
-                  viewLabel={t({
-                    message: "View",
-                    comment: "@context: Button to view page on public site",
-                  })}
-                />
-              }
-            >
-              <div class="flex items-center gap-2 mb-1">
-                <span class="text-xs text-muted-foreground">
-                  {time.formatDate(page.updatedAt)}
-                </span>
-              </div>
-              <a
-                href={`/dash/pages/${page.id}`}
-                class="font-medium hover:underline"
-              >
-                {page.title ||
-                  t({
-                    message: "Untitled",
-                    comment: "@context: Default title for untitled page",
-                  })}
-              </a>
-              <p class="text-sm text-muted-foreground mt-1">/{page.slug}</p>
-            </ListItemRow>
-          ))}
-        </div>
-      )}
-    </>
-  );
-}
+// =============================================================================
+// Inline components (small, tightly coupled to route params)
+// =============================================================================
 
 function NewPageContent() {
   const { t } = useLingui();
@@ -174,9 +100,15 @@ function EditPageContent({ page }: { page: Page }) {
   );
 }
 
-// List pages
+// =============================================================================
+// Route handlers
+// =============================================================================
+
 pagesRoutes.get("/", async (c) => {
-  const pages = await c.var.services.pages.list();
+  const [navItems, otherPages] = await Promise.all([
+    c.var.services.navItems.list(),
+    c.var.services.pages.listNotInNav(),
+  ]);
   const siteName = await getSiteName(c);
 
   return c.html(
@@ -186,15 +118,13 @@ pagesRoutes.get("/", async (c) => {
       siteName={siteName}
       currentPath="/dash/pages"
     >
-      <PagesListContent pages={pages} />
+      <UnifiedPagesContent navItems={navItems} otherPages={otherPages} />
     </DashLayout>,
   );
 });
 
-// New page form
 pagesRoutes.get("/new", async (c) => {
   const siteName = await getSiteName(c);
-
   return c.html(
     <DashLayout
       c={c}
@@ -207,7 +137,89 @@ pagesRoutes.get("/new", async (c) => {
   );
 });
 
-// Create page
+pagesRoutes.get("/links/new", async (c) => {
+  const siteName = await getSiteName(c);
+  return c.html(
+    <DashLayout
+      c={c}
+      title="New Link"
+      siteName={siteName}
+      currentPath="/dash/pages"
+    >
+      <LinkFormContent />
+    </DashLayout>,
+  );
+});
+
+pagesRoutes.post("/links", async (c) => {
+  const body = await c.req.json<{ label: string; url: string }>();
+  if (!body.label || !body.url) {
+    return dsToast("Label and URL are required", "error");
+  }
+
+  await c.var.services.navItems.create({
+    type: "link",
+    label: body.label,
+    url: body.url,
+  });
+  return dsRedirect("/dash/pages");
+});
+
+pagesRoutes.post("/reorder", async (c) => {
+  const body = await c.req.json<{ ids: number[] }>();
+  if (!Array.isArray(body.ids)) {
+    return dsToast("Invalid request", "error");
+  }
+  await c.var.services.navItems.reorder(body.ids);
+  return dsToast("Order saved");
+});
+
+pagesRoutes.get("/links/:id/edit", async (c) => {
+  const id = parseInt(c.req.param("id"), 10);
+  if (isNaN(id)) return c.notFound();
+
+  const item = await c.var.services.navItems.getById(id);
+  if (!item) return c.notFound();
+
+  const siteName = await getSiteName(c);
+  return c.html(
+    <DashLayout
+      c={c}
+      title="Edit Link"
+      siteName={siteName}
+      currentPath="/dash/pages"
+    >
+      <LinkFormContent item={item} isEdit />
+    </DashLayout>,
+  );
+});
+
+pagesRoutes.post("/links/:id", async (c) => {
+  const id = parseInt(c.req.param("id"), 10);
+  if (isNaN(id)) return c.notFound();
+
+  const body = await c.req.json<{ label: string; url: string }>();
+  if (!body.label || !body.url) {
+    return dsToast("Label and URL are required", "error");
+  }
+
+  const updated = await c.var.services.navItems.update(id, {
+    label: body.label,
+    url: body.url,
+  });
+  if (!updated) return c.notFound();
+
+  return dsRedirect("/dash/pages");
+});
+
+pagesRoutes.post("/links/:id/delete", async (c) => {
+  const id = parseInt(c.req.param("id"), 10);
+  if (!isNaN(id)) {
+    await c.var.services.navItems.delete(id);
+  }
+  return dsRedirect("/dash/pages");
+});
+
 pagesRoutes.post("/", async (c) => {
   const body = await c.req.json<{
     title: string;
@@ -226,7 +238,34 @@ pagesRoutes.post("/", async (c) => {
   return dsRedirect(`/dash/pages/${page.id}`);
 });
 
-// View single page
+pagesRoutes.post("/:id/add-to-nav", async (c) => {
+  const id = parseInt(c.req.param("id"), 10);
+  if (isNaN(id)) return c.notFound();
+
+  const page = await c.var.services.pages.getById(id);
+  if (!page) return c.notFound();
+
+  await c.var.services.navItems.create({
+    type: "page",
+    label: page.title || page.slug,
+    url: `/${page.slug}`,
+    pageId: page.id,
+  });
+  return dsRedirect("/dash/pages");
+});
+
+pagesRoutes.post("/:id/remove-from-nav", async (c) => {
+  const pageId = parseInt(c.req.param("id"), 10);
+  if (isNaN(pageId)) return c.notFound();
+
+  const navItems = await c.var.services.navItems.list();
+  const navItem = navItems.find((item) => item.pageId === pageId);
+  if (navItem) {
+    await c.var.services.navItems.delete(navItem.id);
+  }
+  return dsRedirect("/dash/pages");
+});
+
 pagesRoutes.get("/:id", async (c) => {
   const id = parseInt(c.req.param("id"), 10);
   if (isNaN(id)) return c.notFound();
@@ -235,7 +274,6 @@ pagesRoutes.get("/:id", async (c) => {
   if (!page) return c.notFound();
 
   const siteName = await getSiteName(c);
-
   return c.html(
     <DashLayout
       c={c}
@@ -248,7 +286,6 @@ pagesRoutes.get("/:id", async (c) => {
   );
 });
 
-// Edit page form
 pagesRoutes.get("/:id/edit", async (c) => {
   const id = parseInt(c.req.param("id"), 10);
   if (isNaN(id)) return c.notFound();
@@ -257,7 +294,6 @@ pagesRoutes.get("/:id/edit", async (c) => {
   if (!page) return c.notFound();
 
   const siteName = await getSiteName(c);
-
   return c.html(
     <DashLayout
       c={c}
@@ -270,7 +306,6 @@ pagesRoutes.get("/:id/edit", async (c) => {
   );
 });
 
-// Update page
 pagesRoutes.post("/:id", async (c) => {
   const id = parseInt(c.req.param("id"), 10);
   if (isNaN(id)) return c.notFound();
@@ -292,12 +327,10 @@ pagesRoutes.post("/:id", async (c) => {
   return dsRedirect(`/dash/pages/${id}`);
 });
 
-// Delete page
 pagesRoutes.post("/:id/delete", async (c) => {
   const id = parseInt(c.req.param("id"), 10);
   if (isNaN(id)) return c.notFound();
 
   await c.var.services.pages.delete(id);
-
   return dsRedirect("/dash/pages");
 });

package/src/routes/dash/posts.tsx

@@ -7,13 +7,13 @@ import { Hono } from "hono";
 import { useLingui } from "@lingui/react/macro";
 import type { Bindings, Post, Media, Collection } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import { DashLayout } from "../../theme/layouts/index.js";
+import { DashLayout } from "../../ui/layouts/DashLayout.js";
 import {
   PostForm,
   PostList,
   CrudPageHeader,
   ActionButtons,
-} from "../../theme/components/index.js";
+} from "../../ui/dash/index.js";
 import * as sqid from "../../lib/sqid.js";
 import { dsRedirect } from "../../lib/sse.js";
 
@@ -95,7 +95,6 @@ postsRoutes.post("/", async (c) => {
     status: string;
     featured?: boolean;
     pinned?: boolean;
-    slug?: string;
     url?: string;
     quoteText?: string;
     rating?: number;
@@ -110,7 +109,6 @@ postsRoutes.post("/", async (c) => {
     status: body.status as Post["status"],
     featured: body.featured,
     pinned: body.pinned,
-    slug: body.slug || undefined,
     url: body.url || undefined,
     quoteText: body.quoteText || undefined,
     rating: body.rating || undefined,
@@ -131,7 +129,7 @@ function ViewPostContent({ post }: { post: Post }) {
     message: "Post",
     comment: "@context: Default post title",
   });
-  const permalink = post.slug ? `/${post.slug}` : `/p/${sqid.encode(post.id)}`;
+  const permalink = post.path ? `/${post.path}` : `/p/${sqid.encode(post.id)}`;
 
   return (
     <>
@@ -266,7 +264,6 @@ postsRoutes.post("/:id", async (c) => {
     status: string;
     featured?: boolean;
     pinned?: boolean;
-    slug?: string;
     url?: string;
     quoteText?: string;
     rating?: number;
@@ -281,7 +278,6 @@ postsRoutes.post("/:id", async (c) => {
     status: body.status as Post["status"],
     featured: body.featured,
     pinned: body.pinned,
-    slug: body.slug || null,
     url: body.url || null,
     quoteText: body.quoteText || null,
     rating: body.rating || null,

package/src/routes/dash/redirects.tsx

@@ -7,13 +7,13 @@ import { Hono } from "hono";
 import { useLingui } from "@lingui/react/macro";
 import type { Bindings, Redirect } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import { DashLayout } from "../../theme/layouts/index.js";
+import { DashLayout } from "../../ui/layouts/DashLayout.js";
 import {
   EmptyState,
   ListItemRow,
   ActionButtons,
   CrudPageHeader,
-} from "../../theme/components/index.js";
+} from "../../ui/dash/index.js";
 import { dsRedirect } from "../../lib/sse.js";
 
 type Env = { Bindings: Bindings; Variables: AppVariables };
@@ -158,20 +158,26 @@ function NewRedirectContent() {
         </div>
 
         <div class="flex gap-2">
-          <button type="submit" class="btn" data-attr-disabled="$_loading">
-            <span data-show="!$_loading">
-              {t({
-                message: "Create Redirect",
-                comment: "@context: Button to save new redirect",
-              })}
-            </span>
-            <span data-show="$_loading">
-              {t({
-                message: "Processing...",
-                comment:
-                  "@context: Loading text shown on submit button while request is in progress",
-              })}
-            </span>
+          <button type="submit" class="btn" data-attr:disabled="$_loading">
+            <svg
+              data-show="$_loading"
+              style="display:none"
+              class="animate-spin size-4"
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              role="status"
+            >
+              <path d="M21 12a9 9 0 1 1-6.219-8.56" />
+            </svg>
+            {t({
+              message: "Create Redirect",
+              comment: "@context: Button to save new redirect",
+            })}
           </button>
           <a href="/dash/redirects" class="btn-outline">
             {t({