-
Notifications
You must be signed in to change notification settings - Fork 8.6k
DEV: Add a Translation component. #33082
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
base: main
Are you sure you want to change the base?
Conversation
app/assets/javascripts/discourse/app/components/translation.gjs
Outdated
Show resolved
Hide resolved
app/assets/javascripts/discourse/app/components/translation.gjs
Outdated
Show resolved
Hide resolved
app/assets/javascripts/discourse/app/components/translation.gjs
Outdated
Show resolved
Hide resolved
app/assets/javascripts/discourse/tests/integration/components/translation-test.gjs
Outdated
Show resolved
Hide resolved
app/assets/javascripts/discourse/tests/integration/components/translation-test.gjs
Show resolved
Hide resolved
app/assets/javascripts/discourse/tests/integration/components/translation-test.gjs
Show resolved
Hide resolved
_placeholderKeys = new Map(); | ||
|
||
/** | ||
* A map of placeholder keys to their corresponding DOM elements. | ||
* | ||
* @type {Map<String, HTMLElement>} | ||
*/ | ||
_placeholderElements = new Map(); | ||
|
||
/** | ||
* A map of placeholder keys to their appearance in the translation string. | ||
* | ||
* @type {Map<String, String>} | ||
*/ | ||
_placeholderAppearance = new Map(); | ||
|
||
/** | ||
* Tracks which placeholders have been rendered. | ||
* | ||
* @type {Array<String>} | ||
*/ | ||
_renderedPlaceholders = []; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think having all this state stored on the component instance will lead to a lot of possible bugs. e.g. if the component is rendered with one @scope
, and then the @scope
value changes, then the getter will be automatically re-run. But there is nothing to clear all this internal state, so we'll end up with duplicate data in these sets/arrays.
As a general rule, we should aim to avoid any kind of side-effects in getters.
I think I'd aim to build everything you need inside the getter, and then return it. So something like:
get textAndPlaceholders(){
...
return {
parts: ...,
elements: ...,
...
}
}
And then
<template>
{{#let this.textAndPlaceholders as |infos|}}
{{#each infos.parts as |part|}}
{{part}}
{{/each}}
It's probably worth having a test for that case where the scope and/or opts arguments change at runtime.
✨ What's This?
Reference: t/155601
A new
<Translation>
component for interpolating components into translatable strings.This PR also includes a little bit of refactoring in the
i18n
library to make it easier to hook into.Example:
📺 Screenshots
👑 Testing
Review the new integration tests, consider any missing cases that should be covered.