Add ability for anonymous to change interface lang

client/src/app/header/header.component.html

@@ -88,4 +88,4 @@
 </div>
 
 <my-language-chooser #languageChooserModal></my-language-chooser>
-<my-quick-settings #quickSettingsModal></my-quick-settings>
+<my-quick-settings #quickSettingsModal (openLanguageModal)="languageChooserModal.show()"></my-quick-settings>

client/src/app/menu/quick-settings-modal.component.html

@@ -23,5 +23,7 @@
       *ngIf="!isUserLoggedIn()"
       [user]="user" [userInformationLoaded]="userInformationLoaded" [reactiveUpdate]="true" [notifyOnUpdate]="true"
     ></my-user-interface-settings>
+
+    <my-button class="mt-2" theme="secondary" icon="language" (click)="changeLanguage()">Change interface language</my-button>
   </div>
 </ng-template>

client/src/app/menu/quick-settings-modal.component.ts

@@ -1,8 +1,9 @@
 import { CommonModule } from '@angular/common'
-import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'
+import { Component, EventEmitter, OnDestroy, OnInit, Output, ViewChild } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { AuthService, AuthStatus, LocalStorageService, User, UserService } from '@app/core'
 import { GlobalIconComponent } from '@app/shared/shared-icons/global-icon.component'
+import { ButtonComponent } from '@app/shared/shared-main/buttons/button.component'
 import { AlertComponent } from '@app/shared/shared-main/common/alert.component'
 import { UserInterfaceSettingsComponent } from '@app/shared/shared-user-settings/user-interface-settings.component'
 import { UserVideoSettingsComponent } from '@app/shared/shared-user-settings/user-video-settings.component'
@@ -15,13 +16,22 @@ import { filter } from 'rxjs/operators'
   selector: 'my-quick-settings',
   templateUrl: './quick-settings-modal.component.html',
   standalone: true,
-  imports: [ CommonModule, GlobalIconComponent, UserVideoSettingsComponent, UserInterfaceSettingsComponent, AlertComponent ]
+  imports: [
+    CommonModule,
+    GlobalIconComponent,
+    UserVideoSettingsComponent,
+    UserInterfaceSettingsComponent,
+    AlertComponent,
+    ButtonComponent
+  ]
 })
 export class QuickSettingsModalComponent implements OnInit, OnDestroy {
   private static readonly QUERY_MODAL_NAME = 'quick-settings'
 
   @ViewChild('modal', { static: true }) modal: NgbModal
 
+  @Output() openLanguageModal = new EventEmitter<void>()
+
   user: User
   userInformationLoaded = new ReplaySubject<boolean>(1)
 
@@ -83,6 +93,11 @@ export class QuickSettingsModalComponent implements OnInit, OnDestroy {
     this.setModalQuery('add')
   }
 
+  changeLanguage () {
+    this.openedModal.close()
+    this.openLanguageModal.emit()
+  }
+
   private setModalQuery (type: 'add' | 'remove') {
     const modal = type === 'add'
       ? QuickSettingsModalComponent.QUERY_MODAL_NAME