feat: show who reacted to a message

Author: Bloeckchengrafik

src/chat/src/reaction.rs

@@ -1,7 +1,7 @@
-use std::fmt::{Debug, Formatter};
-use std::sync::Arc;
 use atomic_refcell::AtomicRefCell;
 use gpui::{App, IntoElement, Rgba};
+use std::fmt::{Debug, Formatter};
+use std::sync::Arc;
 
 pub type ReactionEvent<T> = (T, ReactionOperation);
 
@@ -14,7 +14,12 @@ pub enum MessageReactionType {
 #[derive(Clone, PartialEq)]
 pub enum ReactionEmoji {
   Simple(String),
-  Custom { url: String, animated: bool, name: Option<String>, id: u64 },
+  Custom {
+    url: String,
+    animated: bool,
+    name: Option<String>,
+    id: u64,
+  },
 }
 
 impl Debug for ReactionEmoji {
@@ -27,7 +32,6 @@ impl Debug for ReactionEmoji {
 }
 
 pub trait MessageReaction: IntoElement {
-
   fn get_count(&self, kind: Option<MessageReactionType>) -> u64;
   fn get_self_reaction(&self) -> Option<MessageReactionType>;
   fn get_emoji(&self) -> ReactionEmoji;
@@ -43,11 +47,12 @@ pub enum ReactionOperation {
   RemoveSelf(ReactionEmoji),
   RemoveAll,
   RemoveEmoji(ReactionEmoji),
+  SetMembers(ReactionEmoji, Vec<String>),
 }
 
 pub trait ReactionList {
   fn get_reactions(&self) -> &Arc<AtomicRefCell<Vec<impl MessageReaction>>>;
   fn increment(&mut self, emoji: &ReactionEmoji, kind: MessageReactionType, user_is_self: bool, by: isize);
-  fn apply(&mut self, operation: ReactionOperation);
+  fn apply(&mut self, operation: ReactionOperation, app: &mut App);
   fn get_content(&self, cx: &mut App) -> impl IntoElement;
 }

src/discord/src/client.rs

@@ -157,14 +157,28 @@ impl DiscordClient {
     }
   }
 
+  pub async fn load_users_reacting_to(&self, channel_id: ChannelId, message_id: MessageId, emoji: ReactionEmoji) {
+    let reactions = channel_id.reaction_users(self.discord().http.clone(), message_id, Self::emoji_to_serenity(&emoji), Some(5), None).await;
+    if reactions.is_err() {return;}
+    let reactions = reactions.unwrap().iter().map(|user|user.name.clone()).collect();
+
+    self.send_reaction_operation(channel_id, message_id, ReactionOperation::SetMembers(emoji, reactions)).await;
+  }
+
   pub async fn add_reaction(&self, channel_id: ChannelId, message_id: MessageId, emoji: ReactionEmoji) {
     let reaction_type = Self::emoji_to_serenity(&emoji);
     channel_id.create_reaction(self.discord().http.clone(), message_id, reaction_type).await.unwrap();
+
+    // Refresh reactions in UI
+    self.load_users_reacting_to(channel_id, message_id, emoji).await;
   }
 
   pub async fn remove_reaction(&self, channel_id: ChannelId, message_id: MessageId, emoji: ReactionEmoji) {
     let reaction_type = Self::emoji_to_serenity(&emoji);
     channel_id.delete_reaction(self.discord().http.clone(), message_id, None, reaction_type).await.unwrap();
+
+    // Refresh reactions in UI
+    self.load_users_reacting_to(channel_id, message_id, emoji).await;
   }
 }
 

src/discord/src/message/reaction.rs

@@ -1,12 +1,16 @@
 use crate::client::DiscordClient;
 use components::theme::ActiveTheme;
+use components::tooltip::Tooltip;
 use gpui::prelude::FluentBuilder;
-use gpui::{div, img, px, AnyElement, App, InteractiveElement, IntoElement, ParentElement, RenderOnce, Rgba, StatefulInteractiveElement, Styled};
+use gpui::{
+  div, img, px, AnyElement, App, InteractiveElement, IntoElement, ParentElement, RenderOnce, Rgba,
+  StatefulInteractiveElement, Styled,
+};
 use scope_chat::reaction::MessageReactionType::Normal;
 use scope_chat::reaction::{MessageReaction, MessageReactionType, ReactionEmoji};
 use serenity::all::{ChannelId, MessageId, ReactionType};
 use std::fmt::Debug;
-use std::sync::Arc;
+use std::sync::{Arc, Mutex};
 use MessageReactionType::Burst;
 
 #[derive(Clone, Debug)]
@@ -43,6 +47,7 @@ pub struct DiscordMessageReaction {
   pub(crate) client: Arc<DiscordClient>,
   pub(crate) message_id: MessageId,
   pub(crate) channel_id: ChannelId,
+  pub(crate) users: Arc<Mutex<Option<Vec<String>>>>,
 }
 
 impl DiscordMessageReaction {
@@ -52,6 +57,7 @@ impl DiscordMessageReaction {
       client,
       message_id,
       channel_id,
+      users: Arc::new(Mutex::new(None)),
     }
   }
 
@@ -83,13 +89,15 @@ impl DiscordMessageReaction {
   fn handle_click(&self, app: &App) {
     let reaction = self.clone();
     let had_reaction = reaction.get_self_reaction().is_some();
-    app.spawn(|_| async move {
-      if had_reaction {
-        reaction.client.remove_reaction(reaction.channel_id, reaction.message_id, reaction.get_emoji()).await;
-      } else {
-        reaction.client.add_reaction(reaction.channel_id, reaction.message_id, reaction.get_emoji()).await;
-      }
-    }).detach();
+    app
+      .spawn(|_| async move {
+        if had_reaction {
+          reaction.client.remove_reaction(reaction.channel_id, reaction.message_id, reaction.get_emoji()).await;
+        } else {
+          reaction.client.add_reaction(reaction.channel_id, reaction.message_id, reaction.get_emoji()).await;
+        }
+      })
+      .detach();
   }
 }
 
@@ -171,6 +179,12 @@ impl RenderOnce for DiscordMessageReaction {
   fn render(self, _: &mut gpui::Window, cx: &mut App) -> impl IntoElement {
     let emoji = self.get_emoji();
     let theme = cx.theme();
+
+    let channel = self.channel_id.clone();
+    let message = self.message_id.clone();
+    let closure_emoji = self.get_emoji();
+    let client = self.client.clone();
+    let users = self.users.clone();
     div()
       .px_1()
       .py_px()
@@ -189,6 +203,22 @@ impl RenderOnce for DiscordMessageReaction {
       .on_click(move |_, _, app| {
         self.handle_click(app);
       })
+      .tooltip(move |win, cx| {
+        let guard = users.lock().unwrap();
+        let text = if guard.is_some() {
+          guard.as_ref().clone().unwrap().join(", ")
+        } else {
+          "Loading...".to_string()
+        };
+        Tooltip::new(text, win, cx)
+      })
+      .on_hover(move |_, _, _| {
+        let client = client.clone();
+        let emoji = closure_emoji.clone();
+        tokio::spawn(async move {
+          client.load_users_reacting_to(channel, message, emoji).await;
+        });
+      })
   }
 }
 

src/discord/src/message/reaction_list.rs

@@ -1,30 +1,32 @@
 use crate::client::DiscordClient;
 use crate::message::reaction::{DiscordMessageReaction, ReactionData};
+use atomic_refcell::{AtomicRef, AtomicRefCell};
 use gpui::{div, App, AppContext, Context, Entity, IntoElement, ParentElement, Render, Styled, Window};
 use scope_chat::reaction::MessageReactionType::Normal;
 use scope_chat::reaction::{MessageReaction, MessageReactionType, ReactionEmoji, ReactionList, ReactionOperation};
 use serenity::all::{ChannelId, MessageId};
 use std::fmt::Debug;
-use std::sync::{Arc, OnceLock};
-use atomic_refcell::{AtomicRef, AtomicRefCell};
+use std::sync::{Arc, Mutex, OnceLock};
 
 #[derive(Clone)]
 pub struct DiscordReactionList {
   reactions: Arc<AtomicRefCell<Vec<DiscordMessageReaction>>>,
   message_id: MessageId,
   channel_id: ChannelId,
   client: Arc<DiscordClient>,
-  entity: Arc<OnceLock<Entity<RenderableReactionList>>>
+  entity: Arc<OnceLock<Entity<RenderableReactionList>>>,
 }
 
 impl DiscordReactionList {
   pub fn new(reactions: Vec<serenity::all::MessageReaction>, channel_id: ChannelId, message_id: MessageId, client: Arc<DiscordClient>) -> Self {
     DiscordReactionList {
-      reactions: Arc::new(AtomicRefCell::new(reactions.iter().map(|reaction| DiscordMessageReaction::new(reaction, client.clone(), message_id.clone(), channel_id.clone())).collect())),
+      reactions: Arc::new(AtomicRefCell::new(
+        reactions.iter().map(|reaction| DiscordMessageReaction::new(reaction, client.clone(), message_id.clone(), channel_id.clone())).collect(),
+      )),
       message_id,
       channel_id,
       client,
-      entity: Arc::new(OnceLock::new())
+      entity: Arc::new(OnceLock::new()),
     }
   }
 }
@@ -52,14 +54,15 @@ impl ReactionList for DiscordReactionList {
         client: self.client.clone(),
         message_id: self.message_id.clone(),
         channel_id: self.channel_id.clone(),
+        users: Arc::new(Mutex::new(None)),
       };
 
       reaction.increment(kind, user_is_self, by);
       self.reactions.borrow_mut().push(reaction);
     }
   }
 
-  fn apply(&mut self, operation: ReactionOperation) {
+  fn apply(&mut self, operation: ReactionOperation, cx: &mut App) {
     match operation {
       ReactionOperation::Add(emoji, ty) => {
         self.increment(&emoji, ty, false, 1);
@@ -79,6 +82,13 @@ impl ReactionList for DiscordReactionList {
       ReactionOperation::RemoveEmoji(emoji) => {
         self.reactions.borrow_mut().retain(|reaction| reaction.get_emoji() != emoji);
       }
+      ReactionOperation::SetMembers(emoji, members) => {
+        if let Some(reaction) = self.reactions.borrow_mut().iter_mut().find(|reaction| reaction.get_emoji() == emoji) {
+          let mut reactions = reaction.users.lock().unwrap();
+          reactions.replace(members);
+          self.entity.get().as_ref().map(|entity| cx.notify(entity.entity_id()));
+        }
+      }
     }
   }
 

src/ui/src/channel/message_list.rs

@@ -122,7 +122,7 @@ where
         if let Element::Resolved(Some(haystack)) = item {
           if haystack.get_identifier() == Some(reaction.0) {
             if let Some(reactions) = haystack.get_reactions() {
-              reactions.apply(reaction.1);
+              reactions.apply(reaction.1, cx);
             }
 
             cx.notify();