refactor(web): decompose 358-LOC manifesto into 9 section components
app/[locale]/manifesto/page.tsx: 358 LOC -> 22-LOC composition shell.
components/manifesto/sections/:
- hero.tsx
- pain-points.tsx
- indistinguishable.tsx (the 'AI vs senior engineer' argument)
- token-cost.tsx
- cognitive-load.tsx
- principles.tsx
- core-loop.tsx
- future.tsx
- final-cta.tsx
Each section 26-68 LOC. Copy unchanged; section order unchanged.
Same i18n namespace ('manifesto'). Renders identically to baseline
in all 4 locales (en/ko/ja/zh).
This commit is contained in:
@@ -0,0 +1,39 @@
|
||||
import type { JSX } from "react"
|
||||
import { getTranslations } from "next-intl/server"
|
||||
import { Check } from "lucide-react"
|
||||
import { Section } from "@/components/ui/section"
|
||||
|
||||
export async function IndistinguishableSection(): Promise<JSX.Element> {
|
||||
const t = await getTranslations("manifesto")
|
||||
const indistinguishableKeys = [
|
||||
"patterns",
|
||||
"errorHandling",
|
||||
"tests",
|
||||
"noSlop",
|
||||
"comments",
|
||||
] as const
|
||||
|
||||
return (
|
||||
<Section data-section="manifesto-indistinguishable" className="mx-auto max-w-3xl">
|
||||
<h2 className="mb-8 text-3xl font-bold md:text-4xl">{t("indistinguishable.title")}</h2>
|
||||
|
||||
<p className="text-muted-foreground mb-8 text-xl">{t("indistinguishable.subtitle")}</p>
|
||||
|
||||
<div className="mb-10 grid gap-6">
|
||||
{indistinguishableKeys.map((key) => (
|
||||
<div
|
||||
key={key}
|
||||
className="bg-secondary/30 border-border/50 flex items-start gap-4 rounded-lg border p-4"
|
||||
>
|
||||
<Check className="h-6 w-6 shrink-0 text-green-500" />
|
||||
<span>{t(`indistinguishable.items.${key}`)}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<blockquote className="border-primary bg-primary/5 rounded-r-lg border-l-4 py-4 pl-6 text-2xl font-light italic">
|
||||
{t("indistinguishable.quote")}
|
||||
</blockquote>
|
||||
</Section>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user