retypeset-odyssey 0.1.0

package/src/pages/[...lang]/posts/[slug].astro

@@ -0,0 +1,101 @@
+---
+import type { CollectionEntry } from 'astro:content'
+import type { Language } from '@/i18n/config'
+import { render } from 'astro:content'
+import Comment from '@/components/Comment/Index.astro'
+import PostDate from '@/components/PostDate.astro'
+import TagList from '@/components/TagList.astro'
+import BackButton from '@/components/Widgets/BackButton.astro'
+import TOC from '@/components/Widgets/TOC.astro'
+import { allLocales } from '@/config'
+import { getLangFromLocale, getLangRouteParam } from '@/i18n/lang'
+import Layout from '@/layouts/Layout.astro'
+import { getPostGroups, getPostSlug } from '@/utils/content'
+import { getPostDescription } from '@/utils/description'
+
+export async function getStaticPaths() {
+  const groups = await getPostGroups()
+
+  return allLocales.flatMap(lang => groups
+    .map((group) => {
+      const post = group.byLang[lang]
+      if (!post) {
+        return null
+      }
+
+      return {
+        params: {
+          lang: getLangRouteParam(lang),
+          slug: group.slug,
+        },
+        props: {
+          post,
+          supportedLangs: group.supportedLangs,
+        },
+      }
+    })
+    .filter(Boolean),
+  )
+}
+
+interface Props {
+  post: CollectionEntry<'posts'>
+  supportedLangs: Language[]
+}
+
+const { post, supportedLangs } = Astro.props as Props
+const currentLang = getLangFromLocale(Astro.currentLocale)
+const slug = getPostSlug(post)
+const description = getPostDescription(post, 'meta')
+const { Content, headings, remarkPluginFrontmatter } = await render(post)
+---
+
+<Layout
+  postTitle={post.data.title}
+  postDescription={description}
+  postSlug={post.id}
+  supportedLangs={supportedLangs}
+>
+  <article class="heti">
+    <div class="relative">
+      <BackButton />
+      <h1 class="post-title">
+        <span
+          transition:name={`post-${slug}${currentLang ? `-${currentLang}` : ''}`}
+          data-disable-theme-toggle-transition
+        >
+          {post.data.title}
+        </span>
+      </h1>
+    </div>
+
+    <div
+      id="post-date"
+      class="mb-17.2 block c-primary font-time"
+      transition:name={`time-${slug}${currentLang ? `-${currentLang}` : ''}`}
+      data-disable-theme-toggle-transition
+    >
+      <PostDate
+        date={post.data.published}
+        updatedDate={post.data.updated}
+        minutes={remarkPluginFrontmatter.minutes}
+      />
+    </div>
+
+    {post.data.toc && <TOC headings={headings} />}
+
+    <div id="post-content">
+      <Content />
+      <div id="post-copyright" />
+      {post.data.tags?.length > 0 && (
+        <div class="mt-12.6 uno-decorative-line" />
+        <TagList
+          tags={post.data.tags}
+          lang={currentLang}
+        />
+      )}
+      <Comment />
+    </div>
+  </article>
+</Layout>
+

package/src/pages/[...lang]/rss.xml.ts

@@ -0,0 +1,14 @@
+import type { APIContext } from 'astro'
+import { allLocales } from '@/config'
+import { getLangRouteParam } from '@/i18n/lang'
+import { generateRSS } from '@/utils/feed'
+
+export function getStaticPaths() {
+  return allLocales.map(lang => ({
+    params: { lang: getLangRouteParam(lang) },
+  }))
+}
+
+export async function GET(context: APIContext) {
+  return generateRSS(context)
+}

package/src/pages/[...lang]/search.astro

@@ -0,0 +1,65 @@
+---
+import { allLocales } from '@/config'
+import { getLangFromLocale, getLangRouteParam } from '@/i18n/lang'
+import { ui } from '@/i18n/ui'
+import Layout from '@/layouts/Layout.astro'
+
+export async function getStaticPaths() {
+  return allLocales.map(lang => ({
+    params: { lang: getLangRouteParam(lang) },
+  }))
+}
+
+const currentLang = getLangFromLocale(Astro.currentLocale)
+const currentUI = ui[currentLang as keyof typeof ui] ?? {}
+---
+
+<Layout>
+  <!-- Decorative Line -->
+  <div class="uno-decorative-line" />
+  <!-- Search -->
+  <div class="search-container">
+    <h1 class="text-4.5 c-primary font-bold mb-6">{currentUI.search}</h1>
+    <div id="search"></div>
+  </div>
+</Layout>
+
+<link href="/pagefind/pagefind-ui.css" rel="stylesheet" />
+<script is:inline src="/pagefind/pagefind-ui.js" type="text/javascript"></script>
+<script is:inline>
+  window.addEventListener('DOMContentLoaded', () => {
+    new PagefindUI({
+      element: '#search',
+      showImages: false,
+      showSubResults: true
+    });
+  });
+</script>
+
+<style is:global>
+  .pagefind-ui {
+    --pagefind-ui-scale: 0.9;
+    --pagefind-ui-primary: var(--c-primary);
+    --pagefind-ui-text: var(--c-text);
+    --pagefind-ui-background: var(--c-bg);
+    --pagefind-ui-border: var(--c-secondary);
+    --pagefind-ui-border-width: 1px;
+    --pagefind-ui-border-radius: 4px;
+    --pagefind-ui-font: inherit;
+  }
+
+  .pagefind-ui__search-input {
+    font-size: 1rem !important;
+    padding: 0.75rem 1rem !important;
+  }
+
+  .pagefind-ui__result-link {
+    color: var(--c-primary) !important;
+    font-weight: 600 !important;
+  }
+
+  .pagefind-ui__result-excerpt {
+    color: var(--c-text) !important;
+    opacity: 0.8;
+  }
+</style>

package/src/pages/[...lang]/tags/[tag].astro

@@ -0,0 +1,53 @@
+---
+import PostList from '@/components/PostList.astro'
+import TagList from '@/components/TagList.astro'
+import { allLocales } from '@/config'
+import { getLangFromLocale, getLangRouteParam } from '@/i18n/lang'
+import Layout from '@/layouts/Layout.astro'
+import { getAllTags, getPostsByTag, getTagSupportedLangs, getTagsWithCounts } from '@/utils/content'
+
+export async function getStaticPaths() {
+  const paths = await Promise.all(allLocales.map(async (lang) => {
+    const langTags = await getAllTags(lang)
+    return langTags.map(tag => ({
+      // Astro 6 auto-encodes params for URLs and decodes them on route match,
+      // so we hand it the raw tag. Slashes are the one exception: a `/` would
+      // split the `[tag]` segment in two; pre-encode just that character so
+      // tags like `CI/CD` survive routing.
+      params: { lang: getLangRouteParam(lang), tag: tag.replace(/\//g, '%2F') },
+      props: { tag },
+    }))
+  }))
+  return paths.flat()
+}
+
+interface Props {
+  tag: string
+}
+
+const { tag } = Astro.props
+const currentLang = getLangFromLocale(Astro.currentLocale)
+const posts = await getPostsByTag(tag, currentLang)
+const tagsWithCounts = await getTagsWithCounts(currentLang)
+const supportedLangs = await getTagSupportedLangs(tag)
+---
+
+<Layout supportedLangs={supportedLangs}>
+  <!-- Decorative Line -->
+  <div class="uno-decorative-line" />
+  <!-- Tag List -->
+  <TagList
+    tags={tagsWithCounts}
+    currentTag={tag}
+    lang={currentLang}
+    cloudStyle={true}
+  />
+
+  <!-- Posts List -->
+  <div class="mt-10.5">
+    <PostList
+      posts={posts}
+      lang={currentLang}
+    />
+  </div>
+</Layout>

package/src/pages/[...lang]/tags/index.astro

@@ -0,0 +1,36 @@
+---
+import TagList from '@/components/TagList.astro'
+import { allLocales } from '@/config'
+import { getLangFromLocale, getLangRouteParam } from '@/i18n/lang'
+import { ui } from '@/i18n/ui'
+import Layout from '@/layouts/Layout.astro'
+import { getTagsWithCounts } from '@/utils/content'
+
+export async function getStaticPaths() {
+  return allLocales.map(lang => ({
+    params: { lang: getLangRouteParam(lang) },
+  }))
+}
+
+const currentLang = getLangFromLocale(Astro.currentLocale)
+const tagsWithCounts = await getTagsWithCounts(currentLang)
+const totalTags = tagsWithCounts.length
+const currentUI = ui[currentLang as keyof typeof ui] ?? {}
+---
+
+<Layout postTitle={currentUI.tags || 'Tags'}>
+  <section class="mb-7.5">
+    <h1 class="mb-2 text-5 font-bold cjk:tracking-wide lg:text-6">
+      {currentUI.tags || 'Tags'}
+    </h1>
+    <p class="mb-6 text-3.5 c-secondary">
+      {totalTags} {currentUI.tagsInTotal || 'tags in total'}
+    </p>
+    <div class="uno-decorative-line" />
+    <TagList
+      tags={tagsWithCounts}
+      lang={currentLang}
+      cloudStyle={true}
+    />
+  </section>
+</Layout>

package/src/pages/_dynamic/list.astro

@@ -0,0 +1,101 @@
+---
+/**
+ * Generic list page for dynamically-discovered content collections.
+ *
+ * Mounted at `/[...lang]/[collection]`; `getStaticPaths` enumerates every
+ * (lang, folder) combination, where `folder` is a directory under
+ * `content/` that the integration discovered. Literal-segment routes
+ * (`/posts`, `/notes`, `/about`, etc.) take priority over this dynamic
+ * pattern in Astro's router, so the built-ins are unaffected.
+ */
+
+import Pagination from '@/components/Pagination.astro'
+import PostDate from '@/components/PostDate.astro'
+import { allLocales, base, defaultLocale } from '@/config'
+import { getLangFromLocale, getLangRouteParam } from '@/i18n/lang'
+import Layout from '@/layouts/Layout.astro'
+import { getDynamicEntries, getDynamicSlug } from '@/utils/dynamic-collections'
+// eslint-disable-next-line ts/ban-ts-comment
+// @ts-ignore - virtual module provided by the integration
+import { dynamicCollections } from 'virtual:retypeset/dynamic-collections'
+
+export async function getStaticPaths() {
+  const paths: Array<{
+    params: { lang: string | undefined, collection: string }
+    props: { collection: string }
+  }> = []
+  for (const collection of dynamicCollections as string[]) {
+    for (const lang of allLocales) {
+      paths.push({
+        params: {
+          lang: getLangRouteParam(lang),
+          collection,
+        },
+        props: { collection },
+      })
+    }
+  }
+  return paths
+}
+
+const PER_PAGE = 7
+
+const { collection } = Astro.props as { collection: string }
+const currentLang = getLangFromLocale(Astro.currentLocale)
+const entries = await getDynamicEntries(collection, currentLang)
+const totalPages = Math.max(1, Math.ceil(entries.length / PER_PAGE))
+const pageEntries = entries.slice(0, PER_PAGE)
+const baseUrl = (currentLang === defaultLocale ? '' : `/${currentLang}`) + `/${collection}/`
+const title = collection.charAt(0).toUpperCase() + collection.slice(1)
+---
+
+<Layout postTitle={title}>
+  <section class="mb-7.5">
+    <h1 class="mb-2 text-5 font-bold cjk:tracking-wide lg:text-6">
+      {title}
+    </h1>
+    <div class="uno-decorative-line" />
+
+    {pageEntries.length > 0
+      ? (
+          <ul>
+            {pageEntries.map((entry) => {
+              const slug = getDynamicSlug(entry)
+              const href = (currentLang === defaultLocale ? '' : `/${currentLang}`)
+                + `/${collection}/${slug}`
+              return (
+                <li class="mb-5.5 lg:mb-7.5">
+                  <h3 class="inline transition-colors hover:c-primary">
+                    <a
+                      class="cjk:tracking-wide lg:font-medium lg:text-4.25"
+                      href={(base ? base : '') + href}
+                    >
+                      {entry.data.title}
+                    </a>
+                  </h3>
+                  <div class="py-0.8 text-3.5 font-time">
+                    <PostDate
+                      date={entry.data.published}
+                      updatedDate={entry.data.updated}
+                      minutes={entry.remarkPluginFrontmatter.minutes}
+                    />
+                  </div>
+                </li>
+              )
+            })}
+          </ul>
+        )
+      : (
+          <p class="mt-6 text-3.5 c-secondary">
+            No entries in this collection yet.
+          </p>
+        )}
+
+    <Pagination
+      currentPage={1}
+      totalPages={totalPages}
+      baseUrl={(base ? base : '') + baseUrl}
+      pagePrefix="page"
+    />
+  </section>
+</Layout>

package/src/pages/_dynamic/slug.astro

@@ -0,0 +1,100 @@
+---
+/**
+ * Generic detail page for dynamically-discovered content collections.
+ *
+ * Mounted at `/[...lang]/[collection]/[slug]`. `getStaticPaths` walks every
+ * (lang, collection, slug) triple that exists in the dynamic folders, so
+ * Astro will not try to render this template for any URL the integration
+ * didn't anticipate.
+ */
+
+import type { Language } from '@/i18n/config'
+import { render } from 'astro:content'
+import PostDate from '@/components/PostDate.astro'
+import BackButton from '@/components/Widgets/BackButton.astro'
+import TOC from '@/components/Widgets/TOC.astro'
+import { allLocales } from '@/config'
+import { getLangRouteParam } from '@/i18n/lang'
+import Layout from '@/layouts/Layout.astro'
+import {
+  type DynamicEntry,
+  getDynamicGroups,
+} from '@/utils/dynamic-collections'
+// eslint-disable-next-line ts/ban-ts-comment
+// @ts-ignore - virtual module provided by the integration
+import { dynamicCollections } from 'virtual:retypeset/dynamic-collections'
+
+export async function getStaticPaths() {
+  const paths: Array<{
+    params: { lang: string | undefined, collection: string, slug: string }
+    props: { entry: DynamicEntry, supportedLangs: Language[], collection: string }
+  }> = []
+
+  for (const collection of dynamicCollections as string[]) {
+    const groups = await getDynamicGroups(collection)
+    for (const lang of allLocales) {
+      for (const group of groups) {
+        const entry = group.byLang[lang]
+        if (!entry)
+          continue
+        paths.push({
+          params: {
+            lang: getLangRouteParam(lang),
+            collection,
+            slug: group.slug,
+          },
+          props: {
+            entry,
+            supportedLangs: group.supportedLangs,
+            collection,
+          },
+        })
+      }
+    }
+  }
+  return paths
+}
+
+interface Props {
+  entry: DynamicEntry
+  supportedLangs: Language[]
+  collection: string
+}
+
+const { entry, supportedLangs, collection } = Astro.props as Props
+const { Content, headings, remarkPluginFrontmatter } = await render(entry)
+---
+
+<Layout
+  postTitle={entry.data.title}
+  postSlug={`${collection}/${entry.id}`}
+  supportedLangs={supportedLangs}
+>
+  <article class="heti">
+    <div class="relative">
+      <BackButton />
+      <h1 class="post-title">
+        <span data-disable-theme-toggle-transition>
+          {entry.data.title}
+        </span>
+      </h1>
+    </div>
+
+    <div
+      class="mb-17.2 block c-primary font-time"
+      data-disable-theme-toggle-transition
+    >
+      <PostDate
+        date={entry.data.published}
+        updatedDate={entry.data.updated}
+        minutes={remarkPluginFrontmatter.minutes}
+      />
+    </div>
+
+    {entry.data.toc && <TOC headings={headings} />}
+
+    <div id="post-content">
+      <Content />
+    </div>
+  </article>
+</Layout>

package/src/pages/og/[...image].ts

@@ -0,0 +1,114 @@
+import type { CollectionEntry } from 'astro:content'
+import { createRequire } from 'node:module'
+import { dirname, join } from 'node:path'
+import { OGImageRoute } from 'astro-og-canvas'
+import { getCollection } from 'astro:content'
+import { getJournalDescription, getNoteDescription, getPostDescription } from '@/utils/description'
+
+// Resolve font paths from the theme package's installed location.
+// Use createRequire so it works whether the theme is the project root (./public/fonts)
+// or installed under node_modules/retypeset-odyssey/public/fonts.
+const themeRequire = createRequire(import.meta.url)
+let themeRoot: string
+try {
+  themeRoot = dirname(themeRequire.resolve('retypeset-odyssey/package.json'))
+}
+catch {
+  // Fallback: theme IS the project root (template/standalone use case)
+  themeRoot = process.cwd()
+}
+const FONT_BOLD = join(themeRoot, 'public/fonts/NotoSansSC-Bold.otf')
+const FONT_REGULAR = join(themeRoot, 'public/fonts/NotoSansSC-Regular.otf')
+const OG_LOGO = join(themeRoot, 'public/icons/og-logo.png')
+
+// eslint-disable-next-line antfu/no-top-level-await
+const posts = await getCollection('posts')
+// eslint-disable-next-line antfu/no-top-level-await
+let notes: CollectionEntry<'notes'>[] = []
+try {
+  // eslint-disable-next-line antfu/no-top-level-await
+  notes = await getCollection('notes')
+}
+catch (error) {
+  const message = error instanceof Error ? error.message : String(error)
+  if (!message.includes('The collection "notes" does not exist')) {
+    throw error
+  }
+}
+
+// eslint-disable-next-line antfu/no-top-level-await
+let journals: CollectionEntry<'journals'>[] = []
+try {
+  // eslint-disable-next-line antfu/no-top-level-await
+  journals = await getCollection('journals')
+}
+catch (error) {
+  const message = error instanceof Error ? error.message : String(error)
+  if (!message.includes('The collection "journals" does not exist')) {
+    throw error
+  }
+}
+
+// Create slug-to-metadata lookup object for blog posts
+type OGPage = {
+  title: string
+  description: string
+}
+
+const pages = Object.fromEntries([
+  ...posts.map((post: CollectionEntry<'posts'>) => [
+    post.id,
+    {
+      title: post.data.title,
+      description: getPostDescription(post, 'og'),
+    },
+  ]),
+  ...notes.map((note: CollectionEntry<'notes'>) => [
+    `notes/${note.id}`,
+    {
+      title: note.data.title,
+      description: getNoteDescription(note, 'og'),
+    },
+  ]),
+  ...journals.map((journal: CollectionEntry<'journals'>) => [
+    `journals/${journal.id}`,
+    {
+      title: journal.data.title,
+      description: getJournalDescription(journal, 'og'),
+    },
+  ]),
+]) as Record<string, OGPage>
+
+// Configure Open Graph image generation route
+// eslint-disable-next-line antfu/no-top-level-await
+export const { getStaticPaths, GET } = await OGImageRoute({
+  param: 'image',
+  pages,
+  getImageOptions: (_path, page) => ({
+    title: page.title,
+    description: page.description,
+    logo: {
+      path: OG_LOGO,
+      size: [250],
+    },
+    border: {
+      color: [242, 241, 245],
+      width: 20,
+    },
+    font: {
+      title: {
+        families: ['Noto Sans SC'],
+        weight: 'Bold',
+        color: [34, 33, 36],
+        lineHeight: 1.5,
+      },
+      description: {
+        families: ['Noto Sans SC'],
+        color: [72, 71, 74],
+        lineHeight: 1.5,
+      },
+    },
+    fonts: [FONT_BOLD, FONT_REGULAR],
+    bgGradient: [[242, 241, 245]],
+  }),
+})

package/src/pages/robots.txt.ts

@@ -0,0 +1,20 @@
+import type { APIRoute } from 'astro'
+import { base } from '@/config'
+
+export const GET: APIRoute = ({ site }) => {
+  const sitemapURL = new URL('sitemap-index.xml', site)
+
+  const robotsTxt = [
+    'User-agent: *',
+    'Allow: /',
+    `Disallow: ${base}/~partytown/`,
+    '',
+    `Sitemap: ${sitemapURL.href}`,
+  ].join('\n')
+
+  return new Response(robotsTxt, {
+    headers: {
+      'Content-Type': 'text/plain; charset=utf-8',
+    },
+  })
+}

package/src/plugins/rehype-code-copy-button.mjs

@@ -0,0 +1,82 @@
+import { SKIP, visit } from 'unist-util-visit'
+
+const copyIcon = {
+  type: 'element',
+  tagName: 'svg',
+  properties: {
+    'className': ['icon-copy'],
+    'viewBox': '0 0 24 24',
+    'fill': 'currentColor',
+    'aria-hidden': 'true',
+  },
+  children: [
+    {
+      type: 'element',
+      tagName: 'path',
+      properties: { d: 'M6.9.8v18h14.5V.8zm12.8 16h-11v-14h11z' },
+      children: [],
+    },
+    {
+      type: 'element',
+      tagName: 'path',
+      properties: { d: 'M4.3 21.2V5.6l-1.7.5v17.1h14.3l.6-2z' },
+      children: [],
+    },
+  ],
+}
+
+const checkIcon = {
+  type: 'element',
+  tagName: 'svg',
+  properties: {
+    'className': ['icon-check'],
+    'viewBox': '0 0 24 24',
+    'fill': 'currentColor',
+    'aria-hidden': 'true',
+  },
+  children: [
+    {
+      type: 'element',
+      tagName: 'path',
+      properties: { d: 'm23.1 6.4-1.3-1.3L9.4 16.6l-6.3-5.4-1.2 1.2L9.4 20z' },
+      children: [],
+    },
+  ],
+}
+
+export function rehypeCodeCopyButton() {
+  return (tree) => {
+    visit(tree, 'element', (node, index, parent) => {
+      if (node.tagName !== 'pre' || node.children?.[0]?.tagName !== 'code' || !parent) {
+        return
+      }
+
+      if (node._hasCopyButton) {
+        return
+      }
+
+      node._hasCopyButton = true
+
+      parent.children[index] = {
+        type: 'element',
+        tagName: 'div',
+        properties: { className: ['code-block-wrapper'] },
+        children: [
+          {
+            type: 'element',
+            tagName: 'button',
+            properties: {
+              'className': ['code-copy-button'],
+              'type': 'button',
+              'aria-label': 'Copy code',
+            },
+            children: [copyIcon, checkIcon],
+          },
+          node,
+        ],
+      }
+
+      return SKIP
+    })
+  }
+}