mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

UI Improvements to the edit history modal

Browse source
This commit is contained in:
Josh Perez 2023-06-30 10:11:27 -04:00 committed by GitHub
parent c96565c4c9
commit 2e7cdfdb70
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
stylesheets/components/EditHistoryMessagesModal.scss
View file

@ -3,6 +3,7 @@
.EditHistoryMessagesModal { .EditHistoryMessagesModal {
&__divider { &__divider {
border-bottom: 0;
border-style: solid; border-style: solid;
margin-block: 24px; margin-block: 24px;

12
ts/components/EditHistoryMessagesModal.tsx
View file

@ -60,7 +60,7 @@ const MESSAGE_DEFAULT_PROPS = {
shouldHideMetadata: false, shouldHideMetadata: false,
showContactModal: shouldNeverBeCalled, showContactModal: shouldNeverBeCalled,
showConversation: noop, showConversation: noop,
showEditHistoryModal: shouldNeverBeCalled, showEditHistoryModal: noop,
showExpiredIncomingTapToViewToast: shouldNeverBeCalled, showExpiredIncomingTapToViewToast: shouldNeverBeCalled,
showExpiredOutgoingTapToViewToast: shouldNeverBeCalled, showExpiredOutgoingTapToViewToast: shouldNeverBeCalled,
showLightboxForViewOnceMedia: shouldNeverBeCalled, showLightboxForViewOnceMedia: shouldNeverBeCalled,
@ -100,6 +100,8 @@ export function EditHistoryMessagesModal({
const [currentMessage, ...pastEdits] = editHistoryMessages; const [currentMessage, ...pastEdits] = editHistoryMessages;
const currentMessageId = `${currentMessage.id}.${currentMessage.timestamp}`; const currentMessageId = `${currentMessage.id}.${currentMessage.timestamp}`;
let previousItem = currentMessage;
return ( return (
<Modal <Modal
hasXButton hasXButton
@ -110,6 +112,7 @@ export function EditHistoryMessagesModal({
noTransform noTransform
> >
<div ref={containerElementRef}> <div ref={containerElementRef}>
<TimelineDateHeader i18n={i18n} timestamp={currentMessage.timestamp} />
<Message <Message
{...MESSAGE_DEFAULT_PROPS} {...MESSAGE_DEFAULT_PROPS}
{...currentMessage} {...currentMessage}
@ -118,6 +121,7 @@ export function EditHistoryMessagesModal({
displayLimit={displayLimitById[currentMessageId]} displayLimit={displayLimitById[currentMessageId]}
getPreferredBadge={getPreferredBadge} getPreferredBadge={getPreferredBadge}
i18n={i18n} i18n={i18n}
isEditedMessage
isSpoilerExpanded={revealedSpoilersById[currentMessageId] || {}} isSpoilerExpanded={revealedSpoilersById[currentMessageId] || {}}
key={currentMessage.timestamp} key={currentMessage.timestamp}
kickOffAttachmentDownload={kickOffAttachmentDownload} kickOffAttachmentDownload={kickOffAttachmentDownload}
@ -146,11 +150,9 @@ export function EditHistoryMessagesModal({
{i18n('icu:EditHistoryMessagesModal__title')} {i18n('icu:EditHistoryMessagesModal__title')}
</h3> </h3>
{pastEdits.map((messageAttributes, index) => { {pastEdits.map(messageAttributes => {
const syntheticId = `${messageAttributes.id}.${messageAttributes.timestamp}`; const syntheticId = `${messageAttributes.id}.${messageAttributes.timestamp}`;
const previousItem = pastEdits[index - 1];
const shouldShowDateHeader = Boolean( const shouldShowDateHeader = Boolean(
!previousItem || !previousItem ||
// This comparison avoids strange header behavior for out-of-order messages. // This comparison avoids strange header behavior for out-of-order messages.
@ -164,6 +166,8 @@ export function EditHistoryMessagesModal({
/> />
) : null; ) : null;
previousItem = messageAttributes;
return ( return (
<React.Fragment key={messageAttributes.timestamp}> <React.Fragment key={messageAttributes.timestamp}>
{dateHeaderElement} {dateHeaderElement}