@jant/core 0.3.23 → 0.3.25

package/src/routes/dash/__tests__/pages.test.ts

@@ -0,0 +1,225 @@
+/**
+ * Tests for the page/nav management logic used by dashboard pages routes.
+ *
+ * Note: Route handler tests that import JSX components with @lingui/react/macro
+ * cannot run in vitest (requires SWC plugin). These tests verify the service
+ * layer operations that the routes orchestrate.
+ */
+
+import { describe, it, expect, beforeEach } from "vitest";
+import { createTestDatabase } from "../../../__tests__/helpers/db.js";
+import { createPageService } from "../../../services/page.js";
+import { createNavItemService } from "../../../services/navigation.js";
+import type { Database } from "../../../db/index.js";
+
+describe("Dashboard Pages - Nav Management Logic", () => {
+  let db: Database;
+  let pageService: ReturnType<typeof createPageService>;
+  let navItemService: ReturnType<typeof createNavItemService>;
+
+  beforeEach(() => {
+    const testDb = createTestDatabase();
+    db = testDb.db as unknown as Database;
+    pageService = createPageService(db);
+    navItemService = createNavItemService(db);
+  });
+
+  describe("add page to nav", () => {
+    it("creates a page-type nav item for the page", async () => {
+      const page = await pageService.create({
+        slug: "about",
+        title: "About Us",
+      });
+
+      // Simulate what the route handler does
+      await navItemService.create({
+        type: "page",
+        label: page.title || page.slug,
+        url: `/${page.slug}`,
+        pageId: page.id,
+      });
+
+      const navItems = await navItemService.list();
+      expect(navItems).toHaveLength(1);
+      expect(navItems[0]?.type).toBe("page");
+      expect(navItems[0]?.label).toBe("About Us");
+      expect(navItems[0]?.url).toBe("/about");
+      expect(navItems[0]?.pageId).toBe(page.id);
+    });
+
+    it("uses slug as label when page has no title", async () => {
+      const page = await pageService.create({ slug: "about" });
+
+      await navItemService.create({
+        type: "page",
+        label: page.title || page.slug,
+        url: `/${page.slug}`,
+        pageId: page.id,
+      });
+
+      const navItems = await navItemService.list();
+      expect(navItems[0]?.label).toBe("about");
+    });
+
+    it("page appears in nav and not in listNotInNav after adding", async () => {
+      const page = await pageService.create({
+        slug: "about",
+        title: "About",
+      });
+
+      // Before adding to nav
+      let notInNav = await pageService.listNotInNav();
+      expect(notInNav).toHaveLength(1);
+
+      // Add to nav
+      await navItemService.create({
+        type: "page",
+        label: page.title || page.slug,
+        url: `/${page.slug}`,
+        pageId: page.id,
+      });
+
+      // After adding to nav
+      notInNav = await pageService.listNotInNav();
+      expect(notInNav).toHaveLength(0);
+
+      const navItems = await navItemService.list();
+      expect(navItems).toHaveLength(1);
+    });
+  });
+
+  describe("remove page from nav", () => {
+    it("removes the nav item but keeps the page", async () => {
+      const page = await pageService.create({
+        slug: "about",
+        title: "About",
+      });
+      const navItem = await navItemService.create({
+        type: "page",
+        label: "About",
+        url: "/about",
+        pageId: page.id,
+      });
+
+      // Simulate what the route handler does: find and delete nav item by pageId
+      const allNavItems = await navItemService.list();
+      const found = allNavItems.find((item) => item.pageId === page.id);
+      expect(found).toBeDefined();
+      await navItemService.delete(found!.id);
+
+      // Nav item should be gone
+      const navItems = await navItemService.list();
+      expect(navItems).toHaveLength(0);
+
+      // Page should still exist
+      const foundPage = await pageService.getById(page.id);
+      expect(foundPage).not.toBeNull();
+
+      // Page should appear in "not in nav" list
+      const notInNav = await pageService.listNotInNav();
+      expect(notInNav).toHaveLength(1);
+      expect(notInNav[0]?.slug).toBe("about");
+    });
+  });
+
+  describe("reorder nav items", () => {
+    it("reorders nav items by position", async () => {
+      const a = await navItemService.create({
+        type: "link",
+        label: "A",
+        url: "/a",
+      });
+      const b = await navItemService.create({
+        type: "link",
+        label: "B",
+        url: "/b",
+      });
+
+      // Reverse order
+      await navItemService.reorder([b.id, a.id]);
+
+      const items = await navItemService.list();
+      expect(items[0]?.label).toBe("B");
+      expect(items[1]?.label).toBe("A");
+    });
+  });
+
+  describe("link CRUD", () => {
+    it("creates a link nav item", async () => {
+      await navItemService.create({
+        type: "link",
+        label: "Blog",
+        url: "/blog",
+      });
+
+      const navItems = await navItemService.list();
+      expect(navItems).toHaveLength(1);
+      expect(navItems[0]?.type).toBe("link");
+      expect(navItems[0]?.label).toBe("Blog");
+      expect(navItems[0]?.url).toBe("/blog");
+    });
+
+    it("updates a link nav item", async () => {
+      const item = await navItemService.create({
+        type: "link",
+        label: "Blog",
+        url: "/blog",
+      });
+
+      await navItemService.update(item.id, {
+        label: "Posts",
+        url: "/posts",
+      });
+
+      const updated = await navItemService.getById(item.id);
+      expect(updated?.label).toBe("Posts");
+      expect(updated?.url).toBe("/posts");
+    });
+
+    it("deletes a link nav item", async () => {
+      const item = await navItemService.create({
+        type: "link",
+        label: "Blog",
+        url: "/blog",
+      });
+
+      await navItemService.delete(item.id);
+
+      const found = await navItemService.getById(item.id);
+      expect(found).toBeNull();
+    });
+  });
+
+  describe("unified page listing", () => {
+    it("separates pages into nav and non-nav groups", async () => {
+      const aboutPage = await pageService.create({
+        slug: "about",
+        title: "About",
+      });
+      await pageService.create({ slug: "contact", title: "Contact" });
+
+      // Add about to nav
+      await navItemService.create({
+        type: "page",
+        label: "About",
+        url: "/about",
+        pageId: aboutPage.id,
+      });
+
+      // Also add a link nav item
+      await navItemService.create({
+        type: "link",
+        label: "External",
+        url: "https://example.com",
+      });
+
+      // Simulate the unified page view data fetch
+      const navItems = await navItemService.list();
+      const otherPages = await pageService.listNotInNav();
+
+      expect(navItems).toHaveLength(2); // page + link
+      expect(otherPages).toHaveLength(1); // only contact
+      expect(otherPages[0]?.slug).toBe("contact");
+    });
+  });
+});

package/src/routes/dash/collections.tsx

@@ -7,14 +7,14 @@ import { Hono } from "hono";
 import { useLingui } from "@lingui/react/macro";
 import type { Bindings, Collection, Post } 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,
   DangerZone,
-} from "../../theme/components/index.js";
+} from "../../ui/dash/index.js";
 import * as sqid from "../../lib/sqid.js";
 import { dsRedirect } from "../../lib/sse.js";
 
@@ -67,7 +67,7 @@ function CollectionsListContent({
                     message: "Edit",
                     comment: "@context: Button to edit collection",
                   })}
-                  viewHref={`/c/${col.path}`}
+                  viewHref={`/c/${col.slug}`}
                   viewLabel={t({
                     message: "View",
                     comment: "@context: Button to view collection",
@@ -81,7 +81,7 @@ function CollectionsListContent({
               >
                 {col.title}
               </a>
-              <p class="text-sm text-muted-foreground">/{col.path}</p>
+              <p class="text-sm text-muted-foreground">/{col.slug}</p>
               {col.description && (
                 <p class="text-sm text-muted-foreground mt-1">
                   {col.description}
@@ -104,7 +104,7 @@ function NewCollectionContent() {
       </h1>
 
       <form
-        data-signals="{title: '', path: '', description: ''}"
+        data-signals="{title: '', slug: '', description: ''}"
         data-on:submit__prevent="@post('/dash/collections')"
         data-indicator="_loading"
         class="flex flex-col gap-4 max-w-lg"
@@ -134,7 +134,7 @@ function NewCollectionContent() {
           </label>
           <input
             type="text"
-            data-bind="path"
+            data-bind="slug"
             class="input"
             required
             placeholder="my-collection"
@@ -213,7 +213,7 @@ function ViewCollectionContent({
       <div class="flex items-center justify-between mb-6">
         <div>
           <h1 class="text-2xl font-semibold">{collection.title}</h1>
-          <p class="text-sm text-muted-foreground">/{collection.path}</p>
+          <p class="text-sm text-muted-foreground">/{collection.slug}</p>
         </div>
         <ActionButtons
           editHref={`/dash/collections/${collection.id}/edit`}
@@ -221,7 +221,7 @@ function ViewCollectionContent({
             message: "Edit",
             comment: "@context: Button to edit collection",
           })}
-          viewHref={`/c/${collection.path}`}
+          viewHref={`/c/${collection.slug}`}
           viewLabel={t({
             message: "View",
             comment: "@context: Button to view collection",
@@ -255,21 +255,10 @@ function ViewCollectionContent({
                       class="font-medium hover:underline"
                     >
                       {post.title ||
-                        post.content?.slice(0, 50) ||
+                        post.body?.slice(0, 50) ||
                         `Post #${post.id}`}
                     </a>
                   </div>
-                  <button
-                    type="button"
-                    class="btn-sm-ghost text-destructive"
-                    data-on:click__prevent={`@post('/dash/collections/${collection.id}/remove-post', {payload: {postId: ${post.id}}})`}
-                  >
-                    {t({
-                      message: "Remove",
-                      comment:
-                        "@context: Button to remove post from collection",
-                    })}
-                  </button>
                 </div>
               ))}
             </div>
@@ -280,7 +269,7 @@ function ViewCollectionContent({
       <div class="mt-6">
         <a href="/dash/collections" class="text-sm hover:underline">
           {t({
-            message: "← Back to Collections",
+            message: "\u2190 Back to Collections",
             comment: "@context: Navigation link",
           })}
         </a>
@@ -294,7 +283,7 @@ function EditCollectionContent({ collection }: { collection: Collection }) {
 
   const signals = JSON.stringify({
     title: collection.title,
-    path: collection.path ?? "",
+    slug: collection.slug ?? "",
     description: collection.description ?? "",
   }).replace(/</g, "\\u003c");
 
@@ -326,7 +315,7 @@ function EditCollectionContent({ collection }: { collection: Collection }) {
           </label>
           <input
             type="text"
-            data-bind="path"
+            data-bind="slug"
             class="input"
             required
             pattern="[a-z0-9-]+"
@@ -419,13 +408,13 @@ collectionsRoutes.get("/new", async (c) => {
 collectionsRoutes.post("/", async (c) => {
   const body = await c.req.json<{
     title: string;
-    path: string;
+    slug: string;
     description?: string;
   }>();
 
   const collection = await c.var.services.collections.create({
     title: body.title,
-    path: body.path,
+    slug: body.slug,
     description: body.description || undefined,
   });
 
@@ -440,7 +429,10 @@ collectionsRoutes.get("/:id", async (c) => {
   const collection = await c.var.services.collections.getById(id);
   if (!collection) return c.notFound();
 
-  const posts = await c.var.services.collections.getPosts(id);
+  // Fetch posts in this collection via post service
+  const posts = await c.var.services.posts.list({
+    collectionId: id,
+  });
   const siteName = await getSiteName(c);
 
   return c.html(
@@ -484,13 +476,13 @@ collectionsRoutes.post("/:id", async (c) => {
 
   const body = await c.req.json<{
     title: string;
-    path: string;
+    slug: string;
     description?: string;
   }>();
 
   await c.var.services.collections.update(id, {
     title: body.title,
-    path: body.path,
+    slug: body.slug,
     description: body.description || undefined,
   });
 
@@ -506,17 +498,3 @@ collectionsRoutes.post("/:id/delete", async (c) => {
 
   return dsRedirect("/dash/collections");
 });
-
-// Remove post from collection
-collectionsRoutes.post("/:id/remove-post", async (c) => {
-  const id = parseInt(c.req.param("id"), 10);
-  if (isNaN(id)) return c.notFound();
-
-  const body = await c.req.json<{ postId: number }>();
-
-  if (body.postId) {
-    await c.var.services.collections.removePost(id, body.postId);
-  }
-
-  return dsRedirect(`/dash/collections/${id}`);
-});

package/src/routes/dash/index.tsx

@@ -8,7 +8,7 @@ import { Hono } from "hono";
 import { Trans, useLingui } from "@lingui/react/macro";
 import type { Bindings } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import { DashLayout } from "../../theme/layouts/index.js";
+import { DashLayout } from "../../ui/layouts/DashLayout.js";
 import { getSiteName } from "../../lib/config.js";
 
 type Env = { Bindings: Bindings; Variables: AppVariables };
@@ -91,8 +91,8 @@ dashIndexRoutes.get("/", async (c) => {
 
   // Get some stats
   const allPosts = await c.var.services.posts.list({ limit: 1000 });
-  const publishedPosts = allPosts.filter((p) => p.visibility !== "draft");
-  const draftPosts = allPosts.filter((p) => p.visibility === "draft");
+  const publishedPosts = allPosts.filter((p) => p.status !== "draft");
+  const draftPosts = allPosts.filter((p) => p.status === "draft");
 
   return c.html(
     <DashLayout c={c} title="Dashboard" siteName={siteName} currentPath="/dash">

package/src/routes/dash/media.tsx

@@ -10,8 +10,8 @@ import { Hono } from "hono";
 import { useLingui } from "@lingui/react/macro";
 import type { Bindings, Media } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import { DashLayout } from "../../theme/layouts/index.js";
-import { EmptyState, DangerZone } from "../../theme/components/index.js";
+import { DashLayout } from "../../ui/layouts/DashLayout.js";
+import { EmptyState, DangerZone } from "../../ui/dash/index.js";
 import * as time from "../../lib/time.js";
 import {
   getMediaUrl,