i18n: TypeScript Error: Property 'translations' does not exist on I18nOptions type

[mflisikowski]

Describe the Bug

TypeScript Error: Property 'translations' does not exist on I18nOptions type

Description

There is a TypeScript error in the custom translations configuration for Payload CMS. The error occurs when trying to access the translations property on the Config['i18n'] type. / https://payloadcms.com/docs/configuration/i18n#typescript

Property 'translations' does not exist on type 'I18nOptions<{} | { authentication: { account: string; accountOfCurrentUser: string; accountVerified: string; alreadyActivated: string; alreadyLoggedIn: string; apiKey: string; authenticated: string; ... 59 more ...; youDidNotRequestPassword: string; }; ... 7 more ...; version: { ...; }; }> | undefined'.ts(2339)

Link to the code that reproduces this issue

https://github.com/mflisikowski/i18n-custom-translations

Reproduction Steps

Environment

• Payload CMS: 3.5.0
• Next.js: 15.0.4
• TypeScript: 5.7.2
• @payloadcms/translations: ^3.5.0

Steps to Reproduce

1. Set up a Payload CMS project with i18n support
2. Configure custom translations using the Config['i18n']['translations'] type: https://payloadcms.com/docs/configuration/i18n#typescript
3. Run TypeScript type checking

Which area(s) are affected? (Select all that apply)

area: docs

Environment Info

Binaries:
  Node: 20.11.1
  npm: 10.2.4
  pnpm: 9.13.2
Relevant Packages:
  payload: 3.5.0
  next: 15.0.4
  @payloadcms/graphql: 3.5.0
  @payloadcms/next/utilities: 3.5.0
  @payloadcms/richtext-lexical: 3.5.0
  @payloadcms/translations: 3.5.0
  @payloadcms/ui/shared: 3.5.0
  react: 19.0.0
  react-dom: 19.0.0
Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 24.1.0: Thu Oct 10 21:03:15 PDT 2024; root:xnu-11215.41.3~2/RELEASE_ARM64_T6000
  Available memory (MB): 16384
  Available CPU cores: 10

[michel-jump]

Following, also encountering this problem.

[smoglica]

For the moment this issue could be handled with NonNullable<Config['i18n']>['translations'].

I don't know if is this the reason, but I'm also encountering another problem with types when using req.t. Custom translations are not detected.

For example for a custom key: 'authentication:loginDetails' I get

The only solution that I found is overriding TFunction type and had to use // @ts-ignore

declare module '@payloadcms/translations' {
  // @ts-ignore
  export type TFunction = (
    key: string,
    options?: Record<string, any>,
  ) => string;
}

[GerardPolloRebozado]

adding that code made the warning disapear but the text is not translated it doenst even appear on the original language

declare module '@payloadcms/translations' {
  // @ts-ignore
  export type TFunction = (
    key: string,
    options?: Record<string, any>,
  ) => string;
}```

[GerardPolloRebozado]

any updates?

[loudmu]

no . you should try the localization starter

[GerardPolloRebozado]

I tried taking a look at it but I have the same issue

[Davsej]

I have the same issue.

[antofopera]

Same problem +1. Shows a type error, and the text is not translated. Ignoring it for the moment.

[usamajamil213]

I have the same issue. I’m using the latest version of @payloadcms/translations (3.20.0). I tried using // @ts-ignore, but I’m unable to get the translation in my custom component.

[github-actions[bot]]

🚀 This is included in version v3.28.0

[github-actions[bot]]

This issue has been automatically locked. Please open a new issue if this issue persists with any additional detail.