From 0fbd0f71822f69ae2faa4408cf7a633ef77d3724 Mon Sep 17 00:00:00 2001
From: gibbyb <gib@gibbyb.com>
Date: Tue, 30 Jul 2024 10:24:08 -0500
Subject: [PATCH] Fix word wrap with no white spaces for status

---
 src/components/ui/History_Drawer.tsx |  2 +-
 src/styles/globals.css               | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/components/ui/History_Drawer.tsx b/src/components/ui/History_Drawer.tsx
index 0b8a1e6..54435a9 100644
--- a/src/components/ui/History_Drawer.tsx
+++ b/src/components/ui/History_Drawer.tsx
@@ -97,7 +97,7 @@ const History_Drawer: React.FC<History_Drawer_Props> = ({ user_id }) => {
             {history.map((entry, index) => (
               <TableRow key={index}>
                 <TableCell className="font-medium lg:max-w-[100px]">{entry.name}</TableCell>
-                <TableCell className="font-medium lg:max-w-[100px]">{entry.status}</TableCell>
+                <TableCell className="font-medium lg:max-w-[100px] wrapword">{entry.status}</TableCell>
                 <TableCell className="font-medium lg:max-w-[100px] justify-end items-end text-right">{new Date(entry.updatedAt).toLocaleString()}</TableCell>
               </TableRow>
             ))}
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 0d5f541..00da67e 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -134,3 +134,14 @@
 .tablefill {
   height: 10vh;
 }
+
+.wrapword {
+    white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
+    white-space: -webkit-pre-wrap;          /* Chrome & Safari */ 
+    white-space: -pre-wrap;                 /* Opera 4-6 */
+    white-space: -o-pre-wrap;               /* Opera 7 */
+    white-space: pre-wrap;                  /* CSS3 */
+    word-wrap: break-word;                  /* Internet Explorer 5.5+ */
+    word-break: break-all;
+    white-space: normal;
+}