From: Dessalines <dessalines@users.noreply.github.com>
Date: Mon, 23 May 2022 11:13:41 +0000 (-0400)
Subject: Don't render markdown for summaries. Fixes #658 (#659)
X-Git-Url: http://these/git/%7B%60/feeds/front/static/%7BpictrsAvatarThumbnail%28this.state.siteRes.site.icon%29%7D?a=commitdiff_plain;h=321339c6c51eb635ecb2dea8f933a5e2b8c0c69d;p=lemmy-ui.git

Don't render markdown for summaries. Fixes #658 (#659)
---

diff --git a/src/assets/css/main.css b/src/assets/css/main.css
index b9fe4b9..fe728ca 100644
--- a/src/assets/css/main.css
+++ b/src/assets/css/main.css
@@ -374,3 +374,11 @@ br.big {
 .slight-radius {
   border-radius: 4px;
 }
+
+.preview-lines {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
diff --git a/src/shared/components/person/profile.tsx b/src/shared/components/person/profile.tsx
index 42cb249..372a899 100644
--- a/src/shared/components/person/profile.tsx
+++ b/src/shared/components/person/profile.tsx
@@ -34,7 +34,6 @@ import {
   isMod,
   mdToHtml,
   numToSI,
-  previewLines,
   relTags,
   restoreScrollPosition,
   routeSortTypeToEnum,
@@ -221,7 +220,7 @@ export class Profile extends Component<any, ProfileState> {
 
   get bioTag(): string {
     return this.state.personRes.person_view.person.bio
-      ? previewLines(this.state.personRes.person_view.person.bio)
+      ? this.state.personRes.person_view.person.bio
       : undefined;
   }
 
diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx
index 3a31549..253eeb4 100644
--- a/src/shared/components/post/post-listing.tsx
+++ b/src/shared/components/post/post-listing.tsx
@@ -35,7 +35,6 @@ import {
   md,
   mdToHtml,
   numToSI,
-  previewLines,
   relTags,
   setupTippy,
   showScores,
@@ -355,9 +354,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
             <li className="list-inline-item">
               <button
                 className="text-muted btn btn-sm btn-link p-0"
-                data-tippy-content={md.render(
-                  previewLines(post_view.post.body)
-                )}
+                data-tippy-content={md.render(post_view.post.body)}
                 data-tippy-allowHtml={true}
                 onClick={linkEvent(this, this.handleShowBody)}
               >
@@ -1093,12 +1090,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
     return (
       post.body &&
       !this.showBody && (
-        <div
-          className="md-div mb-1"
-          dangerouslySetInnerHTML={{
-            __html: md.render(previewLines(post.body)),
-          }}
-        />
+        <div className="md-div mb-1 preview-lines">{post.body}</div>
       )
     );
   }
diff --git a/src/shared/components/post/post.tsx b/src/shared/components/post/post.tsx
index 9b59859..5d15e83 100644
--- a/src/shared/components/post/post.tsx
+++ b/src/shared/components/post/post.tsx
@@ -46,7 +46,6 @@ import {
   insertCommentIntoTree,
   isBrowser,
   isImage,
-  previewLines,
   restoreScrollPosition,
   saveCommentRes,
   saveScrollPosition,
@@ -287,8 +286,7 @@ export class Post extends Component<any, PostState> {
   }
 
   get descriptionTag(): string {
-    let body = this.state.postRes.post_view.post.body;
-    return body ? previewLines(body) : undefined;
+    return this.state.postRes.post_view.post.body;
   }
 
   render() {
diff --git a/src/shared/utils.ts b/src/shared/utils.ts
index bf0a6d8..a0f0376 100644
--- a/src/shared/utils.ts
+++ b/src/shared/utils.ts
@@ -1034,21 +1034,6 @@ function hsl(num: number) {
   return `hsla(${num}, 35%, 50%, 1)`;
 }
 
-export function previewLines(
-  text: string,
-  maxChars = 300,
-  maxLines = 1
-): string {
-  return (
-    text
-      .slice(0, maxChars)
-      .split("\n")
-      // Use lines * 2 because markdown requires 2 lines
-      .slice(0, maxLines * 2)
-      .join("\n") + "..."
-  );
-}
-
 export function hostname(url: string): string {
   let cUrl = new URL(url);
   return cUrl.port ? `${cUrl.hostname}:${cUrl.port}` : `${cUrl.hostname}`;