From 1252c6b07d601ec661ee0f323be120b3a5729d99 Mon Sep 17 00:00:00 2001 From: Jens Langhammer Date: Fri, 1 Oct 2021 14:06:32 +0200 Subject: [PATCH] web: add locale detection Signed-off-by: Jens Langhammer --- web/package-lock.json | 14 ++++++++++++++ web/package.json | 4 +++- web/src/elements/charts/AdminLoginsChart.ts | 6 ++++-- .../elements/charts/ApplicationAuthorizeChart.ts | 4 +++- web/src/elements/charts/UserChart.ts | 8 +++++--- web/src/interfaces/locale.ts | 14 +++++++++----- 6 files changed, 38 insertions(+), 12 deletions(-) diff --git a/web/package-lock.json b/web/package-lock.json index 2c872c6b3..9470ce199 100644 --- a/web/package-lock.json +++ b/web/package-lock.json @@ -18,6 +18,7 @@ "@goauthentik/api": "^2021.9.4-1633083586", "@lingui/cli": "^3.12.1", "@lingui/core": "^3.12.1", + "@lingui/detect-locale": "^3.12.1", "@lingui/macro": "^3.12.1", "@patternfly/patternfly": "^4.135.2", "@polymer/iron-form": "^3.0.1", @@ -2012,6 +2013,14 @@ "node": ">=10.0.0" } }, + "node_modules/@lingui/detect-locale": { + "version": "3.12.1", + "resolved": "https://registry.npmjs.org/@lingui/detect-locale/-/detect-locale-3.12.1.tgz", + "integrity": "sha512-/apP+LscyRuh+CIf42+LNuYmEsceNA/rh6N3iqebNcEsOcIzLA8v6dq1llzDOlfd3SxEj7xP9Kfhn6Vnp+78+Q==", + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/@lingui/macro": { "version": "3.12.1", "resolved": "https://registry.npmjs.org/@lingui/macro/-/macro-3.12.1.tgz", @@ -10007,6 +10016,11 @@ "messageformat-parser": "^4.1.3" } }, + "@lingui/detect-locale": { + "version": "3.12.1", + "resolved": "https://registry.npmjs.org/@lingui/detect-locale/-/detect-locale-3.12.1.tgz", + "integrity": "sha512-/apP+LscyRuh+CIf42+LNuYmEsceNA/rh6N3iqebNcEsOcIzLA8v6dq1llzDOlfd3SxEj7xP9Kfhn6Vnp+78+Q==" + }, "@lingui/macro": { "version": "3.12.1", "resolved": "https://registry.npmjs.org/@lingui/macro/-/macro-3.12.1.tgz", diff --git a/web/package.json b/web/package.json index 149b56071..53baff69b 100644 --- a/web/package.json +++ b/web/package.json @@ -17,7 +17,8 @@ "sourceLocale": "en", "locales": [ "en", - "pseudo-LOCALE" + "pseudo-LOCALE", + "fr_FR" ], "formatOptions": { "lineNumbers": false @@ -50,6 +51,7 @@ "@goauthentik/api": "^2021.9.4-1633083586", "@lingui/cli": "^3.12.1", "@lingui/core": "^3.12.1", + "@lingui/detect-locale": "^3.12.1", "@lingui/macro": "^3.12.1", "@patternfly/patternfly": "^4.135.2", "@polymer/iron-form": "^3.0.1", diff --git a/web/src/elements/charts/AdminLoginsChart.ts b/web/src/elements/charts/AdminLoginsChart.ts index 116c17465..2df07185c 100644 --- a/web/src/elements/charts/AdminLoginsChart.ts +++ b/web/src/elements/charts/AdminLoginsChart.ts @@ -1,5 +1,7 @@ import { ChartData } from "chart.js"; +import { t } from "@lingui/macro"; + import { customElement } from "lit/decorators"; import { AdminApi, LoginMetrics } from "@goauthentik/api"; @@ -17,7 +19,7 @@ export class AdminLoginsChart extends AKChart { return { datasets: [ { - label: "Failed Logins", + label: t`Failed Logins`, backgroundColor: "rgba(201, 25, 11, .5)", spanGaps: true, data: @@ -29,7 +31,7 @@ export class AdminLoginsChart extends AKChart { }) || [], }, { - label: "Successful Logins", + label: t`Successful Logins`, backgroundColor: "rgba(189, 229, 184, .5)", spanGaps: true, data: diff --git a/web/src/elements/charts/ApplicationAuthorizeChart.ts b/web/src/elements/charts/ApplicationAuthorizeChart.ts index fb0c7fcfe..12907ed23 100644 --- a/web/src/elements/charts/ApplicationAuthorizeChart.ts +++ b/web/src/elements/charts/ApplicationAuthorizeChart.ts @@ -1,5 +1,7 @@ import { ChartData } from "chart.js"; +import { t } from "@lingui/macro"; + import { customElement, property } from "lit/decorators"; import { Coordinate, CoreApi } from "@goauthentik/api"; @@ -22,7 +24,7 @@ export class ApplicationAuthorizeChart extends AKChart { return { datasets: [ { - label: "Authorizations", + label: t`Authorizations`, backgroundColor: "rgba(189, 229, 184, .5)", spanGaps: true, data: diff --git a/web/src/elements/charts/UserChart.ts b/web/src/elements/charts/UserChart.ts index 7f12f09ba..be6549322 100644 --- a/web/src/elements/charts/UserChart.ts +++ b/web/src/elements/charts/UserChart.ts @@ -1,5 +1,7 @@ import { ChartData } from "chart.js"; +import { t } from "@lingui/macro"; + import { customElement, property } from "lit/decorators"; import { CoreApi, UserMetrics } from "@goauthentik/api"; @@ -22,7 +24,7 @@ export class UserChart extends AKChart { return { datasets: [ { - label: "Failed Logins", + label: t`Failed Logins`, backgroundColor: "rgba(201, 25, 11, .5)", spanGaps: true, data: @@ -34,7 +36,7 @@ export class UserChart extends AKChart { }) || [], }, { - label: "Successful Logins", + label: t`Successful Logins`, backgroundColor: "rgba(189, 229, 184, .5)", spanGaps: true, data: @@ -46,7 +48,7 @@ export class UserChart extends AKChart { }) || [], }, { - label: "Application authorizations", + label: t`Application authorizations`, backgroundColor: "rgba(43, 154, 243, .5)", spanGaps: true, data: diff --git a/web/src/interfaces/locale.ts b/web/src/interfaces/locale.ts index cfb1ab476..be9ca9921 100644 --- a/web/src/interfaces/locale.ts +++ b/web/src/interfaces/locale.ts @@ -1,16 +1,20 @@ -import { en } from "make-plural/plurals"; +import { en, fr } from "make-plural/plurals"; import { i18n } from "@lingui/core"; +import { detect, fromUrl, fromStorage, fromNavigator } from "@lingui/detect-locale"; import { messages as localeEN } from "../locales/en"; +import { messages as localeFR_FR } from "../locales/fr_FR"; import { messages as localeDEBUG } from "../locales/pseudo-LOCALE"; i18n.loadLocaleData("en", { plurals: en }); i18n.loadLocaleData("debug", { plurals: en }); +i18n.loadLocaleData("fr_FR", { plurals: fr }); i18n.load("en", localeEN); +i18n.load("fr_FR", localeFR_FR); i18n.load("debug", localeDEBUG); -i18n.activate("en"); -if (window.location.search.includes("debugLocale")) { - i18n.activate("debug"); -} +const DEFAULT_FALLBACK = () => "en"; + +const result = detect(fromUrl("lang"), fromStorage("lang"), fromNavigator(), DEFAULT_FALLBACK); +i18n.activate(result || DEFAULT_FALLBACK());