Skip to content

Commit 901cd66

Browse files
Just-InsaneJust-Insane
committed
fix(polls): wrap poll renderers in Message for proper indentation/avatar alignment
1 parent 908d73b commit 901cd66

1 file changed

Lines changed: 200 additions & 6 deletions

File tree

‎src/app/hooks/timeline/useTimelineEventRenderer.tsx‎

Lines changed: 200 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -691,12 +691,206 @@ export function useTimelineEventRenderer({
691691
</Message>
692692
);
693693
},
694-
[M_POLL_START.name]: (_mEventId, mEvent) => (
695-
<PollContent mEvent={mEvent} room={room} messageLayout={messageLayout} />
696-
),
697-
[M_POLL_START.altName]: (_mEventId, mEvent) => (
698-
<PollContent mEvent={mEvent} room={room} messageLayout={messageLayout} />
699-
),
694+
[M_POLL_START.name]: (mEventId, mEvent, item, timelineSet, collapse) => {
695+
const { replyEventId: rawReplyEventId, threadRootId } = mEvent;
696+
const isThreadRel = isThreadRelationEvent(mEvent, threadRootId);
697+
const actualThreadRootId = isThreadRel ? threadRootId : undefined;
698+
const explicitInReplyTo = mEvent.getWireContent()?.['m.relates_to']?.['m.in_reply_to']
699+
?.event_id as unknown;
700+
const threadReplyTargetId =
701+
isThreadRel && typeof explicitInReplyTo === 'string' ? explicitInReplyTo : undefined;
702+
const replyEventId =
703+
hideThreadChip && mEvent.getWireContent()?.['m.relates_to']?.is_falling_back
704+
? undefined
705+
: (threadReplyTargetId ?? rawReplyEventId);
706+
const reactionRelations = getEventReactions(timelineSet, mEventId);
707+
const reactions = reactionRelations?.getSortedAnnotationsByKey();
708+
const hasReactions = reactions && reactions.length > 0;
709+
const highlighted = focusItem?.index === item && focusItem.highlight;
710+
const senderId = mEvent.getSender() ?? '';
711+
const senderDisplayName =
712+
getMemberDisplayName(room, senderId, nicknames) ?? getMxIdLocalPart(senderId) ?? senderId;
713+
const content = mEvent.getContent() ?? {};
714+
return (
715+
<Message
716+
key={mEventId}
717+
data-message-item={item}
718+
data-message-id={mEventId}
719+
room={room}
720+
mEvent={mEvent}
721+
messageSpacing={messageSpacing}
722+
messageLayout={messageLayout}
723+
highlight={highlighted}
724+
canDelete={canRedact || (canDeleteOwn && senderId === mx.getUserId())}
725+
canSendReaction={canSendReaction}
726+
canPinEvent={canPinEvent}
727+
imagePackRooms={imagePackRooms}
728+
relations={hasReactions ? reactionRelations : undefined}
729+
onUserClick={onUserClick}
730+
onUsernameClick={onUsernameClick}
731+
onReplyClick={onReplyClick}
732+
onReactionToggle={onReactionToggle}
733+
senderId={senderId}
734+
activeReplyId={activeReplyId}
735+
senderDisplayName={senderDisplayName}
736+
sendStatus={mEvent.getAssociatedStatus()}
737+
onResend={onResend}
738+
onDeleteFailedSend={onDeleteFailedSend}
739+
collapse={collapse}
740+
reply={
741+
replyEventId && (
742+
<Reply
743+
room={room}
744+
timelineSet={timelineSet}
745+
replyEventId={replyEventId}
746+
threadRootId={hideThreadChip ? undefined : actualThreadRootId}
747+
mentions={content['m.mentions']}
748+
onClick={handleOpenReply}
749+
/>
750+
)
751+
}
752+
reactions={(() => {
753+
const threadChip =
754+
!hideThreadChip && (room.getThread(mEventId) || threadRootId) ? (
755+
<ThreadReplyChip
756+
room={room}
757+
mEventId={mEventId}
758+
openThreadId={openThreadId}
759+
onToggle={() => setOpenThread(openThreadId === mEventId ? undefined : mEventId)}
760+
/>
761+
) : null;
762+
if (!reactionRelations && !threadChip) return undefined;
763+
return (
764+
<>
765+
{reactionRelations && (
766+
<Reactions
767+
style={{ marginTop: config.space.S200 }}
768+
room={room}
769+
relations={reactionRelations}
770+
mEventId={mEventId}
771+
canSendReaction={canSendReaction}
772+
canDeleteOwn={canDeleteOwn}
773+
onReactionToggle={onReactionToggle}
774+
/>
775+
)}
776+
{threadChip}
777+
</>
778+
);
779+
})()}
780+
hideReadReceipts={hideReads}
781+
showDeveloperTools={showDeveloperTools}
782+
memberPowerTag={getMemberPowerTag(senderId)}
783+
hour24Clock={hour24Clock}
784+
dateFormatString={dateFormatString}
785+
>
786+
{mEvent.isRedacted() ? (
787+
<RedactedContent reason={mEvent.getUnsigned().redacted_because?.content.reason} />
788+
) : (
789+
<PollContent mEvent={mEvent} room={room} messageLayout={messageLayout} />
790+
)}
791+
</Message>
792+
);
793+
},
794+
[M_POLL_START.altName]: (mEventId, mEvent, item, timelineSet, collapse) => {
795+
const { replyEventId: rawReplyEventId, threadRootId } = mEvent;
796+
const isThreadRel = isThreadRelationEvent(mEvent, threadRootId);
797+
const actualThreadRootId = isThreadRel ? threadRootId : undefined;
798+
const explicitInReplyTo = mEvent.getWireContent()?.['m.relates_to']?.['m.in_reply_to']
799+
?.event_id as unknown;
800+
const threadReplyTargetId =
801+
isThreadRel && typeof explicitInReplyTo === 'string' ? explicitInReplyTo : undefined;
802+
const replyEventId =
803+
hideThreadChip && mEvent.getWireContent()?.['m.relates_to']?.is_falling_back
804+
? undefined
805+
: (threadReplyTargetId ?? rawReplyEventId);
806+
const reactionRelations = getEventReactions(timelineSet, mEventId);
807+
const reactions = reactionRelations?.getSortedAnnotationsByKey();
808+
const hasReactions = reactions && reactions.length > 0;
809+
const highlighted = focusItem?.index === item && focusItem.highlight;
810+
const senderId = mEvent.getSender() ?? '';
811+
const senderDisplayName =
812+
getMemberDisplayName(room, senderId, nicknames) ?? getMxIdLocalPart(senderId) ?? senderId;
813+
const content = mEvent.getContent() ?? {};
814+
return (
815+
<Message
816+
key={mEventId}
817+
data-message-item={item}
818+
data-message-id={mEventId}
819+
room={room}
820+
mEvent={mEvent}
821+
messageSpacing={messageSpacing}
822+
messageLayout={messageLayout}
823+
highlight={highlighted}
824+
canDelete={canRedact || (canDeleteOwn && senderId === mx.getUserId())}
825+
canSendReaction={canSendReaction}
826+
canPinEvent={canPinEvent}
827+
imagePackRooms={imagePackRooms}
828+
relations={hasReactions ? reactionRelations : undefined}
829+
onUserClick={onUserClick}
830+
onUsernameClick={onUsernameClick}
831+
onReplyClick={onReplyClick}
832+
onReactionToggle={onReactionToggle}
833+
senderId={senderId}
834+
activeReplyId={activeReplyId}
835+
senderDisplayName={senderDisplayName}
836+
sendStatus={mEvent.getAssociatedStatus()}
837+
onResend={onResend}
838+
onDeleteFailedSend={onDeleteFailedSend}
839+
collapse={collapse}
840+
reply={
841+
replyEventId && (
842+
<Reply
843+
room={room}
844+
timelineSet={timelineSet}
845+
replyEventId={replyEventId}
846+
threadRootId={hideThreadChip ? undefined : actualThreadRootId}
847+
mentions={content['m.mentions']}
848+
onClick={handleOpenReply}
849+
/>
850+
)
851+
}
852+
reactions={(() => {
853+
const threadChip =
854+
!hideThreadChip && (room.getThread(mEventId) || threadRootId) ? (
855+
<ThreadReplyChip
856+
room={room}
857+
mEventId={mEventId}
858+
openThreadId={openThreadId}
859+
onToggle={() => setOpenThread(openThreadId === mEventId ? undefined : mEventId)}
860+
/>
861+
) : null;
862+
if (!reactionRelations && !threadChip) return undefined;
863+
return (
864+
<>
865+
{reactionRelations && (
866+
<Reactions
867+
style={{ marginTop: config.space.S200 }}
868+
room={room}
869+
relations={reactionRelations}
870+
mEventId={mEventId}
871+
canSendReaction={canSendReaction}
872+
canDeleteOwn={canDeleteOwn}
873+
onReactionToggle={onReactionToggle}
874+
/>
875+
)}
876+
{threadChip}
877+
</>
878+
);
879+
})()}
880+
hideReadReceipts={hideReads}
881+
showDeveloperTools={showDeveloperTools}
882+
memberPowerTag={getMemberPowerTag(senderId)}
883+
hour24Clock={hour24Clock}
884+
dateFormatString={dateFormatString}
885+
>
886+
{mEvent.isRedacted() ? (
887+
<RedactedContent reason={mEvent.getUnsigned().redacted_because?.content.reason} />
888+
) : (
889+
<PollContent mEvent={mEvent} room={room} messageLayout={messageLayout} />
890+
)}
891+
</Message>
892+
);
893+
},
700894
[EventType.Sticker]: (mEventId, mEvent, item, timelineSet, collapse) => {
701895
const { replyEventId: rawReplyEventId, threadRootId } = mEvent;
702896
const isThreadRel = isThreadRelationEvent(mEvent, threadRootId);

0 commit comments

Comments
 (0)