Correctly truncate HTML

We can because we don't use the video truncated description since v5.0

6 files changed, 9 insertions, 15 deletions

diff --git a/client/src/app/shared/shared-abuse-list/abuse-details.component.html b/client/src/app/shared/shared-abuse-list/abuse-details.component.html
index 2d3e26a25..5a4e60fe7 100644
--- a/client/src/app/shared/shared-abuse-list/abuse-details.component.html
+++ b/client/src/app/shared/shared-abuse-list/abuse-details.component.html
@@ -96,7 +96,7 @@
         <strong i18n>Comment:</strong>
       </div>
 
-      <div [innerHTML]="abuse.commentHtml"></div>
+      <div [innerHTML]="abuse.commentHTML"></div>
     </div>
   </div>
 </div>
diff --git a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.html b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.html
index 5833e3465..253237122 100644
--- a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.html
+++ b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.html
@@ -90,7 +90,8 @@
 
       <ng-container *ngIf="abuse.comment">
         <td>
-          <a [href]="getCommentUrl(abuse)" [innerHTML]="abuse.truncatedCommentHtml" class="table-comment-link"
+          <a
+            [href]="getCommentUrl(abuse)" [innerHTML]="abuse.commentHTML" class="table-comment-link ellipsis-multiline-1"
             [title]="abuse.comment.video.name" target="_blank" rel="noopener noreferrer"
           ></a>
 
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 c38e1286f..691859584 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
@@ -1,5 +1,4 @@
 import * as debug from 'debug'
-import truncate from 'lodash-es/truncate'
 import { SortMeta } from 'primeng/api'
 import { Component, Input, OnInit, ViewChild } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
@@ -211,11 +210,9 @@ export class AbuseListTableComponent extends RestTable implements OnInit {
 
           if (abuse.comment) {
             if (abuse.comment.deleted) {
-              abuse.truncatedCommentHtml = abuse.commentHtml = $localize`Deleted comment`
+              abuse.commentHTML = $localize`Deleted comment`
             } else {
-              const truncated = truncate(abuse.comment.text, { length: 100 })
-              abuse.truncatedCommentHtml = await this.markdownRenderer.textMarkdownToHTML({ markdown: truncated, withHtml: true })
-              abuse.commentHtml = await this.markdownRenderer.textMarkdownToHTML({ markdown: abuse.comment.text, withHtml: true })
+              abuse.commentHTML = await this.markdownRenderer.textMarkdownToHTML({ markdown: abuse.comment.text, withHtml: true })
             }
           }
 
diff --git a/client/src/app/shared/shared-abuse-list/processed-abuse.model.ts b/client/src/app/shared/shared-abuse-list/processed-abuse.model.ts
index 076ccb40b..c51d6877e 100644
--- a/client/src/app/shared/shared-abuse-list/processed-abuse.model.ts
+++ b/client/src/app/shared/shared-abuse-list/processed-abuse.model.ts
@@ -12,8 +12,7 @@ export type ProcessedAbuse = AdminAbuse & {
   reporterAccount?: Account
   flaggedAccount?: Account
 
-  truncatedCommentHtml?: string
-  commentHtml?: string
+  commentHTML?: string
 
   video: AdminAbuse['video'] & {
     channel: AdminAbuse['video']['channel'] & {
diff --git a/client/src/app/shared/shared-forms/markdown-textarea.component.html b/client/src/app/shared/shared-forms/markdown-textarea.component.html
index 63dcdc597..ac2dfd17c 100644
--- a/client/src/app/shared/shared-forms/markdown-textarea.component.html
+++ b/client/src/app/shared/shared-forms/markdown-textarea.component.html
@@ -8,11 +8,11 @@
   </textarea>
 
   <div ngbNav #nav="ngbNav" class="nav-pills nav-preview">
-    <ng-container ngbNavItem *ngIf="truncate !== undefined">
+    <ng-container ngbNavItem *ngIf="truncateTo3Lines">
       <a ngbNavLink i18n>Truncated preview</a>
 
       <ng-template ngbNavContent>
-        <div [innerHTML]="truncatedPreviewHTML"></div>
+        <div class="ellipsis-multiline-3" [innerHTML]="previewHTML"></div>
       </ng-template>
     </ng-container>
 
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 7edcf868c..169be39d1 100644
--- a/client/src/app/shared/shared-forms/markdown-textarea.component.ts
+++ b/client/src/app/shared/shared-forms/markdown-textarea.component.ts
@@ -1,4 +1,3 @@
-import truncate from 'lodash-es/truncate'
 import { Subject } from 'rxjs'
 import { debounceTime, distinctUntilChanged } from 'rxjs/operators'
 import { ViewportScroller } from '@angular/common'
@@ -26,7 +25,7 @@ export class MarkdownTextareaComponent implements ControlValueAccessor, OnInit {
 
   @Input() formError: string
 
-  @Input() truncate: number
+  @Input() truncateTo3Lines: boolean
 
   @Input() markdownType: 'text' | 'enhanced' | 'to-unsafe-html' = 'text'
   @Input() customMarkdownRenderer?: (text: string) => Promise<string | HTMLElement>
@@ -42,7 +41,6 @@ export class MarkdownTextareaComponent implements ControlValueAccessor, OnInit {
   @ViewChild('textarea') textareaElement: ElementRef
   @ViewChild('previewElement') previewElement: ElementRef
 
-  truncatedPreviewHTML: SafeHtml | string = ''
   previewHTML: SafeHtml | string = ''
 
   isMaximized = false
@@ -129,7 +127,6 @@ export class MarkdownTextareaComponent implements ControlValueAccessor, OnInit {
   private async updatePreviews () {
     if (this.content === null || this.content === undefined) return
 
-    this.truncatedPreviewHTML = await this.markdownRender(truncate(this.content, { length: this.truncate }))
     this.previewHTML = await this.markdownRender(this.content)
   }