From bcea37d05f8350bce93e35606439312fefb39f33 Mon Sep 17 00:00:00 2001
From: vv <vv@gmail.com>
Date: Sat, 25 Jan 2025 00:13:42 +0800
Subject: [PATCH 1/3] Add unread highlighting mentions in the RoomPreview when
 a user mentions you

---
 src/home/room_preview.rs | 17 +++++++++++++----
 src/home/rooms_list.rs   | 13 ++++++++-----
 src/sliding_sync.rs      | 11 ++++++++---
 3 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/src/home/room_preview.rs b/src/home/room_preview.rs
index 67dfbb47..58baef54 100644
--- a/src/home/room_preview.rs
+++ b/src/home/room_preview.rs
@@ -9,7 +9,6 @@ use crate::{
 };
 
 use super::rooms_list::{RoomPreviewAvatar, RoomsListEntry};
-
 live_design! {
     use link::theme::*;
     use link::shaders::*;
@@ -19,6 +18,8 @@ live_design! {
     use crate::shared::helpers::*;
     use crate::shared::avatar::Avatar;
     use crate::shared::html_or_plaintext::HtmlOrPlaintext;
+    pub UNREAD_HIGHLIGHT_COLOR = #FF0000;
+    pub UNREAD_DEFAULT_COLOR = #d8d8d8;
 
     RoomName = <Label> {
         width: Fill, height: Fit
@@ -105,12 +106,14 @@ live_design! {
         show_bg: true
         align: { x: 0.5, y: 0.5 }
         draw_bg: {
-            instance background_color: (COLOR_TEXT_IDLE)
+            instance highlight: 0.0,
+            instance highlight_color: (UNREAD_HIGHLIGHT_COLOR),
+            instance default_color: (UNREAD_DEFAULT_COLOR),
             fn pixel(self) -> vec4 {
                 let sdf = Sdf2d::viewport(self.pos * self.rect_size);
                 let c = self.rect_size * 0.5;
                 sdf.circle(c.x, c.x, c.x)
-                sdf.fill_keep(self.background_color);
+                sdf.fill_keep(mix(self.default_color, self.highlight_color, self.highlight));
                 return sdf.result
             }
         }
@@ -278,9 +281,14 @@ impl Widget for RoomPreviewContent {
                 }
             }
 
-            let unread_badge = self.view(id!(unread_badge));
+            let unread_badge = self.view(id!(unread_badge)); 
 
             if room_info.num_unread_messages > 0 {
+                if room_info.num_unread_metions > 0{
+                    unread_badge.apply_over(cx, live!{draw_bg: {highlight: 1.0}});
+                }else{
+                    unread_badge.apply_over(cx, live!{draw_bg: {highlight: 0.0}});
+                }
                 if room_info.num_unread_messages > 99 {
                     // We don't need to show unread messages over 99, so we show 99+ instead.
                     unread_badge.label(id!(unread_message_count)).set_text(cx, "99+");
@@ -290,6 +298,7 @@ impl Widget for RoomPreviewContent {
                         .set_text(cx, &room_info.num_unread_messages.to_string());
                 }
                 unread_badge.set_visible(cx, true);
+               
             } else {
                 unread_badge.set_visible(cx, false);
             }
diff --git a/src/home/rooms_list.rs b/src/home/rooms_list.rs
index 46c39599..06428d59 100644
--- a/src/home/rooms_list.rs
+++ b/src/home/rooms_list.rs
@@ -93,7 +93,8 @@ pub enum RoomsListUpdate {
     /// Update the number of unread messages for the given room.
     UpdateNumUnreadMessages {
         room_id: OwnedRoomId,
-        count: UnreadMessageCount
+        count: UnreadMessageCount,
+        unread_mentions: u64,
     },
     /// Update the displayable name for the given room.
     UpdateRoomName {
@@ -149,6 +150,8 @@ pub struct RoomsListEntry {
     pub room_name: Option<String>,
     /// The number of unread messages in this room.
     pub num_unread_messages: u64,
+    /// The number of unread mentions in this room.
+    pub num_unread_metions: u64,
     /// The canonical alias for this room, if any.
     pub canonical_alias: Option<OwnedRoomAliasId>,
     /// The alternative aliases for this room, if any.
@@ -484,11 +487,11 @@ impl Widget for RoomsList {
                             error!("Error: couldn't find room {room_id} to update latest event");
                         }
                     }
-                    RoomsListUpdate::UpdateNumUnreadMessages { room_id, count } => {
+                    RoomsListUpdate::UpdateNumUnreadMessages { room_id, count , unread_mentions} => {
                         if let Some(room) = self.all_rooms.get_mut(&room_id) {
-                            room.num_unread_messages = match count {
-                                UnreadMessageCount::Unknown => 0,
-                                UnreadMessageCount::Known(count) => count,
+                            (room.num_unread_messages, room.num_unread_metions) = match count {
+                                UnreadMessageCount::Unknown => (0, 0),
+                                UnreadMessageCount::Known(count) => (count, unread_mentions),
                             };
                         } else {
                             error!("Error: couldn't find room {} to update unread messages count", room_id);
diff --git a/src/sliding_sync.rs b/src/sliding_sync.rs
index ff3c09cb..d1c4a552 100644
--- a/src/sliding_sync.rs
+++ b/src/sliding_sync.rs
@@ -616,7 +616,8 @@ async fn async_worker(
                     }
                     enqueue_rooms_list_update(RoomsListUpdate::UpdateNumUnreadMessages {
                         room_id: room_id.clone(),
-                        count: UnreadMessageCount::Known(timeline.room().num_unread_messages())
+                        count: UnreadMessageCount::Known(timeline.room().num_unread_messages()),
+                        unread_mentions:timeline.room().num_unread_mentions(),
                     });
                 });
             }
@@ -871,7 +872,8 @@ async fn async_worker(
                     // Also update the number of unread messages in the room.
                     enqueue_rooms_list_update(RoomsListUpdate::UpdateNumUnreadMessages {
                         room_id: room_id.clone(),
-                        count: UnreadMessageCount::Known(timeline.room().num_unread_messages())
+                        count: UnreadMessageCount::Known(timeline.room().num_unread_messages()),
+                        unread_mentions: timeline.room().num_unread_mentions()
                     });
                 });
             },
@@ -895,7 +897,8 @@ async fn async_worker(
                     // Also update the number of unread messages in the room.
                     enqueue_rooms_list_update(RoomsListUpdate::UpdateNumUnreadMessages {
                         room_id: room_id.clone(),
-                        count: UnreadMessageCount::Known(timeline.room().num_unread_messages())
+                        count: UnreadMessageCount::Known(timeline.room().num_unread_messages()),
+                        unread_mentions: timeline.room().num_unread_mentions()
                     });
                 });
             },
@@ -1485,6 +1488,7 @@ async fn update_room(
         enqueue_rooms_list_update(RoomsListUpdate::UpdateNumUnreadMessages {
             room_id: new_room_id.clone(),
             count: UnreadMessageCount::Known(new_room.num_unread_messages()),
+            unread_mentions: new_room.num_unread_mentions()
         });
 
         Ok(())
@@ -1578,6 +1582,7 @@ async fn add_new_room(room: &room_list_service::Room, room_list_service: &RoomLi
         latest,
         tags: room.tags().await.ok().flatten(),
         num_unread_messages: room.num_unread_messages(),
+        num_unread_metions: room.num_unread_mentions(),
         // start with a basic text avatar; the avatar image will be fetched asynchronously below.
         avatar: avatar_from_room_name(room_name.as_deref().unwrap_or_default()),
         room_name,

From 9d290600af43801a23a9736c34afa15081c3d230 Mon Sep 17 00:00:00 2001
From: Cam <yangcancai0112@gmail.com>
Date: Sat, 25 Jan 2025 09:51:15 +0800
Subject: [PATCH 2/3] Fix typo & syntax spacing

---
 src/home/room_preview.rs | 8 ++++----
 src/home/rooms_list.rs   | 4 ++--
 src/sliding_sync.rs      | 2 +-
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/home/room_preview.rs b/src/home/room_preview.rs
index 58baef54..51e8ff68 100644
--- a/src/home/room_preview.rs
+++ b/src/home/room_preview.rs
@@ -284,10 +284,10 @@ impl Widget for RoomPreviewContent {
             let unread_badge = self.view(id!(unread_badge)); 
 
             if room_info.num_unread_messages > 0 {
-                if room_info.num_unread_metions > 0{
-                    unread_badge.apply_over(cx, live!{draw_bg: {highlight: 1.0}});
-                }else{
-                    unread_badge.apply_over(cx, live!{draw_bg: {highlight: 0.0}});
+                if room_info.num_unread_mentions > 0 {
+                    unread_badge.apply_over(cx, live!{ draw_bg: { highlight: 1.0 }});
+                } else {
+                    unread_badge.apply_over(cx, live!{ draw_bg: { highlight: 0.0 }});
                 }
                 if room_info.num_unread_messages > 99 {
                     // We don't need to show unread messages over 99, so we show 99+ instead.
diff --git a/src/home/rooms_list.rs b/src/home/rooms_list.rs
index 06428d59..1dd33fd2 100644
--- a/src/home/rooms_list.rs
+++ b/src/home/rooms_list.rs
@@ -151,7 +151,7 @@ pub struct RoomsListEntry {
     /// The number of unread messages in this room.
     pub num_unread_messages: u64,
     /// The number of unread mentions in this room.
-    pub num_unread_metions: u64,
+    pub num_unread_mentions: u64,
     /// The canonical alias for this room, if any.
     pub canonical_alias: Option<OwnedRoomAliasId>,
     /// The alternative aliases for this room, if any.
@@ -489,7 +489,7 @@ impl Widget for RoomsList {
                     }
                     RoomsListUpdate::UpdateNumUnreadMessages { room_id, count , unread_mentions} => {
                         if let Some(room) = self.all_rooms.get_mut(&room_id) {
-                            (room.num_unread_messages, room.num_unread_metions) = match count {
+                            (room.num_unread_messages, room.num_unread_mentions) = match count {
                                 UnreadMessageCount::Unknown => (0, 0),
                                 UnreadMessageCount::Known(count) => (count, unread_mentions),
                             };
diff --git a/src/sliding_sync.rs b/src/sliding_sync.rs
index d1c4a552..50633dae 100644
--- a/src/sliding_sync.rs
+++ b/src/sliding_sync.rs
@@ -1582,7 +1582,7 @@ async fn add_new_room(room: &room_list_service::Room, room_list_service: &RoomLi
         latest,
         tags: room.tags().await.ok().flatten(),
         num_unread_messages: room.num_unread_messages(),
-        num_unread_metions: room.num_unread_mentions(),
+        num_unread_mentions: room.num_unread_mentions(),
         // start with a basic text avatar; the avatar image will be fetched asynchronously below.
         avatar: avatar_from_room_name(room_name.as_deref().unwrap_or_default()),
         room_name,

From 9e509a3d620379427dbd2c6a54123830c62321c0 Mon Sep 17 00:00:00 2001
From: Cam <yangcancai0112@gmail.com>
Date: Sat, 25 Jan 2025 21:23:29 +0800
Subject: [PATCH 3/3] Changed the unread_badge logic

---
 src/home/room_preview.rs | 35 ++++++++++++++++++++---------------
 1 file changed, 20 insertions(+), 15 deletions(-)

diff --git a/src/home/room_preview.rs b/src/home/room_preview.rs
index 51e8ff68..2a89a180 100644
--- a/src/home/room_preview.rs
+++ b/src/home/room_preview.rs
@@ -282,27 +282,32 @@ impl Widget for RoomPreviewContent {
             }
 
             let unread_badge = self.view(id!(unread_badge)); 
-
-            if room_info.num_unread_messages > 0 {
-                if room_info.num_unread_mentions > 0 {
-                    unread_badge.apply_over(cx, live!{ draw_bg: { highlight: 1.0 }});
-                } else {
-                    unread_badge.apply_over(cx, live!{ draw_bg: { highlight: 0.0 }});
-                }
-                if room_info.num_unread_messages > 99 {
-                    // We don't need to show unread messages over 99, so we show 99+ instead.
-                    unread_badge.label(id!(unread_message_count)).set_text(cx, "99+");
+            // Helper function to format the unread count, display "99+" if greater than 99
+            fn format_unread_count(count: u64) -> String {
+                if count > 99 {
+                    "99+".to_string()
                 } else {
-                    unread_badge
-                        .label(id!(unread_message_count))
-                        .set_text(cx, &room_info.num_unread_messages.to_string());
+                    count.to_string()
                 }
+            }
+            if room_info.num_unread_mentions > 0 {
+                // If there are unread mentions, show red badge and the number of unread mentions
+                unread_badge.apply_over(cx, live!{ draw_bg: { highlight: 1.0 }});
+                unread_badge
+                    .label(id!(unread_message_count))
+                    .set_text(cx, &format_unread_count(room_info.num_unread_mentions));
+                unread_badge.set_visible(cx, true);
+            } else if room_info.num_unread_messages > 0 {
+                // If there are no unread mentions but there are unread messages, show gray badge and the number of unread messages
+                unread_badge.apply_over(cx, live!{ draw_bg: { highlight: 0.0 }});
+                unread_badge
+                    .label(id!(unread_message_count))
+                    .set_text(cx, &format_unread_count(room_info.num_unread_messages));
                 unread_badge.set_visible(cx, true);
-               
             } else {
+                // If there are no unread mentions and no unread messages, hide the badge
                 unread_badge.set_visible(cx, false);
             }
-
             if cx.display_context.is_desktop() {
                 self.update_preview_colors(cx, room_info.is_selected);
             } else if room_info.is_selected {