From 0e45e336f62a411b3c423be46d16252355c754d7 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Mon, 14 Nov 2022 10:47:39 +0100 Subject: Fix HTML in account/channel description --- .../account-video-channels.component.ts | 6 ++++- client/src/app/+accounts/accounts.component.ts | 6 ++++- .../video-block-list/video-block-list.component.ts | 2 +- .../comments/video-comment-list.component.ts | 2 +- .../+video-channels/video-channels.component.ts | 13 +++++++++-- .../shared/comment/video-comment.component.ts | 2 +- .../shared/metadata/video-description.component.ts | 2 +- client/src/app/app.component.ts | 2 +- client/src/app/core/plugins/plugin.service.ts | 4 ++-- client/src/app/core/renderer/markdown.service.ts | 27 ++++++++++++++++++---- .../abuse-list-table.component.ts | 6 ++--- .../shared-custom-markup/custom-markup.service.ts | 2 +- .../channel-miniature-markup.component.ts | 6 ++++- .../shared-forms/markdown-textarea.component.ts | 4 ++-- .../app/shared/shared-instance/instance.service.ts | 2 +- .../support-modal.component.ts | 2 +- .../video-playlist-miniature.component.ts | 2 +- 17 files changed, 64 insertions(+), 26 deletions(-) diff --git a/client/src/app/+accounts/account-video-channels/account-video-channels.component.ts b/client/src/app/+accounts/account-video-channels/account-video-channels.component.ts index 457a432fe..59814a93d 100644 --- a/client/src/app/+accounts/account-video-channels/account-video-channels.component.ts +++ b/client/src/app/+accounts/account-video-channels/account-video-channels.component.ts @@ -105,7 +105,11 @@ export class AccountVideoChannelsComponent implements OnInit, OnDestroy { }) ) .subscribe(async ({ videoChannel, videos, total }) => { - this.channelsDescriptionHTML[videoChannel.id] = await this.markdown.textMarkdownToHTML(videoChannel.description) + this.channelsDescriptionHTML[videoChannel.id] = await this.markdown.textMarkdownToHTML({ + markdown: videoChannel.description, + withEmoji: true, + withHtml: true + }) this.videoChannels.push(videoChannel) diff --git a/client/src/app/+accounts/accounts.component.ts b/client/src/app/+accounts/accounts.component.ts index cf66b817a..0033fbf59 100644 --- a/client/src/app/+accounts/accounts.component.ts +++ b/client/src/app/+accounts/accounts.component.ts @@ -142,7 +142,11 @@ export class AccountsComponent implements OnInit, OnDestroy { } private async onAccount (account: Account) { - this.accountDescriptionHTML = await this.markdown.textMarkdownToHTML(account.description) + this.accountDescriptionHTML = await this.markdown.textMarkdownToHTML({ + markdown: account.description, + withEmoji: true, + withHtml: true + }) // After the markdown renderer to avoid layout changes this.account = account diff --git a/client/src/app/+admin/moderation/video-block-list/video-block-list.component.ts b/client/src/app/+admin/moderation/video-block-list/video-block-list.component.ts index 911d2418e..efd99e52b 100644 --- a/client/src/app/+admin/moderation/video-block-list/video-block-list.component.ts +++ b/client/src/app/+admin/moderation/video-block-list/video-block-list.component.ts @@ -127,7 +127,7 @@ export class VideoBlockListComponent extends RestTable implements OnInit { } toHtml (text: string) { - return this.markdownRenderer.textMarkdownToHTML(text) + return this.markdownRenderer.textMarkdownToHTML({ markdown: text }) } async unblockVideo (entry: VideoBlacklist) { diff --git a/client/src/app/+admin/overview/comments/video-comment-list.component.ts b/client/src/app/+admin/overview/comments/video-comment-list.component.ts index cfe40b92a..c95d2ffeb 100644 --- a/client/src/app/+admin/overview/comments/video-comment-list.component.ts +++ b/client/src/app/+admin/overview/comments/video-comment-list.component.ts @@ -115,7 +115,7 @@ export class VideoCommentListComponent extends RestTable implements OnInit { } toHtml (text: string) { - return this.markdownRenderer.textMarkdownToHTML(text, true, true) + return this.markdownRenderer.textMarkdownToHTML({ markdown: text, withHtml: true, withEmoji: true }) } isInSelectionMode () { diff --git a/client/src/app/+video-channels/video-channels.component.ts b/client/src/app/+video-channels/video-channels.component.ts index c5bcdffe2..afbf96032 100644 --- a/client/src/app/+video-channels/video-channels.component.ts +++ b/client/src/app/+video-channels/video-channels.component.ts @@ -56,8 +56,17 @@ export class VideoChannelsComponent implements OnInit, OnDestroy { ])) ) .subscribe(async videoChannel => { - this.channelDescriptionHTML = await this.markdown.textMarkdownToHTML(videoChannel.description) - this.ownerDescriptionHTML = await this.markdown.textMarkdownToHTML(videoChannel.ownerAccount.description) + this.channelDescriptionHTML = await this.markdown.textMarkdownToHTML({ + markdown: videoChannel.description, + withEmoji: true, + withHtml: true + }) + + this.ownerDescriptionHTML = await this.markdown.textMarkdownToHTML({ + markdown: videoChannel.ownerAccount.description, + withEmoji: true, + withHtml: true + }) // After the markdown renderer to avoid layout changes this.videoChannel = videoChannel diff --git a/client/src/app/+videos/+video-watch/shared/comment/video-comment.component.ts b/client/src/app/+videos/+video-watch/shared/comment/video-comment.component.ts index cabea7551..191ec4a28 100644 --- a/client/src/app/+videos/+video-watch/shared/comment/video-comment.component.ts +++ b/client/src/app/+videos/+video-watch/shared/comment/video-comment.component.ts @@ -160,7 +160,7 @@ export class VideoCommentComponent implements OnInit, OnChanges { private async init () { // Before HTML rendering restore line feed for markdown list compatibility const commentText = this.comment.text.replace(//g, '\r\n') - const html = await this.markdownService.textMarkdownToHTML(commentText, true, true) + const html = await this.markdownService.textMarkdownToHTML({ markdown: commentText, withHtml: true, withEmoji: true }) this.sanitizedCommentHTML = this.markdownService.processVideoTimestamps(this.video.shortUUID, html) this.newParentComments = this.parentComments.concat([ this.comment ]) diff --git a/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts b/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts index b5444facb..72b09a274 100644 --- a/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts +++ b/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts @@ -80,7 +80,7 @@ export class VideoDescriptionComponent implements OnChanges { } private async setVideoDescriptionHTML () { - const html = await this.markdownService.textMarkdownToHTML(this.video.description) + const html = await this.markdownService.textMarkdownToHTML({ markdown: this.video.description }) this.videoHTMLDescription = this.markdownService.processVideoTimestamps(this.video.shortUUID, html) } diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index f2488aa59..e621ce432 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts @@ -206,7 +206,7 @@ export class AppComponent implements OnInit, AfterViewInit { } this.broadcastMessage = { - message: await this.markdownService.unsafeMarkdownToHTML(messageConfig.message, true), + message: await this.markdownService.markdownToUnsafeHTML({ markdown: messageConfig.message }), dismissable: messageConfig.dismissable, class: classes[messageConfig.level] } diff --git a/client/src/app/core/plugins/plugin.service.ts b/client/src/app/core/plugins/plugin.service.ts index 1e79cbf79..bd8c61d9a 100644 --- a/client/src/app/core/plugins/plugin.service.ts +++ b/client/src/app/core/plugins/plugin.service.ts @@ -259,11 +259,11 @@ export class PluginService implements ClientHook { markdownRenderer: { textMarkdownToHTML: (textMarkdown: string) => { - return this.markdownRenderer.textMarkdownToHTML(textMarkdown) + return this.markdownRenderer.textMarkdownToHTML({ markdown: textMarkdown }) }, enhancedMarkdownToHTML: (enhancedMarkdown: string) => { - return this.markdownRenderer.enhancedMarkdownToHTML(enhancedMarkdown) + return this.markdownRenderer.enhancedMarkdownToHTML({ markdown: enhancedMarkdown }) } }, diff --git a/client/src/app/core/renderer/markdown.service.ts b/client/src/app/core/renderer/markdown.service.ts index 42e8c4a88..a5fd72862 100644 --- a/client/src/app/core/renderer/markdown.service.ts +++ b/client/src/app/core/renderer/markdown.service.ts @@ -62,23 +62,40 @@ export class MarkdownService { constructor (private htmlRenderer: HtmlRendererService) {} - textMarkdownToHTML (markdown: string, withHtml = false, withEmoji = false) { + textMarkdownToHTML (options: { + markdown: string + withHtml?: boolean + withEmoji?: boolean + }) { + const { markdown, withHtml = false, withEmoji = false } = options + if (withHtml) return this.render({ name: 'textWithHTMLMarkdownIt', markdown, withEmoji }) return this.render({ name: 'textMarkdownIt', markdown, withEmoji }) } - enhancedMarkdownToHTML (markdown: string, withHtml = false, withEmoji = false) { + enhancedMarkdownToHTML (options: { + markdown: string + withHtml?: boolean + withEmoji?: boolean + }) { + const { markdown, withHtml = false, withEmoji = false } = options + if (withHtml) return this.render({ name: 'enhancedWithHTMLMarkdownIt', markdown, withEmoji }) return this.render({ name: 'enhancedMarkdownIt', markdown, withEmoji }) } - unsafeMarkdownToHTML (markdown: string, _trustedInput: true) { - return this.render({ name: 'unsafeMarkdownIt', markdown, withEmoji: true }) + markdownToUnsafeHTML (options: { markdown: string }) { + return this.render({ name: 'unsafeMarkdownIt', markdown: options.markdown, withEmoji: true }) } - customPageMarkdownToHTML (markdown: string, additionalAllowedTags: string[]) { + customPageMarkdownToHTML (options: { + markdown: string + additionalAllowedTags: string[] + }) { + const { markdown, additionalAllowedTags } = options + return this.render({ name: 'customPageMarkdownIt', markdown, withEmoji: true, additionalAllowedTags }) } diff --git a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts index a3a71ae20..569a37b17 100644 --- a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts +++ b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts @@ -214,8 +214,8 @@ export class AbuseListTableComponent extends RestTable implements OnInit { abuse.truncatedCommentHtml = abuse.commentHtml = $localize`Deleted comment` } else { const truncated = truncate(abuse.comment.text, { length: 100 }) - abuse.truncatedCommentHtml = await this.markdownRenderer.textMarkdownToHTML(truncated, true) - abuse.commentHtml = await this.markdownRenderer.textMarkdownToHTML(abuse.comment.text, true) + abuse.truncatedCommentHtml = await this.markdownRenderer.textMarkdownToHTML({ markdown: truncated, withHtml: true }) + abuse.commentHtml = await this.markdownRenderer.textMarkdownToHTML({ markdown: abuse.comment.text, withHtml: true }) } } @@ -451,6 +451,6 @@ export class AbuseListTableComponent extends RestTable implements OnInit { } private toHtml (text: string) { - return this.markdownRenderer.textMarkdownToHTML(text) + return this.markdownRenderer.textMarkdownToHTML({ markdown: text }) } } diff --git a/client/src/app/shared/shared-custom-markup/custom-markup.service.ts b/client/src/app/shared/shared-custom-markup/custom-markup.service.ts index d738a644e..618c3dd4f 100644 --- a/client/src/app/shared/shared-custom-markup/custom-markup.service.ts +++ b/client/src/app/shared/shared-custom-markup/custom-markup.service.ts @@ -58,7 +58,7 @@ export class CustomMarkupService { } async buildElement (text: string) { - const html = await this.markdown.customPageMarkdownToHTML(text, this.getSupportedTags()) + const html = await this.markdown.customPageMarkdownToHTML({ markdown: text, additionalAllowedTags: this.getSupportedTags() }) const rootElement = document.createElement('div') rootElement.innerHTML = html diff --git a/client/src/app/shared/shared-custom-markup/peertube-custom-tags/channel-miniature-markup.component.ts b/client/src/app/shared/shared-custom-markup/peertube-custom-tags/channel-miniature-markup.component.ts index e9c466a90..ba12b7139 100644 --- a/client/src/app/shared/shared-custom-markup/peertube-custom-tags/channel-miniature-markup.component.ts +++ b/client/src/app/shared/shared-custom-markup/peertube-custom-tags/channel-miniature-markup.component.ts @@ -42,7 +42,11 @@ export class ChannelMiniatureMarkupComponent implements CustomMarkupComponent, O tap(channel => { this.channel = channel }), - switchMap(() => from(this.markdown.textMarkdownToHTML(this.channel.description))), + switchMap(() => from(this.markdown.textMarkdownToHTML({ + markdown: this.channel.description, + withEmoji: true, + withHtml: true + }))), tap(html => { this.descriptionHTML = html }), diff --git a/client/src/app/shared/shared-forms/markdown-textarea.component.ts b/client/src/app/shared/shared-forms/markdown-textarea.component.ts index 089991884..e3371f22c 100644 --- a/client/src/app/shared/shared-forms/markdown-textarea.component.ts +++ b/client/src/app/shared/shared-forms/markdown-textarea.component.ts @@ -144,9 +144,9 @@ export class MarkdownTextareaComponent implements ControlValueAccessor, OnInit { html = result } else if (this.markdownType === 'text') { - html = await this.markdownService.textMarkdownToHTML(text) + html = await this.markdownService.textMarkdownToHTML({ markdown: text }) } else { - html = await this.markdownService.enhancedMarkdownToHTML(text) + html = await this.markdownService.enhancedMarkdownToHTML({ markdown: text }) } if (this.markdownVideo) { diff --git a/client/src/app/shared/shared-instance/instance.service.ts b/client/src/app/shared/shared-instance/instance.service.ts index 0241f56ef..89f47db24 100644 --- a/client/src/app/shared/shared-instance/instance.service.ts +++ b/client/src/app/shared/shared-instance/instance.service.ts @@ -51,7 +51,7 @@ export class InstanceService { } for (const key of Object.keys(html)) { - html[key] = await this.markdownService.textMarkdownToHTML(about.instance[key]) + html[key] = await this.markdownService.textMarkdownToHTML({ markdown: about.instance[key] }) } return html diff --git a/client/src/app/shared/shared-support-modal/support-modal.component.ts b/client/src/app/shared/shared-support-modal/support-modal.component.ts index 08e997f7b..f330228e1 100644 --- a/client/src/app/shared/shared-support-modal/support-modal.component.ts +++ b/client/src/app/shared/shared-support-modal/support-modal.component.ts @@ -27,7 +27,7 @@ export class SupportModalComponent { const support = this.video?.support || this.videoChannel.support - this.markdownService.enhancedMarkdownToHTML(support) + this.markdownService.enhancedMarkdownToHTML({ markdown: support }) .then(r => { this.htmlSupport = r }) diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.ts b/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.ts index dd9fe0a5a..225c4eb64 100644 --- a/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.ts +++ b/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.ts @@ -32,7 +32,7 @@ export class VideoPlaylistMiniatureComponent implements OnInit { async ngOnInit () { this.buildPlaylistUrl() if (this.displayDescription) { - this.playlistDescription = await this.markdownService.textMarkdownToHTML(this.playlist.description) + this.playlistDescription = await this.markdownService.textMarkdownToHTML({ markdown: this.playlist.description }) } } -- cgit v1.2.3