Skip to content

Commit 5755047

Browse files
committed
feat: add upcoming sites
1 parent 8e0f083 commit 5755047

File tree

1 file changed

+150
-1
lines changed

1 file changed

+150
-1
lines changed

apps/index/src/app/page.tsx

Lines changed: 150 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { SITES } from '@next-i18n/const';
1+
import { PENDING_SITES, SITES } from '@next-i18n/const';
22
import Image from 'next/image';
33

44
// Language metadata with display names and descriptions
@@ -24,10 +24,54 @@ const LANGUAGE_INFO = {
2424
description: 'Next.js 繁體中文文檔',
2525
color: 'from-purple-500 to-purple-600',
2626
},
27+
// Pending languages
28+
ja: {
29+
name: 'Japanese',
30+
nativeName: '日本語',
31+
flag: '🇯🇵',
32+
description: 'Next.js 日本語ドキュメント',
33+
color: 'from-pink-500 to-pink-600',
34+
},
35+
es: {
36+
name: 'Spanish',
37+
nativeName: 'Español',
38+
flag: '🇪🇸',
39+
description: 'Documentación de Next.js en español',
40+
color: 'from-amber-500 to-amber-600',
41+
},
42+
de: {
43+
name: 'German',
44+
nativeName: 'Deutsch',
45+
flag: '🇩🇪',
46+
description: 'Next.js Dokumentation auf Deutsch',
47+
color: 'from-gray-500 to-gray-600',
48+
},
49+
fr: {
50+
name: 'French',
51+
nativeName: 'Français',
52+
flag: '🇫🇷',
53+
description: 'Documentation Next.js en français',
54+
color: 'from-indigo-500 to-indigo-600',
55+
},
56+
ru: {
57+
name: 'Russian',
58+
nativeName: 'Русский',
59+
flag: '🇷🇺',
60+
description: 'Документация Next.js на русском языке',
61+
color: 'from-emerald-500 to-emerald-600',
62+
},
63+
ar: {
64+
name: 'Arabic',
65+
nativeName: 'العربية',
66+
flag: '🇸🇦',
67+
description: 'وثائق Next.js باللغة العربية',
68+
color: 'from-green-500 to-green-600',
69+
},
2770
} as const;
2871

2972
export default function Home() {
3073
const siteEntries = Object.entries(SITES);
74+
const pendingSiteEntries = Object.entries(PENDING_SITES);
3175
const totalTranslations = siteEntries.length;
3276

3377
return (
@@ -65,6 +109,12 @@ export default function Home() {
65109
<div className="w-2 h-2 bg-green-500 rounded-full animate-pulse" />
66110
<span>{totalTranslations} Languages Available</span>
67111
</div>
112+
{pendingSiteEntries.length > 0 && (
113+
<div className="flex items-center gap-2">
114+
<div className="w-2 h-2 bg-orange-500 rounded-full animate-pulse" />
115+
<span>{pendingSiteEntries.length} More Coming Soon</span>
116+
</div>
117+
)}
68118
<div className="flex items-center gap-2">
69119
<Image
70120
src="/globe.svg"
@@ -159,6 +209,103 @@ export default function Home() {
159209
</div>
160210
</div>
161211

212+
{/* Pending Sites Section */}
213+
{pendingSiteEntries.length > 0 && (
214+
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-20">
215+
<div className="text-center mb-12">
216+
<h2 className="text-3xl font-bold text-gray-900 dark:text-white mb-4">
217+
Coming Soon
218+
</h2>
219+
<p className="text-lg text-gray-600 dark:text-gray-300 max-w-2xl mx-auto">
220+
More languages are in development. Help us expand the Next.js
221+
documentation to reach developers worldwide.
222+
</p>
223+
</div>
224+
225+
<div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
226+
{pendingSiteEntries.map(([locale, url]) => {
227+
const info = LANGUAGE_INFO[locale as keyof typeof LANGUAGE_INFO];
228+
if (!info) return null;
229+
230+
return (
231+
<div
232+
key={locale}
233+
className="group relative overflow-hidden rounded-2xl bg-white dark:bg-gray-800 shadow-md border border-gray-200 dark:border-gray-700 opacity-75"
234+
>
235+
{/* Gradient Background */}
236+
<div
237+
className={`absolute inset-0 bg-gradient-to-br ${info.color} opacity-3`}
238+
/>
239+
240+
{/* Card Content */}
241+
<div className="relative p-6">
242+
<div className="flex items-start justify-between mb-4">
243+
<div className="text-3xl mb-3 opacity-60">
244+
{info.flag}
245+
</div>
246+
<div className="flex items-center gap-1 text-xs text-gray-500 dark:text-gray-400 bg-orange-100 dark:bg-orange-900/30 px-2 py-1 rounded-full">
247+
<div className="w-1.5 h-1.5 bg-orange-500 rounded-full animate-pulse" />
248+
<span>In Progress</span>
249+
</div>
250+
</div>
251+
252+
<h3 className="text-lg font-semibold text-gray-900 dark:text-white mb-2">
253+
{info.nativeName}
254+
</h3>
255+
256+
<p className="text-sm text-gray-500 dark:text-gray-400 mb-1">
257+
{info.name}
258+
</p>
259+
260+
<p className="text-gray-600 dark:text-gray-300 mb-4 line-clamp-2 text-sm">
261+
{info.description}
262+
</p>
263+
264+
<div className="flex items-center justify-between">
265+
<div className="flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400">
266+
<Image
267+
src="/globe.svg"
268+
alt="Coming soon icon"
269+
width={12}
270+
height={12}
271+
className="dark:invert opacity-60"
272+
/>
273+
<span>Translation in Progress</span>
274+
</div>
275+
276+
<div className="text-xs text-orange-600 dark:text-orange-400 font-medium">
277+
Coming Soon
278+
</div>
279+
</div>
280+
</div>
281+
</div>
282+
);
283+
})}
284+
</div>
285+
286+
<div className="text-center mt-8">
287+
<p className="text-sm text-gray-500 dark:text-gray-400 mb-4">
288+
Want to help with translations?
289+
</p>
290+
<a
291+
href="https://github.com/vercel/next.js"
292+
target="_blank"
293+
rel="noopener noreferrer"
294+
className="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg transition-colors duration-200 text-sm font-medium"
295+
>
296+
<Image
297+
src="/globe.svg"
298+
alt="Contribute icon"
299+
width={16}
300+
height={16}
301+
className="invert"
302+
/>
303+
<span>Contribute on GitHub</span>
304+
</a>
305+
</div>
306+
</div>
307+
)}
308+
162309
{/* Footer Section */}
163310
<footer className="border-t border-gray-200 dark:border-gray-700 bg-white/50 dark:bg-gray-800/50 backdrop-blur-sm">
164311
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
@@ -184,6 +331,8 @@ export default function Home() {
184331
<div className="flex items-center gap-4 text-sm text-gray-500 dark:text-gray-400">
185332
<span>{totalTranslations} Languages</span>
186333
<span></span>
334+
<span>{pendingSiteEntries.length} In Progress</span>
335+
<span></span>
187336
<span>Open Source</span>
188337
<span></span>
189338
<span>Community Driven</span>

0 commit comments

Comments
 (0)