Skip to content

Insert checkbox column in Facility > Users KTable to allow user selection #13426

@LianaHarris360

Description

@LianaHarris360

This issue is not open for contribution. Visit Contributing guidelines to learn about the contributing process and how to find suitable issues.

Requires #13393

Overview

A dedicated checkbox column should be added in the Facility > Users KTable implementation to enable the selection of individual or all users to support bulk selection and action workflows. The selection logic for this column should closely resemble the current pattern used in UserTable.

Technical Requirements

  • New header
    • Add a header entry in the tableHeaders() computed property for a selection column as the first column.
    • The dataType for this header entry should be “undefined”.
  • Select all users checkbox
    • Render a “Select All” KCheckbox in the header cell that will toggle selection of all of the users shown on the page. Because the list of users is paginated, not every user in the table will be selected, only the ones currently visible.
    • This “Select All” checkbox should have an indeterminate state.
    • The addition of this header should shift all other column indexes by +1.
    • Apply the same visually-hidden styling used in the existing UserPage KTable for the header label of this KCheckbox.
  • Checkboxes row
    • In each cell row, render a KCheckbox in column 0.
    • Set the KCheckbox property showLabel=false. Provide an accessible label combining the user’s full name and, for non-learner roles, their role—matching the Full Name column’s pattern of conditional role labels.
  • Event handling
    • Ensure each checkbox’s change event emits a selection containing the necessary user data (e.g. user ID, name, role).

Resources

Accessibility notes

  • The “Select All” header checkbox must be focusable and announced (“Select all users”) by screen readers.
  • Each row checkbox should announce its label by screen readers: e.g. “Select John Doe, coach.”
  • Ensure keyboard users can tab into and toggle both the header and row checkboxes.

Metadata

Metadata

Assignees

Labels

Type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions