Optional translations about next-intl HOT 7 OPEN

Can we have these two features:

1. If the translation does not exist, fallback to see the defaultLocale json file and use the word there
2. Fallback to a specific language not always defaultLocale, If the translation from zh-TW does not exist, fallback to show words in zh

from next-intl.

Can we have these two features:

1. If the translation does not exist, fallback to see the defaultLocale json file and use the word there
2. Fallback to a specific language not always defaultLocale, If the translation from zh-TW does not exist, fallback to show words in zh

I use this code to implement the logic:

import merge from "deepmerge";
import { getRequestConfig } from "next-intl/server";

export default getRequestConfig(async ({ locale }) => {
  const localeMessages = (await import(`./messages/${locale}.json`)).default;
  const localeGeneralMessages =
    locale.split("-").length > 1
      ? (await import(`./messages/${locale.split("-")[0]}.json`)).default
      : {};
  const defaultMessages = (await import(`./messages/en.json`)).default;
  const messages = merge.all([
    defaultMessages,
    localeGeneralMessages,
    localeMessages,
  ]);

  return {
    messages,
  };
});

It can run successfully, but give me the type warning for async ({ locale })

Argument of type '({ locale }: GetRequestConfigParams) => Promise<{ messages: object; }>' is not assignable to parameter of type '(params: GetRequestConfigParams) => RequestConfig | Promise<RequestConfig>'.
  Type 'Promise<{ messages: object; }>' is not assignable to type 'RequestConfig | Promise<RequestConfig>'.
    Type 'Promise<{ messages: object; }>' is not assignable to type 'Promise<RequestConfig>'.
      Type '{ messages: object; }' is not assignable to type 'RequestConfig'.
        Types of property 'messages' are incompatible.
          Type 'object' is not assignable to type 'AbstractIntlMessages'.
            Index signature for type 'string' is missing in type '{}'.ts(2345)

anyone know how to solve this?

from next-intl.

Merging messages from another locale as a fallback is absolutely fine and also mentioned in the messages docs ("How can I use messages from another locale as fallbacks?").

from next-intl.

Can we have these two features:

1. If the translation does not exist, fallback to see the defaultLocale json file and use the word there
2. Fallback to a specific language not always defaultLocale, If the translation from zh-TW does not exist, fallback to show words in zh

I use this code to implement the logic:

import merge from "deepmerge";
import { getRequestConfig } from "next-intl/server";

export default getRequestConfig(async ({ locale }) => {
  const localeMessages = (await import(`./messages/${locale}.json`)).default;
  const localeGeneralMessages =
    locale.split("-").length > 1
      ? (await import(`./messages/${locale.split("-")[0]}.json`)).default
      : {};
  const defaultMessages = (await import(`./messages/en.json`)).default;
  const messages = merge.all([
    defaultMessages,
    localeGeneralMessages,
    localeMessages,
  ]);

  return {
    messages,
  };
});

It can run successfully, but give me the type warning for async ({ locale })

Argument of type '({ locale }: GetRequestConfigParams) => Promise<{ messages: object; }>' is not assignable to parameter of type '(params: GetRequestConfigParams) => RequestConfig | Promise<RequestConfig>'.
  Type 'Promise<{ messages: object; }>' is not assignable to type 'RequestConfig | Promise<RequestConfig>'.
    Type 'Promise<{ messages: object; }>' is not assignable to type 'Promise<RequestConfig>'.
      Type '{ messages: object; }' is not assignable to type 'RequestConfig'.
        Types of property 'messages' are incompatible.
          Type 'object' is not assignable to type 'AbstractIntlMessages'.
            Index signature for type 'string' is missing in type '{}'.ts(2345)

anyone know how to solve this?

I've solved the issue like this, but I only have two elements, maybe you can do two steps

const messages = merge(defaultMessages, localeMessages);

from next-intl.

My usecase:

Our backend is returning a State (e.g. Washington, Oregon, etc.)
We will have translations for all of the common states.

However, it is possible that a new value comes down the line.
I would like to be able to show a translated key if its present, otherwise just fall back to displaying the value returned by the API.

As far as I can tell, this isn't supported by this library?

from next-intl.

@philipbjorge Have you considered using select for this use case?

"state": "{state, select, WA {Washington} OR {Oregon} other {{state}}"

from next-intl.

Mmm interesting solution... We have 900 selections, so I feel like that string might become unwieldy. I think we might go with something like this since the key name is well-defined.

  const getTranslationWithFallback = (key: string, fallback: string) => {
    const translated = tc(key, false);
    if (translated.startsWith("common.")) {
      return fallback;
    }
    return translated;
  };

{getTranslationWithFallback(`biomes.${biome}`, biome)}

from next-intl.