Page MenuHomePhabricator

D7196.id24205.diff
No OneTemporary

D7196.id24205.diff

diff --git a/web/modals/chat/message-reactions-modal.css b/web/modals/chat/message-reactions-modal.css
--- a/web/modals/chat/message-reactions-modal.css
+++ b/web/modals/chat/message-reactions-modal.css
@@ -14,3 +14,13 @@
flex-direction: row;
justify-content: space-between;
}
+
+div.userInfoContainer {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+}
+
+div.username {
+ margin-left: 8px;
+}
diff --git a/web/modals/chat/message-reactions-modal.react.js b/web/modals/chat/message-reactions-modal.react.js
--- a/web/modals/chat/message-reactions-modal.react.js
+++ b/web/modals/chat/message-reactions-modal.react.js
@@ -3,9 +3,11 @@
import * as React from 'react';
import type { ReactionInfo } from 'lib/selectors/chat-selectors.js';
+import { getAvatarForUser } from 'lib/shared/avatar-utils.js';
import { useMessageReactionsList } from 'lib/shared/reaction-utils.js';
import css from './message-reactions-modal.css';
+import Avatar from '../../components/avatar.react.js';
import Modal from '../modal.react.js';
type Props = {
@@ -20,12 +22,19 @@
const reactionsList = React.useMemo(
() =>
- messageReactionsList.map(messageReactionUser => (
- <div key={messageReactionUser.id} className={css.userRowContainer}>
- <div>{messageReactionUser.username}</div>
- <div>{messageReactionUser.reaction}</div>
- </div>
- )),
+ messageReactionsList.map(messageReactionUser => {
+ const avatarInfo = getAvatarForUser(messageReactionUser);
+
+ return (
+ <div key={messageReactionUser.id} className={css.userRowContainer}>
+ <div className={css.userInfoContainer}>
+ <Avatar size="small" avatarInfo={avatarInfo} />
+ <div className={css.username}>{messageReactionUser.username}</div>
+ </div>
+ <div>{messageReactionUser.reaction}</div>
+ </div>
+ );
+ }),
[messageReactionsList],
);

File Metadata

Mime Type
text/plain
Expires
Tue, Dec 24, 8:42 AM (16 h, 47 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2699284
Default Alt Text
D7196.id24205.diff (1 KB)

Event Timeline