Skip to content

Conversation

@cellog
Copy link
Contributor

@cellog cellog commented Oct 16, 2025

Issue #1869

This adds a new Trans component that does not use React.Children under the hood, but instead uses React.createElement and expects a tree of components (contents) that instead passes in the components to render. This eliminates a whole slew of weird hard-to-diagnose bugs, and most importantly, makes Trans compatible with the new React compiler that was just released as version 1.0 last week.

A follow-up PR will adjust the icu macro to use this new component under the hood. It's designed to be a drop-in replacement for the code that is compiled, but requires a different parsing logic in the babel macro.

Checklist

  • only relevant code is changed (make a diff before you submit the PR)
  • run tests npm run test
  • tests are included
  • commit message and code follows the Developer's Certification of Origin

Checklist (for documentation change)

  • only relevant documentation part is changed (make a diff before you submit the PR)
  • motivation/reason is provided
  • commit message and code follows the Developer's Certification of Origin

@coveralls
Copy link

Coverage Status

coverage: 97.208% (+1.3%) from 95.874%
when pulling 4ae9666 on cellog:issue-1869-new-trans
into 8a58ad0 on i18next:master.

@adrai
Copy link
Member

adrai commented Oct 16, 2025

Do you want me to merge this right now or should we wait?
btw: we should probably then document this somewhere here: https://react.i18next.com/misc/using-with-icu-format#using-babel-macros-trans-plural-select

@cellog
Copy link
Contributor Author

cellog commented Oct 16, 2025

Do you want me to merge this right now or should we wait? btw: we should probably then document this somewhere here: https://react.i18next.com/misc/using-with-icu-format#using-babel-macros-trans-plural-select

This is mergeable as-is (if people really want to, they can use this without icu.macro)

That specific document isn't yet updateable, but I could see adding a new sibling doc to Trans. I wonder if we should leave it undocumented for now, until the icu macro PR is reviewed? Just so we don't lock in things that need changing immediately

@adrai
Copy link
Member

adrai commented Oct 16, 2025

That specific document isn't yet updateable, but I could see adding a new sibling doc to Trans. I wonder if we should leave it undocumented for now, until the icu macro PR is reviewed? Just so we don't lock in things that need changing immediately

Yes, let's wait for the docs...

will merge, but not yet create a new release, ok?

@adrai adrai merged commit 62d6c2c into i18next:master Oct 16, 2025
9 checks passed
import React from 'react';
import { warn, warnOnce, isString } from './utils.js';
import { getI18n } from './i18nInstance.js';
import { renderTranslation } from './IcuTransUtils';
Copy link

@curtdept curtdept Oct 20, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@adrai @cellog this is missing the .js extension and causing issues with vite, etc when using typescript

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can you try with v16.1.2 ?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sure, waiting for build, btw the import seems to work with ./IcuTransUtils/renderTranslation.js :)

Copy link

@curtdept curtdept Oct 20, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@adrai ya that version is clean and tests good on our stuff, thanks for the quick fix :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants