- Integrated `next-intl` for server-side and client-side i18n support. - Added English (`en.json`) and Italian (`it.json`) localization files. - Configured routing with locale-based subdirectories (`/[locale]/path`) using `next-intl`. - Introduced type-safe i18n utilities and TypeScript definitions for translation keys. - Updated middleware to handle locale detection and routing. - Implemented dynamic translation loading to reduce bundle size. - Enhanced developer experience with auto-complete and compile-time validation for i18n keys.
45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
// src/i18n/request.ts
|
|
/**
|
|
* Server-side i18n request configuration for next-intl.
|
|
*
|
|
* This file handles:
|
|
* - Loading translation messages for the requested locale
|
|
* - Server-side locale detection
|
|
* - Time zone configuration
|
|
*
|
|
* Important:
|
|
* - This runs on the server only (Next.js App Router)
|
|
* - Translation files are NOT sent to the client (zero bundle overhead)
|
|
* - Messages are loaded on-demand per request
|
|
*/
|
|
|
|
import { getRequestConfig } from 'next-intl/server';
|
|
import { routing } from './routing';
|
|
|
|
export default getRequestConfig(async ({ locale }) => {
|
|
// Validate that the incoming `locale` parameter is valid
|
|
// Type assertion: we know locale will be a string from the URL parameter
|
|
const requestedLocale = locale as 'en' | 'it';
|
|
|
|
// Check if the requested locale is supported, otherwise use default
|
|
const validLocale = routing.locales.includes(requestedLocale)
|
|
? requestedLocale
|
|
: routing.defaultLocale;
|
|
|
|
return {
|
|
// Return the validated locale
|
|
locale: validLocale,
|
|
|
|
// Load messages for the requested locale
|
|
// Dynamic import ensures only the requested locale is loaded
|
|
messages: (await import(`../../messages/${validLocale}.json`)).default,
|
|
|
|
// Optional: Configure time zone
|
|
// This will be used for date/time formatting
|
|
// timeZone: 'Europe/Rome', // Example for Italian users
|
|
|
|
// Optional: Configure now (for relative time formatting)
|
|
// now: new Date(),
|
|
};
|
|
});
|