Add internationalization (i18n) with next-intl and Italian translations

- 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.
This commit is contained in:
Felipe Cardoso
2025-11-17 20:27:09 +01:00
parent b7c1191335
commit fe6a98c379
11 changed files with 873 additions and 13 deletions

View File

@@ -0,0 +1,44 @@
// 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(),
};
});