fix: break words first, break all second

Unleash · Oct 21, 2024 · f425eee · f425eee
1 parent a8206f5
commit f425eee
Showing 1 changed file with 11 additions and 5 deletions.
diff --git a/frontend/src/component/personalDashboard/LatestProjectEvents.tsx b/frontend/src/component/personalDashboard/LatestProjectEvents.tsx
@@ -45,9 +45,13 @@ const StyledUserAvatar = styled(UserAvatar)(({ theme }) => ({
 }));
 
 const StyledMarkdown = styled(Markdown)(({ theme }) => ({
-    wordBreak: 'break-all',
+    wordBreak: 'break-word',
 }));
 
+const BreakLongWordsFallback = styled('div')({
+    wordBreak: 'break-all',
+});
+
 export const LatestProjectEvents: FC<{
     latestEvents: PersonalDashboardProjectDetailsSchema['latestEvents'];
 }> = ({ latestEvents }) => {
@@ -77,10 +81,12 @@ export const LatestProjectEvents: FC<{
                                         locationSettings.locale,
                                     )}
                                 </Timestamp>
-                                <StyledMarkdown>
-                                    {event.summary ||
-                                        'No preview available for this event'}
-                                </StyledMarkdown>
+                                <BreakLongWordsFallback>
+                                    <StyledMarkdown>
+                                        {event.summary ||
+                                            'No preview available for this event'}
+                                    </StyledMarkdown>
+                                </BreakLongWordsFallback>
                             </div>
                         </Event>
                     );