Skip to content

Feat/add translation support#14

Merged
AFCMS merged 8 commits intomasterfrom
feat/add-translation-support
Sep 22, 2025
Merged

Feat/add translation support#14
AFCMS merged 8 commits intomasterfrom
feat/add-translation-support

Conversation

@Klhmt
Copy link
Collaborator

@Klhmt Klhmt commented Sep 20, 2025

First implementation of the translation mechanism.

How translate things in the code

  • add translation in the code (either with the React component or with the macro)
  • run pnpm run extract
  • add the translation on the messages.ts files in src/locales/*/
  • run pnpm run compile EDIT: done by the Vite plugin

I think there's room for improvements (maybe make the list of supported languages dynamic based on the existant files in locales/*...)

@Klhmt Klhmt linked an issue Sep 20, 2025 that may be closed by this pull request
@vercel
Copy link

vercel bot commented Sep 20, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
fluorite Ready Ready Preview Comment Sep 22, 2025 2:39pm

@AFCMS AFCMS self-requested a review September 20, 2025 21:29
Copy link
Owner

@AFCMS AFCMS left a comment

Choose a reason for hiding this comment

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

I didn't test the code yet.

About the translations and auto generated files, I think we should bring a pre-commit library like Husky to run the translation update before committing (in another PR).

Copy link
Owner

Choose a reason for hiding this comment

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

Not a problem here but argggg forced to use babel here.

If the React parser was SWC it could have use the SWC plugin instead (much faster).

Here most of the React work is made by OXC which is faster than SWC, but still rely on Babel for the React compiler, and now the Lingui plugin 😢

I want more Rust in the web 🦀

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

</div>
<p>Drop video file here</p>
<p>
<Trans>Drop video file here</Trans>
Copy link
Owner

Choose a reason for hiding this comment

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

Is there a reason to use <Trans> instead of t here?

We do not plan on adding nested JSX components under it at the moment.

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

See https://lingui.dev/tutorials/react#macros-vs-components for the difference. At compilation the macros are transformed into <Trans>. I'll use a macro there to be more consistant

Copy link
Owner

Choose a reason for hiding this comment

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

It's not the goal of the PR here but in the short term we should have a configuration page with app language and not solely rely on the browser language.

I think we should either bring a component library or build our own but it require some brainstorming first.

In general I think we should aim at a very minimalistic UI and a settings page will quickly become a requirement (don't want a big dropdown in the control bar).

@AFCMS
Copy link
Owner

AFCMS commented Sep 22, 2025

Conflicts 😬

There is one new string in ControlBar.tsx, fix the conflict in package.json then delete and pnpm install to recreate pnpm-lock.yaml.

Should be pretty easy to fix the tsconfig.

@AFCMS AFCMS merged commit 6d8ef88 into master Sep 22, 2025
4 checks passed
@AFCMS AFCMS deleted the feat/add-translation-support branch September 22, 2025 14:43
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.

Translations

2 participants