From 8e06ccea4cd06ccee0540cb53fa3ec25116015e4 Mon Sep 17 00:00:00 2001
From: Pas <74743263+Pasithea0@users.noreply.github.com>
Date: Tue, 5 Aug 2025 11:58:26 -0600
Subject: [PATCH] update notifications + styles
---
public/notifications.xml | 23 +++++++++++++--
.../components/DetailView.tsx | 16 +++-------
.../components/ListView.tsx | 20 +++----------
.../notificationsModal/utils/index.ts | 29 +++++++++++++++++++
4 files changed, 58 insertions(+), 30 deletions(-)
diff --git a/public/notifications.xml b/public/notifications.xml
index bd706913..e9ba6cda 100644
--- a/public/notifications.xml
+++ b/public/notifications.xml
@@ -8,11 +8,30 @@
") - .replace(/\n- /g, "
• ") - .replace(/\n\*\*([^*]+)\*\*/g, "
") - .replace(/^/, "
") - .replace(/$/, "
") - .replace(/<\/p>/g, "") - .replace( - /
• /g, - '
•', - ) - .replace(/<\/p>/g, "
"), + __html: formatNotificationDescription( + selectedNotification.description, + ), }} /> diff --git a/src/components/overlays/notificationsModal/components/ListView.tsx b/src/components/overlays/notificationsModal/components/ListView.tsx index 21f30c77..306fafd1 100644 --- a/src/components/overlays/notificationsModal/components/ListView.tsx +++ b/src/components/overlays/notificationsModal/components/ListView.tsx @@ -1,6 +1,7 @@ import { Icon, Icons } from "@/components/Icon"; import { ListViewProps } from "../types"; +import { formatNotificationDescription } from "../utils"; export function ListView({ notifications, @@ -185,22 +186,9 @@ export function ListView({ // eslint-disable-next-line react/no-danger dangerouslySetInnerHTML={{ __html: - notification.description - .replace(/\n\n/g, "") - .replace(/\n- /g, "
• ") - .replace( - /\n\*\*([^*]+)\*\*/g, - "
", - ) - .replace(/^/, "
") - .replace(/$/, "
") - .replace(/<\/p>/g, "") - .replace( - /
• /g, - '
•', - ) - .replace(/<\/p>/g, "
") - .substring(0, 150) + + formatNotificationDescription( + notification.description, + ).substring(0, 150) + (notification.description.length > 150 ? "..." : ""), diff --git a/src/components/overlays/notificationsModal/utils/index.ts b/src/components/overlays/notificationsModal/utils/index.ts index 86080f03..36e4ab0f 100644 --- a/src/components/overlays/notificationsModal/utils/index.ts +++ b/src/components/overlays/notificationsModal/utils/index.ts @@ -136,3 +136,32 @@ export const getCategoryLabel = (category: string) => { return category; } }; +export function formatNotificationDescription(description: string): string { + return ( + description + // First, normalize multiple consecutive line breaks to single line breaks + .replace(/\n{3,}/g, "\n\n") + // Handle bullet points before paragraph breaks + .replace(/\n- /g, "• ") + // Handle bold text (headers) + .replace(/\n\*\*([^*]+)\*\*/g, "
") + // Handle paragraph breaks (double line breaks) + .replace(/\n\n/g, "
")
+ // Handle single line breaks within paragraphs
+ .replace(/\n/g, "
")
+ // Wrap in paragraph tags
+ .replace(/^/, "
") + .replace(/$/, "
") + // Remove empty paragraphs + .replace(/<\/p>/g, "") + // Clean up consecutive paragraph tags + .replace(/<\/p>
<\/p>/g, "
") + .replace(/<\/p>
/g, "
") + // Style bullet points + .replace( + /
• /g, + '
•', + ) + .replace(/<\/p>/g, "
") + ); +}