feat(deps): next-intl scaffold (English-only, future locale-add ready)

Minimal next-intl wire-up so future i18n additions are a config
change, not a code rewrite. No URL routing changes — there's no
`/<locale>/` prefix because there's no second locale today.

- `src/i18n/request.ts` — request-scoped locale + messages loader,
  hard-coded to 'en'
- `messages/en.json` — common namespace with a few sample keys
- `next.config.ts` — withNextIntlPlugin wraps the config
- `src/app/layout.tsx` — wraps body with NextIntlClientProvider so
  client components can `useTranslations('common')` now

When a real locale target appears (Polish for marina users, Italian
for broker portal, etc.):
1. Add `messages/<locale>.json`
2. Move route folders under `app/[locale]/` to enable URL routing
3. Add a `routing.ts` with the locale list + default

Verified: tsc clean, vitest 1315/1315, next build green.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-12 22:47:18 +02:00
parent dda554df84
commit 3aa1275ed7
6 changed files with 455 additions and 3 deletions

View File

@@ -2,6 +2,8 @@ import type { Metadata, Viewport } from 'next';
import Script from 'next/script';
import { headers } from 'next/headers';
import { Inter, JetBrains_Mono } from 'next/font/google';
import { NextIntlClientProvider } from 'next-intl';
import { getLocale, getMessages } from 'next-intl/server';
import { Toaster } from 'sonner';
import { classifyFormFactor } from '@/lib/form-factor';
import { ReactGrabViewportSync } from '@/components/dev/react-grab-viewport-sync';
@@ -50,9 +52,11 @@ export const metadata: Metadata = {
export default async function RootLayout({ children }: { children: React.ReactNode }) {
const headerList = await headers();
const formFactor = classifyFormFactor(headerList.get('user-agent'));
const locale = await getLocale();
const messages = await getMessages();
return (
<html lang="en" suppressHydrationWarning>
<html lang={locale} suppressHydrationWarning>
<head>
{process.env.NODE_ENV === 'development' && (
<Script
@@ -66,7 +70,9 @@ export default async function RootLayout({ children }: { children: React.ReactNo
data-form-factor={formFactor}
className={`${inter.variable} ${jetbrainsMono.variable} font-sans antialiased`}
>
{children}
<NextIntlClientProvider locale={locale} messages={messages}>
{children}
</NextIntlClientProvider>
<Toaster richColors position="top-right" />
{process.env.NODE_ENV === 'development' && <ReactGrabViewportSync />}
</body>

20
src/i18n/request.ts Normal file
View File

@@ -0,0 +1,20 @@
import { getRequestConfig } from 'next-intl/server';
/**
* next-intl request configuration (server-side).
*
* We're shipping the framework without routing — there's no `/<locale>/`
* URL prefix yet because there's no localisation target (English-only
* today). When/if we add a second locale, swap to next-intl's "i18n
* routing" mode and move route folders under `[locale]/`.
*
* The plugin in `next.config.ts` points at this file. Components call
* `useTranslations('common')` to opt in.
*/
export default getRequestConfig(async () => {
const locale = 'en';
return {
locale,
messages: (await import(`../../messages/${locale}.json`)).default,
};
});