Accessibility: Fix aria descriptions and labels

[samuelwei]

Fixes #2315

Type

• Bugfix
• Feature
• Documentation
• Refactoring (e.g. Style updates, Test implementation, etc.)
• Other (please describe): Accessibility

Checklist

• Code updated to current develop branch head
• Passes CI checks
• Is a part of an issue
• Tests added for the bugfix or newly implemented feature, describe below why if not
• Changelog is updated
• Documentation of code and features exists

Changes

• Accessibility: Removed unused aria-describedby
• Accessibility: Fixed aria-describedby in Admin UI
• Accessibility: Add aria-labels to filter and sort select elements in room tabs

Other information

VueMultiselect <Multiselect/> is still not accessible and cannot be fixed easily

Summary by CodeRabbit

• New Features

  • Added localized labels for filtering and sorting controls across room lists and related admin screens.
  • Introduced clearer sort options, including ascending and descending states.

• Bug Fixes

  • Improved screen reader support by adding or correcting accessibility labels and hidden decorative elements.
  • Cleaned up a few form fields so help text and descriptions are announced more reliably.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: c1fed205-3043-4f21-bc0c-f6b79abd90ee

📥 Commits

Reviewing files that changed from the base of the PR and between 45e729f and 95d50b5.

📒 Files selected for processing (14)

• lang/en/app.php
• lang/en/rooms.php
• resources/js/components/LoginTabLocal.vue
• resources/js/components/RoomTabFiles.vue
• resources/js/components/RoomTabHistory.vue
• resources/js/components/RoomTabMembers.vue
• resources/js/components/RoomTabPersonalizedLinks.vue
• resources/js/components/RoomTabRecordings.vue
• resources/js/components/SettingsRoomTypesDeleteButton.vue
• resources/js/views/AdminRoomTypesView.vue
• resources/js/views/AdminServersView.vue
• resources/js/views/AdminSettings.vue
• resources/js/views/AdminUsersNew.vue
• resources/js/views/RoomsIndex.vue

💤 Files with no reviewable changes (1)

• resources/js/components/LoginTabLocal.vue

---

Walkthrough

Adds new translation keys for filter and sort UI labels, and updates ARIA attributes (aria-hidden, aria-label, aria-describedby, aria-labelledby) across multiple Vue components to improve accessibility of filter/sort controls, form fields, and toggle switches.

Changes

Accessibility ARIA fixes

Layer / File(s)	Summary
New translation keys lang/en/app.php, lang/en/rooms.php	Adds filter, sort_by, sort_ascending, sort_descending, and index.filter.filter_by_room_type translation strings.
Room tab filter/sort labels resources/js/components/RoomTabFiles.vue, RoomTabHistory.vue, RoomTabMembers.vue, RoomTabPersonalizedLinks.vue, RoomTabRecordings.vue	Adds aria-hidden="true" to InputGroupAddon icons and dynamic/localized aria-label bindings to filter/sort Select and toggle Button elements.
Rooms index filter/sort labels resources/js/views/RoomsIndex.vue	Adds aria-hidden="true" and aria-label bindings to room-type filter and sorting dropdowns.
Login form cleanup resources/js/components/LoginTabLocal.vue	Removes unused aria-describedby attributes and the related help-block id from email and password fields.
Admin settings aria wiring resources/js/components/SettingsRoomTypesDeleteButton.vue, resources/js/views/AdminRoomTypesView.vue, AdminServersView.vue, AdminSettings.vue, AdminUsersNew.vue	Rewires aria-describedby via :pt configuration or fieldset attributes, and adds aria-labelledby for a replacement Select field.

Estimated code review effort: 2 (Simple) | ~15 minutes

Possibly related PRs

• THM-Health/PILOS#1988: Both PRs touch the room type filter UI on resources/js/views/RoomsIndex.vue, one adding ARIA/i18n attributes while the other changed select option/default behavior.

Suggested labels: frontend, UI

Suggested reviewers: Sabr1n4W

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title is concise and accurately summarizes the accessibility ARIA description and label updates.
Description check	✅ Passed	The description follows the template and includes the issue link, type, changes, and notes, with only checklist items left unfilled.
Linked Issues check	✅ Passed	The PR addresses #2315 by reviewing and fixing aria-describedby usage across components and views, matching the issue goal.
Out of Scope Changes check	✅ Passed	The added aria-label and translation updates are directly tied to the accessibility fix, with no clear unrelated changes.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch 2315-improve-a11y

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 97.10%. Comparing base (45e729f) to head (95d50b5).

Additional details and impacted files

@@              Coverage Diff              @@
##             develop    #3298      +/-   ##
=============================================
- Coverage      97.11%   97.10%   -0.02%     
  Complexity      1948     1948              
=============================================
  Files            483      483              
  Lines          16654    16663       +9     
  Branches        2408     2417       +9     
=============================================
+ Hits           16174    16181       +7     
- Misses           480      482       +2     

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

[cypress]

PILOS    Run #3164

Run Properties:   Passed #3164  •  95d50b5fd3: Accessibility: Fix aria descriptions and labels

Project	PILOS
Branch Review	2315-improve-a11y
Run status	Passed #3164
Run duration	07m 55s
Commit	95d50b5fd3: Accessibility: Fix aria descriptions and labels
Committer	Samuel Weirich
View all properties for this run ↗︎

---

Test results
Failures	0
Flaky	0
Pending	0
Skipped	0
Passing	635
View all changes introduced in this branch ↗︎