@intlayer/docs 7.0.1 → 7.0.2

package/docs/en/intlayer_with_nextjs_15.md

@@ -47,6 +47,10 @@ history:
 
 See [Application Template](https://github.com/aymericzip/intlayer-next-15-template) on GitHub.
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications. Intlayer seamlessly integrates with the latest **Next.js 15** framework, including its powerful **App Router**. It is optimized to work with **Server Components** for efficient rendering and is fully compatible with [**Turbopack**](https://nextjs.org/docs/architecture/turbopack).
@@ -829,15 +833,17 @@ export const generateMetadata = async ({
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl =
+    multilingualUrls[locale as keyof typeof multilingualUrls];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale as keyof typeof multilingualUrls],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };
@@ -869,15 +875,16 @@ export const generateMetadata = async ({ params }) => {
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl = multilingualUrls[locale];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };
@@ -909,15 +916,16 @@ const generateMetadata = async ({ params }) => {
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl = multilingualUrls[locale];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };

package/docs/en/intlayer_with_nextjs_16.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-12-06
-updatedAt: 2025-10-09
+updatedAt: 2025-10-26
 title: How to translate your Next.js 16 app – i18n guide 2025
 description: Discover how to make your Next.js 16 website multilingual. Follow the documentation to internationalize (i18n) and translate it.
 keywords:
@@ -28,6 +28,10 @@ history:
 
 See [Application Template](https://github.com/aymericzip/intlayer-next-16-template) on GitHub.
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications. Intlayer seamlessly integrates with the latest **Next.js 16** framework, including its powerful **App Router**. It is optimized to work with **Server Components** for efficient rendering and is fully compatible with [**Turbopack**](https://nextjs.org/docs/architecture/turbopack).
@@ -804,15 +808,17 @@ export const generateMetadata = async ({
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl =
+    multilingualUrls[locale as keyof typeof multilingualUrls];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale as keyof typeof multilingualUrls],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };
@@ -844,15 +850,16 @@ export const generateMetadata = async ({ params }) => {
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl = multilingualUrls[locale];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };
@@ -884,15 +891,16 @@ const generateMetadata = async ({ params }) => {
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl = multilingualUrls[locale];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };

package/docs/en/intlayer_with_nextjs_page_router.md

@@ -27,6 +27,10 @@ history:
 
 # Translate your Next.js and Page Router website using Intlayer | Internationalization (i18n)
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications. Intlayer seamlessly integrates with the latest **Next.js** framework, including its traditional **Page Router**.

package/docs/en/intlayer_with_nuxt.md

@@ -25,6 +25,10 @@ history:
 
 See [Application Template](https://github.com/aymericzip/intlayer-nuxt-template) on GitHub.
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications.

package/docs/en/intlayer_with_react_native+expo.md

@@ -28,6 +28,10 @@ history:
 
 See [Application Template](https://github.com/aymericzip/intlayer-react-native-template) on GitHub.
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an **innovative, open-source internationalization (i18n) library** that simplifies multilingual support in modern applications. It works in many JavaScript/TypeScript environments, **including React Native** (via the `react-intlayer` package).
@@ -153,6 +157,9 @@ module.exports = (async () => {
 })();
 ```
 
+> Note: `configMetroIntlayer` is a promise function. Use `configMetroIntlayerSync` instead if you want to use it synchronously, or avoid IFFE (Immediately Invoked Function Expression).
+> Note: `configMetroIntlayerSync` does not allow to build intlayer dictionaries on server start
+
 ## Step 4: Add the Intlayer provider
 
 To keep synchronized the user language across your application, you need to wrap your root component with the `IntlayerProvider` component from `react-intlayer-native`.

package/docs/en/intlayer_with_react_router_v7.md

@@ -31,6 +31,10 @@ history:
 
 This guide demonstrates how to integrate **Intlayer** for seamless internationalization in React Router v7 projects with locale-aware routing, TypeScript support, and modern development practices.
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications.

package/docs/en/intlayer_with_tanstack.md

@@ -28,6 +28,10 @@ history:
 
 # Translate your Tanstack Start website using Intlayer | Internationalization (i18n)
 
+## Table of Contents
+
+<TOC>
+
 This guide demonstrates how to integrate **Intlayer** for seamless internationalization in Tanstack Start projects with locale-aware routing, TypeScript support, and modern development practices.
 
 ## What is Intlayer?

package/docs/en/intlayer_with_vite+preact.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-04-18
-updatedAt: 2025-06-29
+updatedAt: 2025-10-28
 title: How to translate your Vite and Preact app – i18n guide 2025
 description: Discover how to make your Vite and Preact website multilingual. Follow the documentation to internationalize (i18n) and translate it.
 keywords:
@@ -16,6 +16,9 @@ slugs:
   - vite-and-preact
 applicationTemplate: https://github.com/aymericzip/intlayer-vite-preact-template
 history:
+  - version: 7.0.0
+    date: 2025-10-28
+    changes: Update LocaleRouter component to use new route configuration
   - version: 5.5.10
     date: 2025-06-29
     changes: Init history
@@ -27,6 +30,10 @@ history:
 
 See [Application Template](https://github.com/aymericzip/intlayer-vite-preact-template) on GitHub.
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications.
@@ -88,6 +95,10 @@ const config: IntlayerConfig = {
     ],
     defaultLocale: Locales.ENGLISH,
   },
+  routing: {
+    mode: "prefix-no-default", // Default: prefix all locales except the default locale
+    storage: ["cookie", "header"], // Default: store locale in cookie and detect from header
+  },
 };
 
 export default config;
@@ -107,6 +118,10 @@ const config = {
     ],
     defaultLocale: Locales.ENGLISH,
   },
+  routing: {
+    mode: "prefix-no-default", // Default: prefix all locales except the default locale
+    storage: ["cookie", "header"], // Default: store locale in cookie and detect from header
+  },
 };
 
 export default config;
@@ -126,12 +141,16 @@ const config = {
     ],
     defaultLocale: Locales.ENGLISH,
   },
+  routing: {
+    mode: "prefix-no-default", // Default: prefix all locales except the default locale
+    storage: ["cookie", "header"], // Default: store locale in cookie and detect from header
+  },
 };
 
 module.exports = config;
 ```
 
-> Through this configuration file, you can set up localized URLs, middleware redirection, cookie names, the location and extension of your content declarations, disable Intlayer logs in the console, and more. For a complete list of available parameters, refer to the [configuration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/configuration.md).
+> Through this configuration file, you can set up localized URLs, routing modes, storage options, cookie names, the location and extension of your content declarations, disable Intlayer logs in the console, and more. For a complete list of available parameters, refer to the [configuration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/configuration.md).
 
 ### Step 3: Integrate Intlayer in Your Vite Configuration
 
@@ -607,7 +626,7 @@ Example:
 - https://example.com/fr/about
 ```
 
-> By default, the routes are not prefixed for the default locale. If you want to prefix the default locale, you can set the `middleware.prefixDefault` option to `true` in your configuration. See the [configuration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/configuration.md) for more information.
+> By default, the routes are not prefixed for the default locale (`routing.mode: "prefix-no-default"`). If you want to prefix the default locale, you can set the `routing.mode` option to `"prefix-all"` in your configuration. See the [configuration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/configuration.md) for more information.
 
 To add localized routing to your application, you can create a `LocaleRouter` component that wraps your application's routes and handles locale-based routing. Here is an example using [preact-iso](https://github.com/preactjs/preact-iso):
 
@@ -626,13 +645,13 @@ yarn add preact-iso
 ```
 
 ```tsx fileName="src/components/LocaleRouter.tsx"  codeFormat="typescript"
-import { type Locales, configuration, getPathWithoutLocale } from "intlayer";
-import { ComponentChildren, FunctionalComponent } from "preact";
+import { configuration, getPathWithoutLocale, type Locale } from "intlayer";
+import type { ComponentChildren, FunctionalComponent } from "preact";
+import { useEffect } from "preact/hooks";
 import { IntlayerProvider } from "preact-intlayer";
 import { LocationProvider, useLocation } from "preact-iso";
-import { useEffect } from "preact/hooks";
 
-const { internationalization, middleware } = configuration;
+const { internationalization, routing } = configuration;
 const { locales, defaultLocale } = internationalization;
 
 const Navigate: FunctionalComponent<{ to: string; replace?: boolean }> = ({
@@ -652,7 +671,7 @@ const Navigate: FunctionalComponent<{ to: string; replace?: boolean }> = ({
  */
 const AppLocalized: FunctionalComponent<{
   children: ComponentChildren;
-  locale?: Locales;
+  locale?: Locale;
 }> = ({ children, locale }) => {
   const { path: pathname, url } = useLocation();
 
@@ -671,9 +690,9 @@ const AppLocalized: FunctionalComponent<{
   );
 
   /**
-   * If middleware.prefixDefault is true, the default locale should always be prefixed.
+   * If routing.mode is 'prefix-all', the default locale should always be prefixed.
    */
-  if (middleware.prefixDefault) {
+  if (routing.mode === "prefix-all") {
     // Validate the locale
     if (!locale || !locales.includes(locale)) {
       // Redirect to the default locale with the updated path
@@ -691,7 +710,7 @@ const AppLocalized: FunctionalComponent<{
     );
   } else {
     /**
-     * When middleware.prefixDefault is false, the default locale is not prefixed.
+     * When routing.mode is not 'prefix-all', the default locale is not prefixed.
      * Ensure that the current locale is valid and not the default locale.
      */
     if (
@@ -722,10 +741,12 @@ const RouterContent: FunctionalComponent<{
     return null;
   }
 
-  const pathLocale = path.split("/")[1] as Locales;
+  const pathLocale = path.split("/")[1] as Locale;
 
   const isLocaleRoute = locales
-    .filter((locale) => middleware.prefixDefault || locale !== defaultLocale)
+    .filter(
+      (locale) => routing.mode === "prefix-all" || locale !== defaultLocale
+    )
     .some((locale) => locale.toString() === pathLocale);
 
   if (isLocaleRoute) {
@@ -734,7 +755,7 @@ const RouterContent: FunctionalComponent<{
 
   return (
     <AppLocalized
-      locale={!middleware.prefixDefault ? defaultLocale : undefined}
+      locale={routing.mode !== "prefix-all" ? defaultLocale : undefined}
     >
       {children}
     </AppLocalized>
@@ -763,7 +784,7 @@ import { useEffect } from "preact/hooks";
 import { h } from "preact"; // Required for JSX
 
 // Destructuring configuration from Intlayer
-const { internationalization, middleware } = configuration;
+const { internationalization, routing } = configuration;
 const { locales, defaultLocale } = internationalization;
 
 const Navigate = ({ to, replace }) => {
@@ -796,9 +817,9 @@ const AppLocalized = ({ children, locale }) => {
   );
 
   /**
-   * If middleware.prefixDefault is true, the default locale should always be prefixed.
+   * If routing.mode is 'prefix-all', the default locale should always be prefixed.
    */
-  if (middleware.prefixDefault) {
+  if (routing.mode === "prefix-all") {
     // Validate the locale
     if (!locale || !locales.includes(locale)) {
       // Redirect to the default locale with the updated path
@@ -816,7 +837,7 @@ const AppLocalized = ({ children, locale }) => {
     );
   } else {
     /**
-     * When middleware.prefixDefault is false, the default locale is not prefixed.
+     * When routing.mode is not 'prefix-all', the default locale is not prefixed.
      * Ensure that the current locale is valid and not the default locale.
      */
     if (
@@ -848,7 +869,9 @@ const RouterContent = ({ children }) => {
   const pathLocale = path.split("/")[1];
 
   const isLocaleRoute = locales
-    .filter((locale) => middleware.prefixDefault || locale !== defaultLocale)
+    .filter(
+      (locale) => routing.mode === "prefix-all" || locale !== defaultLocale
+    )
     .some((locale) => locale.toString() === pathLocale);
 
   if (isLocaleRoute) {
@@ -857,7 +880,7 @@ const RouterContent = ({ children }) => {
 
   return (
     <AppLocalized
-      locale={!middleware.prefixDefault ? defaultLocale : undefined}
+      locale={routing.mode !== "prefix-all" ? defaultLocale : undefined}
     >
       {children}
     </AppLocalized>
@@ -884,7 +907,7 @@ const { useEffect } = require("preact/hooks");
 const { h } = require("preact"); // Required for JSX
 
 // Destructuring configuration from Intlayer
-const { internationalization, middleware } = configuration;
+const { internationalization, routing } = configuration;
 const { locales, defaultLocale } = internationalization;
 
 const Navigate = ({ to, replace }) => {
@@ -917,9 +940,9 @@ const AppLocalized = ({ children, locale }) => {
   );
 
   /**
-   * If middleware.prefixDefault is true, the default locale should always be prefixed.
+   * If routing.mode is 'prefix-all', the default locale should always be prefixed.
    */
-  if (middleware.prefixDefault) {
+  if (routing.mode === "prefix-all") {
     // Validate the locale
     if (!locale || !locales.includes(locale)) {
       // Redirect to the default locale with the updated path
@@ -937,7 +960,7 @@ const AppLocalized = ({ children, locale }) => {
     );
   } else {
     /**
-     * When middleware.prefixDefault is false, the default locale is not prefixed.
+     * When routing.mode is not 'prefix-all', the default locale is not prefixed.
      * Ensure that the current locale is valid and not the default locale.
      */
     if (
@@ -969,7 +992,9 @@ const RouterContent = ({ children }) => {
   const pathLocale = path.split("/")[1];
 
   const isLocaleRoute = locales
-    .filter((locale) => middleware.prefixDefault || locale !== defaultLocale)
+    .filter(
+      (locale) => routing.mode === "prefix-all" || locale !== defaultLocale
+    )
     .some((locale) => locale.toString() === pathLocale);
 
   if (isLocaleRoute) {
@@ -978,7 +1003,7 @@ const RouterContent = ({ children }) => {
 
   return (
     <AppLocalized
-      locale={!middleware.prefixDefault ? defaultLocale : undefined}
+      locale={routing.mode !== "prefix-all" ? defaultLocale : undefined}
     >
       {children}
     </AppLocalized>

package/docs/en/intlayer_with_vite+react.md

@@ -29,6 +29,10 @@ history:
 
 See [Application Template](https://github.com/aymericzip/intlayer-vite-react-template) on GitHub.
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications.

package/docs/en/intlayer_with_vite+solid.md

@@ -42,6 +42,10 @@ With Intlayer, you can:
 
 ## Step-by-Step Guide to Set Up Intlayer in a Vite and Solid Application
 
+## Table of Contents
+
+<TOC>
+
 ### Step 1: Install Dependencies
 
 Install the necessary packages using npm:

package/docs/en/intlayer_with_vite+svelte.md

@@ -27,6 +27,10 @@ history:
 
 <!-- See [Application Template](https://github.com/aymericzip/intlayer-solid-template) on GitHub. -->
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications.

package/docs/en/intlayer_with_vite+vue.md

@@ -25,6 +25,10 @@ history:
 
 See [Application Template](https://github.com/aymericzip/intlayer-vite-vue-template) on GitHub.
 
+## Table of Contents
+
+<TOC>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalization (i18n) library designed to simplify multilingual support in modern web applications.

package/docs/en/introduction.md

@@ -187,6 +187,7 @@ Organize your multilingual content close to your code to keep everything consist
 
 We’ve built Intlayer with flexibility in mind, offering seamless integration across popular frameworks and build tools:
 
+- **[Intlayer with Next.js 16](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_nextjs_16.md)**
 - **[Intlayer with Next.js 15](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_nextjs_15.md)**
 - **[Intlayer with Next.js 14 (App Router)](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_nextjs_14.md)**
 - **[Intlayer with Next.js Page Router](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_nextjs_page_router.md)**

package/docs/en/releases/v7.md

@@ -187,8 +187,7 @@ storage: ['cookie', 'localStorage']
 
 For production applications that need to balance functionality with GDPR compliance:
 
-```typescript
-// intlayer.config.ts
+```typescript fileName="intlayer.config.ts"
 export default {
   internationalization: {
     locales: ["en", "fr", "es"],
@@ -260,8 +259,7 @@ If not set, Intlayer will try to detect the format command automatically. By try
 
 The `formatCommand` option accepts a string template where `{{file}}` will be replaced with the actual file path:
 
-```typescript
-// intlayer.config.ts
+```typescript fileName="intlayer.config.ts"
 export default {
   content: {
     formatCommand: 'bun x biome format "{{file}}" --write --log-level none',
@@ -320,7 +318,7 @@ The `fill` property has been moved from the `content` section to a new `dictiona
 
 **v6 configuration:**
 
-```typescript
+```typescript fileName="intlayer.config.ts"
 export default {
   content: {
     autoFill: "./{{fileName}}.content.json",
@@ -331,7 +329,7 @@ export default {
 
 **v7 configuration:**
 
-```typescript
+```typescript fileName="intlayer.config.ts"
 export default {
   content: {
     contentDir: ["src"],
@@ -399,7 +397,7 @@ The fill command now supports complex content declaration structures, including:
 
 ### Example usage
 
-```typescript
+```typescript fileName="*.content.ts"
 // Rewrite current file with all locales
 const content = {
   key: "example",
@@ -484,7 +482,7 @@ Advanced chunking strategies handle large content files without exceeding AI con
 
 ### Example workflow
 
-```typescript
+```typescript fileName="*.content.ts"
 // Large content file gets automatically chunked
 const content = {
   key: "large-documentation",
@@ -539,7 +537,7 @@ The system automatically:
 
 **Before (v6):**
 
-```typescript
+```typescript fileName="intlayer.config.ts"
 export default {
   content: {
     autoFill: "./{{fileName}}.content.json",
@@ -558,7 +556,7 @@ export default {
 
 **After (v7):**
 
-```typescript
+```typescript fileName="intlayer.config.ts"
 export default {
   content: {
     contentDir: ["src"],
@@ -588,7 +586,7 @@ export default {
 
 **Before (v6):**
 
-```typescript
+```typescript fileName="*.content.ts"
 const content = {
   key: "example",
   autoFill: true, // Rewrites this file
@@ -600,7 +598,7 @@ const content = {
 
 **After (v7):**
 
-```typescript
+```typescript fileName="*.content.ts"
 const content = {
   key: "example",
   fill: true, // Rewrites this file

package/docs/en/roadmap.md

@@ -31,6 +31,12 @@ Intlayer is a content management and internationalization solution designed to s
 
 ---
 
+## Table of Contents
+
+<TOC>
+
+---
+
 ## Current Features
 
 ### 1. Content Declaration

package/docs/en-GB/intlayer_with_nextjs_14.md

@@ -722,15 +722,17 @@ export const generateMetadata = ({
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl =
+    multilingualUrls[locale as keyof typeof multilingualUrls];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale as keyof typeof multilingualUrls],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };
@@ -760,15 +762,16 @@ export const generateMetadata = ({ params: { locale } }) => {
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl = multilingualUrls[locale];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };
@@ -798,15 +801,16 @@ const generateMetadata = ({ params: { locale } }) => {
    * ```
    */
   const multilingualUrls = getMultilingualUrls("/");
+  const localizedUrl = multilingualUrls[locale];
 
   return {
     ...metadata,
     alternates: {
-      canonical: multilingualUrls[locale],
+      canonical: localizedUrl,
       languages: { ...multilingualUrls, "x-default": "/" },
     },
     openGraph: {
-      url: multilingualUrls[locale],
+      url: localizedUrl,
     },
   };
 };