Fix HTML in account/channel description

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(/<br.?\/?>/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 })
     }
   }