From 6db06b3a9a012e07ad1d23958b7dffc282675d57 Mon Sep 17 00:00:00 2001
From: Samir Boulema <sboulema@gmail.com>
Date: Wed, 1 Nov 2023 19:10:14 +0100
Subject: [PATCH] Add support for new line in description (#210)

* Add support for new line in description

* Add changeset
---
 .changeset/quiet-mugs-sort.md                           | 5 +++++
 src/components/preview/__snapshots__/card.test.tsx.snap | 2 +-
 src/components/preview/card.tsx                         | 3 ++-
 3 files changed, 8 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/quiet-mugs-sort.md

diff --git a/.changeset/quiet-mugs-sort.md b/.changeset/quiet-mugs-sort.md
new file mode 100644
index 00000000..3e39576d
--- /dev/null
+++ b/.changeset/quiet-mugs-sort.md
@@ -0,0 +1,5 @@
+---
+'socialify': minor
+---
+
+Support new line in description
diff --git a/src/components/preview/__snapshots__/card.test.tsx.snap b/src/components/preview/__snapshots__/card.test.tsx.snap
index d9f8d834..637f0c3c 100644
--- a/src/components/preview/__snapshots__/card.test.tsx.snap
+++ b/src/components/preview/__snapshots__/card.test.tsx.snap
@@ -84,7 +84,7 @@ exports[`Card #2 renders 1`] = `
   </p>
   <p
     class="card-description-wrapper"
-    style="display: flex; justify-content: center; width: 100%; margin-top: 10px; margin-bottom: 0px; font-size: 17px; line-height: 1.4; max-height: 3em; overflow: hidden; word-break: break-all;"
+    style="display: flex; justify-content: center; width: 100%; margin-top: 10px; margin-bottom: 0px; font-size: 17px; line-height: 1.4; max-height: 3em; overflow: hidden; word-break: break-all; white-space: pre-wrap;"
   >
     TEST DESCRIPTION
   </p>
diff --git a/src/components/preview/card.tsx b/src/components/preview/card.tsx
index a9a798e8..6c1267b2 100644
--- a/src/components/preview/card.tsx
+++ b/src/components/preview/card.tsx
@@ -143,7 +143,8 @@ export const Card = (config: Configuration) => {
             lineHeight: 1.4,
             maxHeight: '3em',
             overflow: 'hidden',
-            wordBreak: 'break-all'
+            wordBreak: 'break-all',
+            whiteSpace: 'pre-wrap'
           }}>
           {config.description.value}
         </p>