Page MenuHomePhabricator
Files F3756771

D9477.id31983.diff
No OneTemporary
Actions

D9477.id31983.diff
View Options

diff --git a/web/settings/relationship/block-list-row.react.js b/web/settings/relationship/block-list-row.react.js
--- a/web/settings/relationship/block-list-row.react.js
+++ b/web/settings/relationship/block-list-row.react.js
@@ -10,14 +10,17 @@
import UserAvatar from '../../avatars/user-avatar.react.js';
import MenuItem from '../../components/menu-item.react.js';
import Menu from '../../components/menu.react.js';
+import { usePushUserProfileModal } from '../../modals/user-profile/user-profile-utils.js';
function BlockListRow(props: UserRowProps): React.Node {
const { userInfo, onMenuVisibilityChange } = props;
const { unblockUser } = useRelationshipCallbacks(userInfo.id);
const editIcon = <SWMansionIcon icon="edit-1" size={22} />;
+ const pushUserProfileModal = usePushUserProfileModal(userInfo.id);
+
return (
- <div className={css.container}>
+ <div className={css.container} onClick={pushUserProfileModal}>
<div className={css.userInfoContainer}>
<UserAvatar size="S" userID={userInfo.id} />
<div className={css.usernameContainer}>{userInfo.username}</div>
diff --git a/web/settings/relationship/friend-list-row.react.js b/web/settings/relationship/friend-list-row.react.js
--- a/web/settings/relationship/friend-list-row.react.js
+++ b/web/settings/relationship/friend-list-row.react.js
@@ -12,6 +12,7 @@
import Button from '../../components/button.react.js';
import MenuItem from '../../components/menu-item.react.js';
import Menu from '../../components/menu.react.js';
+import { usePushUserProfileModal } from '../../modals/user-profile/user-profile-utils.js';
const dangerButtonColor = {
color: 'var(--btn-bg-danger)',
@@ -21,6 +22,23 @@
const { userInfo, onMenuVisibilityChange } = props;
const { friendUser, unfriendUser } = useRelationshipCallbacks(userInfo.id);
+
+ const friendUserCallback = React.useCallback(
+ (event: SyntheticEvent<HTMLElement>) => {
+ event.stopPropagation();
+ friendUser();
+ },
+ [friendUser],
+ );
+
+ const unfriendUserCallback = React.useCallback(
+ (event: SyntheticEvent<HTMLElement>) => {
+ event.stopPropagation();
+ unfriendUser();
+ },
+ [unfriendUser],
+ );
+
const buttons = React.useMemo(() => {
if (userInfo.relationshipStatus === userRelationshipStatus.REQUEST_SENT) {
return (
@@ -28,7 +46,7 @@
variant="text"
className={css.button}
buttonColor={dangerButtonColor}
- onClick={unfriendUser}
+ onClick={unfriendUserCallback}
>
Cancel request
</Button>
@@ -39,14 +57,18 @@
) {
return (
<>
- <Button variant="text" className={css.button} onClick={friendUser}>
+ <Button
+ variant="text"
+ className={css.button}
+ onClick={friendUserCallback}
+ >
Accept
</Button>
<Button
variant="text"
className={css.button}
buttonColor={dangerButtonColor}
- onClick={unfriendUser}
+ onClick={unfriendUserCallback}
>
Reject
</Button>
@@ -73,14 +95,17 @@
}
return undefined;
}, [
- friendUser,
- unfriendUser,
userInfo.relationshipStatus,
+ unfriendUserCallback,
+ friendUserCallback,
onMenuVisibilityChange,
+ unfriendUser,
]);
+ const pushUserProfileModal = usePushUserProfileModal(userInfo.id);
+
return (
- <div className={css.container}>
+ <div className={css.container} onClick={pushUserProfileModal}>
<div className={css.userInfoContainer}>
<UserAvatar size="S" userID={userInfo.id} />
<div className={css.usernameContainer}>{userInfo.username}</div>
diff --git a/web/settings/relationship/user-list-row.css b/web/settings/relationship/user-list-row.css
--- a/web/settings/relationship/user-list-row.css
+++ b/web/settings/relationship/user-list-row.css
@@ -7,6 +7,12 @@
line-height: var(--line-height-display);
}
+.container:hover {
+ cursor: pointer;
+ background-color: var(--inline-engagement-bg-hover);
+ border-radius: 8px;
+}
+
.usernameContainer {
white-space: nowrap;
text-overflow: ellipsis;
@@ -27,6 +33,10 @@
color: var(--btn-bg-filled);
}
+.button:hover {
+ text-decoration: underline;
+}
+
.edit_menu {
position: relative;
}

File Metadata

Mime Type
text/plain
Expires
Sat, Jan 11, 5:54 AM (20 h, 14 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2860719
Default Alt Text
D9477.id31983.diff (4 KB)

Event Timeline