interesting
/
PeerTube
mirror of https://github.com/Chocobozzz/PeerTube.git
1
0
Fork 0
Code Issues Projects Releases Wiki 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.`)
}
}