@hutusi/amytis 1.5.5

package/src/layouts/PostLayout.tsx

@@ -0,0 +1,118 @@
+import Link from 'next/link';
+import { getAuthorSlug, PostData } from '@/lib/markdown';
+import MarkdownRenderer from '@/components/MarkdownRenderer';
+import RelatedPosts from '@/components/RelatedPosts';
+import SeriesList from '@/components/SeriesList';
+import PostSidebar from '@/components/PostSidebar';
+import Comments from '@/components/Comments';
+import ExternalLinks from '@/components/ExternalLinks';
+import Tag from '@/components/Tag';
+import ReadingProgressBar from '@/components/ReadingProgressBar';
+import { siteConfig } from '../../site.config';
+import { t } from '@/lib/i18n';
+
+interface PostLayoutProps {
+  post: PostData;
+  relatedPosts?: PostData[];
+  seriesPosts?: PostData[];
+  seriesTitle?: string;
+}
+
+export default function PostLayout({ post, relatedPosts, seriesPosts, seriesTitle }: PostLayoutProps) {
+  const showToc = siteConfig.toc !== false && post.toc !== false && post.headings && post.headings.length > 0;
+  const hasSeries = !!(post.series && seriesPosts && seriesPosts.length > 0);
+  const showSidebar = showToc || hasSeries;
+
+  return (
+    <div className={`layout-container ${showSidebar ? 'lg:max-w-7xl' : 'lg:max-w-6xl'}`}>
+      <ReadingProgressBar />
+      <div className={showSidebar
+        ? 'grid grid-cols-1 lg:grid-cols-[280px_minmax(0,1fr)] gap-8 items-start'
+        : 'max-w-6xl mx-auto'
+      }>
+        {/* Left sidebar: series nav + page TOC */}
+        {showSidebar && (
+          <PostSidebar
+            seriesSlug={hasSeries ? post.series : undefined}
+            seriesTitle={hasSeries ? (seriesTitle || post.series) : undefined}
+            posts={hasSeries ? seriesPosts : undefined}
+            currentSlug={post.slug}
+            headings={showToc ? post.headings : []}
+          />
+        )}
+
+        <article className="min-w-0 max-w-3xl">
+          <header className="mb-16 border-b border-muted/10 pb-12">
+            {post.draft && (
+              <div className="mb-4">
+                <span className="text-xs font-bold text-red-500 bg-red-100 dark:bg-red-900/30 px-2 py-1 rounded tracking-widest inline-block">
+                  DRAFT
+                </span>
+              </div>
+            )}
+            <div className="flex items-center gap-3 text-xs font-sans text-muted mb-6">
+              <span className="uppercase tracking-widest font-semibold text-accent">
+                {post.category}
+              </span>
+              <span className="w-1 h-1 rounded-full bg-muted/30" />
+              <time className="font-mono">{post.date}</time>
+              <span className="w-1 h-1 rounded-full bg-muted/30" />
+              <span className="font-mono">{post.readingTime}</span>
+            </div>
+
+            <h1 className="text-4xl md:text-5xl font-serif font-bold text-heading leading-tight mb-6">
+              {post.title}
+            </h1>
+
+            <div className="flex items-center gap-2 mb-8 text-sm font-serif italic text-muted">
+              <span>{t('written_by')}</span>
+              <div className="flex items-center gap-1">
+                {post.authors.map((author, index) => (
+                  <span key={author} className="flex items-center">
+                    <Link
+                      href={`/authors/${getAuthorSlug(author)}`}
+                      className="text-foreground hover:text-accent no-underline transition-colors duration-200"
+                    >
+                      {author}
+                    </Link>
+                    {index < post.authors.length - 1 && <span className="mr-1">,</span>}
+                  </span>
+                ))}
+              </div>
+            </div>
+
+            {post.excerpt && (
+              <p className="text-xl text-foreground font-serif italic leading-relaxed mb-8">
+                {post.excerpt}
+              </p>
+            )}
+
+            {post.tags && post.tags.length > 0 && (
+              <div className="flex flex-wrap gap-2">
+                {post.tags.map((tag) => (
+                  <Tag key={tag} tag={tag} variant="default" />
+                ))}
+              </div>
+            )}
+          </header>
+
+          {hasSeries && (
+            <div className="lg:hidden mb-12">
+              <SeriesList seriesSlug={post.series!} seriesTitle={seriesTitle || post.series!} posts={seriesPosts!} currentSlug={post.slug} />
+            </div>
+          )}
+
+          <MarkdownRenderer content={post.content} latex={post.latex} slug={post.slug} />
+
+          {post.externalLinks && post.externalLinks.length > 0 && (
+            <ExternalLinks links={post.externalLinks} />
+          )}
+
+          <RelatedPosts posts={relatedPosts || []} />
+
+          <Comments slug={post.slug} />
+        </article>
+      </div>
+    </div>
+  );
+}

package/src/layouts/SimpleLayout.tsx

@@ -0,0 +1,31 @@
+import { PostData } from '@/lib/markdown';
+import MarkdownRenderer from '@/components/MarkdownRenderer';
+import SimpleLayoutHeader from '@/components/SimpleLayoutHeader';
+import { TranslationKey } from '@/i18n/translations';
+
+interface SimpleLayoutProps {
+  post: PostData;
+  titleKey?: TranslationKey;
+  subtitleKey?: TranslationKey;
+  titleOverride?: string | Record<string, string>;
+  subtitleOverride?: string | Record<string, string>;
+}
+
+export default function SimpleLayout({ post, titleKey, subtitleKey, titleOverride, subtitleOverride }: SimpleLayoutProps) {
+  return (
+    <div className="layout-main">
+      <article className="max-w-3xl mx-auto">
+        <SimpleLayoutHeader
+          title={post.title}
+          excerpt={post.excerpt}
+          titleKey={titleKey}
+          subtitleKey={subtitleKey}
+          titleOverride={titleOverride}
+          subtitleOverride={subtitleOverride}
+        />
+
+        <MarkdownRenderer content={post.content} latex={post.latex} slug={post.slug} />
+      </article>
+    </div>
+  );
+}

package/src/lib/i18n.ts

@@ -0,0 +1,35 @@
+import { translations, Language } from '@/i18n/translations';
+import { siteConfig } from '../../site.config';
+
+/**
+ * Server-side translation helper.
+ * For client components, use the `useLanguage()` hook instead.
+ */
+export const t = (key: keyof typeof translations.en) =>
+  translations[siteConfig.i18n.defaultLocale as Language]?.[key] || translations.en[key];
+
+export const tWith = (key: keyof typeof translations.en, params: Record<string, string | number>) => {
+  let result = t(key);
+  Object.entries(params).forEach(([k, v]) => {
+    result = result.split(`{${k}}`).join(String(v));
+  });
+  return result;
+};
+
+/**
+ * Resolve a locale-aware config value given an explicit language.
+ * Shared by both server-side resolveLocale() and client-side components.
+ */
+export function resolveLocaleValue(value: string | Record<string, string>, lang: string): string {
+  if (typeof value === 'string') return value;
+  return value[lang] || value.en || Object.values(value)[0] || '';
+}
+
+/**
+ * Resolve a config value that may be a plain string or a locale map.
+ * Uses the default locale from site config (server-side / build-time).
+ * e.g. "Hello" or { en: "Hello", zh: "你好" }
+ */
+export function resolveLocale(value: string | Record<string, string>): string {
+  return resolveLocaleValue(value, siteConfig.i18n.defaultLocale);
+}

package/src/lib/markdown.test.ts

@@ -0,0 +1,127 @@
+import { describe, expect, test } from "bun:test";
+import { generateExcerpt, calculateReadingTime, getHeadings, getAuthorSlug } from "./markdown";
+
+describe("markdown utils", () => {
+  describe("generateExcerpt", () => {
+    test("should return content as is if short enough", () => {
+      const text = "Hello world";
+      expect(generateExcerpt(text)).toBe("Hello world");
+    });
+
+    test("should truncate content longer than 160 chars", () => {
+      const longText = "a".repeat(200);
+      const excerpt = generateExcerpt(longText);
+      expect(excerpt.length).toBe(163); // 160 + "..."
+      expect(excerpt.endsWith("...")).toBe(true);
+    });
+
+    test("should strip markdown headers", () => {
+      const text = "# Header\nContent";
+      expect(generateExcerpt(text)).toBe("Header Content");
+    });
+
+    test("should strip bold and italic", () => {
+      const text = "This is **bold** and *italic*";
+      expect(generateExcerpt(text)).toBe("This is bold and italic");
+    });
+
+    test("should strip links but keep text", () => {
+      const text = "Check [this link](https://example.com)";
+      // generateExcerpt strips bold/italic markers and backticks but
+      // does not fully strip markdown link syntax
+      const result = generateExcerpt(text);
+      expect(result).toContain("this link");
+    });
+  });
+
+  describe("calculateReadingTime", () => {
+    test("short content returns 1 min read", () => {
+      const text = "Hello world, this is a short post.";
+      expect(calculateReadingTime(text)).toBe("1 min read");
+    });
+
+    test("600 words returns 3 min read", () => {
+      const words = Array(600).fill("word").join(" ");
+      expect(calculateReadingTime(words)).toBe("3 min read");
+    });
+
+    test("empty content returns 1 min read", () => {
+      expect(calculateReadingTime("")).toBe("1 min read");
+    });
+
+    test("strips markdown formatting before counting", () => {
+      // 400 actual words surrounded by markdown syntax
+      const words = Array(400).fill("**word**").join(" ");
+      const result = calculateReadingTime(words);
+      expect(result).toBe("2 min read");
+    });
+
+    test("counts Chinese characters for reading time", () => {
+      const han = "中".repeat(600);
+      expect(calculateReadingTime(han)).toBe("2 min read");
+    });
+
+    test("combines Latin words and Chinese characters", () => {
+      const latinWords = Array(200).fill("word").join(" ");
+      const han = "中".repeat(300);
+      const mixed = `${latinWords} ${han}`;
+      expect(calculateReadingTime(mixed)).toBe("2 min read");
+    });
+  });
+
+  describe("getHeadings", () => {
+    test("extracts H2 headings with slugified IDs", () => {
+      const content = "## Hello World\n\nSome text\n\n## Another Section";
+      const headings = getHeadings(content);
+      expect(headings).toHaveLength(2);
+      expect(headings[0]).toEqual({ id: "hello-world", text: "Hello World", level: 2 });
+      expect(headings[1]).toEqual({ id: "another-section", text: "Another Section", level: 2 });
+    });
+
+    test("extracts H3 headings", () => {
+      const content = "### Sub Section\n\nSome text";
+      const headings = getHeadings(content);
+      expect(headings).toHaveLength(1);
+      expect(headings[0]).toEqual({ id: "sub-section", text: "Sub Section", level: 3 });
+    });
+
+    test("preserves document order for mixed H2/H3", () => {
+      const content = "## First\n\n### Nested\n\n## Second";
+      const headings = getHeadings(content);
+      expect(headings).toHaveLength(3);
+      expect(headings[0].level).toBe(2);
+      expect(headings[1].level).toBe(3);
+      expect(headings[2].level).toBe(2);
+    });
+
+    test("ignores H1 and H4+ headings", () => {
+      const content = "# Title\n\n## Included\n\n#### Not Included\n\n##### Also Not";
+      const headings = getHeadings(content);
+      expect(headings).toHaveLength(1);
+      expect(headings[0].text).toBe("Included");
+    });
+
+    test("handles Unicode headings", () => {
+      const content = "## 核心特性\n\nContent\n\n## Résumé";
+      const headings = getHeadings(content);
+      expect(headings).toHaveLength(2);
+      expect(headings[0].text).toBe("核心特性");
+      expect(headings[0].id).toBeTruthy();
+      expect(headings[1].text).toBe("Résumé");
+    });
+
+    test("returns empty array for no headings", () => {
+      const content = "Just plain text with no headings at all.";
+      const headings = getHeadings(content);
+      expect(headings).toEqual([]);
+    });
+  });
+
+  describe("getAuthorSlug", () => {
+    test("creates stable, URL-safe slugs for author names", () => {
+      expect(getAuthorSlug("Amytis Team")).toBe("amytis-team");
+      expect(getAuthorSlug("[author]")).toBe("author");
+      expect(getAuthorSlug(" John Hu ")).toBe("john-hu");
+    });
+  });
+});