import classNames from 'classnames';
import moment from 'moment';
import React from 'react';
import { useDispatch, useSelector } from 'react-redux';
import useKey from 'react-use/lib/useKey';
import { Message } from './Message';
import { deleteMessagesById } from '../../../../interactions/conversations/unsendingInteractions';
import {
ContactPropsMessageDetail,
closeMessageDetailsView,
} from '../../../../state/ducks/conversations';
import { getMessageDetailsViewProps } from '../../../../state/selectors/conversations';
import { Avatar, AvatarSize } from '../../../avatar/Avatar';
import { ContactName } from '../../ContactName';
import { useMessageIsDeletable } from '../../../../state/selectors';
import { SessionButton, SessionButtonColor, SessionButtonType } from '../../../basic/SessionButton';
const AvatarItem = (props: { pubkey: string }) => {
const { pubkey } = props;
return ;
};
const DeleteButtonItem = (props: { messageId: string; convoId: string; isDeletable: boolean }) => {
const { i18n } = window;
return props.isDeletable ? (
{
await deleteMessagesById([props.messageId], props.convoId);
}}
/>
) : null;
};
const ContactsItem = (props: { contacts: Array }) => {
const { contacts } = props;
if (!contacts || !contacts.length) {
return null;
}
return (
{contacts.map(contact => (
))}
);
};
const ContactItem = (props: { contact: ContactPropsMessageDetail }) => {
const { contact } = props;
const errors = contact.errors || [];
const statusComponent = (
);
return (
{errors.map((error, index) => (
{error.message}
))}
{statusComponent}
);
};
export const MessageDetail = () => {
const { i18n } = window;
const messageDetailProps = useSelector(getMessageDetailsViewProps);
const isDeletable = useMessageIsDeletable(messageDetailProps?.messageId);
const dispatch = useDispatch();
useKey('Escape', () => {
dispatch(closeMessageDetailsView());
});
if (!messageDetailProps) {
return null;
}
const { errors, receivedAt, sentAt, convoId, direction, messageId } = messageDetailProps;
return (
{(errors || []).map((error, index) => (
{i18n('error')} |
{' '}
{error.message}{' '}
|
))}
{i18n('sent')} |
{moment(sentAt).format('LLLL')} ({sentAt})
|
{receivedAt ? (
{i18n('received')} |
{moment(receivedAt).format('LLLL')} ({receivedAt})
|
) : null}
{direction === 'incoming' ? i18n('from') : i18n('to')}
|
);
};