From ee376b9ba3c78a05f90254f5b009f48e4e3e08c9 Mon Sep 17 00:00:00 2001
From: Bryan1029384756 <23323626+Bryan1029384756@users.noreply.github.com>
Date: Mon, 16 Feb 2026 15:10:57 -0600
Subject: [PATCH] feat: add `ChatArea` component for message display, link
 previews, and media handling, alongside a new `Sidebar` component.

---
 TODO.md                                     | 9 +--------
 apps/electron/package.json                  | 2 +-
 packages/shared/package.json                | 2 +-
 packages/shared/src/components/ChatArea.jsx | 5 ++++-
 packages/shared/src/components/Sidebar.jsx  | 7 ++-----
 5 files changed, 9 insertions(+), 16 deletions(-)

diff --git a/TODO.md b/TODO.md
index c9838cf..6b1ce5a 100644
--- a/TODO.md
+++ b/TODO.md
@@ -8,11 +8,4 @@
 
 - Can we add a way to tell the user they are connecting to voice. Like show them its connecting so the user knows something is happening instead of them clicking on the voice stage again and again.
 
-- Add photo / video albums like Commit https://commet.chat/
-
-
-<!-- When we call somone in a private dm call can we play the default_call_sound.mp3 to the person reciving  
-  the call for about 30 seconds. After the 30 seconds we stop ringing. Also it shows "Moyettes is in a call" with a join call button but its to the left side and pushes chat. Can we make it take up the voice stage div and show the user that is calling and 2 buttons. One to join call and one to reject the call.
- -->
-
-  When i switch from a private dm to the server i hear a ping notification even though i have no notifications. Also when i switch from a text channel to another text channel a certain text channel is the one thats triggering it and i dont know why. Its only for one user that its doing it.
\ No newline at end of file
+- Add photo / video albums like Commit https://commet.chat/
\ No newline at end of file
diff --git a/apps/electron/package.json b/apps/electron/package.json
index 16e2729..86c4652 100644
--- a/apps/electron/package.json
+++ b/apps/electron/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@discord-clone/electron",
   "private": true,
-  "version": "1.0.19",
+  "version": "1.0.20",
   "description": "Discord Clone - Electron app",
   "author": "Moyettes",
   "type": "module",
diff --git a/packages/shared/package.json b/packages/shared/package.json
index a72daca..091e402 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@discord-clone/shared",
   "private": true,
-  "version": "1.0.19",
+  "version": "1.0.20",
   "type": "module",
   "main": "src/App.jsx",
   "dependencies": {
diff --git a/packages/shared/src/components/ChatArea.jsx b/packages/shared/src/components/ChatArea.jsx
index 86b498f..55fab2f 100644
--- a/packages/shared/src/components/ChatArea.jsx
+++ b/packages/shared/src/components/ChatArea.jsx
@@ -522,6 +522,7 @@ const ChatArea = ({ channelId, channelName, channelType, username, channelKey, u
     const typingTimeoutRef = useRef(null);
     const lastTypingEmitRef = useRef(0);
     const isInitialLoadRef = useRef(true);
+    const pingSeededRef = useRef(false);
     const prevScrollHeightRef = useRef(0);
     const isLoadingMoreRef = useRef(false);
     const userSentMessageRef = useRef(false);
@@ -757,6 +758,7 @@ const ChatArea = ({ channelId, channelName, channelType, username, channelKey, u
         // Don't clear messageDecryptionCache — it persists across channel switches
         setDecryptedMessages([]);
         isInitialLoadRef.current = true;
+        pingSeededRef.current = false;
         notifiedMessageIdsRef.current = new Set();
         pendingNotificationIdsRef.current = new Set();
         setReplyingTo(null);
@@ -791,10 +793,11 @@ const ChatArea = ({ channelId, channelName, channelType, username, channelKey, u
         if (!decryptedMessages.length) return;
 
         // Initial load: seed all IDs, no sound
-        if (isInitialLoadRef.current) {
+        if (!pingSeededRef.current) {
             for (const msg of decryptedMessages) {
                 if (msg.id) notifiedMessageIdsRef.current.add(msg.id);
             }
+            pingSeededRef.current = true;
             return;
         }
 
diff --git a/packages/shared/src/components/Sidebar.jsx b/packages/shared/src/components/Sidebar.jsx
index e1e2a5b..2614fd5 100644
--- a/packages/shared/src/components/Sidebar.jsx
+++ b/packages/shared/src/components/Sidebar.jsx
@@ -841,10 +841,7 @@ const Sidebar = ({ channels, categories, activeChannel, onSelectChannel, usernam
         if (!unreadQueriesLoaded) return;
 
         const currentIds = new Set(
-            dmChannels.filter(dm =>
-                unreadChannels.has(dm.channel_id) &&
-                !(view === 'me' && activeDMChannel?.channel_id === dm.channel_id)
-            ).map(dm => dm.channel_id)
+            dmChannels.filter(dm => unreadChannels.has(dm.channel_id)).map(dm => dm.channel_id)
         );
 
         if (prevUnreadDMsRef.current === null) {
@@ -864,7 +861,7 @@ const Sidebar = ({ channels, categories, activeChannel, onSelectChannel, usernam
         }
 
         prevUnreadDMsRef.current = currentIds;
-    }, [dmChannels, unreadChannels, unreadQueriesLoaded, view, activeDMChannel, isReceivingScreenShareAudio]);
+    }, [dmChannels, unreadChannels, unreadQueriesLoaded, isReceivingScreenShareAudio]);
 
     const onRenameChannel = () => {};