Better html title for account and channel pages

This commit is contained in:
Chocobozzz 2024-08-19 16:28:26 +02:00
parent b2bb45cf91
commit 62fcf1fa96
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
4 changed files with 55 additions and 66 deletions

View File

@ -1,7 +1,7 @@
import { DatePipe, NgClass, NgIf } from '@angular/common' import { DatePipe, NgClass, NgIf } from '@angular/common'
import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core' import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'
import { ActivatedRoute, Router, RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router' import { ActivatedRoute, Router, RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router'
import { AuthService, MarkdownService, Notifier, RedirectService, RestExtractor, ScreenService, UserService } from '@app/core' import { AuthService, MarkdownService, MetaService, Notifier, RedirectService, RestExtractor, ScreenService, UserService } from '@app/core'
import { Account } from '@app/shared/shared-main/account/account.model' import { Account } from '@app/shared/shared-main/account/account.model'
import { AccountService } from '@app/shared/shared-main/account/account.service' import { AccountService } from '@app/shared/shared-main/account/account.service'
import { DropdownAction } from '@app/shared/shared-main/buttons/action-dropdown.component' import { DropdownAction } from '@app/shared/shared-main/buttons/action-dropdown.component'
@ -76,30 +76,31 @@ export class AccountsComponent implements OnInit, OnDestroy {
private videoService: VideoService, private videoService: VideoService,
private markdown: MarkdownService, private markdown: MarkdownService,
private blocklist: BlocklistService, private blocklist: BlocklistService,
private screenService: ScreenService private screenService: ScreenService,
private metaService: MetaService
) { ) {
} }
ngOnInit () { ngOnInit () {
this.routeSub = this.route.params this.routeSub = this.route.params
.pipe( .pipe(
map(params => params['accountId']), map(params => params['accountId']),
distinctUntilChanged(), distinctUntilChanged(),
switchMap(accountId => this.accountService.getAccount(accountId)), switchMap(accountId => this.accountService.getAccount(accountId)),
tap(account => this.onAccount(account)), tap(account => this.onAccount(account)),
switchMap(account => this.videoChannelService.listAccountVideoChannels({ account })), switchMap(account => this.videoChannelService.listAccountVideoChannels({ account })),
catchError(err => this.restExtractor.redirectTo404IfNotFound(err, 'other', [ catchError(err => this.restExtractor.redirectTo404IfNotFound(err, 'other', [
HttpStatusCode.BAD_REQUEST_400, HttpStatusCode.BAD_REQUEST_400,
HttpStatusCode.NOT_FOUND_404 HttpStatusCode.NOT_FOUND_404
])) ]))
) )
.subscribe({ .subscribe({
next: videoChannels => { next: videoChannels => {
this.videoChannels = videoChannels.data this.videoChannels = videoChannels.data
}, },
error: err => this.notifier.error(err.message) error: err => this.notifier.error(err.message)
}) })
this.links = [ this.links = [
{ label: $localize`CHANNELS`, routerLink: 'video-channels' }, { label: $localize`CHANNELS`, routerLink: 'video-channels' },
@ -169,6 +170,8 @@ export class AccountsComponent implements OnInit, OnDestroy {
} }
private async onAccount (account: Account) { private async onAccount (account: Account) {
this.metaService.setTitle(account.displayName)
this.accountDescriptionHTML = await this.markdown.textMarkdownToHTML({ this.accountDescriptionHTML = await this.markdown.textMarkdownToHTML({
markdown: account.description, markdown: account.description,
withEmoji: true, withEmoji: true,

View File

@ -35,20 +35,12 @@ export default [
}, },
{ {
path: 'video-channels', path: 'video-channels',
component: AccountVideoChannelsComponent, component: AccountVideoChannelsComponent
data: {
meta: {
title: $localize`Account video channels`
}
}
}, },
{ {
path: 'videos', path: 'videos',
component: AccountVideosComponent, component: AccountVideosComponent,
data: { data: {
meta: {
title: $localize`Account videos`
},
reuse: { reuse: {
enabled: true, enabled: true,
key: 'account-videos-list' key: 'account-videos-list'

View File

@ -31,9 +31,6 @@ export default [
path: 'videos', path: 'videos',
component: VideoChannelVideosComponent, component: VideoChannelVideosComponent,
data: { data: {
meta: {
title: $localize`Video channel videos`
},
reuse: { reuse: {
enabled: true, enabled: true,
key: 'video-channel-videos-list' key: 'video-channel-videos-list'
@ -42,12 +39,7 @@ export default [
}, },
{ {
path: 'video-playlists', path: 'video-playlists',
component: VideoChannelPlaylistsComponent, component: VideoChannelPlaylistsComponent
data: {
meta: {
title: $localize`Video channel playlists`
}
}
} }
] ]
} }

View File

@ -2,7 +2,7 @@ import { Subscription } from 'rxjs'
import { catchError, distinctUntilChanged, map, switchMap } from 'rxjs/operators' import { catchError, distinctUntilChanged, map, switchMap } from 'rxjs/operators'
import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core' import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'
import { ActivatedRoute, RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router' import { ActivatedRoute, RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router'
import { AuthService, MarkdownService, Notifier, RestExtractor, ScreenService, Hotkey, HotkeysService } from '@app/core' import { AuthService, MarkdownService, Notifier, RestExtractor, ScreenService, Hotkey, HotkeysService, MetaService } from '@app/core'
import { HttpStatusCode, UserRight } from '@peertube/peertube-models' import { HttpStatusCode, UserRight } from '@peertube/peertube-models'
import { ListOverflowComponent, ListOverflowItem } from '../shared/shared-main/misc/list-overflow.component' import { ListOverflowComponent, ListOverflowItem } from '../shared/shared-main/misc/list-overflow.component'
import { CopyButtonComponent } from '../shared/shared-main/buttons/copy-button.component' import { CopyButtonComponent } from '../shared/shared-main/buttons/copy-button.component'
@ -58,7 +58,6 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
constructor ( constructor (
private route: ActivatedRoute, private route: ActivatedRoute,
private notifier: Notifier,
private authService: AuthService, private authService: AuthService,
private videoChannelService: VideoChannelService, private videoChannelService: VideoChannelService,
private videoService: VideoService, private videoService: VideoService,
@ -66,40 +65,43 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
private hotkeysService: HotkeysService, private hotkeysService: HotkeysService,
private screenService: ScreenService, private screenService: ScreenService,
private markdown: MarkdownService, private markdown: MarkdownService,
private blocklist: BlocklistService private blocklist: BlocklistService,
private metaService: MetaService
) { } ) { }
ngOnInit () { ngOnInit () {
this.routeSub = this.route.params this.routeSub = this.route.params
.pipe( .pipe(
map(params => params['videoChannelName']), map(params => params['videoChannelName']),
distinctUntilChanged(), distinctUntilChanged(),
switchMap(videoChannelName => this.videoChannelService.getVideoChannel(videoChannelName)), switchMap(videoChannelName => this.videoChannelService.getVideoChannel(videoChannelName)),
catchError(err => this.restExtractor.redirectTo404IfNotFound(err, 'other', [ catchError(err => this.restExtractor.redirectTo404IfNotFound(err, 'other', [
HttpStatusCode.BAD_REQUEST_400, HttpStatusCode.BAD_REQUEST_400,
HttpStatusCode.NOT_FOUND_404 HttpStatusCode.NOT_FOUND_404
])) ]))
) )
.subscribe(async videoChannel => { .subscribe(async videoChannel => {
this.channelDescriptionHTML = await this.markdown.textMarkdownToHTML({ this.metaService.setTitle(videoChannel.displayName)
markdown: videoChannel.description,
withEmoji: true,
withHtml: true
})
this.ownerDescriptionHTML = await this.markdown.textMarkdownToHTML({ this.channelDescriptionHTML = await this.markdown.textMarkdownToHTML({
markdown: videoChannel.ownerAccount.description, markdown: videoChannel.description,
withEmoji: true, withEmoji: true,
withHtml: true withHtml: true
}) })
// After the markdown renderer to avoid layout changes this.ownerDescriptionHTML = await this.markdown.textMarkdownToHTML({
this.videoChannel = videoChannel markdown: videoChannel.ownerAccount.description,
this.ownerAccount = new Account(this.videoChannel.ownerAccount) withEmoji: true,
withHtml: true
})
this.loadChannelVideosCount() // After the markdown renderer to avoid layout changes
this.loadOwnerBlockStatus() this.videoChannel = videoChannel
}) this.ownerAccount = new Account(this.videoChannel.ownerAccount)
this.loadChannelVideosCount()
this.loadOwnerBlockStatus()
})
this.hotkeys = [ this.hotkeys = [
new Hotkey('Shift+s', () => { new Hotkey('Shift+s', () => {