discourse/app/assets/javascripts/admin/addon/controllers/admin-site-text-index.js
Natalie Tay 235c673fe8
FEATURE: Localize language names (#33790)
This PR adds localized language names to settings. The language names
are localized in the frontend, not the backend, due to setting
initialization complexity.

This change affects these areas:
- `SiteSetting.available_locales` 
- this "setting" is a lookup table to get language names. use
`languageNameLookup` service to get the name for a locale
- it returns an object that looks like the following, then gets
re-hydrated with client localized values when initializing the
`siteSettingService` in the frontend.
  ```
  [
{"native_name":"اللغة العربية","value":"ar","name":"languages.ar.name"},
    ...
  ]  
  ```

- `SiteSetting.default_locale` 
- this is a single-value `enum` setting that has always been hardcoded.
This caused quite an issue as it is not initialized the same way as
other site settings in the yml file. It has always relied on reading
directly from a `names.yml` file to load native language names, thus
bypassing the need for I18n to be initialized from the backend. A new
locale_enum type has been introduced for this setting, and any future
settings.
  
- `SiteSetting.content_localization_supported_locales` - this is a
`enum_list` setting,
  - enum_list is introduced, leveraging both `list` and `enum`
  
- theme translations

- site texts

- Wizard's default_locale choices 
- it was set up from the backend using `LocaleSiteSetting.value`. This
proved problematic, as a Japanese user would be getting the locales in
English because the values are initialized using English even without
memoization
- therefore we're now initializing the choices in the frontend using
`available_locales` as defined above
  
- content localization meta data
- post language in the composer, localization composer, post history
modal, post language tooltip, language switcher



/t/151409
2025-07-29 11:48:45 +08:00

168 lines
3.7 KiB
JavaScript
Vendored

import { tracked } from "@glimmer/tracking";
import Controller from "@ember/controller";
import { action } from "@ember/object";
import { service } from "@ember/service";
import discourseDebounce from "discourse/lib/debounce";
import { disableImplicitInjections } from "discourse/lib/implicit-injections";
import ReseedModal from "admin/components/modal/reseed";
let lastSearch;
@disableImplicitInjections
export default class AdminSiteTextIndexController extends Controller {
@service router;
@service siteSettings;
@service modal;
@service store;
@tracked locale;
@tracked q;
@tracked overridden;
@tracked outdated;
@tracked untranslated;
@tracked onlySelectedLocale;
@tracked model;
@tracked searching = false;
@tracked preferred = false;
queryParams = [
"q",
"overridden",
"outdated",
"locale",
"untranslated",
"onlySelectedLocale",
];
get resolvedOverridden() {
return [true, "true"].includes(this.overridden) ?? false;
}
get resolvedOutdated() {
return [true, "true"].includes(this.outdated) ?? false;
}
get resolvedUntranslated() {
return [true, "true"].includes(this.untranslated) ?? false;
}
get resolvedOnlySelectedLocale() {
return [true, "true"].includes(this.onlySelectedLocale) ?? false;
}
get resolvedLocale() {
return this.locale ?? this.siteSettings.default_locale;
}
get showUntranslated() {
return (
this.siteSettings.admin_allow_filter_untranslated_text &&
this.resolvedLocale !== "en"
);
}
async _performSearch() {
try {
this.model = await this.store.find("site-text", {
q: this.q,
overridden: this.resolvedOverridden,
outdated: this.resolvedOutdated,
locale: this.resolvedLocale,
untranslated: this.resolvedUntranslated,
only_selected_locale: this.resolvedOnlySelectedLocale,
});
} finally {
this.searching = false;
}
}
get availableLocales() {
return this.siteSettings.available_locales;
}
get fallbackLocaleFullName() {
if (this.model.extras.fallback_locale) {
return this.availableLocales.find((l) => {
return l.value === this.model.extras.fallback_locale;
}).name;
}
}
@action
edit(siteText) {
this.router.transitionTo("adminSiteText.edit", siteText.get("id"), {
queryParams: {
locale: this.resolvedLocale,
},
});
}
@action
toggleOverridden() {
if (this.resolvedOverridden) {
this.overridden = null;
} else {
this.overridden = true;
}
this.searching = true;
discourseDebounce(this, this._performSearch, 400);
}
@action
toggleOutdated() {
if (this.resolvedOutdated) {
this.outdated = null;
} else {
this.outdated = true;
}
this.searching = true;
discourseDebounce(this, this._performSearch, 400);
}
@action
toggleUntranslated() {
if (this.resolvedUntranslated) {
this.untranslated = null;
} else {
this.untranslated = true;
}
this.searching = true;
discourseDebounce(this, this._performSearch, 400);
}
@action
toggleOnlySelectedLocale() {
if (this.resolvedOnlySelectedLocale) {
this.onlySelectedLocale = null;
} else {
this.onlySelectedLocale = true;
}
this.searching = true;
discourseDebounce(this, this._performSearch, 400);
}
@action
search() {
const q = this.q;
if (q !== lastSearch) {
this.searching = true;
discourseDebounce(this, this._performSearch, 400);
lastSearch = q;
}
}
@action
updateLocale(value) {
this.searching = true;
this.locale = value;
discourseDebounce(this, this._performSearch, 400);
}
@action
showReseedModal() {
this.modal.show(ReseedModal);
}
}