web: fix locale change not updating all elements
closes #2365 Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
parent
2c54be85be
commit
7e5d8624c8
|
@ -10,8 +10,8 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<ak-message-container></ak-message-container>
|
<ak-message-container data-refresh-on-locale="true"></ak-message-container>
|
||||||
<ak-interface-admin>
|
<ak-interface-admin data-refresh-on-locale="true">
|
||||||
<section class="ak-static-page pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
|
<section class="ak-static-page pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
|
||||||
<div class="pf-c-empty-state" style="height: 100vh;">
|
<div class="pf-c-empty-state" style="height: 100vh;">
|
||||||
<div class="pf-c-empty-state__content">
|
<div class="pf-c-empty-state__content">
|
||||||
|
|
|
@ -20,8 +20,8 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<ak-message-container></ak-message-container>
|
<ak-message-container data-refresh-on-locale="true"></ak-message-container>
|
||||||
<ak-flow-executor>
|
<ak-flow-executor data-refresh-on-locale="true">
|
||||||
<section class="ak-static-page pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
|
<section class="ak-static-page pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
|
||||||
<div class="pf-c-empty-state" style="height: 100vh;">
|
<div class="pf-c-empty-state" style="height: 100vh;">
|
||||||
<div class="pf-c-empty-state__content">
|
<div class="pf-c-empty-state__content">
|
||||||
|
|
|
@ -10,8 +10,8 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<ak-message-container></ak-message-container>
|
<ak-message-container data-refresh-on-locale="true"></ak-message-container>
|
||||||
<ak-interface-user>
|
<ak-interface-user data-refresh-on-locale="true">
|
||||||
<section class="ak-static-page pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
|
<section class="ak-static-page pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
|
||||||
<div class="pf-c-empty-state" style="height: 100vh;">
|
<div class="pf-c-empty-state" style="height: 100vh;">
|
||||||
<div class="pf-c-empty-state__content">
|
<div class="pf-c-empty-state__content">
|
||||||
|
|
|
@ -4,6 +4,8 @@ import { Messages, i18n } from "@lingui/core";
|
||||||
import { detect, fromNavigator, fromUrl } from "@lingui/detect-locale";
|
import { detect, fromNavigator, fromUrl } from "@lingui/detect-locale";
|
||||||
import { t } from "@lingui/macro";
|
import { t } from "@lingui/macro";
|
||||||
|
|
||||||
|
import { LitElement } from "lit";
|
||||||
|
|
||||||
import { messages as localeDE } from "../locales/de";
|
import { messages as localeDE } from "../locales/de";
|
||||||
import { messages as localeEN } from "../locales/en";
|
import { messages as localeEN } from "../locales/en";
|
||||||
import { messages as localeES } from "../locales/es";
|
import { messages as localeES } from "../locales/es";
|
||||||
|
@ -93,8 +95,7 @@ const DEFAULT_FALLBACK = () => "en";
|
||||||
|
|
||||||
export function autoDetectLanguage() {
|
export function autoDetectLanguage() {
|
||||||
let detected =
|
let detected =
|
||||||
detect(fromUrl("locale"), fromNavigator(), DEFAULT_FALLBACK) ||
|
detect(fromUrl("locale"), fromNavigator(), DEFAULT_FALLBACK) || DEFAULT_FALLBACK();
|
||||||
DEFAULT_FALLBACK();
|
|
||||||
// For now we only care about the first locale part
|
// For now we only care about the first locale part
|
||||||
if (detected.includes("_")) {
|
if (detected.includes("_")) {
|
||||||
detected = detected.split("_")[0];
|
detected = detected.split("_")[0];
|
||||||
|
@ -111,8 +112,15 @@ export function activateLocale(code: string) {
|
||||||
const urlLocale = fromUrl("locale");
|
const urlLocale = fromUrl("locale");
|
||||||
if (urlLocale !== null && urlLocale !== "") {
|
if (urlLocale !== null && urlLocale !== "") {
|
||||||
i18n.activate(urlLocale);
|
i18n.activate(urlLocale);
|
||||||
return;
|
} else {
|
||||||
|
i18n.activate(code);
|
||||||
}
|
}
|
||||||
i18n.activate(code);
|
document.querySelectorAll("[data-refresh-on-locale=true]").forEach((el) => {
|
||||||
|
try {
|
||||||
|
(el as LitElement).requestUpdate();
|
||||||
|
} catch {
|
||||||
|
console.debug(`authentik/locale: failed to update element ${el}`);
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
autoDetectLanguage();
|
autoDetectLanguage();
|
||||||
|
|
Reference in a new issue