Improve accessibility of the room summary card (#12586)

* Improve accessibility of the room summary card

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update @vector-im/compound-web to 4.5.0

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix bad merge

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2024-06-17 09:27:15 +01:00 committed by GitHub
parent 5212ae8747
commit 5a1b98d8b7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 898 additions and 872 deletions

View file

@ -522,57 +522,68 @@ const RoomSummaryCard: React.FC<IProps> = ({ room, permalinkCreator, onClose, on
<Separator />
<ToggleMenuItem
Icon={FavouriteIcon}
label={_t("room|context_menu|favourite")}
checked={isFavorite}
onChange={() => tagRoom(room, DefaultTagID.Favourite)}
// XXX: https://github.com/element-hq/compound/issues/288
onSelect={() => {}}
/>
<MenuItem
Icon={UserAddIcon}
label={_t("action|invite")}
disabled={!canInviteToState}
onSelect={() => inviteToRoom(room)}
/>
<MenuItem Icon={LinkIcon} label={_t("action|copy_link")} onSelect={onShareRoomClick} />
<MenuItem Icon={SettingsIcon} label={_t("common|settings")} onSelect={onRoomSettingsClick} />
<div role="menubar" aria-orientation="vertical">
<ToggleMenuItem
Icon={FavouriteIcon}
label={_t("room|context_menu|favourite")}
checked={isFavorite}
onChange={() => tagRoom(room, DefaultTagID.Favourite)}
// XXX: https://github.com/element-hq/compound/issues/288
onSelect={() => {}}
/>
<MenuItem
Icon={UserAddIcon}
label={_t("action|invite")}
disabled={!canInviteToState}
onSelect={() => inviteToRoom(room)}
/>
<MenuItem Icon={LinkIcon} label={_t("action|copy_link")} onSelect={onShareRoomClick} />
<MenuItem Icon={SettingsIcon} label={_t("common|settings")} onSelect={onRoomSettingsClick} />
<Separator />
<MenuItem
// this icon matches the legacy implementation
// and is a short term solution until legacy room header is removed
Icon={UserProfileSolidIcon}
label={_t("common|people")}
onSelect={onRoomMembersClick}
/>
{!isVideoRoom && (
<>
<MenuItem Icon={FilesIcon} label={_t("right_panel|files_button")} onSelect={onRoomFilesClick} />
<MenuItem
Icon={PollsIcon}
label={_t("right_panel|polls_button")}
onSelect={onRoomPollHistoryClick}
/>
{pinningEnabled && (
<Separator />
<MenuItem
// this icon matches the legacy implementation
// and is a short term solution until legacy room header is removed
Icon={UserProfileSolidIcon}
label={_t("common|people")}
onSelect={onRoomMembersClick}
/>
{!isVideoRoom && (
<>
<MenuItem Icon={FilesIcon} label={_t("right_panel|files_button")} onSelect={onRoomFilesClick} />
<MenuItem
Icon={PinIcon}
label={_t("right_panel|pinned_messages_button")}
onSelect={onRoomPinsClick}
>
<Text as="span" size="sm">
{pinCount}
</Text>
</MenuItem>
)}
<MenuItem Icon={ExportArchiveIcon} label={_t("export_chat|title")} onSelect={onRoomExportClick} />
</>
)}
Icon={PollsIcon}
label={_t("right_panel|polls_button")}
onSelect={onRoomPollHistoryClick}
/>
{pinningEnabled && (
<MenuItem
Icon={PinIcon}
label={_t("right_panel|pinned_messages_button")}
onSelect={onRoomPinsClick}
>
<Text as="span" size="sm">
{pinCount}
</Text>
</MenuItem>
)}
<MenuItem
Icon={ExportArchiveIcon}
label={_t("export_chat|title")}
onSelect={onRoomExportClick}
/>
</>
)}
<Separator />
<Separator />
<MenuItem Icon={LeaveIcon} kind="critical" label={_t("action|leave_room")} onSelect={onLeaveRoomClick} />
<MenuItem
Icon={LeaveIcon}
kind="critical"
label={_t("action|leave_room")}
onSelect={onLeaveRoomClick}
/>
</div>
{SettingsStore.getValue(UIFeature.Widgets) &&
!isVideoRoom &&