Skip to content

Dashboard Hook Logs table rows are not keyboard-accessible #525

Description

@chhhee10

Description

In the Hook Logs table (app/components/session-hooks-panel.tsx:329), a row is expanded only via
<tr onClick={() => toggleRow(i)}> with cursor-pointer. The row has no tabIndex, no
role="button", and no onKeyDown, and the disclosure indicator is a bare <ChevronDown> icon
(:342), not a button. Interaction is mouse-only.

Steps to Reproduce

  1. Open a session's Hook Logs panel in the dashboard.
  2. Using only the keyboard (Tab / Enter / Space), try to expand a row to see its details
    (Session ID, CWD, full reason, matched policies).
  3. There is no focusable control — the detail panel is unreachable without a mouse. Screen-reader
    users get no affordance that the row is interactive.

Expected Behavior

Row expansion should be operable by keyboard and announced to assistive tech — e.g. Tab to focus,
Enter/Space to toggle, with aria-expanded reflecting state.

Failproof AI Version

0.0.14-beta.1

Node.js / Bun Version

Bun 1.3+

Operating System

macOS

Additional Context

Approachable a11y starter. Either make the chevron cell a real <button aria-expanded=…>, or add
role="button", tabIndex={0}, an Enter/Space onKeyDown, and aria-expanded to the <tr>.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workinggood first issueGood for newcomers

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions