hd-garden 0.8.0 → 0.8.1

package/app/components/BlogArchive.tsx

@@ -17,6 +17,7 @@ import {
 } from "../lib/tag-filter";
 import { ContentEmptyState } from "./ContentEmptyState";
 import { siteHref } from "../lib/site-href";
+import { siteLang, ui } from "../lib/i18n";
 
 function day(value: string) {
   const date = new Date(value);
@@ -72,6 +73,7 @@ export function BlogArchiveFallback({ posts, series }: ArchiveData) {
 }
 
 function ArchiveView({ posts, series, selected, go }: ArchiveData & { selected: string[]; go: (next: string[]) => void }) {
+  const t = ui();
   const [compact, setCompact] = useState(false);
   const [expanded, setExpanded] = useState(false);
   const options = useMemo(() => tagOptions(posts, selected), [posts, selected]);
@@ -81,7 +83,7 @@ function ArchiveView({ posts, series, selected, go }: ArchiveData & { selected:
     .sort((left, right) => Date.parse(right.date) - Date.parse(left.date));
   const years = new Map<string, typeof filtered>();
   for (const post of filtered) {
-    const year = day(post.date).slice(0, 4) || "未知";
+    const year = day(post.date).slice(0, 4) || t.unknownYear;
     const list = years.get(year);
     if (list) list.push(post);
     else years.set(year, [post]);
@@ -92,7 +94,7 @@ function ArchiveView({ posts, series, selected, go }: ArchiveData & { selected:
       <div>
         {options.length ? (
           <div className="sh-tagfilter">
-            <ul className="sh-tagchips" aria-label="按标签筛选">
+            <ul className="sh-tagchips" aria-label={t.tagFilterLabel}>
               {shown.map((option) => (
                 <li key={option.tag}>
                   <button
@@ -111,7 +113,9 @@ function ArchiveView({ posts, series, selected, go }: ArchiveData & { selected:
               {hidden > 0 || expanded ? (
                 <li>
                   <button type="button" className="sh-tagmore" aria-expanded={expanded} onClick={() => setExpanded(!expanded)}>
-                    {expanded ? "收起" : `展开全部 ${options.length} 个标签`}
+                    {siteLang === "en"
+                      ? (expanded ? t.tagCollapse : t.tagExpandAll(options.length))
+                      : (expanded ? "收起" : `展开全部 ${options.length} 个标签`)}
                   </button>
                 </li>
               ) : null}
@@ -119,17 +123,17 @@ function ArchiveView({ posts, series, selected, go }: ArchiveData & { selected:
           </div>
         ) : null}
         <div className="sh-status">
-          <span aria-live="polite">{tagSummary(selected.length, filtered.length)}</span>
-          {selected.length ? <button type="button" onClick={() => go([])}>清除</button> : null}
-          <div className="sh-view" role="group" aria-label="列表密度">
-            <button type="button" aria-pressed={!compact} onClick={() => setCompact(false)}>摘要</button>
-            <button type="button" aria-pressed={compact} onClick={() => setCompact(true)}>紧凑</button>
+          <span aria-live="polite">{tagSummary(selected.length, filtered.length, siteLang)}</span>
+          {selected.length ? <button type="button" onClick={() => go([])}>{siteLang === "en" ? t.tagClear : "清除"}</button> : null}
+          <div className="sh-view" role="group" aria-label={t.densityLabel}>
+            <button type="button" aria-pressed={!compact} onClick={() => setCompact(false)}>{t.densityDetailed}</button>
+            <button type="button" aria-pressed={compact} onClick={() => setCompact(true)}>{t.densityCompact}</button>
           </div>
         </div>
         <div id="sh-list" className={compact ? "is-compact" : undefined}>
           {filtered.length ? [...years.entries()].map(([year, entries]) => (
             <section className="sh-year" id={`y${year}`} key={year} aria-labelledby={`yh${year}`}>
-              <h2 id={`yh${year}`}>{year}<span className="n">{entries.length} 篇</span></h2>
+              <h2 id={`yh${year}`}>{year}<span className="n">{siteLang === "en" ? t.yearPostCount(entries.length) : <>{entries.length} 篇</>}</span></h2>
               <ol className="sh-rows">
                 {entries.map((post) => (
                   <li className="sh-row" key={post.path}>
@@ -137,7 +141,7 @@ function ArchiveView({ posts, series, selected, go }: ArchiveData & { selected:
                     <div className="archive-copy">
                       <h3>
                         <Link href={postHref(post)}>{post.title}</Link>
-                        {post.pinned ? <span className="pin">置顶</span> : null}
+                        {post.pinned ? <span className="pin">{t.pinnedBadge}</span> : null}
                       </h3>
                       {post.description ? <p>{post.description}</p> : null}
                     </div>
@@ -148,19 +152,19 @@ function ArchiveView({ posts, series, selected, go }: ArchiveData & { selected:
             </section>
           )) : selected.length ? (
             <div className="sh-tagempty">
-              <p>没有同时带这些标签的文章。</p>
+              <p>{siteLang === "en" ? t.tagEmptyMatch : "没有同时带这些标签的文章。"}</p>
               <div className="acts">
                 {selected.length > 1 ? (
-                  <button type="button" onClick={() => go(selected.slice(0, -1))}>去掉「{selected[selected.length - 1]}」</button>
+                  <button type="button" onClick={() => go(selected.slice(0, -1))}>{t.tagDropLast(selected[selected.length - 1])}</button>
                 ) : null}
-                <button type="button" onClick={() => go([])}>看全部文章</button>
+                <button type="button" onClick={() => go([])}>{t.browseAllPosts}</button>
               </div>
             </div>
           ) : <ContentEmptyState kind="posts" />}
         </div>
       </div>
-      <aside className="sh-rail" aria-label="按年份跳转">
-        {years.size ? <h2>按年份</h2> : null}
+      <aside className="sh-rail" aria-label={t.railJumpByYear}>
+        {years.size ? <h2>{t.railByYear}</h2> : null}
         <ol>
           {[...years.keys()].map((year) => (
             <li key={year}>
@@ -170,7 +174,7 @@ function ArchiveView({ posts, series, selected, go }: ArchiveData & { selected:
         </ol>
         {series.length ? (
           <>
-            <h2>专栏</h2>
+            <h2>{t.railColumns}</h2>
             <ol>
               {series.map((column) => (
                 <li key={column.slug}>

package/app/components/Comments.tsx

@@ -5,17 +5,16 @@ import { ui } from "../lib/i18n";
 
 export function Comments({ slug }: { slug: string }) {
   const config = readGiscusConfig();
+  const t = ui();
 
   return (
     <section className="comments" aria-labelledby={`comments-heading-${slug}`}>
       <div className="comments-heading">
         <ChatCircle size={23} />
         <div>
-          <h2 id={`comments-heading-${slug}`}>{ui().comments}</h2>
+          <h2 id={`comments-heading-${slug}`}>{t.comments}</h2>
           <p>
-            {config
-              ? "评论由 GitHub Discussions 保存和管理。"
-              : "评论还没开放。配好下面四项后，这里才会出现评论框。"}
+            {config ? t.commentsSummaryReady : t.commentsSummaryUnconfigured}
           </p>
         </div>
       </div>
@@ -26,14 +25,21 @@ export function Comments({ slug }: { slug: string }) {
         <div className="integration-notice">
           <GithubLogo size={20} weight="fill" />
           <p>
-            打开{" "}
-            <a href="https://giscus.app/zh-CN" target="_blank" rel="noreferrer">
+            {t.commentsSetupBefore}{" "}
+            <a href={t.commentsGiscusGuideUrl} target="_blank" rel="noreferrer">
               Giscus
             </a>
-            ，安装到一个已开启 Discussions 的公开仓库，把仓库、仓库 ID、分类、分类 ID
-            写入 <code>.env.local</code> 和 GitHub Actions Variables：
-            <code>GISCUS_REPO</code>、<code>GISCUS_REPO_ID</code>、
-            <code>GISCUS_CATEGORY</code>、<code>GISCUS_CATEGORY_ID</code>。
+            {t.commentsSetupMiddle}
+            <code>.env.local</code>
+            {t.commentsSetupAnd}
+            <code>GISCUS_REPO</code>
+            {t.commentsSetupJoin}
+            <code>GISCUS_REPO_ID</code>
+            {t.commentsSetupJoin}
+            <code>GISCUS_CATEGORY</code>
+            {t.commentsSetupJoin}
+            <code>GISCUS_CATEGORY_ID</code>
+            {t.commentsSetupEnd}
           </p>
         </div>
       )}

package/app/components/ContentEmptyState.tsx

@@ -3,35 +3,36 @@
 import Link from "next/link";
 import { ArrowRight, Article, Books, Quotes } from "@phosphor-icons/react/ssr";
 import { siteHref } from "../lib/site-href";
+import { ui } from "../lib/i18n";
 
-const emptyContent = {
-  posts: {
-    icon: Article,
-    eyebrow: "暂无博文",
-    title: "暂无博文。",
-    description: "文章会按时间排在这里。",
-    actionHref: "/",
-    actionLabel: "返回首页",
-  },
-  thoughts: {
-    icon: Quotes,
-    eyebrow: "暂无随想",
-    title: "暂无随想。",
-    description: "短笔记和链接会在这里。",
-    actionHref: "/blog",
-    actionLabel: "先读博文",
-  },
-  columns: {
-    icon: Books,
-    eyebrow: "暂无专栏",
-    title: "暂无专栏。",
-    description: "一组文章会按顺序列在这里。",
-    actionHref: "/blog",
-    actionLabel: "浏览全部博文",
-  },
-} as const;
-
-export function ContentEmptyState({ kind }: { kind: keyof typeof emptyContent }) {
+export function ContentEmptyState({ kind }: { kind: "posts" | "thoughts" | "columns" }) {
+  const s = ui();
+  const emptyContent = {
+    posts: {
+      icon: Article,
+      eyebrow: s.emptyPostsEyebrow,
+      title: s.emptyPostsTitle,
+      description: s.emptyPostsDesc,
+      actionHref: "/",
+      actionLabel: s.emptyPostsCta,
+    },
+    thoughts: {
+      icon: Quotes,
+      eyebrow: s.emptyThoughtsEyebrow,
+      title: s.emptyThoughtsTitle,
+      description: s.emptyThoughtsDesc,
+      actionHref: "/blog",
+      actionLabel: s.emptyThoughtsCta,
+    },
+    columns: {
+      icon: Books,
+      eyebrow: s.emptyColumnsEyebrow,
+      title: s.emptyColumnsTitle,
+      description: s.emptyColumnsDesc,
+      actionHref: "/blog",
+      actionLabel: s.emptyColumnsCta,
+    },
+  } as const;
   const content = emptyContent[kind];
   const Icon = content.icon;
 

package/app/components/ExternalEmbed.tsx

@@ -7,6 +7,7 @@ import {
   YoutubeLogo,
 } from "@phosphor-icons/react/ssr";
 import { parse } from "yaml";
+import { ui, type UiLang } from "../lib/i18n";
 
 type EmbedData = {
   url: string;
@@ -70,23 +71,23 @@ function playableUrl(provider: EmbedProvider, url: URL) {
   return null;
 }
 
-const providerCopy = {
-  youtube: { label: "YouTube", Icon: YoutubeLogo },
-  bilibili: { label: "Bilibili", Icon: VideoCamera },
-  x: { label: "X", Icon: XLogo },
-  wechat: { label: "微信公众号", Icon: WechatLogo },
-  website: { label: "网页摘要", Icon: LinkSimple },
-};
-
-export function ExternalEmbed({ source }: { source: string }) {
+export function ExternalEmbed({ source, lang }: { source: string; lang?: UiLang }) {
+  const s = ui(lang);
   const data = readEmbedData(source);
   if (!data) {
-    return <p className="external-embed-error">无法解析这个嵌入块，请检查 URL 与 YAML 格式。</p>;
+    return <p className="external-embed-error">{s.embedParseError}</p>;
   }
 
   const url = new URL(data.url);
   const provider = providerFor(url);
   const playerUrl = playableUrl(provider, url);
+  const providerCopy = {
+    youtube: { label: "YouTube", Icon: YoutubeLogo },
+    bilibili: { label: "Bilibili", Icon: VideoCamera },
+    x: { label: "X", Icon: XLogo },
+    wechat: { label: s.embedProviderWechat, Icon: WechatLogo },
+    website: { label: s.embedProviderWeb, Icon: LinkSimple },
+  };
   const { Icon, label } = providerCopy[provider];
 
   if (playerUrl) {
@@ -95,7 +96,7 @@ export function ExternalEmbed({ source }: { source: string }) {
         <div className="external-embed-frame">
           <iframe
             src={playerUrl}
-            title={data.title ?? `${label} 嵌入内容`}
+            title={data.title ?? s.embedFrameTitle(label)}
             loading="lazy"
             allow="accelerometer; autoplay; encrypted-media; fullscreen; picture-in-picture"
             referrerPolicy="strict-origin-when-cross-origin"
@@ -104,7 +105,7 @@ export function ExternalEmbed({ source }: { source: string }) {
         </div>
         <figcaption>
           <span><Icon size={17} />{label}</span>
-          <a href={data.url} target="_blank" rel="noopener noreferrer">在原网站打开<ArrowUpRight size={14} /></a>
+          <a href={data.url} target="_blank" rel="noopener noreferrer">{s.embedOpenOriginal}<ArrowUpRight size={14} /></a>
         </figcaption>
       </figure>
     );
@@ -118,8 +119,8 @@ export function ExternalEmbed({ source }: { source: string }) {
       )}
       <span className="external-embed-copy">
         <small><Icon size={16} />{label} · {url.hostname}</small>
-        <strong>{data.title ?? "打开这条外部内容"}</strong>
-        <p>{data.description ?? (provider === "x" || provider === "wechat" ? "平台不提供稳定的无脚本嵌入，Garden 会保留清晰、可访问的原文入口。" : "查看原网页中的完整内容与上下文。")}</p>
+        <strong>{data.title ?? s.embedFallbackTitle}</strong>
+        <p>{data.description ?? (provider === "x" || provider === "wechat" ? s.embedFallbackNoScript : s.embedFallbackWeb)}</p>
       </span>
       <ArrowUpRight size={21} />
     </a>

package/app/components/GardenContentGuide.tsx

@@ -32,7 +32,15 @@ cover: writing/first-post.jpg
 
 ## 一个小标题
 
-可以继续插入图片、代码、公式和 Mermaid 图表。`;
+可以继续插入图片、代码、公式、Mermaid 图表，或用 \`garden\` 围栏写组件：
+
+\`\`\`garden list
+items:
+  - icon: idea
+    text: 记下为什么重新开始写
+  - icon: book
+    text: 先把旧笔记整理成目录
+\`\`\``;
 
 const thoughtSource = `---
 title: 雨后的散步
@@ -53,7 +61,7 @@ const columnSource = `columns:
   - slug: writing-system
     title: 写作系统
     description: 记录从选题到发布的完整写作过程。
-    status: 持续更新
+    status: ongoing
     cover: /images/columns/writing-system.webp
     coverAlt: 桌面上的笔记本与钢笔
     posts:

package/app/components/GardenDocsNav.tsx

@@ -9,6 +9,8 @@ import {
   HANDBOOK_SECTIONS,
   HANDBOOK_UI,
   NAV_SHORT_TITLE,
+  REFERENCE_SECTION,
+  isReferencePath,
   handbookPath,
   sectionTitle,
   type GardenDocNavItem,
@@ -152,7 +154,7 @@ export function GardenDocsNav({
         </div>
 
         <nav className="gdoc-nav" aria-label={t.chapters}>
-          {groups.map((group) => (
+          {(isReferencePath(currentPath) ? [...groups].sort((a, b) => Number(b.id === REFERENCE_SECTION) - Number(a.id === REFERENCE_SECTION)) : groups).map((group) => (
             <div key={group.id} className="gdoc-nav-group">
               <h2 className="gdoc-nav-group-head">{sectionTitle(HANDBOOK_SECTIONS.find((sec) => sec.id === group.id), lang) ?? group.title}</h2>
               <ol className="gdoc-nav-list">
@@ -170,7 +172,7 @@ export function GardenDocsNav({
                         {badge ? (
                           <>
                             <code className="gdoc-comp-pill">{badge}</code>
-                            <span className="gdoc-comp-label">{label}</span>
+                            {group.id === REFERENCE_SECTION ? null : <span className="gdoc-comp-label">{label}</span>}
                           </>
                         ) : (
                           <span>{label}</span>

package/app/components/GiscusComments.tsx

@@ -3,6 +3,7 @@
 import { useEffect, useRef } from "react";
 
 import type { GiscusConfig } from "../lib/giscus-config";
+import { ui } from "../lib/i18n";
 
 export type { GiscusConfig };
 
@@ -38,7 +39,7 @@ export function GiscusComments({
     script.dataset.emitMetadata = "0";
     script.dataset.inputPosition = "bottom";
     script.dataset.theme = currentGiscusTheme();
-    script.dataset.lang = "zh-CN";
+    script.dataset.lang = ui().giscusLang;
     script.dataset.loading = "lazy";
     container.append(script);
 

package/app/components/GithubLiveOverview.tsx

@@ -8,6 +8,7 @@ import {
   MapPin,
   Users,
 } from "@phosphor-icons/react";
+import { siteLang, ui } from "../lib/i18n";
 
 export type GithubPublicProfile = {
   avatar_url: string;
@@ -70,28 +71,29 @@ export function GithubLiveOverview({
     return () => controller.abort();
   }, [username]);
 
+  const t = ui();
   const displayName = visibleGithubText(profile.name ?? profile.login) || profile.login;
   const profileBio = profile.bio?.trim();
   const signature = statusMessage?.trim() || profileBio;
   const syncLabel = syncState === "synced"
-    ? "本次访问已同步"
+    ? (siteLang === "en" ? t.githubSyncSynced : "本次访问已同步")
     : syncState === "snapshot"
-      ? "暂用发布时快照"
-      : "正在同步当前资料";
+      ? t.githubSyncSnapshot
+      : t.githubSyncSyncing;
 
   return (
     <>
       <header className="github-overview">
         {/* eslint-disable-next-line @next/next/no-img-element */}
-        <img src={profile.avatar_url} alt={`${profile.login} 的 GitHub 头像`} />
+        <img src={profile.avatar_url} alt={t.githubAvatarAlt(profile.login)} />
         <div className="github-identity">
-          <span className="eyebrow" aria-live="polite"><GithubLogo size={17} /> GitHub 公开资料 · {syncLabel}</span>
+          <span className="eyebrow" aria-live="polite"><GithubLogo size={17} />{` ${t.githubOverviewPrefix} · `}{syncLabel}</span>
           <h2>{displayName}</h2>
           {signature && <p>{signature}</p>}
           {profile.location && <span className="github-location"><MapPin size={14} />{profile.location}</span>}
         </div>
         <a href={profile.html_url} target="_blank" rel="noopener noreferrer">
-          查看 GitHub
+          {t.githubViewProfile}
           <ArrowUpRight size={16} />
         </a>
       </header>
@@ -99,7 +101,7 @@ export function GithubLiveOverview({
       <dl className="github-metrics">
         <div>
           <GithubLogo size={21} aria-hidden="true" />
-          <dt>公开仓库</dt>
+          <dt>{t.githubMetricRepos}</dt>
           <dd>{syncState === "synced" || initialLive ? profile.public_repos : "—"}</dd>
         </div>
         <div>
@@ -109,7 +111,7 @@ export function GithubLiveOverview({
         </div>
         <div>
           <GitCommit size={21} aria-hidden="true" />
-          <dt>近 30 天 commits</dt>
+          <dt>{t.githubMetricCommits}</dt>
           <dd>{recentCommits ?? "—"}</dd>
         </div>
       </dl>

package/app/components/GithubProfile.tsx

@@ -4,7 +4,9 @@ import {
   Star,
 } from "@phosphor-icons/react/ssr";
 import { githubUsername } from "../lib/site";
+import { hasRealGithubId } from "../lib/github-id.mjs";
 import { siteConfig } from "../site.config";
+import { ui } from "../lib/i18n";
 import { GithubLiveOverview, type GithubPublicProfile } from "./GithubLiveOverview";
 
 type GithubRepository = {
@@ -93,26 +95,31 @@ async function loadGithubUser(token?: string) {
 }
 
 function activityFromEvent(event: GithubEvent): GithubActivity | null {
+  const t = ui();
   const repository = event.repo.name;
   const repositoryUrl = `https://github.com/${repository}`;
 
   if (event.type === "PushEvent") {
-    return { id: event.id, label: "推送了代码", repository, date: event.created_at, url: `${repositoryUrl}/commits` };
+    return { id: event.id, label: t.githubEventPush, repository, date: event.created_at, url: `${repositoryUrl}/commits` };
   }
   if (event.type === "PullRequestEvent") {
-    const action = event.payload.action === "closed" ? "完成了 Pull Request" : "提交了 Pull Request";
+    const action = event.payload.action === "closed" ? t.githubEventPrClosed : t.githubEventPrOpen;
     return { id: event.id, label: action, repository, date: event.created_at, url: event.payload.pull_request?.html_url ?? repositoryUrl };
   }
   if (event.type === "IssuesEvent") {
-    const action = event.payload.action === "closed" ? "关闭了 Issue" : "参与了 Issue";
+    const action = event.payload.action === "closed" ? t.githubEventIssueClosed : t.githubEventIssueOpen;
     return { id: event.id, label: action, repository, date: event.created_at, url: event.payload.issue?.html_url ?? repositoryUrl };
   }
   if (event.type === "CreateEvent") {
-    const target = event.payload.ref_type === "repository" ? "创建了仓库" : `创建了${event.payload.ref_type === "tag" ? "标签" : "分支"}`;
+    const target = event.payload.ref_type === "repository"
+      ? t.githubEventCreateRepo
+      : event.payload.ref_type === "tag"
+        ? t.githubEventCreateTag
+        : t.githubEventCreateBranch;
     return { id: event.id, label: target, repository, date: event.created_at, url: repositoryUrl };
   }
   if (event.type === "ReleaseEvent") {
-    return { id: event.id, label: "发布了新版本", repository, date: event.created_at, url: event.payload.release?.html_url ?? `${repositoryUrl}/releases` };
+    return { id: event.id, label: t.githubEventRelease, repository, date: event.created_at, url: event.payload.release?.html_url ?? `${repositoryUrl}/releases` };
   }
   return null;
 }
@@ -220,7 +227,7 @@ async function loadGithubGraph(token?: string) {
 }
 
 function formatActivityDate(value: string) {
-  return new Intl.DateTimeFormat("zh-CN", { month: "2-digit", day: "2-digit" }).format(new Date(value));
+  return new Intl.DateTimeFormat(ui().dateLocale, { month: "2-digit", day: "2-digit" }).format(new Date(value));
 }
 
 function contributionLevelClass(level: string) {
@@ -228,6 +235,9 @@ function contributionLevelClass(level: string) {
 }
 
 export async function GithubProfile() {
+  // A new site still has the template id (or none): render the page without a profile and never call the API.
+  if (!hasRealGithubId(githubUsername)) return null;
+  const t = ui();
   const token = process.env.GITHUB_TOKEN;
   const [{ profile, live }, graph, activity] = await Promise.all([
     loadGithubUser(token),
@@ -240,7 +250,7 @@ export async function GithubProfile() {
   const calendarDays = graph?.year.contributionCalendar.weeks.flatMap((week) => week.contributionDays) ?? [];
 
   return (
-    <section className="github-profile" aria-label="GitHub 资料">
+    <section className="github-profile" aria-label={t.githubProfileAria}>
       <GithubLiveOverview
         username={githubUsername}
         initialProfile={profile}
@@ -252,8 +262,8 @@ export async function GithubProfile() {
       <section className="github-pinned" aria-labelledby="github-pinned-title">
         <header>
           <div>
-            <p className="eyebrow">PINNED / 置顶仓库</p>
-            <h3 id="github-pinned-title">正在做的项目</h3>
+            <p className="eyebrow">{t.githubPinnedEyebrow}</p>
+            <h3 id="github-pinned-title">{t.githubPinnedHeading}</h3>
           </div>
           <PushPin size={20} aria-hidden="true" />
         </header>
@@ -262,7 +272,7 @@ export async function GithubProfile() {
             {pinned.map((repository) => (
               <a href={repository.url} target="_blank" rel="noopener noreferrer" key={repository.nameWithOwner}>
                 <strong>{repository.nameWithOwner.split("/").at(-1)}</strong>
-                <p>{repository.description ?? "查看这个公开仓库的代码与最近更新。"}</p>
+                <p>{repository.description ?? t.githubPinnedFallbackDesc}</p>
                 <span>
                   {repository.primaryLanguage && <><i style={{ background: repository.primaryLanguage.color ?? undefined }} />{repository.primaryLanguage.name}</>}
                   <small><Star size={13} weight="fill" />{repository.stargazerCount}</small>
@@ -271,38 +281,38 @@ export async function GithubProfile() {
             ))}
           </div>
         ) : (
-          <p className="github-data-note">配置 GitHub Token 或 author.githubPinned 后，这里会展示置顶仓库。</p>
+          <p className="github-data-note">{t.githubPinnedEmpty}</p>
         )}
       </section>
 
       <section className="github-contributions" aria-labelledby="github-contributions-title">
         <header>
           <div>
-            <p className="eyebrow">CONTRIBUTIONS / 贡献</p>
-            <h3 id="github-contributions-title">过去一年的公开贡献</h3>
+            <p className="eyebrow">{t.githubContribEyebrow}</p>
+            <h3 id="github-contributions-title">{t.githubContribHeading}</h3>
           </div>
-          <strong>{graph ? `${graph.year.contributionCalendar.totalContributions} 次贡献` : "需要 GitHub Token"}</strong>
+          <strong>{graph ? t.githubContribCount(graph.year.contributionCalendar.totalContributions) : t.githubContribNeedToken}</strong>
         </header>
         {calendarDays.length > 0 ? (
-          <div className="github-calendar" role="img" aria-label={`过去一年 ${graph?.year.contributionCalendar.totalContributions ?? 0} 次公开贡献`}>
+          <div className="github-calendar" role="img" aria-label={t.githubContribAria(graph?.year.contributionCalendar.totalContributions ?? 0)}>
             {calendarDays.map((day) => (
               <span
                 className={`github-contribution-day level-${contributionLevelClass(day.contributionLevel)}`}
                 key={day.date}
-                title={`${day.date} · ${day.contributionCount} 次贡献`}
-                aria-label={`${day.date}，${day.contributionCount} 次贡献`}
+                title={t.githubContribDayTitle(day.date, day.contributionCount)}
+                aria-label={t.githubContribDayAria(day.date, day.contributionCount)}
               />
             ))}
           </div>
         ) : (
-          <p className="github-data-note">正式发布时会使用工作流的只读令牌生成贡献热点图。</p>
+          <p className="github-data-note">{t.githubContribEmpty}</p>
         )}
       </section>
 
       <section className="github-activity" aria-labelledby="github-activity-title">
         <header>
-          <p className="eyebrow">CONTRIBUTION ACTIVITY / 最近活动</p>
-          <h3 id="github-activity-title">最近在 GitHub 上做了什么</h3>
+          <p className="eyebrow">{t.githubActivityEyebrow}</p>
+          <h3 id="github-activity-title">{t.githubActivityHeading}</h3>
         </header>
         {activity.length > 0 ? (
           <ol>
@@ -318,7 +328,7 @@ export async function GithubProfile() {
             ))}
           </ol>
         ) : (
-          <p className="github-data-note">GitHub 暂时没有返回最近的公开贡献活动。</p>
+          <p className="github-data-note">{t.githubActivityEmpty}</p>
         )}
       </section>
     </section>

package/app/components/HandbookLangSwitch.tsx

@@ -5,6 +5,8 @@ import { usePathname } from "next/navigation";
 import { HANDBOOK_LANG_KEY, handbookBase, type HandbookLang } from "../lib/garden-docs-meta";
 import { siteHref } from "../lib/site-href";
 import { swapHandbookLang } from "../lib/handbook-path";
+import { siteLang } from "../lib/i18n";
+import { handbookPageLang, handbookSwitchLabel, handbookSwitchTarget, handbookSwitchTitle } from "../lib/handbook-switch.mjs";
 
 const noSubscribe = () => () => {};
 
@@ -12,14 +14,16 @@ const noSubscribe = () => () => {};
 function counterpartHref(target: HandbookLang) {
   const link = document.querySelector<HTMLLinkElement>(`link[rel="alternate"][hreflang="${target === "en" ? "en" : "zh-CN"}"]`);
   if (link?.href) return swapHandbookLang(location.pathname, target);
+  // English sites leave hreflang out of <head>; the handbook ships every page in both languages there.
+  if (siteLang === "en") return swapHandbookLang(location.pathname, target);
   return target === "zh" ? siteHref(`${handbookBase("zh")}/`) : null;
 }
 
 /** 「中 / EN」 in the top bar on handbook pages. Goes to the counterpart page. */
 export function HandbookLangSwitch() {
   const pathname = usePathname() ?? "";
-  const lang: HandbookLang = /\/garden\/en(\/|$)/.test(pathname) ? "en" : "zh";
-  const target: HandbookLang = lang === "en" ? "zh" : "en";
+  const lang: HandbookLang = handbookPageLang(pathname);
+  const target: HandbookLang = handbookSwitchTarget(lang);
   const href = useSyncExternalStore(
     noSubscribe,
     () => counterpartHref(target),
@@ -39,10 +43,10 @@ export function HandbookLangSwitch() {
     </>
   );
   if (!href) {
-    return <span className="sh-lang is-disabled" title="No English version of this page yet">{label}</span>;
+    return <span className="sh-lang is-disabled" title={handbookSwitchTitle(lang, siteLang)}>{label}</span>;
   }
   return (
-    <a className="sh-lang" href={href} hrefLang={target === "en" ? "en" : "zh-CN"} lang={target === "en" ? "en" : undefined} onClick={remember} aria-label={target === "en" ? "Read in English" : "Switch to Chinese"}>
+    <a className="sh-lang" href={href} hrefLang={target === "en" ? "en" : "zh-CN"} lang={target === "en" ? "en" : undefined} onClick={remember} aria-label={handbookSwitchLabel(lang)}>
       {label}
     </a>
   );