Show who reacted in aria-label of reactions

This commit is contained in:
Josh Perez 2023-05-11 15:48:04 -04:00 committed by GitHub
parent 4131234b78
commit 21f5ac30f2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 41 additions and 6 deletions

View file

@ -2107,11 +2107,33 @@ export class Message extends React.PureComponent<Props, State> {
['desc', 'desc']
);
// Take the first three groups for rendering
const toRender = take(ordered, 3).map(res => ({
emoji: res[0].emoji,
count: res.length,
isMe: res.some(re => Boolean(re.from.isMe)),
}));
const toRender = take(ordered, 3).map(res => {
const isMe = res.some(re => Boolean(re.from.isMe));
const count = res.length;
const { emoji } = res[0];
let label: string;
if (isMe) {
label = i18n('icu:Message__reaction-emoji-label--you', { emoji });
} else if (count === 1) {
label = i18n('icu:Message__reaction-emoji-label--single', {
title: res[0].from.title,
emoji,
});
} else {
label = i18n('icu:Message__reaction-emoji-label--many', {
count,
emoji,
});
}
return {
count,
emoji,
isMe,
label,
};
});
const someNotRendered = ordered.length > 3;
// We only drop two here because the third emoji would be replaced by the
// more button
@ -2154,6 +2176,7 @@ export class Message extends React.PureComponent<Props, State> {
return (
<button
aria-label={re.label}
type="button"
// eslint-disable-next-line react/no-array-index-key
key={`${re.emoji}-${i}`}