Task/refactor language in various components (#6078)

* Refactor language

apps/client/src/app/app.component.ts

@@ -243,7 +243,7 @@ export class GfAppComponent implements OnDestroy, OnInit {
     this.tokenStorageService.signOut();
     this.userService.remove();
 
-    document.location.href = `/${document.documentElement.lang}`;
+    document.location.href = `/${$localize.locale}`;
   }
 
   public ngOnDestroy() {

apps/client/src/app/components/admin-users/admin-users.component.ts

@@ -224,7 +224,7 @@ export class GfAdminUsersComponent implements OnDestroy, OnInit {
                   this.tokenStorageService.signOut();
                   this.userService.remove();
 
-                  document.location.href = `/${document.documentElement.lang}`;
+                  document.location.href = `/${$localize.locale}`;
                 }
               },
               message: accessToken,

apps/client/src/app/components/header/header.component.ts

@@ -335,7 +335,7 @@ export class GfHeaderComponent implements OnChanges {
       .subscribe((user) => {
         const userLanguage = user?.settings?.language;
 
-        if (userLanguage && document.documentElement.lang !== userLanguage) {
+        if (userLanguage && $localize.locale !== userLanguage) {
           window.location.href = `../${userLanguage}`;
         } else {
           this.router.navigate(['/']);

apps/client/src/app/components/user-account-access/user-account-access.component.ts

@@ -164,7 +164,7 @@ export class GfUserAccountAccessComponent implements OnDestroy, OnInit {
                 this.tokenStorageService.signOut();
                 this.userService.remove();
 
-                document.location.href = `/${document.documentElement.lang}`;
+                document.location.href = `/${$localize.locale}`;
               },
               message: accessToken,
               title: $localize`Security token`

apps/client/src/app/components/user-account-settings/user-account-settings.component.ts

@@ -78,7 +78,8 @@ export class GfUserAccountSettingsComponent implements OnDestroy, OnInit {
   public isAccessTokenHidden = true;
   public isFingerprintSupported = this.doesBrowserSupportAuthn();
   public isWebAuthnEnabled: boolean;
-  public language = document.documentElement.lang;
+  public language = $localize.locale;
+
   public locales = [
     'ca',
     'de',
@@ -199,7 +200,7 @@ export class GfUserAccountSettingsComponent implements OnDestroy, OnInit {
             this.tokenStorageService.signOut();
             this.userService.remove();
 
-            document.location.href = `/${document.documentElement.lang}`;
+            document.location.href = `/${this.language}`;
           });
       },
       confirmType: ConfirmationDialogType.Warn,

apps/client/src/app/core/auth.guard.ts

@@ -64,9 +64,9 @@ export class AuthGuard {
         .subscribe((user) => {
           const userLanguage = user?.settings?.language;
 
-          if (userLanguage && document.documentElement.lang !== userLanguage) {
+          if (userLanguage && $localize.locale !== userLanguage) {
             this.dataService
-              .putUserSetting({ language: document.documentElement.lang })
+              .putUserSetting({ language: $localize.locale })
               .subscribe(() => {
                 this.userService.remove();
 

apps/client/src/app/pages/faq/overview/faq-overview-page.component.ts

@@ -22,7 +22,7 @@ import { Subject, takeUntil } from 'rxjs';
   templateUrl: './faq-overview-page.html'
 })
 export class GfFaqOverviewPageComponent implements OnDestroy {
-  public pricingUrl = `https://ghostfol.io/${document.documentElement.lang}/${publicRoutes.pricing.path}`;
+  public pricingUrl = `https://ghostfol.io/${$localize.locale}/${publicRoutes.pricing.path}`;
   public routerLinkFeatures = publicRoutes.features.routerLink;
   public user: User;
 

apps/client/src/app/pages/faq/saas/saas-page.component.ts

@@ -22,7 +22,7 @@ import { Subject, takeUntil } from 'rxjs';
   templateUrl: './saas-page.html'
 })
 export class GfSaasPageComponent implements OnDestroy {
-  public pricingUrl = `https://ghostfol.io/${document.documentElement.lang}/${publicRoutes.pricing.path}`;
+  public pricingUrl = `https://ghostfol.io/${$localize.locale}/${publicRoutes.pricing.path}`;
   public routerLinkAccount = internalRoutes.account.routerLink;
   public routerLinkAccountMembership =
     internalRoutes.account.subRoutes.membership.routerLink;

apps/client/src/app/pages/faq/self-hosting/self-hosting-page.component.ts

@@ -15,7 +15,7 @@ import { Subject } from 'rxjs';
   templateUrl: './self-hosting-page.html'
 })
 export class GfSelfHostingPageComponent implements OnDestroy {
-  public pricingUrl = `https://ghostfol.io/${document.documentElement.lang}/${publicRoutes.pricing.path}`;
+  public pricingUrl = `https://ghostfol.io/${$localize.locale}/${publicRoutes.pricing.path}`;
 
   private unsubscribeSubject = new Subject<void>();