Refactor PollResultsDialog

This commit is contained in:
Tim Vahlbrock 2024-11-01 00:41:59 +01:00
parent a5fdd41b03
commit baabfbcfb9
No known key found for this signature in database

View file

@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
Please see LICENSE files in the repository root for full details. Please see LICENSE files in the repository root for full details.
*/ */
import { PollStartEvent } from "matrix-js-sdk/src/extensible_events_v1/PollStartEvent"; import { PollAnswerSubevent, PollStartEvent } from "matrix-js-sdk/src/extensible_events_v1/PollStartEvent";
import { RoomMember } from "matrix-js-sdk/src/matrix"; import { RoomMember } from "matrix-js-sdk/src/matrix";
import React from "react"; import React from "react";
@ -28,11 +28,28 @@ export default function PollResultsDialog (props: IProps): JSX.Element {
onFinished={() => Modal.closeCurrentModal()} onFinished={() => Modal.closeCurrentModal()}
> >
{ {
props.pollEvent.answers.map((answer, answerIndex) => { props.pollEvent.answers.map((answer) => {
const votes = props.votes.get(answer.id) || []; const votes = props.votes.get(answer.id) || [];
if(votes.length === 0) return; if(votes.length === 0) return;
return <AnswerEntry
key={answer.id}
answer={answer}
members={props.members}
votes={votes}
/>;
})
}
</BaseDialog>
);
}
function AnswerEntry(props: {
answer: PollAnswerSubevent;
members: RoomMember[];
votes: UserVote[];
}): JSX.Element {
const {answer, members, votes} = props;
return ( return (
<div key={answer.id}> <div key={answer.id}>
<div style={{display: "flex", alignItems: "center", marginBottom: "10px"}}> <div style={{display: "flex", alignItems: "center", marginBottom: "10px"}}>
@ -41,20 +58,19 @@ export default function PollResultsDialog (props: IProps): JSX.Element {
</div> </div>
{votes.length === 0 && <div>No one voted for this.</div>} {votes.length === 0 && <div>No one voted for this.</div>}
{votes.map((vote) => { {votes.map((vote) => {
const member = props.members.find(m => m.userId === vote.sender); const member = members.find(m => m.userId === vote.sender);
if (!member) return null; if(member) return <VoterEntry key={vote.sender} vote={vote} member={member} />;
})}
</div>
);
}
function VoterEntry(props: {vote: UserVote; member: RoomMember}): JSX.Element {
const {vote, member} = props;
return <div key={vote.sender} style={{display: "flex", alignItems: "center", marginLeft: "15px"}}> return <div key={vote.sender} style={{display: "flex", alignItems: "center", marginLeft: "15px"}}>
<div style={{marginRight: "10px"}}> <div style={{marginRight: "10px"}}>
<MemberAvatar member={member} size="36px" aria-hidden="true" /> <MemberAvatar member={member} size="36px" aria-hidden="true" />
</div> </div>
{member.name} {member.name}
</div>; </div>;
})}
{answerIndex < props.pollEvent.answers.length - 1 && <br />}
</div>
);
})
}
</BaseDialog>
);
} }