From 6a9498e37cbda01414b8accf3fdcac410f893500 Mon Sep 17 00:00:00 2001
From: Kimsible <2324615-kimsible@users.noreply.gitlab.com>
Date: Fri, 6 Nov 2020 17:40:40 +0100
Subject: [PATCH] Correct break line display for re-draft comments

---
 .../+video-watch/comment/video-comment-add.component.ts    | 4 ++++
 .../+video-watch/comment/video-comments.component.ts       | 7 +++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/client/src/app/+videos/+video-watch/comment/video-comment-add.component.ts b/client/src/app/+videos/+video-watch/comment/video-comment-add.component.ts
index c1d0032cc..d746a614b 100644
--- a/client/src/app/+videos/+video-watch/comment/video-comment-add.component.ts
+++ b/client/src/app/+videos/+video-watch/comment/video-comment-add.component.ts
@@ -183,7 +183,11 @@ export class VideoCommentAddComponent extends FormReactive implements OnChanges,
         this.textareaElement.nativeElement.focus()
       }
 
+      // Scroll to textarea
       this.textareaElement.nativeElement.scrollIntoView({ behavior: 'smooth', block: 'center', inline: 'nearest' })
+
+      // Use the native textarea autosize according to the text's break lines
+      this.textareaElement.nativeElement.dispatchEvent(new Event('input'))
     })
 
     this.form.patchValue({ text })
diff --git a/client/src/app/+videos/+video-watch/comment/video-comments.component.ts b/client/src/app/+videos/+video-watch/comment/video-comments.component.ts
index 79627b1af..602bd8050 100644
--- a/client/src/app/+videos/+video-watch/comment/video-comments.component.ts
+++ b/client/src/app/+videos/+video-watch/comment/video-comments.component.ts
@@ -199,10 +199,13 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
     if (confirm) {
       this.inReplyToCommentId = commentToRedraft.inReplyToCommentId
 
+      // Display <br /> tag as a break line for editing
+      const commentToRedraftText = commentToRedraft.text.replace(/<br.?\/?>/g, '\r\n')
+
       if (commentToRedraft.threadId === commentToRedraft.id) {
-        this.commentThreadRedraftValue = commentToRedraft.text
+        this.commentThreadRedraftValue = commentToRedraftText
       } else {
-        this.commentReplyRedraftValue = commentToRedraft.text
+        this.commentReplyRedraftValue = commentToRedraftText
       }
 
     }
-- 
2.41.0