diff --git a/CHANGELOG.md b/CHANGELOG.md index a0c159e936..a055168440 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,8 @@ ### Added ### Changed +- do not display email adresses in reactions dialog #4066 +- click on a row in reactions dialog opens contact profile #4066 - Update `@deltachat/stdio-rpc-server` and `deltachat/jsonrpc-client` to `1.142.12` - Display `Config::MdnsEnabled` as true by default. diff --git a/src/renderer/components/ContactName/index.tsx b/src/renderer/components/ContactName/index.tsx index 6392a17a8e..aa7d7dcbc8 100644 --- a/src/renderer/components/ContactName/index.tsx +++ b/src/renderer/components/ContactName/index.tsx @@ -6,7 +6,7 @@ import styles from './styles.module.scss' type Props = { displayName: string - address: string + address?: string isVerified?: boolean } @@ -17,7 +17,9 @@ export default function ContactName(props: Props) { {props.displayName} {props.isVerified && } -
{props.address}
+ {!!props.address && ( +
{props.address}
+ )} ) } diff --git a/src/renderer/components/dialogs/ReactionsDialog/index.tsx b/src/renderer/components/dialogs/ReactionsDialog/index.tsx index 708f5159c9..93b9741dff 100644 --- a/src/renderer/components/dialogs/ReactionsDialog/index.tsx +++ b/src/renderer/components/dialogs/ReactionsDialog/index.tsx @@ -1,4 +1,5 @@ import React, { useEffect, useState } from 'react' +import classNames from 'classnames' import Dialog, { DialogBody, @@ -19,8 +20,11 @@ import styles from './styles.module.scss' import type { DialogProps } from '../../../contexts/DialogContext' import type { T } from '@deltachat/jsonrpc-client' +import useOpenViewProfileDialog from '../../../hooks/dialog/useOpenViewProfileDialog' + export type Props = { reactionsByContact: T.Reactions['reactionsByContact'] + onClose?: () => void } type ContactWithReaction = T.Contact & { @@ -38,7 +42,10 @@ export default function ReactionsDialog({ - + @@ -50,9 +57,10 @@ export default function ReactionsDialog({ ) } -function ReactionsDialogList({ reactionsByContact }: Props) { +function ReactionsDialogList({ reactionsByContact, onClose }: Props) { const accountId = selectedAccountId() const [contacts, setContacts] = useState([]) + const openViewProfileDialog = useOpenViewProfileDialog({ onAction: onClose }) useEffect(() => { const resolveContacts = async () => { @@ -84,16 +92,25 @@ function ReactionsDialogList({ reactionsByContact }: Props) { return (
    {contacts.map(contact => { + const notFromSelf = accountId !== contact.id return ( -
  • +
  • { + if (notFromSelf) { + openViewProfileDialog(accountId, contact.id) + } + }} + role='button' + >
    - +
    {contact.emoji}
  • diff --git a/src/renderer/components/dialogs/ReactionsDialog/styles.module.scss b/src/renderer/components/dialogs/ReactionsDialog/styles.module.scss index 006d734d93..748d019798 100644 --- a/src/renderer/components/dialogs/ReactionsDialog/styles.module.scss +++ b/src/renderer/components/dialogs/ReactionsDialog/styles.module.scss @@ -6,6 +6,14 @@ align-items: center; display: flex; justify-content: space-between; + border-radius: 10px; +} + +.reactionsDialogListClickable { + cursor: pointer; + &:hover { + background-color: var(--chatListItemBgHover); + } } .reactionsDialogAvatar { diff --git a/src/renderer/components/dialogs/ViewProfile/index.tsx b/src/renderer/components/dialogs/ViewProfile/index.tsx index a72568ad1e..cde23cc4cc 100644 --- a/src/renderer/components/dialogs/ViewProfile/index.tsx +++ b/src/renderer/components/dialogs/ViewProfile/index.tsx @@ -62,9 +62,10 @@ export default function ViewProfile( props: { contact: T.Contact onBack?: () => void + onAction?: () => void } & DialogProps ) { - const { onClose, onBack } = props + const { onClose, onBack, onAction } = props const accountId = selectedAccountId() const tx = useTranslationFunction() @@ -110,7 +111,11 @@ export default function ViewProfile( onClickBack={onBack} /> - + ) @@ -119,9 +124,11 @@ export default function ViewProfile( export function ViewProfileInner({ contact, onClose, + onAction, }: { contact: T.Contact onClose: () => void + onAction?: () => void }) { const accountId = selectedAccountId() const tx = useTranslationFunction() @@ -142,6 +149,7 @@ export function ViewProfileInner({ const onChatClick = (chatId: number) => { selectChat(accountId, chatId) + onAction && onAction() onClose() } const onSendMessage = async () => { diff --git a/src/renderer/hooks/dialog/useOpenViewProfileDialog.ts b/src/renderer/hooks/dialog/useOpenViewProfileDialog.ts index b7799e2624..be7dccc155 100644 --- a/src/renderer/hooks/dialog/useOpenViewProfileDialog.ts +++ b/src/renderer/hooks/dialog/useOpenViewProfileDialog.ts @@ -4,14 +4,16 @@ import ViewProfile from '../../components/dialogs/ViewProfile' import useDialog from './useDialog' import { BackendRemote } from '../../backend-com' -export default function useOpenViewProfileDialog() { +export default function useOpenViewProfileDialog(props?: { + onAction?: () => void +}) { const { openDialog } = useDialog() return useCallback( async (accountId: number, contactId: number) => { const contact = await BackendRemote.rpc.getContact(accountId, contactId) - openDialog(ViewProfile, { contact }) + openDialog(ViewProfile, { contact, onAction: props?.onAction }) }, - [openDialog] + [openDialog, props?.onAction] ) }