VIDEOS
diff --git a/client/src/app/+admin/config/pages/admin-config-general.component.ts b/client/src/app/+admin/config/pages/admin-config-general.component.ts
index ba2be5e07..1cf99599b 100644
--- a/client/src/app/+admin/config/pages/admin-config-general.component.ts
+++ b/client/src/app/+admin/config/pages/admin-config-general.component.ts
@@ -33,6 +33,8 @@ import { MarkdownTextareaComponent } from '../../../shared/shared-forms/markdown
import { PeertubeCheckboxComponent } from '../../../shared/shared-forms/peertube-checkbox.component'
import { SelectCustomValueComponent } from '../../../shared/shared-forms/select/select-custom-value.component'
import { SelectOptionsComponent } from '../../../shared/shared-forms/select/select-options.component'
+import { SelectVideosSortComponent } from '../../../shared/shared-forms/select/select-videos-sort.component'
+import { SelectVideosScopeComponent } from '../../../shared/shared-forms/select/select-videos-scope.component'
import { HelpComponent } from '../../../shared/shared-main/buttons/help.component'
import { UserRealQuotaInfoComponent } from '../../shared/user-real-quota-info.component'
import { AdminSaveBarComponent } from '../shared/admin-save-bar.component'
@@ -43,6 +45,11 @@ type Form = {
}>
client: FormGroup<{
+ browseVideos: FormGroup<{
+ defaultSort: FormControl
+ defaultScope: FormControl
+ }>
+
menu: FormGroup<{
login: FormGroup<{
redirectOnSingleExternalAuth: FormControl
@@ -220,7 +227,9 @@ type Form = {
UserRealQuotaInfoComponent,
SelectOptionsComponent,
AlertComponent,
- AdminSaveBarComponent
+ AdminSaveBarComponent,
+ SelectVideosSortComponent,
+ SelectVideosScopeComponent
]
})
export class AdminConfigGeneralComponent implements OnInit, OnDestroy, CanComponentDeactivate {
@@ -295,6 +304,10 @@ export class AdminConfigGeneralComponent implements OnInit, OnDestroy, CanCompon
defaultClientRoute: null
},
client: {
+ browseVideos: {
+ defaultSort: null,
+ defaultScope: null
+ },
menu: {
login: {
redirectOnSingleExternalAuth: null
diff --git a/client/src/app/+video-list/videos-list-all.component.ts b/client/src/app/+video-list/videos-list-all.component.ts
index 1f089af76..914a9a168 100644
--- a/client/src/app/+video-list/videos-list-all.component.ts
+++ b/client/src/app/+video-list/videos-list-all.component.ts
@@ -1,11 +1,11 @@
import { Component, OnDestroy, OnInit, inject } from '@angular/core'
import { ActivatedRoute } from '@angular/router'
-import { ComponentPaginationLight, DisableForReuseHook, MetaService } from '@app/core'
+import { ComponentPaginationLight, DisableForReuseHook, MetaService, ServerService } from '@app/core'
import { HooksService } from '@app/core/plugins/hooks.service'
import { VideoService } from '@app/shared/shared-main/video/video.service'
import { VideoFilterScope, VideoFilters } from '@app/shared/shared-video-miniature/video-filters.model'
import { VideosListComponent } from '@app/shared/shared-video-miniature/videos-list.component'
-import { VideoSortField } from '@peertube/peertube-models'
+import { HTMLServerConfig, VideoSortField } from '@peertube/peertube-models'
import { Subscription } from 'rxjs'
@Component({
@@ -19,6 +19,7 @@ export class VideosListAllComponent implements OnInit, OnDestroy, DisableForReus
private videoService = inject(VideoService)
private hooks = inject(HooksService)
private meta = inject(MetaService)
+ private serverService = inject(ServerService)
getVideosObservableFunction = this.getVideosObservable.bind(this)
getSyndicationItemsFunction = this.getSyndicationItems.bind(this)
@@ -37,11 +38,14 @@ export class VideosListAllComponent implements OnInit, OnDestroy, DisableForReus
disabled = false
private routeSub: Subscription
+ private serverConfig: HTMLServerConfig
ngOnInit () {
+ this.serverConfig = this.serverService.getHTMLConfig()
+
const queryParams = this.route.snapshot.queryParams
- this.defaultSort = queryParams.sort || '-publishedAt'
- this.defaultScope = queryParams.scope || 'federated'
+ this.defaultSort = queryParams.sort || this.serverConfig.client.browseVideos.defaultSort
+ this.defaultScope = queryParams.scope || this.serverConfig.client.browseVideos.defaultScope
this.routeSub = this.route.params.subscribe(() => this.update())
}
diff --git a/client/src/app/shared/shared-forms/select/select-videos-scope.component.ts b/client/src/app/shared/shared-forms/select/select-videos-scope.component.ts
new file mode 100644
index 000000000..8809517ce
--- /dev/null
+++ b/client/src/app/shared/shared-forms/select/select-videos-scope.component.ts
@@ -0,0 +1,64 @@
+import { CommonModule } from '@angular/common'
+import { Component, forwardRef, OnInit, input } from '@angular/core'
+import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms'
+import { SelectOptionsItem } from '../../../../types/select-options-item.model'
+import { SelectOptionsComponent } from './select-options.component'
+
+@Component({
+ selector: 'my-select-videos-scope',
+ template: `
+
+ `,
+ providers: [
+ {
+ provide: NG_VALUE_ACCESSOR,
+ useExisting: forwardRef(() => SelectVideosScopeComponent),
+ multi: true
+ }
+ ],
+ imports: [ FormsModule, CommonModule, SelectOptionsComponent ]
+})
+export class SelectVideosScopeComponent implements ControlValueAccessor, OnInit {
+ readonly inputId = input.required()
+
+ scopeItems: SelectOptionsItem[]
+ selectedId: string
+
+ ngOnInit () {
+ this.buildScopeItems()
+ }
+
+ private buildScopeItems () {
+ this.scopeItems = [
+ { id: 'local', label: $localize`Only videos from this platform` },
+ { id: 'federated', label: $localize`Videos from all platforms` }
+ ]
+ }
+
+ propagateChange = (_: any) => {
+ // empty
+ }
+
+ writeValue (id: string) {
+ this.selectedId = id
+ }
+
+ registerOnChange (fn: (_: any) => void) {
+ this.propagateChange = fn
+ }
+
+ registerOnTouched () {
+ // Unused
+ }
+
+ onModelChange () {
+ this.propagateChange(this.selectedId)
+ }
+}
diff --git a/client/src/app/shared/shared-forms/select/select-videos-sort.component.ts b/client/src/app/shared/shared-forms/select/select-videos-sort.component.ts
new file mode 100644
index 000000000..dfb1a7074
--- /dev/null
+++ b/client/src/app/shared/shared-forms/select/select-videos-sort.component.ts
@@ -0,0 +1,91 @@
+import { CommonModule } from '@angular/common'
+import { Component, forwardRef, OnInit, inject, input } from '@angular/core'
+import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms'
+import { ServerService } from '@app/core'
+import { SelectOptionsItem } from '../../../../types/select-options-item.model'
+import { SelectOptionsComponent } from './select-options.component'
+import { HTMLServerConfig } from '@peertube/peertube-models'
+
+@Component({
+ selector: 'my-select-videos-sort',
+ template: `
+
+ `,
+ providers: [
+ {
+ provide: NG_VALUE_ACCESSOR,
+ useExisting: forwardRef(() => SelectVideosSortComponent),
+ multi: true
+ }
+ ],
+ imports: [ FormsModule, CommonModule, SelectOptionsComponent ]
+})
+export class SelectVideosSortComponent implements ControlValueAccessor, OnInit {
+ private server = inject(ServerService)
+
+ readonly inputId = input.required()
+
+ sortItems: SelectOptionsItem[]
+ selectedId: string
+
+ private serverConfig: HTMLServerConfig
+
+ ngOnInit () {
+ this.serverConfig = this.server.getHTMLConfig()
+
+ this.buildSortItems()
+ }
+
+ private buildSortItems () {
+ this.sortItems = [
+ { id: '-publishedAt', label: $localize`Recently Added` },
+ { id: '-originallyPublishedAt', label: $localize`Original Publication Date` },
+ { id: 'name', label: $localize`Name` }
+ ]
+
+ if (this.isTrendingSortEnabled('most-viewed')) {
+ this.sortItems.push({ id: '-trending', label: $localize`Recent Views` })
+ }
+
+ if (this.isTrendingSortEnabled('hot')) {
+ this.sortItems.push({ id: '-hot', label: $localize`Hot` })
+ }
+
+ if (this.isTrendingSortEnabled('most-liked')) {
+ this.sortItems.push({ id: '-likes', label: $localize`Likes` })
+ }
+
+ this.sortItems.push({ id: '-views', label: $localize`Global Views` })
+ }
+
+ private isTrendingSortEnabled (sort: 'most-viewed' | 'hot' | 'most-liked') {
+ return this.serverConfig.trending.videos.algorithms.enabled.includes(sort)
+ }
+
+ propagateChange = (_: any) => {
+ // empty
+ }
+
+ writeValue (id: string) {
+ this.selectedId = id
+ }
+
+ registerOnChange (fn: (_: any) => void) {
+ this.propagateChange = fn
+ }
+
+ registerOnTouched () {
+ // Unused
+ }
+
+ onModelChange () {
+ this.propagateChange(this.selectedId)
+ }
+}
diff --git a/client/src/app/shared/shared-video-miniature/video-filters-header.component.html b/client/src/app/shared/shared-video-miniature/video-filters-header.component.html
index a7d74c7d6..c079fa1e1 100644
--- a/client/src/app/shared/shared-video-miniature/video-filters-header.component.html
+++ b/client/src/app/shared/shared-video-miniature/video-filters-header.component.html
@@ -59,7 +59,7 @@
-
+