fix(dashboard): name the person in the share rows' accessible labels

Every grant row's mode select announced as bare 'Access level' and
every revoke button as 'Remove access', so a screen reader user
tabbing the list could not tell whose grant a control changes. Carry
the holder in the aria-label ('Access level for alice' / 'Remove
access for alice'); the visible UI and the revoke tooltip stay as
they were. i18n() encodes the interpolated string as a whole, quotes
included, so the labels stay attribute-safe for any holder name.
This commit is contained in:
Nariman Jelveh
2026-08-17 22:19:49 -07:00
parent cd8e71d313
commit 369d3e5231
2 changed files with 7 additions and 2 deletions
+5 -2
View File
@@ -227,8 +227,11 @@ export default function UIShareModal ({ path: item_path, name, owner, fsentry, $
rows += '<div class="share-modal-row">';
rows += avatar_html(share.holder ?? '');
rows += `<span class="share-modal-row-who"><span class="share-modal-row-name enable-user-select">${holder}${you_suffix}</span></span>`;
rows += `<select class="share-modal-row-mode" data-holder="${holder}" aria-label="${i18n('share_access_level')}">${options_for(share.mode)}</select>`;
rows += `<button type="button" class="share-modal-revoke" data-holder="${holder}" title="${i18n('share_remove_access')}" aria-label="${i18n('share_remove_access')}">${icons.trash}</button>`;
// The accessible names carry the holder: a list where every row
// reads as bare "Access level" / "Remove access" leaves a screen
// reader user unable to tell whose grant a control changes.
rows += `<select class="share-modal-row-mode" data-holder="${holder}" aria-label="${i18n('share_access_level_for', { recipient: share.holder ?? '' })}">${options_for(share.mode)}</select>`;
rows += `<button type="button" class="share-modal-revoke" data-holder="${holder}" title="${i18n('share_remove_access')}" aria-label="${i18n('share_remove_access_for', { recipient: share.holder ?? '' })}">${icons.trash}</button>`;
rows += '</div>';
}
if ( !shares.length ) {
+2
View File
@@ -381,11 +381,13 @@ const en = {
share_access_write: 'Can edit',
share_access_manage: 'Can edit & share',
share_access_level: 'Access level',
share_access_level_for: 'Access level for {{recipient}}',
share_add_people: 'Add people by email or username',
share_who_has_access: 'Who has access',
share_no_one: 'Not shared with anyone yet.',
share_owner: 'Owner',
share_remove_access: 'Remove access',
share_remove_access_for: 'Remove access for {{recipient}}',
share_remove_from_shared: 'Remove from Shared',
share_nothing_shared: 'Nothing has been shared with you yet.',
share_done: 'Done',