missingKey en zod key key

Question

Regression Report I am unable to change the language with the using of the LanguageDetector package, When i set the fallback langauge as en or ar it works pretty fine but after it is being set if i try to change the language from the header it doesn't change even tho i see this log when i set debug: true

// logs on each request that i have Accept-Language Header set to ar
i18next: languageChanged en
i18next: languageChanged ar
i18next::translator: missingKey en zod email email

Config

// configure dotenv before every thing, even imports
import * as dotenv from 'dotenv';
import { join, resolve } from 'path';
dotenv.config({ path: resolve(__dirname, '.env') });

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import i18next from 'i18next';
import enTranslations from 'zod-i18n-map/locales/en/zod.json';
import { z } from 'zod';
import { makeZodI18nMap } from 'zod-i18n-map';
import languageDetector from 'i18next-http-middleware';
import i18nextBackend from 'i18next-fs-backend';
import arTranslations from 'zod-i18n-map/locales/ar/zod.json';
import enTranslations from 'zod-i18n-map/locales/en/zod.json';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.use(languageDetector.handle(i18next));

    await i18next
      .use(i18nextBackend)
      .use(languageDetector.LanguageDetector)
    .init({
      debug: true,
      supportedLngs: ['en', 'ar'],
      fallbackLng: 'en',
      resources: {
        ar: { zod: arTranslations },
        en: { zod: enTranslations },
      },
    });

  z.setErrorMap(makeZodI18nMap({ ns: 'zod', t: i18next.t }));
  app.use(compression());
  await app.listen(3000);
}
bootstrap();

Expected behavior to return the message as 'ar' instead of the fallbackLng

Your Environment runtime version: Latest Nestjs i18next version: 23.5.1 os: Windows zod-i18n-map: 2.20.0 Debug

i18next: languageChanged en
i18next: initialized {
  debug: true,
  initImmediate: true,
  ns: [ 'translation' ],
  defaultNS: [ 'translation' ],
  fallbackLng: [ 'en' ],
  fallbackNS: false,
  supportedLngs: [ 'en', 'ar', 'cimode' ],
  nonExplicitSupportedLngs: false,
  load: 'all',
  preload: false,
  simplifyPluralSuffix: true,
  keySeparator: '.',
  nsSeparator: ':',
  pluralSeparator: '_',
  contextSeparator: '_',
  partialBundledLanguages: false,
  saveMissing: false,
  updateMissing: false,
  saveMissingTo: 'fallback',
  saveMissingPlurals: true,
  missingKeyHandler: false,
  missingInterpolationHandler: false,
  postProcess: false,
  postProcessPassResolved: false,
  returnNull: false,
  returnEmptyString: true,
  returnObjects: false,
  joinArrays: false,
  returnedObjectHandler: false,
  parseMissingKeyHandler: false,
  appendNamespaceToMissingKey: false,
  appendNamespaceToCIMode: false,
  overloadTranslationOptionHandler: [Function: handle],
  interpolation: {
    escapeValue: true,
    format: [Function: bound format],
    prefix: '{{',
    suffix: '}}',
    formatSeparator: ',',
    unescapePrefix: '-',
    nestingPrefix: '$t(',
    nestingSuffix: ')',
    nestingOptionsSeparator: ',',
    maxReplaces: 1000,
    skipOnVariables: true
  },
  resources: { ar: { zod: [Object] }, en: { zod: [Object] } },
  ignoreJSONStructure: true
}

Answer 1

I solve it by using this middleware, Pretty sure there is better way but that just worked for me and i am open to any better suggestion!

  app.use(
    (
      req: Request & { language: string },
      res: Response,
      next: NextFunction,
    ) => {
      z.setErrorMap(
        makeZodI18nMap({
          t: i18next.getFixedT(req.language),
        }),
      );
      next();
    },
  );

Answer 2

Adding handlePath: false fixed it for me.

z.setErrorMap(makeZodI18nMap({ handlePath: false }));

source