Skip to content

Give the download dialogs a specific closeLabel on DialogTitle #3215

Description

@frano-m

Summary

findable-ui's DialogTitle close button had no accessible name — MUI sets aria-hidden on every SvgIcon, so an icon-only IconButton computed to an empty accessible name. Fixed in findable-ui #1005 / #1007, which also added an optional closeLabel prop for dialogs that want something more specific than the default "Close".

Both of this repo's download dialogs get a named close button for free on upgrade. This ticket is the follow-up suggested in review of that PR: give the two of them a specific name, since "Close" alone doesn't say which dialog is being closed.

Where

Both dialogs render the same styled wrapper, so there is one component to thread the prop through and two call sites to set it on:

  • components/common/Table/components/Actions/components/Dialog/dialog.styles.ts:15styled(DXDialogTitle), the shared wrapper. Emotion forwards unknown props to the wrapped component, so closeLabel passes straight through; no change needed here.
  • components/common/Table/components/Cell/components/CXGDownloadCell/components/CXGDownloadDialog/cxgDownloadDialog.tsx:26
    <DialogTitle title="Download from CZ CELLxGENE" onClose={onClose} />
  • components/common/Table/components/Cell/components/TrackerDownloadCell/components/Dialog/dialog.tsx:36
    <DialogTitle title="Download from HCA" onClose={onClose} />

Suggested change

<DialogTitle
  closeLabel="Close CZ CELLxGENE download dialog"
  onClose={onClose}
  title="Download from CZ CELLxGENE"
/>
<DialogTitle
  closeLabel="Close HCA download dialog"
  onClose={onClose}
  title="Download from HCA"
/>

Exact wording is a judgement call — the point is that a screen-reader user moving through the page hears which dialog the control closes, rather than one of several identical "Close" buttons.

Blocked on a findable-ui release

closeLabel is not in a published version yet. The latest findable-ui release is v56.0.0 (2026-07-31) and the fix merged after it, so this needs the next release.

This repo is currently on ^55.0.0, so it is two majors behind — worth checking findable-ui's changelog for breaking changes in 56.x before bumping, rather than treating this as a patch upgrade. In particular 56.0.0 includes a refactor! replacing the header search dialog with a non-modal dropdown.

Note on scope

The default is already correct without any change here — on upgrade both buttons announce as "Close" instead of as an unnamed button. This ticket is the polish on top, not the fix. If the upgrade is far off, it is fine to leave this open.

Context

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions