Skip to content

Commit 8613838

Browse files
ericyangpanclaude
andcommitted
refactor(app): update application pages and routes
Update all page components, client components, and OpenGraph images to support new manifest structure, enhanced metadata, and improved type safety across all routes. Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
1 parent a0566aa commit 8613838

File tree

35 files changed

+363
-326
lines changed

35 files changed

+363
-326
lines changed

src/app/[locale]/ai-coding-landscape/page.tsx

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,10 @@ import { buildTitle, generateStaticPageMetadata } from '@/lib/metadata'
1010

1111
export async function generateMetadata({ params }: { params: Promise<{ locale: string }> }) {
1212
const { locale } = await params
13-
const tNav = await getTranslations({ locale, namespace: 'components.header' })
13+
const tPage = await getTranslations({ locale, namespace: 'pages.landscape' })
1414

15-
const title = buildTitle({ title: tNav('aiCodingLandscape') })
16-
const description = tNav('aiCodingLandscapeDesc')
15+
const title = buildTitle({ title: tPage('title') })
16+
const description = tPage('description')
1717

1818
return generateStaticPageMetadata({
1919
locale: locale as Locale,
@@ -32,8 +32,7 @@ type Props = {
3232

3333
export default async function Page({ params }: Props) {
3434
const { locale } = await params
35-
const tNav = await getTranslations({ locale, namespace: 'components.header' })
36-
const tOverview = await getTranslations({ locale, namespace: 'pages.stacks.overview' })
35+
const tPage = await getTranslations({ locale, namespace: 'pages.landscape' })
3736

3837
// Build vendor matrix data
3938
const matrixData = buildVendorMatrix()
@@ -42,13 +41,13 @@ export default async function Page({ params }: Props) {
4241
<>
4342
<Header />
4443
<main className="max-w-8xl mx-auto px-[var(--spacing-md)] pt-[var(--spacing-lg)]">
45-
<PageHeader title={tNav('aiCodingLandscape')} subtitle={tNav('aiCodingLandscapeDesc')} />
44+
<PageHeader title={tPage('title')} subtitle={tPage('description')} />
4645

4746
{/* Vendor Matrix */}
4847
<VendorMatrix matrixData={matrixData} />
4948

5049
{/* Back to Overview */}
51-
<BackToNavigation href="/ai-coding-stack" title={tOverview('overviewTitle')} />
50+
<BackToNavigation href="/ai-coding-stack" title={tPage('backToOverview')} />
5251
</main>
5352
<Footer />
5453
</>

src/app/[locale]/ai-coding-stack/page.tsx

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@ import type { LocalePageProps } from '@/types/locale'
99

1010
export async function generateMetadata({ params }: LocalePageProps) {
1111
const { locale } = await params
12-
const t = await getTranslations({ locale, namespace: 'pages.stacks.overview' })
12+
const tPage = await getTranslations({ locale, namespace: 'pages.stacks.overview' })
1313

14-
const title = buildTitle({ title: t('title') })
15-
const description = t('subtitle')
14+
const title = buildTitle({ title: tPage('title') })
15+
const description = tPage('subtitle')
1616

1717
return generateStaticPageMetadata({
1818
locale: locale as Locale,
@@ -27,14 +27,14 @@ export async function generateMetadata({ params }: LocalePageProps) {
2727

2828
export default async function AICodingStackPage({ params }: LocalePageProps) {
2929
const { locale } = await params
30-
const t = await getTranslations({ locale, namespace: 'pages.stacks.overview' })
30+
const tPage = await getTranslations({ locale, namespace: 'pages.stacks.overview' })
3131

3232
return (
3333
<>
3434
<Header />
3535

3636
<main className="max-w-8xl mx-auto px-[var(--spacing-md)] py-[var(--spacing-lg)]">
37-
<PageHeader title={t('title')} subtitle={t('subtitle')} />
37+
<PageHeader title={tPage('title')} subtitle={tPage('subtitle')} />
3838

3939
{/* Stacks Grid */}
4040
<div className="grid grid-cols-1 md:grid-cols-3 gap-[var(--spacing-md)]">
@@ -52,13 +52,15 @@ export default async function AICodingStackPage({ params }: LocalePageProps) {
5252
className="block border border-[var(--color-border)] p-[var(--spacing-md)] hover:border-[var(--color-border-strong)] transition-all hover:-translate-y-0.5 group"
5353
>
5454
<div className="flex justify-between items-start mb-[var(--spacing-md)]">
55-
<h3 className="text-2xl font-semibold tracking-tight">{t(`${stack.key}.title`)}</h3>
55+
<h3 className="text-2xl font-semibold tracking-tight">
56+
{tPage(`${stack.key}.title`)}
57+
</h3>
5658
<span className="text-2xl text-[var(--color-text-muted)] group-hover:text-[var(--color-text)] group-hover:translate-x-1 transition-all">
5759
5860
</span>
5961
</div>
6062
<p className="text-sm leading-relaxed text-[var(--color-text-secondary)] font-light">
61-
{t(`${stack.key}.description`)}
63+
{tPage(`${stack.key}.description`)}
6264
</p>
6365
</Link>
6466
))}

src/app/[locale]/articles/[slug]/page.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ export default async function ArticlePage({ params }: Props) {
5757
notFound()
5858
}
5959

60-
const t = await getTranslations({ locale, namespace: 'components.header' })
60+
const tShared = await getTranslations({ locale, namespace: 'shared' })
6161
const ArticleContent = await getArticleComponent(locale, slug)
6262

6363
if (!ArticleContent) {
@@ -90,7 +90,7 @@ export default async function ArticlePage({ params }: Props) {
9090

9191
<Breadcrumb
9292
items={[
93-
{ name: t('articles'), href: '/articles' },
93+
{ name: tShared('header.articles'), href: '/articles' },
9494
{ name: article.title, href: `/articles/${slug}` },
9595
]}
9696
/>

src/app/[locale]/articles/opengraph-image.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,12 @@ interface Props {
1111

1212
export default async function Image({ params }: Props) {
1313
const { locale } = await params
14-
const t = await getTranslations({ locale, namespace: 'components.header' })
14+
const tPage = await getTranslations({ locale, namespace: 'components.header' })
1515

1616
return new ImageResponse(
1717
<OGImageTemplate
1818
category="ARTICLES"
19-
title={t('articles')}
19+
title={tPage('articles')}
2020
description="Insights, guides, and best practices for AI-powered development"
2121
/>,
2222
{ ...size }

src/app/[locale]/articles/page.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,17 +9,17 @@ import { buildTitle, generateStaticPageMetadata } from '@/lib/metadata'
99

1010
export async function generateMetadata({ params }: { params: Promise<{ locale: string }> }) {
1111
const { locale } = await params
12-
const t = await getTranslations({ locale, namespace: 'pages.articles' })
12+
const tPage = await getTranslations({ locale, namespace: 'pages.articles' })
1313

14-
const title = buildTitle({ title: `${t('title')} - AI Coding Insights & Tutorials` })
15-
const description = t('subtitle')
14+
const title = buildTitle({ title: `${tPage('title')} - AI Coding Insights & Tutorials` })
15+
const description = tPage('subtitle')
1616

1717
return generateStaticPageMetadata({
1818
locale: locale as Locale,
1919
basePath: 'articles',
2020
title,
2121
description,
22-
keywords: t('keywords'),
22+
keywords: tPage('keywords'),
2323
ogType: 'website',
2424
})
2525
}
@@ -30,14 +30,14 @@ type Props = {
3030

3131
export default async function ArticlesPage({ params }: Props) {
3232
const { locale } = await params
33-
const t = await getTranslations({ locale, namespace: 'pages.articles' })
33+
const tPage = await getTranslations({ locale, namespace: 'pages.articles' })
3434
const articles = getArticles(locale)
3535
return (
3636
<>
3737
<Header />
3838

3939
<div className="max-w-8xl mx-auto px-[var(--spacing-md)] py-[var(--spacing-lg)]">
40-
<PageHeader title={t('title')} subtitle={t('subtitle')} />
40+
<PageHeader title={tPage('title')} subtitle={tPage('subtitle')} />
4141

4242
{/* Articles Grid */}
4343
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-[var(--spacing-md)]">

src/app/[locale]/clis/[slug]/page.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -37,8 +37,8 @@ export async function generateMetadata({
3737
return { title: 'CLI Not Found | AI Coding Stack' }
3838
}
3939

40-
const tGlobal = await getTranslations({ locale })
41-
const licenseStr = cli.license ? translateLicenseText(cli.license, tGlobal) : ''
40+
const tShared = await getTranslations({ locale })
41+
const licenseStr = cli.license ? translateLicenseText(cli.license, tShared) : ''
4242

4343
return await generateSoftwareDetailMetadata({
4444
locale: locale as Locale,
@@ -68,8 +68,8 @@ export default async function CLIPage({
6868
notFound()
6969
}
7070

71-
const t = await getTranslations({ locale, namespace: 'pages.stacks.cliDetail' })
72-
const tGlobal = await getTranslations({ locale })
71+
const tPage = await getTranslations({ locale, namespace: 'pages.stacks.cliDetail' })
72+
const tShared = await getTranslations({ locale })
7373

7474
// Transform URLs for component props
7575
const websiteUrl = cli.websiteUrl || cli.resourceUrls?.download || undefined
@@ -88,7 +88,7 @@ export default async function CLIPage({
8888
version: cli.latestVersion,
8989
platforms: cli.platforms,
9090
pricing: cli.pricing,
91-
license: cli.license ? translateLicenseText(cli.license, tGlobal) : undefined,
91+
license: cli.license ? translateLicenseText(cli.license, tShared) : undefined,
9292
},
9393
category: 'clis',
9494
locale: locale as Locale,
@@ -99,8 +99,8 @@ export default async function CLIPage({
9999

100100
// Breadcrumb items
101101
const breadcrumbItems = [
102-
{ name: tGlobal('shared.terms.aiCodingStack'), href: '/ai-coding-stack' },
103-
{ name: tGlobal('shared.categories.plural.clis'), href: '/clis' },
102+
{ name: tShared('shared.terms.aiCodingStack'), href: '/ai-coding-stack' },
103+
{ name: tShared('shared.categories.plural.clis'), href: '/clis' },
104104
{ name: cli.name, href: `clis/${cli.id}` },
105105
]
106106

@@ -114,7 +114,7 @@ export default async function CLIPage({
114114
description={cli.description}
115115
vendor={cli.vendor}
116116
category="CLI"
117-
categoryLabel={t('categoryLabel')}
117+
categoryLabel={tPage('categoryLabel')}
118118
verified={cli.verified ?? false}
119119
latestVersion={cli.latestVersion}
120120
license={cli.license}
@@ -135,7 +135,7 @@ export default async function CLIPage({
135135

136136
<ProductCommands install={cli.installCommand} launch={cli.launchCommand} />
137137

138-
<BackToNavigation href="/clis" title={t('allCLIs')} />
138+
<BackToNavigation href="/clis" title={tPage('allCLIs')} />
139139
</main>
140140
</PageLayout>
141141
)

0 commit comments

Comments
 (0)