diff --git a/web/modals/components/add-members-item.react.js b/web/modals/components/add-members-item.react.js
--- a/web/modals/components/add-members-item.react.js
+++ b/web/modals/components/add-members-item.react.js
@@ -6,6 +6,7 @@
import css from './add-members.css';
import Button from '../../components/button.react.js';
+import UserAvatar from '../../components/user-avatar.react.js';
type AddMembersItemProps = {
+userInfo: UserListItem,
@@ -42,7 +43,10 @@
onClick={onClickCallback}
disabled={!canBeAdded}
>
-
{userInfo.username}
+
+
+
{userInfo.username}
+
{action}
);
diff --git a/web/modals/components/add-members.css b/web/modals/components/add-members.css
--- a/web/modals/components/add-members.css
+++ b/web/modals/components/add-members.css
@@ -34,3 +34,14 @@
button.addMemberItem:hover .danger {
color: var(--add-members-remove-pending-color-hover);
}
+
+div.userInfoContainer {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ padding-left: 16px;
+}
+
+div.username {
+ margin-left: 8px;
+}
diff --git a/web/modals/threads/members/member.react.js b/web/modals/threads/members/member.react.js
--- a/web/modals/threads/members/member.react.js
+++ b/web/modals/threads/members/member.react.js
@@ -30,6 +30,7 @@
import Label from '../../../components/label.react.js';
import MenuItem from '../../../components/menu-item.react.js';
import Menu from '../../../components/menu.react.js';
+import UserAvatar from '../../../components/user-avatar.react.js';
type Props = {
+memberInfo: RelativeMemberInfo,
@@ -148,7 +149,9 @@
return (
- {userName} {label}
+
+ {userName}
+ {label}