forks
/
peertube
1
0
Fork 0
Code Releases Activity

Better video languages filter UX 

Don't throw if the user did not select any language, automatically
select "all languages" instead
This commit is contained in:
Chocobozzz 2021-04-28 09:41:50 +02:00
parent 9e1409713d
commit dbef40433f
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
1 changed files with 40 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
client/src/app/shared/shared-user-settings/user-video-settings.component.ts
View File

@ -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.`)
}
}