-
Notifications
You must be signed in to change notification settings - Fork 13
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
a880244
commit d87b449
Showing
79 changed files
with
2,988 additions
and
2,084 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,63 +1,25 @@ | ||
| import {registerLocaleData} from "@angular/common"; | ||
| import {APP_INITIALIZER, Injectable, LOCALE_ID} from "@angular/core"; | ||
| import {loadTranslations} from "@angular/localize"; | ||
|
|
||
| @Injectable({ | ||
| providedIn: "root", | ||
| }) | ||
| class I18n { | ||
| locale = "en"; | ||
| readonly allowedLocales = ["en", "fr", "de", "it"]; | ||
|
|
||
| async setLocale() { | ||
| const userLocale = localStorage.getItem("locale"); | ||
|
|
||
| // If the user has a preferred language stored in localStorage, use it. | ||
| if (userLocale && this.allowedLocales.includes(userLocale)) { | ||
| this.locale = userLocale; | ||
| } else { | ||
| localStorage.setItem("locale", this.locale); | ||
| import {NgModule, APP_INITIALIZER, LOCALE_ID} from "@angular/core"; | ||
| import {CommonModule} from "@angular/common"; | ||
| import {TranslatePipe} from "./translate.pipe"; | ||
| import {I18n} from "./i18n.service"; | ||
|
|
||
| @NgModule({ | ||
| declarations: [TranslatePipe], // Declare the pipe | ||
| imports: [CommonModule], | ||
| providers: [ | ||
| I18n, | ||
| { // Load locale data at app start-up | ||
| provide: APP_INITIALIZER, | ||
| useFactory: (i18n: I18n) => () => i18n.setLocale(), | ||
| deps: [I18n], | ||
| multi: true, | ||
| }, | ||
| { // Set the runtime locale for the app | ||
| provide: LOCALE_ID, | ||
| useFactory: (i18n: I18n) => i18n.locale, | ||
| deps: [I18n], | ||
| } | ||
|
|
||
| // Use web pack magic string to only include required locale data | ||
| const localeModule = await import( | ||
| /* webpackInclude: /(en|de|fr|it)\.mjs$/ */ | ||
| `/node_modules/@angular/common/locales/${this.locale}.mjs` | ||
| ); | ||
|
|
||
| // Set locale for built in pipes, etc. | ||
| registerLocaleData(localeModule.default); | ||
|
|
||
| // Load translation file | ||
| const localeTranslationsModule = await import( | ||
| `src/assets/i18n/${this.locale}.json` | ||
| ); | ||
|
|
||
| // Load translations for the current locale at run-time | ||
| loadTranslations(localeTranslationsModule.default); | ||
| } | ||
| } | ||
|
|
||
| // Load locale data at app start-up | ||
| function setLocale() { | ||
| return { | ||
| provide: APP_INITIALIZER, | ||
| useFactory: (i18n: I18n) => () => i18n.setLocale(), | ||
| deps: [I18n], | ||
| multi: true, | ||
| }; | ||
| } | ||
|
|
||
| // Set the runtime locale for the app | ||
| function setLocaleId() { | ||
| return { | ||
| provide: LOCALE_ID, | ||
| useFactory: (i18n: I18n) => i18n.locale, | ||
| deps: [I18n], | ||
| }; | ||
| } | ||
|
|
||
| export const I18nModule = { | ||
| setLocale: setLocale, | ||
| setLocaleId: setLocaleId, | ||
| }; | ||
| ], | ||
| exports: [TranslatePipe] // Export the pipe | ||
| }) | ||
| export class I18nModule { } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,89 @@ | ||
| import {Injectable} from "@angular/core"; | ||
| import {registerLocaleData} from "@angular/common"; | ||
| import {loadTranslations} from "@angular/localize"; | ||
|
|
||
| @Injectable({ | ||
| providedIn: "root", | ||
| }) | ||
| export class I18n { | ||
| locale = "en"; | ||
| readonly allowedLocales = ["en", "fr", "de", "it"]; | ||
| translations: any = {}; | ||
|
|
||
| async setLocale() { | ||
| const userLocale = localStorage.getItem("locale"); | ||
|
|
||
| // If the user has a preferred language stored in LocalStorage, use it. | ||
| if (userLocale && this.allowedLocales.includes(userLocale)) { | ||
| this.locale = userLocale; | ||
| } else { | ||
| localStorage.setItem("locale", this.locale); | ||
| } | ||
|
|
||
| // Use webpack magic string to only include required locale data | ||
| const localeModule = await import( | ||
| /* webpackInclude: /(en|de|fr|it)\.mjs$/ */ | ||
| `/node_modules/@angular/common/locales/${this.locale}.mjs` | ||
| ); | ||
| registerLocaleData(localeModule.default); | ||
|
|
||
| // Load translation file initially | ||
| await this.loadTranslations(); | ||
| } | ||
|
|
||
| async loadTranslations() { | ||
| const localeTranslationsModule = await import( | ||
| `src/assets/i18n/${this.locale}.json` | ||
| ); | ||
|
|
||
| // Ensure translations are flattened if necessary | ||
| this.translations = this.flattenTranslations(localeTranslationsModule.default); | ||
|
|
||
| // Load translations for the current locale at runtime | ||
| loadTranslations(this.translations); | ||
| } | ||
|
|
||
| // Helper function to flatten nested translations | ||
| // nested JSON : | ||
| // { | ||
| // "app": { | ||
| // "login": "Login", | ||
| // "models": {...} | ||
| // } | ||
| // } | ||
| // flattened JSON : | ||
| // { | ||
| // "app.login": "Login", | ||
| // "app.models...": ..., | ||
| // "app.models...": ... | ||
| // } | ||
| private flattenTranslations(translations: any): any { | ||
| const flattenedTranslations = {}; | ||
|
|
||
| function flatten(obj, prefix = "") { | ||
| for (const key in obj) { | ||
| if (typeof obj[key] === "string") { | ||
| flattenedTranslations[prefix + key] = obj[key]; | ||
| } else if (typeof obj[key] === "object") { | ||
| flatten(obj[key], prefix + key + "."); | ||
| } | ||
| } | ||
| } | ||
|
|
||
| flatten(translations); | ||
| return flattenedTranslations; | ||
| } | ||
|
|
||
| // Used for the pipe and allowing parameters | ||
| translate(key: string, params?: any): string { | ||
| let translation = this.translations[key] || key; | ||
|
|
||
| if (params) { | ||
| Object.keys(params).forEach(param => { | ||
| translation = translation.replace(`{$${param}}`, params[param]); | ||
| }); | ||
| } | ||
|
|
||
| return translation; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| import {Pipe, PipeTransform} from "@angular/core"; | ||
| import {I18n} from "./i18n.service"; | ||
|
|
||
| @Pipe({ | ||
| name: "translate", | ||
| pure: false | ||
| }) | ||
| export class TranslatePipe implements PipeTransform { | ||
| constructor(private i18n: I18n) {} | ||
|
|
||
| transform(key: string, params?: any): string { | ||
| return this.i18n.translate(key, params); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.