Verified Commit dbef4043 authored by Chocobozzz's avatar Chocobozzz
Browse files

Better video languages filter UX

Don't throw if the user did not select any language, automatically
select "all languages" instead
parent 9e140971
......@@ -38,8 +38,6 @@ export class UserVideoSettingsComponent extends FormReactive implements OnInit,
ngOnInit () {
this.allLanguagesGroup = $localize`All languages`
let oldForm: any
this.buildForm({
nsfwPolicy: null,
webTorrentEnabled: null,
......@@ -73,16 +71,7 @@ export class UserVideoSettingsComponent extends FormReactive implements OnInit,
videoLanguages
})
if (this.reactiveUpdate) {
oldForm = { ...this.form.value }
this.formValuesWatcher = this.form.valueChanges.subscribe((formValue: any) => {
const updatedKey = Object.keys(formValue).find(k => formValue[k] !== oldForm[k])
oldForm = { ...this.form.value }
this.updateDetails([ updatedKey ])
})
}
if (this.reactiveUpdate) this.handleReactiveUpdate()
})
}
......@@ -96,7 +85,7 @@ export class UserVideoSettingsComponent extends FormReactive implements OnInit,
const autoPlayVideo = this.form.value['autoPlayVideo']
const autoPlayNextVideo = this.form.value['autoPlayNextVideo']
const videoLanguagesForm = this.form.value['videoLanguages']
let videoLanguagesForm = this.form.value['videoLanguages']
if (Array.isArray(videoLanguagesForm)) {
if (videoLanguagesForm.length > 20) {
......@@ -104,13 +93,14 @@ export class UserVideoSettingsComponent extends FormReactive implements OnInit,
return
}
// Automatically use "All languages" if the user did not select any language
if (videoLanguagesForm.length === 0) {
this.notifier.error($localize`You need to enable at least 1 video language.`)
return
videoLanguagesForm = [ this.allLanguagesGroup ]
this.form.patchValue({ videoLanguages: [ { group: this.allLanguagesGroup } ] })
}
}
const videoLanguages = this.getVideoLanguages(videoLanguagesForm)
const videoLanguages = this.buildLanguagesFromForm(videoLanguagesForm)
let details: UserUpdateMe = {
nsfwPolicy,
......@@ -127,22 +117,13 @@ export class UserVideoSettingsComponent extends FormReactive implements OnInit,
if (onlyKeys) details = pick(details, onlyKeys)
if (this.authService.isLoggedIn()) {
this.userService.updateMyProfile(details).subscribe(
() => {
this.authService.refreshUserInformation()
if (this.notifyOnUpdate) this.notifier.success($localize`Video settings updated.`)
},
err => this.notifier.error(err.message)
)
} else {
this.userService.updateMyAnonymousProfile(details)
if (this.notifyOnUpdate) this.notifier.success($localize`Display/Video settings updated.`)
return this.updateLoggedProfile(details)
}
return this.updateAnonymousProfile(details)
}
private getVideoLanguages (videoLanguages: ItemSelectCheckboxValue[]) {
private buildLanguagesFromForm (videoLanguages: ItemSelectCheckboxValue[]) {
if (!Array.isArray(videoLanguages)) return undefined
// null means "All"
......@@ -166,4 +147,34 @@ export class UserVideoSettingsComponent extends FormReactive implements OnInit,
return l.id + ''
})
}
private handleReactiveUpdate () {
let oldForm = { ...this.form.value }
this.formValuesWatcher = this.form.valueChanges.subscribe((formValue: any) => {
const updatedKey = Object.keys(formValue)
.find(k => formValue[k] !== oldForm[k])
oldForm = { ...this.form.value }
this.updateDetails([ updatedKey ])
})
}
private updateLoggedProfile (details: UserUpdateMe) {
this.userService.updateMyProfile(details).subscribe(
() => {
this.authService.refreshUserInformation()
if (this.notifyOnUpdate) this.notifier.success($localize`Video settings updated.`)
},
err => this.notifier.error(err.message)
)
}
private updateAnonymousProfile (details: UserUpdateMe) {
this.userService.updateMyAnonymousProfile(details)
if (this.notifyOnUpdate) this.notifier.success($localize`Display/Video settings updated.`)
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment