Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

t from getTranslations({locale, namespace}) can`t receive any arguments when not using typed messages #625

Closed
SergGen opened this issue Nov 14, 2023 · 9 comments · Fixed by #630
Labels
bug Something isn't working unconfirmed Needs triage.

Comments

@SergGen
Copy link

SergGen commented Nov 14, 2023

Description

When calling t from getTranslations with correct argument, the IDE shows on t argument this TypeScript error: TS2345: An argument of type string is not assigned to a parameter of type never. This error appears also when is building.
This error appears in next-intl starting from version 3.0.0-rc.10. In version 3.0.1, this error is also present.
IDE show this type of t:

const t: <>(key: never, values?: (TranslationValues | undefined), formats?: (Partial<Formats> | undefined)) => string

Sample code with this error:

export async function generateMetadata({ params: { locale } }: { params: { locale: 'en' | 'de' } }) {
      const t = await getTranslations({ locale, namespace: 'pages.metadata' });
      return { title: t('title'), description: t('description')};
}

I am using IDE Webstorm 2023.2.5. TypeScript version 5.2.2. Next.js version 14.0.2.

CodeSandbox reproduction do not show this error. This error is in IDE with TypeScript and building.

Expected behaviour

I want there to be no TypeScript error: TS2345: An argument of type string is not assigned to a parameter of type never.

@SergGen SergGen added bug Something isn't working unconfirmed Needs triage. labels Nov 14, 2023
@amannn
Copy link
Owner

amannn commented Nov 14, 2023

To be able to look into this, a reproduction would be required. Maybe your IDE uses another version of TypeScript that reports a false positive (instead of the local one)?

This repo also uses typescript@^5.2.2 and the getTranslations API is working.

What I did notice so far is that getTranslations({locale, namespace: ''}) for some reason doesn't display autocomplete in VSCode, while getTranslations('') does. However, both validate correctly and will show errors if an invalid string is provided. Not sure if a fix is required on the TypeScript side or next-intl.

@SergGen
Copy link
Author

SergGen commented Nov 14, 2023

I cloned your example and compared the package versions with my project. It's all the same.
Your example works and builds correctly.

I don't understand why this error occurs in my project...

An IDE should not affect the build process. Build error still appear in terminal.

Type error: Argument of type 'string' is not assignable to parameter of type 'never'.

When next-intl version set to 3.0.0-rc.9, there are no any error.

@tianyingchun
Copy link

tianyingchun commented Nov 15, 2023

i have update to 3.0.1 face this issue too

export async function generateMetadata({ params: { locale } }: PageProps) {
  const t = await getTranslations({ locale, namespace: 'IndexPage' });
  return {
    title: t('title'),
  };
}

namespace: 'IndexPage' can not show typings auto promoting, but it can verify if IndexPage correct.

useTranslations() works fine.

@amannn
Copy link
Owner

amannn commented Nov 15, 2023

Ah, I think I found the error!

The error happens when you don't use the TypeScript integration of next-intl.

As a temporary workaround, you can define this in a file like ./global.d.ts:

// Temporary workaround for https://github.com/amannn/next-intl/issues/625
type Messages = any
declare interface IntlMessages extends Messages {}

getTranslations(namespace) doesn't seem to be affected.

I'll look into a proper fix. Thanks for the report!

@amannn amannn changed the title t from getTranslations cann`t get any arguments. t from getTranslations({locale, namespace}) can`t receive any arguments when not using typed messages Nov 15, 2023
amannn added a commit that referenced this issue Nov 15, 2023
@tianyingchun
Copy link

// Use type safe message keys with `next-intl`
type Messages = typeof import('./messages/en.json');
declare interface IntlMessages extends Messages {}

3.0.2 also has this issue.
@amannn

@tianyingchun
Copy link

tianyingchun commented Nov 16, 2023

image image

typescript@5.2.2

Nothing prompting here it should give tips `

@amannn
Copy link
Owner

amannn commented Nov 16, 2023

Yep, I noticed too that somehow TypeScript doesn't provide autocomplete for this case. However, errors are correctly detected. Note that this only affects the object form, not when calling getTranslations(namespace?).

If some TypeScript wizard would like to have a look, I'd really appreciate it!

@tianyingchun
Copy link

haha, Expect ts experts to help :) have no idea

@CreativeArtDesign
Copy link

I trying to do this.

but it does not find my string and my string is right.
import {getTranslations} from 'next-intl/server';

const local = "sv" // MANUALLY SPECIFIED LOCALE
const t = await getTranslations({
locale: local, // OR "en" BASED ON THE DESIRED LOCALE
namespaces: ["Notifications"],
})

error:

IntlError: MISSING_MESSAGE: Could not resolve ResetYourPassword in messages for locale sv.

I use
version 3.7.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working unconfirmed Needs triage.
Projects
None yet
4 participants