1 import { Subject, Subscription } from 'rxjs'
2 import { Component, Input, OnDestroy, OnInit } from '@angular/core'
3 import { AuthService, Notifier, ServerService, UserService } from '@app/core'
4 import { FormReactive, FormValidatorService } from '@app/shared/shared-forms'
5 import { capitalizeFirstLetter } from '@root-helpers/string'
6 import { HTMLServerConfig, User, UserUpdateMe } from '@shared/models'
9 selector: 'my-user-interface-settings',
10 templateUrl: './user-interface-settings.component.html',
11 styleUrls: [ './user-interface-settings.component.scss' ]
13 export class UserInterfaceSettingsComponent extends FormReactive implements OnInit, OnDestroy {
14 @Input() user: User = null
15 @Input() reactiveUpdate = false
16 @Input() notifyOnUpdate = true
17 @Input() userInformationLoaded: Subject<any>
19 formValuesWatcher: Subscription
21 defaultThemeLabel = $localize`Light/Orange`
23 private serverConfig: HTMLServerConfig
26 protected formValidatorService: FormValidatorService,
27 private authService: AuthService,
28 private notifier: Notifier,
29 private userService: UserService,
30 private serverService: ServerService
35 get availableThemes () {
36 return this.serverConfig.theme.registered
41 this.serverConfig = this.serverService.getHTMLConfig()
47 this.userInformationLoaded
49 this.form.patchValue({
50 theme: this.user.theme
53 if (this.reactiveUpdate) {
54 this.formValuesWatcher = this.form.valueChanges.subscribe(() => this.updateInterfaceSettings())
60 this.formValuesWatcher?.unsubscribe()
63 getDefaultThemeLabel () {
64 const theme = this.serverConfig.theme.default
66 if (theme === 'default') return this.defaultThemeLabel
71 capitalizeFirstLetter (str: string) {
72 return capitalizeFirstLetter(str)
75 updateInterfaceSettings () {
76 const theme = this.form.value['theme']
78 const details: UserUpdateMe = {
82 if (this.authService.isLoggedIn()) {
83 this.userService.updateMyProfile(details)
86 this.authService.refreshUserInformation()
88 if (this.notifyOnUpdate) this.notifier.success($localize`Interface settings updated.`)
91 error: err => this.notifier.error(err.message)
97 this.userService.updateMyAnonymousProfile(details)
98 if (this.notifyOnUpdate) this.notifier.success($localize`Interface settings updated.`)