@jant/core 0.0.1

package/src/routes/dash/pages.tsx

@@ -0,0 +1,245 @@
+/**
+ * Dashboard Pages Routes
+ *
+ * Management for custom pages (posts with type="page")
+ */
+
+import { Hono } from "hono";
+import { useLingui } from "../../i18n/index.js";
+import type { Bindings, Post } from "../../types.js";
+import type { AppVariables } from "../../app.js";
+import { DashLayout } from "../../theme/layouts/index.js";
+import { PageForm, VisibilityBadge, EmptyState, ListItemRow, ActionButtons, CrudPageHeader, DangerZone } from "../../theme/components/index.js";
+import * as sqid from "../../lib/sqid.js";
+import * as time from "../../lib/time.js";
+import { VisibilitySchema, parseFormData } from "../../lib/schemas.js";
+
+type Env = { Bindings: Bindings; Variables: AppVariables };
+
+export const pagesRoutes = new Hono<Env>();
+
+function PagesListContent({ pages }: { pages: Post[] }) {
+  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/${sqid.encode(page.id)}/edit`}
+                  editLabel={t({ message: "Edit", comment: "@context: Button to edit page" })}
+                  viewHref={page.visibility !== "draft" && page.path ? `/${page.path}` : undefined}
+                  viewLabel={t({ message: "View", comment: "@context: Button to view page on public site" })}
+                />
+              }
+            >
+              <div class="flex items-center gap-2 mb-1">
+                <VisibilityBadge visibility={page.visibility} />
+                <span class="text-xs text-muted-foreground">
+                  {time.formatDate(page.updatedAt)}
+                </span>
+              </div>
+              <a
+                href={`/dash/pages/${sqid.encode(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.path}
+              </p>
+            </ListItemRow>
+          ))}
+        </div>
+      )}
+    </>
+  );
+}
+
+function NewPageContent() {
+  const { t } = useLingui();
+  return (
+    <>
+      <h1 class="text-2xl font-semibold mb-6">
+        {t({ message: "New Page", comment: "@context: New page main heading" })}
+      </h1>
+      <PageForm action="/dash/pages" />
+    </>
+  );
+}
+
+function ViewPageContent({ page }: { page: Post }) {
+  const { t } = useLingui();
+  return (
+    <>
+      <div class="flex items-center justify-between mb-6">
+        <div>
+          <h1 class="text-2xl font-semibold">{page.title || t({ message: "Page", comment: "@context: Default page heading when untitled" })}</h1>
+          {page.path && (
+            <p class="text-muted-foreground mt-1">/{page.path}</p>
+          )}
+        </div>
+        <ActionButtons
+          editHref={`/dash/pages/${sqid.encode(page.id)}/edit`}
+          editLabel={t({ message: "Edit", comment: "@context: Button to edit page" })}
+          viewHref={page.visibility !== "draft" && page.path ? `/${page.path}` : undefined}
+          viewLabel={t({ message: "View", comment: "@context: Button to view page on public site" })}
+        />
+      </div>
+
+      <div class="card">
+        <section>
+          <div class="prose" dangerouslySetInnerHTML={{ __html: page.contentHtml || "" }} />
+        </section>
+      </div>
+
+      <DangerZone
+        actionLabel={t({ message: "Delete Page", comment: "@context: Button to delete page" })}
+        formAction={`/dash/pages/${sqid.encode(page.id)}/delete`}
+        confirmMessage="Are you sure you want to delete this page?"
+      />
+    </>
+  );
+}
+
+function EditPageContent({ page }: { page: Post }) {
+  const { t } = useLingui();
+  return (
+    <>
+      <h1 class="text-2xl font-semibold mb-6">
+        {t({ message: "Edit Page", comment: "@context: Edit page main heading" })}
+      </h1>
+      <PageForm page={page} action={`/dash/pages/${sqid.encode(page.id)}`} />
+    </>
+  );
+}
+
+// List pages
+pagesRoutes.get("/", async (c) => {
+  const pages = await c.var.services.posts.list({
+    type: "page",
+    visibility: ["unlisted", "draft"],
+    limit: 100,
+  });
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+
+  return c.html(
+    <DashLayout c={c} title="Pages" siteName={siteName} currentPath="/dash/pages">
+      <PagesListContent pages={pages} />
+    </DashLayout>
+  );
+});
+
+// New page form
+pagesRoutes.get("/new", async (c) => {
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+
+  return c.html(
+    <DashLayout c={c} title="New Page" siteName={siteName} currentPath="/dash/pages">
+      <NewPageContent />
+    </DashLayout>
+  );
+});
+
+// Create page
+pagesRoutes.post("/", async (c) => {
+  const formData = await c.req.formData();
+
+  const title = formData.get("title") as string;
+  const content = formData.get("content") as string;
+  const visibility = parseFormData(formData, "visibility", VisibilitySchema);
+  const path = formData.get("path") as string;
+
+  const page = await c.var.services.posts.create({
+    type: "page",
+    title,
+    content,
+    visibility,
+    path: path.toLowerCase().replace(/[^a-z0-9-]/g, "-"),
+  });
+
+  return c.redirect(`/dash/pages/${sqid.encode(page.id)}`);
+});
+
+// View single page
+pagesRoutes.get("/:id", async (c) => {
+  const id = sqid.decode(c.req.param("id"));
+  if (!id) return c.notFound();
+
+  const page = await c.var.services.posts.getById(id);
+  if (!page || page.type !== "page") return c.notFound();
+
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+
+  return c.html(
+    <DashLayout c={c} title={page.title || "Page"} siteName={siteName} currentPath="/dash/pages">
+      <ViewPageContent page={page} />
+    </DashLayout>
+  );
+});
+
+// Edit page form
+pagesRoutes.get("/:id/edit", async (c) => {
+  const id = sqid.decode(c.req.param("id"));
+  if (!id) return c.notFound();
+
+  const page = await c.var.services.posts.getById(id);
+  if (!page || page.type !== "page") return c.notFound();
+
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+
+  return c.html(
+    <DashLayout c={c} title={`Edit: ${page.title || "Page"}`} siteName={siteName} currentPath="/dash/pages">
+      <EditPageContent page={page} />
+    </DashLayout>
+  );
+});
+
+// Update page
+pagesRoutes.post("/:id", async (c) => {
+  const id = sqid.decode(c.req.param("id"));
+  if (!id) return c.notFound();
+
+  const formData = await c.req.formData();
+
+  const title = formData.get("title") as string;
+  const content = formData.get("content") as string;
+  const visibility = parseFormData(formData, "visibility", VisibilitySchema);
+  const path = formData.get("path") as string;
+
+  await c.var.services.posts.update(id, {
+    type: "page",
+    title,
+    content,
+    visibility,
+    path: path.toLowerCase().replace(/[^a-z0-9-]/g, "-"),
+  });
+
+  return c.redirect(`/dash/pages/${sqid.encode(id)}`);
+});
+
+// Delete page
+pagesRoutes.post("/:id/delete", async (c) => {
+  const id = sqid.decode(c.req.param("id"));
+  if (!id) return c.notFound();
+
+  await c.var.services.posts.delete(id);
+
+  return c.redirect("/dash/pages");
+});

package/src/routes/dash/posts.tsx

@@ -0,0 +1,202 @@
+/**
+ * Dashboard Posts Routes
+ */
+
+import { Hono } from "hono";
+import { z } from "zod";
+import { useLingui } from "../../i18n/index.js";
+import type { Bindings, Post } from "../../types.js";
+import type { AppVariables } from "../../app.js";
+import { DashLayout } from "../../theme/layouts/index.js";
+import { PostForm, PostList, CrudPageHeader, ActionButtons } from "../../theme/components/index.js";
+import * as sqid from "../../lib/sqid.js";
+import {
+  PostTypeSchema,
+  VisibilitySchema,
+  parseFormData,
+  parseFormDataOptional,
+} from "../../lib/schemas.js";
+
+type Env = { Bindings: Bindings; Variables: AppVariables };
+
+export const postsRoutes = new Hono<Env>();
+
+function PostsListContent({ posts }: { posts: Post[] }) {
+  const { t } = useLingui();
+  return (
+    <>
+      <CrudPageHeader
+        title={t({ message: "Posts", comment: "@context: Dashboard heading" })}
+        ctaLabel={t({ message: "New Post", comment: "@context: Button to create new post" })}
+        ctaHref="/dash/posts/new"
+      />
+      <PostList posts={posts} />
+    </>
+  );
+}
+
+function NewPostContent() {
+  const { t } = useLingui();
+  return (
+    <>
+      <h1 class="text-2xl font-semibold mb-6">{t({ message: "New Post", comment: "@context: Page heading" })}</h1>
+      <PostForm action="/dash/posts" />
+    </>
+  );
+}
+
+// List posts
+postsRoutes.get("/", async (c) => {
+  const posts = await c.var.services.posts.list({
+    visibility: ["featured", "quiet", "unlisted", "draft"],
+  });
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+
+  return c.html(
+    <DashLayout c={c} title="Posts" siteName={siteName} currentPath="/dash/posts">
+      <PostsListContent posts={posts} />
+    </DashLayout>
+  );
+});
+
+// New post form
+postsRoutes.get("/new", async (c) => {
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+
+  return c.html(
+    <DashLayout c={c} title="New Post" siteName={siteName} currentPath="/dash/posts">
+      <NewPostContent />
+    </DashLayout>
+  );
+});
+
+// Create post
+postsRoutes.post("/", async (c) => {
+  const formData = await c.req.formData();
+
+  // Validate and parse form data
+  const type = parseFormData(formData, "type", PostTypeSchema);
+  const visibility = parseFormData(formData, "visibility", VisibilitySchema);
+  const title = parseFormDataOptional(formData, "title", z.string());
+  const content = formData.get("content") as string;
+  const sourceUrl = parseFormDataOptional(formData, "sourceUrl", z.string());
+  const path = parseFormDataOptional(formData, "path", z.string());
+
+  const post = await c.var.services.posts.create({
+    type,
+    title,
+    content,
+    visibility,
+    sourceUrl,
+    path,
+  });
+
+  return c.redirect(`/dash/posts/${sqid.encode(post.id)}`);
+});
+
+function ViewPostContent({ post }: { post: Post }) {
+  const { t } = useLingui();
+  const defaultTitle = t({ message: "Post", comment: "@context: Default post title" });
+
+  return (
+    <>
+      <div class="flex items-center justify-between mb-6">
+        <h1 class="text-2xl font-semibold">{post.title || defaultTitle}</h1>
+        <ActionButtons
+          editHref={`/dash/posts/${sqid.encode(post.id)}/edit`}
+          editLabel={t({ message: "Edit", comment: "@context: Button to edit post" })}
+          viewHref={`/p/${sqid.encode(post.id)}`}
+          viewLabel={t({ message: "View", comment: "@context: Button to view post" })}
+        />
+      </div>
+
+      <div class="card">
+        <section>
+          <div class="prose" dangerouslySetInnerHTML={{ __html: post.contentHtml || "" }} />
+        </section>
+      </div>
+    </>
+  );
+}
+
+function EditPostContent({ post }: { post: Post }) {
+  const { t } = useLingui();
+  return (
+    <>
+      <h1 class="text-2xl font-semibold mb-6">{t({ message: "Edit Post", comment: "@context: Page heading" })}</h1>
+      <PostForm post={post} action={`/dash/posts/${sqid.encode(post.id)}`} />
+    </>
+  );
+}
+
+// View single post
+postsRoutes.get("/:id", async (c) => {
+  const id = sqid.decode(c.req.param("id"));
+  if (!id) return c.notFound();
+
+  const post = await c.var.services.posts.getById(id);
+  if (!post) return c.notFound();
+
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+  const pageTitle = post.title || "Post";
+
+  return c.html(
+    <DashLayout c={c} title={pageTitle} siteName={siteName} currentPath="/dash/posts">
+      <ViewPostContent post={post} />
+    </DashLayout>
+  );
+});
+
+// Edit post form
+postsRoutes.get("/:id/edit", async (c) => {
+  const id = sqid.decode(c.req.param("id"));
+  if (!id) return c.notFound();
+
+  const post = await c.var.services.posts.getById(id);
+  if (!post) return c.notFound();
+
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+
+  return c.html(
+    <DashLayout c={c} title={`Edit: ${post.title || "Post"}`} siteName={siteName} currentPath="/dash/posts">
+      <EditPostContent post={post} />
+    </DashLayout>
+  );
+});
+
+// Update post
+postsRoutes.post("/:id", async (c) => {
+  const id = sqid.decode(c.req.param("id"));
+  if (!id) return c.notFound();
+
+  const formData = await c.req.formData();
+
+  // Validate and parse form data
+  const type = parseFormData(formData, "type", PostTypeSchema);
+  const visibility = parseFormData(formData, "visibility", VisibilitySchema);
+  const title = parseFormDataOptional(formData, "title", z.string()) || null;
+  const content = parseFormDataOptional(formData, "content", z.string()) || null;
+  const sourceUrl = parseFormDataOptional(formData, "sourceUrl", z.string()) || null;
+  const path = parseFormDataOptional(formData, "path", z.string()) || null;
+
+  await c.var.services.posts.update(id, {
+    type,
+    title,
+    content,
+    visibility,
+    sourceUrl,
+    path,
+  });
+
+  return c.redirect(`/dash/posts/${sqid.encode(id)}`);
+});
+
+// Delete post
+postsRoutes.post("/:id/delete", async (c) => {
+  const id = sqid.decode(c.req.param("id"));
+  if (!id) return c.notFound();
+
+  await c.var.services.posts.delete(id);
+
+  return c.redirect("/dash/posts");
+});

package/src/routes/dash/redirects.tsx

@@ -0,0 +1,155 @@
+/**
+ * Dashboard Redirects Routes
+ */
+
+import { Hono } from "hono";
+import { useLingui } from "../../i18n/index.js";
+import type { Bindings, Redirect } from "../../types.js";
+import type { AppVariables } from "../../app.js";
+import { DashLayout } from "../../theme/layouts/index.js";
+import { EmptyState, ListItemRow, ActionButtons, CrudPageHeader } from "../../theme/components/index.js";
+
+type Env = { Bindings: Bindings; Variables: AppVariables };
+
+export const redirectsRoutes = new Hono<Env>();
+
+function RedirectsListContent({ redirects }: { redirects: Redirect[] }) {
+  const { t } = useLingui();
+
+  return (
+    <>
+      <CrudPageHeader
+        title={t({ message: "Redirects", comment: "@context: Dashboard heading" })}
+        ctaLabel={t({ message: "New Redirect", comment: "@context: Button to create new redirect" })}
+        ctaHref="/dash/redirects/new"
+      />
+
+      {redirects.length === 0 ? (
+        <EmptyState
+          message={t({ message: "No redirects configured.", comment: "@context: Empty state message" })}
+          ctaText={t({ message: "New Redirect", comment: "@context: Button to create new redirect" })}
+          ctaHref="/dash/redirects/new"
+        />
+      ) : (
+        <div class="flex flex-col divide-y">
+          {redirects.map((r) => (
+            <ListItemRow
+              key={r.id}
+              actions={
+                <ActionButtons
+                  deleteAction={`/dash/redirects/${r.id}/delete`}
+                  deleteLabel={t({ message: "Delete", comment: "@context: Button to delete redirect" })}
+                />
+              }
+            >
+              <div class="flex items-center gap-2">
+                <code class="text-sm bg-muted px-1 rounded">{r.fromPath}</code>
+                <span class="text-muted-foreground">→</span>
+                <code class="text-sm bg-muted px-1 rounded">{r.toPath}</code>
+                <span class="badge-outline">{r.type}</span>
+              </div>
+            </ListItemRow>
+          ))}
+        </div>
+      )}
+    </>
+  );
+}
+
+function NewRedirectContent() {
+  const { t } = useLingui();
+
+  return (
+    <>
+      <h1 class="text-2xl font-semibold mb-6">{t({ message: "New Redirect", comment: "@context: Page heading" })}</h1>
+
+      <form method="post" action="/dash/redirects" class="flex flex-col gap-4 max-w-lg">
+        <div class="field">
+          <label class="label">{t({ message: "From Path", comment: "@context: Redirect form field" })}</label>
+          <input
+            type="text"
+            name="fromPath"
+            class="input"
+            placeholder="/old-path"
+            required
+          />
+          <p class="text-xs text-muted-foreground mt-1">{t({ message: "The path to redirect from", comment: "@context: Redirect from path help text" })}</p>
+        </div>
+
+        <div class="field">
+          <label class="label">{t({ message: "To Path", comment: "@context: Redirect form field" })}</label>
+          <input
+            type="text"
+            name="toPath"
+            class="input"
+            placeholder="/new-path or https://..."
+            required
+          />
+          <p class="text-xs text-muted-foreground mt-1">{t({ message: "The destination path or URL", comment: "@context: Redirect to path help text" })}</p>
+        </div>
+
+        <div class="field">
+          <label class="label">{t({ message: "Type", comment: "@context: Redirect form field" })}</label>
+          <select name="type" class="select">
+            <option value="301">{t({ message: "301 (Permanent)", comment: "@context: Redirect type option" })}</option>
+            <option value="302">{t({ message: "302 (Temporary)", comment: "@context: Redirect type option" })}</option>
+          </select>
+        </div>
+
+        <div class="flex gap-2">
+          <button type="submit" class="btn">
+            {t({ message: "Create Redirect", comment: "@context: Button to save new redirect" })}
+          </button>
+          <a href="/dash/redirects" class="btn-outline">
+            {t({ message: "Cancel", comment: "@context: Button to cancel form" })}
+          </a>
+        </div>
+      </form>
+    </>
+  );
+}
+
+// List redirects
+redirectsRoutes.get("/", async (c) => {
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+  const redirects = await c.var.services.redirects.list();
+
+  return c.html(
+    <DashLayout c={c} title="Redirects" siteName={siteName} currentPath="/dash/redirects">
+      <RedirectsListContent redirects={redirects} />
+    </DashLayout>
+  );
+});
+
+// New redirect form
+redirectsRoutes.get("/new", async (c) => {
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+
+  return c.html(
+    <DashLayout c={c} title="New Redirect" siteName={siteName} currentPath="/dash/redirects">
+      <NewRedirectContent />
+    </DashLayout>
+  );
+});
+
+// Create redirect
+redirectsRoutes.post("/", async (c) => {
+  const formData = await c.req.formData();
+
+  const fromPath = formData.get("fromPath") as string;
+  const toPath = formData.get("toPath") as string;
+  const type = parseInt(formData.get("type") as string, 10) as 301 | 302;
+
+  await c.var.services.redirects.create(fromPath, toPath, type);
+
+  return c.redirect("/dash/redirects");
+});
+
+// Delete redirect
+redirectsRoutes.post("/:id/delete", async (c) => {
+  const id = parseInt(c.req.param("id"), 10);
+  if (!isNaN(id)) {
+    await c.var.services.redirects.delete(id);
+  }
+  return c.redirect("/dash/redirects");
+});

package/src/routes/dash/settings.tsx

@@ -0,0 +1,93 @@
+/**
+ * Dashboard Settings Routes
+ */
+
+import { Hono } from "hono";
+import { useLingui } from "../../i18n/index.js";
+import type { Bindings } from "../../types.js";
+import type { AppVariables } from "../../app.js";
+import { DashLayout } from "../../theme/layouts/index.js";
+
+type Env = { Bindings: Bindings; Variables: AppVariables };
+
+export const settingsRoutes = new Hono<Env>();
+
+function SettingsContent({ siteName, siteDescription, siteLanguage }: { siteName: string; siteDescription: string; siteLanguage: string }) {
+  const { t } = useLingui();
+
+  return (
+    <>
+      <h1 class="text-2xl font-semibold mb-6">{t({ message: "Settings", comment: "@context: Dashboard heading" })}</h1>
+
+      <form method="post" action="/dash/settings" class="flex flex-col gap-6 max-w-lg">
+        <div class="card">
+          <header>
+            <h2>{t({ message: "General", comment: "@context: Settings section heading" })}</h2>
+          </header>
+          <section class="flex flex-col gap-4">
+            <div class="field">
+              <label class="label">{t({ message: "Site Name", comment: "@context: Settings form field" })}</label>
+              <input type="text" name="siteName" class="input" value={siteName} required />
+            </div>
+
+            <div class="field">
+              <label class="label">{t({ message: "Site Description", comment: "@context: Settings form field" })}</label>
+              <textarea name="siteDescription" class="textarea" rows={3}>
+                {siteDescription}
+              </textarea>
+            </div>
+
+            <div class="field">
+              <label class="label">{t({ message: "Language", comment: "@context: Settings form field" })}</label>
+              <select name="siteLanguage" class="select">
+                <option value="en" selected={siteLanguage === "en"}>
+                  English
+                </option>
+                <option value="zh-Hans" selected={siteLanguage === "zh-Hans"}>
+                  简体中文
+                </option>
+                <option value="zh-Hant" selected={siteLanguage === "zh-Hant"}>
+                  繁體中文
+                </option>
+              </select>
+            </div>
+          </section>
+        </div>
+
+        <button type="submit" class="btn">
+          {t({ message: "Save Settings", comment: "@context: Button to save settings" })}
+        </button>
+      </form>
+    </>
+  );
+}
+
+// Settings page
+settingsRoutes.get("/", async (c) => {
+  const siteName = (await c.var.services.settings.get("SITE_NAME")) ?? "Jant";
+  const siteDescription = (await c.var.services.settings.get("SITE_DESCRIPTION")) ?? "";
+  const siteLanguage = (await c.var.services.settings.get("SITE_LANGUAGE")) ?? "en";
+
+  return c.html(
+    <DashLayout c={c} title="Settings" siteName={siteName} currentPath="/dash/settings">
+      <SettingsContent siteName={siteName} siteDescription={siteDescription} siteLanguage={siteLanguage} />
+    </DashLayout>
+  );
+});
+
+// Update settings
+settingsRoutes.post("/", async (c) => {
+  const formData = await c.req.formData();
+
+  const siteName = formData.get("siteName") as string;
+  const siteDescription = formData.get("siteDescription") as string;
+  const siteLanguage = formData.get("siteLanguage") as string;
+
+  await c.var.services.settings.setMany({
+    SITE_NAME: siteName,
+    SITE_DESCRIPTION: siteDescription,
+    SITE_LANGUAGE: siteLanguage,
+  });
+
+  return c.redirect("/dash/settings?saved=1");
+});