From 55313deb91eacae5505e7b3bf9dd256814454cd8 Mon Sep 17 00:00:00 2001 From: Audric Ackermann Date: Wed, 20 Oct 2021 15:54:03 +1100 Subject: [PATCH] add a show user details option in the menu Fixes #1971 --- _locales/en/messages.json | 1 + ts/components/ConversationListItem.tsx | 3 ++ .../conversation/ConversationHeader.tsx | 3 ++ ts/components/dialog/UserDetailsDialog.tsx | 2 ++ .../session/menu/ConversationHeaderMenu.tsx | 10 +++++- .../menu/ConversationListItemContextMenu.tsx | 10 ++++++ ts/components/session/menu/Menu.tsx | 35 ++++++++++++++++++- 7 files changed, 62 insertions(+), 2 deletions(-) diff --git a/_locales/en/messages.json b/_locales/en/messages.json index f3500b1b6..3ce676fbb 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -422,6 +422,7 @@ "unpinConversation": "Unpin Conversation", "pinConversationLimitTitle": "Pinned conversations limit", "pinConversationLimitToastDescription": "You can only pin $number$ conversations", + "showUserDetails": "Show User Details", "latestUnreadIsAbove": "First unread message is above", "sendRecoveryPhraseTitle": "Sending Recovery Phrase", "sendRecoveryPhraseMessage": "You are attempting to send your recovery phrase which can be used to access your account. Are you sure you want to send this message?", diff --git a/ts/components/ConversationListItem.tsx b/ts/components/ConversationListItem.tsx index ec667eb4f..e94606cef 100644 --- a/ts/components/ConversationListItem.tsx +++ b/ts/components/ConversationListItem.tsx @@ -356,6 +356,9 @@ const ConversationListItem = (props: Props) => { left={!!left} type={type} currentNotificationSetting={currentNotificationSetting || 'all'} + avatarPath={avatarPath || null} + name={name} + profileName={profileName} /> diff --git a/ts/components/conversation/ConversationHeader.tsx b/ts/components/conversation/ConversationHeader.tsx index f321a6a6a..d8ec8287e 100644 --- a/ts/components/conversation/ConversationHeader.tsx +++ b/ts/components/conversation/ConversationHeader.tsx @@ -360,6 +360,9 @@ export const ConversationHeaderWithDetails = () => { left={left} hasNickname={hasNickname} currentNotificationSetting={currentNotificationSetting} + avatarPath={avatarPath} + name={name} + profileName={profileName} /> diff --git a/ts/components/dialog/UserDetailsDialog.tsx b/ts/components/dialog/UserDetailsDialog.tsx index 10166436c..64622765f 100644 --- a/ts/components/dialog/UserDetailsDialog.tsx +++ b/ts/components/dialog/UserDetailsDialog.tsx @@ -6,6 +6,7 @@ import useCopyToClipboard from 'react-use/lib/useCopyToClipboard'; import useKey from 'react-use/lib/useKey'; import { ConversationTypeEnum } from '../../models/conversation'; import { getConversationController } from '../../session/conversations'; +import { ToastUtils } from '../../session/utils'; import { openConversationWithMessages } from '../../state/ducks/conversations'; import { updateUserDetailsModal } from '../../state/ducks/modalDialog'; import { Avatar, AvatarSize } from '../Avatar'; @@ -77,6 +78,7 @@ export const UserDetailsDialog = (props: Props) => { buttonColor={SessionButtonColor.Primary} onClick={() => { copyToClipboard(props.conversationId); + ToastUtils.pushCopiedToClipBoard(); }} /> { @@ -50,7 +54,11 @@ const ConversationHeaderMenu = (props: PropsConversationHeaderMenu) => { left, hasNickname, currentNotificationSetting, + name, + profileName, + avatarPath, } = props; + const userName = name || profileName || conversationId; return ( @@ -75,9 +83,9 @@ const ConversationHeaderMenu = (props: PropsConversationHeaderMenu) => { {getRemoveModeratorsMenuItem(weAreAdmin, isPublic, isKickedFromGroup, conversationId)} {getUpdateGroupNameMenuItem(weAreAdmin, isKickedFromGroup, left, conversationId)} {getLeaveGroupMenuItem(isKickedFromGroup, left, isGroup, isPublic, conversationId)} - {/* TODO: add delete group */} {getInviteContactMenuItem(isGroup, isPublic, conversationId)} {getDeleteContactMenuItem(isGroup, isPublic, left, isKickedFromGroup, conversationId)} + {getShowUserDetailsMenuItem(isPrivate, conversationId, avatarPath, userName)} ); }; diff --git a/ts/components/session/menu/ConversationListItemContextMenu.tsx b/ts/components/session/menu/ConversationListItemContextMenu.tsx index 0cf88923c..0dc4d65bd 100644 --- a/ts/components/session/menu/ConversationListItemContextMenu.tsx +++ b/ts/components/session/menu/ConversationListItemContextMenu.tsx @@ -18,6 +18,7 @@ import { getMarkAllReadMenuItem, getNotificationForConvoMenuItem, getPinConversationMenuItem, + getShowUserDetailsMenuItem, } from './Menu'; export type PropsContextConversationItem = { @@ -33,6 +34,9 @@ export type PropsContextConversationItem = { left: boolean; theme?: any; currentNotificationSetting: ConversationNotificationSettingType; + name: string | undefined; + profileName: string | undefined; + avatarPath: string | null; }; const ConversationListItemContextMenu = (props: PropsContextConversationItem) => { @@ -48,9 +52,14 @@ const ConversationListItemContextMenu = (props: PropsContextConversationItem) => isKickedFromGroup, currentNotificationSetting, isPrivate, + name, + profileName, + avatarPath, } = props; const isGroup = type === 'group'; + const userName = name || profileName || conversationId; + return ( {getNotificationForConvoMenuItem({ @@ -71,6 +80,7 @@ const ConversationListItemContextMenu = (props: PropsContextConversationItem) => {getInviteContactMenuItem(isGroup, isPublic, conversationId)} {getDeleteContactMenuItem(isGroup, isPublic, left, isKickedFromGroup, conversationId)} {getLeaveGroupMenuItem(isKickedFromGroup, left, isGroup, isPublic, conversationId)} + {getShowUserDetailsMenuItem(isPrivate, conversationId, avatarPath, userName)} ); }; diff --git a/ts/components/session/menu/Menu.tsx b/ts/components/session/menu/Menu.tsx index a781c8355..f747e8e06 100644 --- a/ts/components/session/menu/Menu.tsx +++ b/ts/components/session/menu/Menu.tsx @@ -12,7 +12,11 @@ import { ConversationNotificationSettingType, } from '../../../models/conversation'; import { useDispatch, useSelector } from 'react-redux'; -import { changeNickNameModal, updateConfirmModal } from '../../../state/ducks/modalDialog'; +import { + changeNickNameModal, + updateConfirmModal, + updateUserDetailsModal, +} from '../../../state/ducks/modalDialog'; import { SectionType } from '../../../state/ducks/section'; import { getConversationController } from '../../../session/conversations'; import { @@ -241,6 +245,35 @@ export function getLeaveGroupMenuItem( return null; } +export function getShowUserDetailsMenuItem( + isPrivate: boolean | undefined, + conversationId: string, + avatarPath: string | null, + userName: string +): JSX.Element | null { + const dispatch = useDispatch(); + + if (isPrivate) { + return ( + { + dispatch( + updateUserDetailsModal({ + conversationId: conversationId, + userName, + authorAvatarPath: avatarPath, + }) + ); + }} + > + {window.i18n('showUserDetails')} + + ); + } + + return null; +} + export function getUpdateGroupNameMenuItem( isAdmin: boolean | undefined, isKickedFromGroup: boolean | undefined,