@jant/core 0.3.21 → 0.3.22

package/src/routes/feed/rss.ts

@@ -3,24 +3,27 @@
  */
 
 import { Hono } from "hono";
-import type { Bindings } from "../../types.js";
+import type { Context } from "hono";
+import type { Bindings, FeedData } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import * as sqid from "../../lib/sqid.js";
-import * as time from "../../lib/time.js";
-import { getMediaUrl, getPublicUrlForProvider } from "../../lib/image.js";
+import { defaultRssRenderer, defaultAtomRenderer } from "../../lib/feed.js";
+import { getSiteLanguage } from "../../lib/config.js";
+import { buildMediaMap } from "../../lib/media-helpers.js";
+import { createMediaContext, toPostViews } from "../../lib/view.js";
 
 type Env = { Bindings: Bindings; Variables: AppVariables };
 
 export const rssRoutes = new Hono<Env>();
 
-// RSS 2.0 Feed - main feed at /feed
-rssRoutes.get("/", async (c) => {
+/**
+ * Build FeedData from the Hono context.
+ */
+async function buildFeedData(c: Context<Env>): Promise<FeedData> {
   const all = await c.var.services.settings.getAll();
   const siteName = all["SITE_NAME"] ?? "Jant";
   const siteDescription = all["SITE_DESCRIPTION"] ?? "";
   const siteUrl = c.env.SITE_URL;
-  const r2PublicUrl = c.env.R2_PUBLIC_URL;
-  const s3PublicUrl = c.env.S3_PUBLIC_URL;
+  const siteLanguage = await getSiteLanguage(c);
 
   const posts = await c.var.services.posts.list({
     visibility: ["featured", "quiet"],
@@ -29,45 +32,41 @@ rssRoutes.get("/", async (c) => {
 
   // Batch load media for enclosures
   const postIds = posts.map((p) => p.id);
-  const mediaMap = await c.var.services.media.getByPostIds(postIds);
-
-  const items = posts
-    .map((post) => {
-      const link = `${siteUrl}/p/${sqid.encode(post.id)}`;
-      const title = post.title || `Post #${post.id}`;
-      const pubDate = new Date(post.publishedAt * 1000).toUTCString();
-
-      // Add enclosure for first media attachment
-      const postMedia = mediaMap.get(post.id);
-      const firstMedia = postMedia?.[0];
-      const enclosure = firstMedia
-        ? `\n      <enclosure url="${getMediaUrl(firstMedia.id, firstMedia.storageKey, getPublicUrlForProvider(firstMedia.provider, r2PublicUrl, s3PublicUrl))}" length="${firstMedia.size}" type="${firstMedia.mimeType}"/>`
-        : "";
+  const rawMediaMap = await c.var.services.media.getByPostIds(postIds);
+  const mediaCtx = createMediaContext(c);
+  const mediaMap = buildMediaMap(
+    rawMediaMap,
+    mediaCtx.r2PublicUrl,
+    mediaCtx.imageTransformUrl,
+    mediaCtx.s3PublicUrl,
+  );
+
+  // Transform to PostView[] with media
+  const postViews = toPostViews(
+    posts.map((p) => ({
+      ...p,
+      mediaAttachments: mediaMap.get(p.id) ?? [],
+    })),
+    mediaCtx,
+  );
+
+  return {
+    siteName,
+    siteDescription,
+    siteUrl,
+    siteLanguage,
+    posts: postViews,
+  };
+}
 
-      return `
-    <item>
-      <title><![CDATA[${escapeXml(title)}]]></title>
-      <link>${link}</link>
-      <guid isPermaLink="true">${link}</guid>
-      <pubDate>${pubDate}</pubDate>
-      <description><![CDATA[${post.contentHtml || ""}]]></description>${enclosure}
-    </item>`;
-    })
-    .join("");
+// RSS 2.0 Feed - main feed at /feed
+rssRoutes.get("/", async (c) => {
+  const feedData = await buildFeedData(c);
 
-  const rss = `<?xml version="1.0" encoding="UTF-8"?>
-<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
-  <channel>
-    <title>${escapeXml(siteName)}</title>
-    <link>${siteUrl}</link>
-    <description>${escapeXml(siteDescription)}</description>
-    <language>en</language>
-    <atom:link href="${siteUrl}/feed" rel="self" type="application/rss+xml"/>
-    ${items}
-  </channel>
-</rss>`;
+  const renderer = c.var.config.theme?.feed?.rss ?? defaultRssRenderer;
+  const xml = renderer(feedData);
 
-  return new Response(rss, {
+  return new Response(xml, {
     headers: {
       "Content-Type": "application/rss+xml; charset=utf-8",
     },
@@ -76,60 +75,14 @@ rssRoutes.get("/", async (c) => {
 
 // Atom Feed
 rssRoutes.get("/atom.xml", async (c) => {
-  const all = await c.var.services.settings.getAll();
-  const siteName = all["SITE_NAME"] ?? "Jant";
-  const siteDescription = all["SITE_DESCRIPTION"] ?? "";
-  const siteUrl = c.env.SITE_URL;
-
-  const posts = await c.var.services.posts.list({
-    visibility: ["featured", "quiet"],
-    limit: 50,
-  });
+  const feedData = await buildFeedData(c);
 
-  const entries = posts
-    .map((post) => {
-      const link = `${siteUrl}/p/${sqid.encode(post.id)}`;
-      const title = post.title || `Post #${post.id}`;
-      const updated = time.toISOString(post.updatedAt);
-      const published = time.toISOString(post.publishedAt);
+  const renderer = c.var.config.theme?.feed?.atom ?? defaultAtomRenderer;
+  const xml = renderer(feedData);
 
-      return `
-  <entry>
-    <title>${escapeXml(title)}</title>
-    <link href="${link}" rel="alternate"/>
-    <id>${link}</id>
-    <published>${published}</published>
-    <updated>${updated}</updated>
-    <content type="html"><![CDATA[${post.contentHtml || ""}]]></content>
-  </entry>`;
-    })
-    .join("");
-
-  const now = time.toISOString(time.now());
-
-  const atom = `<?xml version="1.0" encoding="UTF-8"?>
-<feed xmlns="http://www.w3.org/2005/Atom">
-  <title>${escapeXml(siteName)}</title>
-  <subtitle>${escapeXml(siteDescription)}</subtitle>
-  <link href="${siteUrl}" rel="alternate"/>
-  <link href="${siteUrl}/feed/atom.xml" rel="self"/>
-  <id>${siteUrl}/</id>
-  <updated>${now}</updated>
-  ${entries}
-</feed>`;
-
-  return new Response(atom, {
+  return new Response(xml, {
     headers: {
       "Content-Type": "application/atom+xml; charset=utf-8",
     },
   });
 });
-
-function escapeXml(str: string): string {
-  return str
-    .replace(/&/g, "&amp;")
-    .replace(/</g, "&lt;")
-    .replace(/>/g, "&gt;")
-    .replace(/"/g, "&quot;")
-    .replace(/'/g, "&apos;");
-}

package/src/routes/feed/sitemap.ts

@@ -5,8 +5,8 @@
 import { Hono } from "hono";
 import type { Bindings } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import * as sqid from "../../lib/sqid.js";
-import * as time from "../../lib/time.js";
+import { defaultSitemapRenderer } from "../../lib/feed.js";
+import { createMediaContext, toPostViewsFromPosts } from "../../lib/view.js";
 
 type Env = { Bindings: Bindings; Variables: AppVariables };
 
@@ -21,36 +21,14 @@ sitemapRoutes.get("/sitemap.xml", async (c) => {
     limit: 1000,
   });
 
-  const urls = posts
-    .map((post) => {
-      const loc = `${siteUrl}/p/${sqid.encode(post.id)}`;
-      const lastmod = time.toISOString(post.updatedAt).split("T")[0];
-      const priority = post.visibility === "featured" ? "0.8" : "0.6";
+  // Transform to PostView[]
+  const mediaCtx = createMediaContext(c);
+  const postViews = toPostViewsFromPosts(posts, mediaCtx);
 
-      return `
-  <url>
-    <loc>${loc}</loc>
-    <lastmod>${lastmod}</lastmod>
-    <priority>${priority}</priority>
-  </url>`;
-    })
-    .join("");
+  const renderer = c.var.config.theme?.feed?.sitemap ?? defaultSitemapRenderer;
+  const xml = renderer({ siteUrl, posts: postViews });
 
-  // Add homepage
-  const homepageUrl = `
-  <url>
-    <loc>${siteUrl}/</loc>
-    <priority>1.0</priority>
-    <changefreq>daily</changefreq>
-  </url>`;
-
-  const sitemap = `<?xml version="1.0" encoding="UTF-8"?>
-<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
-  ${homepageUrl}
-  ${urls}
-</urlset>`;
-
-  return new Response(sitemap, {
+  return new Response(xml, {
     headers: {
       "Content-Type": "application/xml; charset=utf-8",
     },

package/src/routes/pages/archive.tsx

@@ -5,15 +5,13 @@
  */
 
 import { Hono } from "hono";
-import { useLingui } from "@lingui/react/macro";
-import type { Bindings, Post, PostType } from "../../types.js";
+import type { Bindings, PostType } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import { BaseLayout, SiteLayout } from "../../theme/layouts/index.js";
-import { Pagination } from "../../theme/components/index.js";
 import { POST_TYPES } from "../../types.js";
-import * as sqid from "../../lib/sqid.js";
-import * as time from "../../lib/time.js";
+import { ArchivePage as DefaultArchivePage } from "../../theme/pages/ArchivePage.js";
 import { getNavigationData } from "../../lib/navigation.js";
+import { renderPublicPage } from "../../lib/render.js";
+import { createMediaContext, toArchiveGroups } from "../../lib/view.js";
 
 type Env = { Bindings: Bindings; Variables: AppVariables };
 
@@ -21,191 +19,6 @@ const PAGE_SIZE = 50;
 
 export const archiveRoutes = new Hono<Env>();
 
-function getTypeLabel(type: string): string {
-  const { t } = useLingui();
-  const labels: Record<string, string> = {
-    note: t({ message: "Note", comment: "@context: Post type label - note" }),
-    article: t({
-      message: "Article",
-      comment: "@context: Post type label - article",
-    }),
-    link: t({ message: "Link", comment: "@context: Post type label - link" }),
-    quote: t({
-      message: "Quote",
-      comment: "@context: Post type label - quote",
-    }),
-    image: t({
-      message: "Image",
-      comment: "@context: Post type label - image",
-    }),
-    page: t({ message: "Page", comment: "@context: Post type label - page" }),
-  };
-  return labels[type] ?? type;
-}
-
-function getTypeLabelPlural(type: string): string {
-  const { t } = useLingui();
-  const labels: Record<string, string> = {
-    note: t({
-      message: "Notes",
-      comment: "@context: Post type label plural - notes",
-    }),
-    article: t({
-      message: "Articles",
-      comment: "@context: Post type label plural - articles",
-    }),
-    link: t({
-      message: "Links",
-      comment: "@context: Post type label plural - links",
-    }),
-    quote: t({
-      message: "Quotes",
-      comment: "@context: Post type label plural - quotes",
-    }),
-    image: t({
-      message: "Images",
-      comment: "@context: Post type label plural - images",
-    }),
-    page: t({
-      message: "Pages",
-      comment: "@context: Post type label plural - pages",
-    }),
-  };
-  return labels[type] ?? `${type}s`;
-}
-
-function formatYearMonth(yearMonth: string): string {
-  const [year, month] = yearMonth.split("-");
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- yearMonth format YYYY-MM guarantees both year and month exist
-  const date = new Date(parseInt(year!, 10), parseInt(month!, 10) - 1);
-  return date.toLocaleDateString("en-US", { year: "numeric", month: "long" });
-}
-
-function ArchiveContent({
-  displayPosts,
-  hasMore,
-  nextCursor,
-  type,
-  grouped,
-  replyCounts,
-}: {
-  displayPosts: Post[];
-  hasMore: boolean;
-  nextCursor?: number;
-  type?: string;
-  grouped: Map<string, Post[]>;
-  replyCounts: Map<number, number>;
-}) {
-  const { t } = useLingui();
-  const title = type
-    ? getTypeLabelPlural(type)
-    : t({ message: "Archive", comment: "@context: Archive page title" });
-
-  return (
-    <div>
-      <header class="mb-8">
-        <h1 class="text-2xl font-semibold">{title}</h1>
-
-        {/* Type filter */}
-        <nav class="flex flex-wrap gap-2 mt-4">
-          <a
-            href="/archive"
-            class={`badge ${!type ? "badge-primary" : "badge-outline"}`}
-          >
-            {t({
-              message: "All",
-              comment: "@context: Archive filter - all types",
-            })}
-          </a>
-          {POST_TYPES.filter((t) => t !== "page").map((typeKey) => (
-            <a
-              key={typeKey}
-              href={`/archive?type=${typeKey}`}
-              class={`badge ${type === typeKey ? "badge-primary" : "badge-outline"}`}
-            >
-              {getTypeLabelPlural(typeKey)}
-            </a>
-          ))}
-        </nav>
-      </header>
-
-      <main>
-        {displayPosts.length === 0 ? (
-          <p class="text-muted-foreground">
-            {t({
-              message: "No posts found.",
-              comment: "@context: Archive empty state",
-            })}
-          </p>
-        ) : (
-          Array.from(grouped.entries()).map(([yearMonth, monthPosts]) => (
-            <section key={yearMonth} class="mb-8">
-              <h2 class="text-lg font-medium mb-4 text-muted-foreground">
-                {formatYearMonth(yearMonth)}
-              </h2>
-              <div class="flex flex-col gap-3">
-                {monthPosts.map((post) => {
-                  const replyCount = replyCounts.get(post.id);
-                  return (
-                    <article key={post.id} class="flex items-baseline gap-4">
-                      <time
-                        class="text-sm text-muted-foreground w-12 shrink-0"
-                        datetime={time.toISOString(post.publishedAt)}
-                      >
-                        {new Date(post.publishedAt * 1000).getDate()}
-                      </time>
-                      <div class="flex-1 min-w-0">
-                        <a
-                          href={`/p/${sqid.encode(post.id)}`}
-                          class="hover:underline"
-                        >
-                          {post.title ||
-                            post.content?.slice(0, 80) ||
-                            `Post #${post.id}`}
-                        </a>
-                        {!type && (
-                          <span class="ml-2 badge-outline text-xs">
-                            {getTypeLabel(post.type)}
-                          </span>
-                        )}
-                        {replyCount && replyCount > 0 && (
-                          <span class="ml-2 text-xs text-muted-foreground">
-                            (
-                            {replyCount === 1
-                              ? t({
-                                  message: "1 reply",
-                                  comment:
-                                    "@context: Archive post reply indicator - single",
-                                })
-                              : t({
-                                  message: "{count} replies",
-                                  comment:
-                                    "@context: Archive post reply indicator - plural",
-                                  values: { count: String(replyCount) },
-                                })}
-                            )
-                          </span>
-                        )}
-                      </div>
-                    </article>
-                  );
-                })}
-              </div>
-            </section>
-          ))
-        )}
-      </main>
-
-      {/* Pagination */}
-      <Pagination
-        baseUrl={type ? `/archive?type=${type}` : "/archive"}
-        hasMore={hasMore}
-        nextCursor={nextCursor}
-      />
-    </div>
-  );
-}
-
 // Archive page - all posts
 archiveRoutes.get("/", async (c) => {
   const typeParam = c.req.query("type") as PostType | undefined;
@@ -230,10 +43,6 @@ archiveRoutes.get("/", async (c) => {
   const hasMore = posts.length > PAGE_SIZE;
   const displayPosts = hasMore ? posts.slice(0, PAGE_SIZE) : posts;
 
-  // Get reply counts for thread indicators
-  const postIds = displayPosts.map((p) => p.id);
-  const replyCounts = await c.var.services.posts.getReplyCounts(postIds);
-
   // Get next cursor
   const nextCursor =
     hasMore && displayPosts.length > 0
@@ -253,18 +62,24 @@ archiveRoutes.get("/", async (c) => {
     grouped.get(key)!.push(post);
   }
 
-  return c.html(
-    <BaseLayout title={`Archive - ${navData.siteName}`} c={c}>
-      <SiteLayout {...navData}>
-        <ArchiveContent
-          displayPosts={displayPosts}
-          hasMore={hasMore}
-          nextCursor={nextCursor}
-          type={type}
-          grouped={grouped}
-          replyCounts={replyCounts}
-        />
-      </SiteLayout>
-    </BaseLayout>,
-  );
+  // Transform to View Models
+  const mediaCtx = createMediaContext(c);
+  const groups = toArchiveGroups(grouped, mediaCtx);
+
+  const components = c.var.config.theme?.components;
+  const Page = components?.ArchivePage ?? DefaultArchivePage;
+
+  return renderPublicPage(c, {
+    title: `Archive - ${navData.siteName}`,
+    navData,
+    content: (
+      <Page
+        groups={groups}
+        hasMore={hasMore}
+        nextCursor={nextCursor}
+        type={type}
+        theme={components}
+      />
+    ),
+  });
 });

package/src/routes/pages/collection.tsx

@@ -3,77 +3,17 @@
  */
 
 import { Hono } from "hono";
-import { useLingui } from "@lingui/react/macro";
-import type { Bindings, Collection, Post } from "../../types.js";
+import type { Bindings } from "../../types.js";
 import type { AppVariables } from "../../app.js";
-import { BaseLayout, SiteLayout } from "../../theme/layouts/index.js";
-import * as sqid from "../../lib/sqid.js";
-import * as time from "../../lib/time.js";
+import { CollectionPage as DefaultCollectionPage } from "../../theme/pages/CollectionPage.js";
 import { getNavigationData } from "../../lib/navigation.js";
+import { renderPublicPage } from "../../lib/render.js";
+import { createMediaContext, toPostViewsFromPosts } from "../../lib/view.js";
 
 type Env = { Bindings: Bindings; Variables: AppVariables };
 
 export const collectionRoutes = new Hono<Env>();
 
-function CollectionContent({
-  collection,
-  posts,
-}: {
-  collection: Collection;
-  posts: Post[];
-}) {
-  const { t } = useLingui();
-
-  return (
-    <div>
-      <header class="mb-8">
-        <h1 class="text-2xl font-semibold">{collection.title}</h1>
-        {collection.description && (
-          <p class="text-muted-foreground mt-2">{collection.description}</p>
-        )}
-      </header>
-
-      <main class="flex flex-col gap-6">
-        {posts.length === 0 ? (
-          <p class="text-muted-foreground">
-            {t({
-              message: "No posts in this collection.",
-              comment: "@context: Empty state message",
-            })}
-          </p>
-        ) : (
-          posts.map((post) => (
-            <article key={post.id} class="h-entry">
-              {post.title && (
-                <h2 class="p-name text-lg font-medium mb-2">
-                  <a
-                    href={`/p/${sqid.encode(post.id)}`}
-                    class="u-url hover:underline"
-                  >
-                    {post.title}
-                  </a>
-                </h2>
-              )}
-              <div
-                class="e-content prose prose-sm"
-                dangerouslySetInnerHTML={{ __html: post.contentHtml || "" }}
-              />
-              <footer class="mt-2 text-sm text-muted-foreground">
-                <time
-                  class="dt-published"
-                  datetime={time.toISOString(post.publishedAt)}
-                >
-                  {time.formatDate(post.publishedAt)}
-                </time>
-              </footer>
-            </article>
-          ))
-        )}
-      </main>
-    </div>
-  );
-}
-
 collectionRoutes.get("/:path", async (c) => {
   const path = c.req.param("path");
 
@@ -83,15 +23,19 @@ collectionRoutes.get("/:path", async (c) => {
   const posts = await c.var.services.collections.getPosts(collection.id);
   const navData = await getNavigationData(c);
 
-  return c.html(
-    <BaseLayout
-      title={`${collection.title} - ${navData.siteName}`}
-      description={collection.description ?? undefined}
-      c={c}
-    >
-      <SiteLayout {...navData}>
-        <CollectionContent collection={collection} posts={posts} />
-      </SiteLayout>
-    </BaseLayout>,
-  );
+  // Transform to View Models
+  const mediaCtx = createMediaContext(c);
+  const postViews = toPostViewsFromPosts(posts, mediaCtx);
+
+  const components = c.var.config.theme?.components;
+  const Page = components?.CollectionPage ?? DefaultCollectionPage;
+
+  return renderPublicPage(c, {
+    title: `${collection.title} - ${navData.siteName}`,
+    description: collection.description ?? undefined,
+    navData,
+    content: (
+      <Page collection={collection} posts={postViews} theme={components} />
+    ),
+  });
 });