Skip to content

Conversation

@Huor97
Copy link
Contributor

@Huor97 Huor97 commented Dec 4, 2025

What does this PR do?

Adds an aria-label attribute to the close button in the ProgressToast component to improve accessibility for screen reader users. The button previously had only a visual icon ("x") without a text alternative, making it difficult for assistive technology users to understand its purpose.

  • No related GitHub or Linear issue (small accessibility improvement as per CONTRIBUTING.md guidelines)

Visual Demo (For contributors especially)

Code Change:

Before:

<button onClick={() => onClose(toastId)}>
  <Icon name="x" className="h-4 w-4 hover:cursor-pointer" />
</button>

After:

<button onClick={() => onClose(toastId)} aria-label={t("close")}>
  <Icon name="x" className="h-4 w-4 hover:cursor-pointer" />
</button>

The close button now announces "close" to screen readers, making it clear what the button does.

Mandatory Tasks (DO NOT REMOVE)

  • I have self-reviewed the code (A decent size PR without self-review might be rejected).
  • I have updated the developer docs in /docs if this PR makes changes that would require a documentation change. If N/A, write N/A here and check the checkbox.
  • I confirm automated tests are in place that prove my fix is effective or that my feature works.

How should this be tested?

  1. Use a screen reader to navigate to the close button
  2. Verify it announces "close"
  3. Click the button to ensure it works

Environment variables: None

Expected behavior: Close button now accessible to screen readers

Checklist

  • I haven't read the contributing guide
  • My code doesn't follow the style guidelines of this project
  • I haven't checked if my changes generate no new warnings

@vercel
Copy link

vercel bot commented Dec 4, 2025

@Huor97 is attempting to deploy a commit to the cal Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions
Copy link
Contributor

github-actions bot commented Dec 4, 2025

Hey there and thank you for opening this pull request! 👋🏼

We require pull request titles to follow the Conventional Commits specification and it looks like your proposed title needs to be adjusted.

Details:

No release type found in pull request title "fix (a11y): Add aria-label to progressToast close button". Add a prefix to indicate what kind of release this pull request corresponds to. For reference, see https://www.conventionalcommits.org/

Available types:
 - feat: A new feature
 - fix: A bug fix
 - docs: Documentation only changes
 - style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
 - refactor: A code change that neither fixes a bug nor adds a feature
 - perf: A code change that improves performance
 - test: Adding missing tests or correcting existing tests
 - build: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
 - ci: Changes to our CI configuration files and scripts (example scopes: Travis, Circle, BrowserStack, SauceLabs)
 - chore: Other changes that don't modify src or test files
 - revert: Reverts a previous commit

@Huor97 Huor97 changed the title fix (a11y): Add aria-label to progressToast close button fix: a11y add aria-label to progressToast close button Dec 4, 2025
@dhairyashiil dhairyashiil marked this pull request as ready for review December 5, 2025 06:47
@dhairyashiil dhairyashiil requested review from a team as code owners December 5, 2025 06:47
@graphite-app graphite-app bot added the community Created by Linear-GitHub Sync label Dec 5, 2025
Copy link
Member

@dhairyashiil dhairyashiil left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 👍🏼 Thank you for the contribution. I can see this is your first PR in Cal, so welcome! Feel free to work on other open issues, and ping me if you need any help.

@dhairyashiil dhairyashiil enabled auto-merge (squash) December 5, 2025 06:51
Copy link
Contributor

@cubic-dev-ai cubic-dev-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No issues found across 1 file

@dhairyashiil dhairyashiil merged commit 8cace7f into calcom:main Dec 5, 2025
53 of 62 checks passed
@Huor97 Huor97 deleted the fix/a11y-progress-toast-close-button branch December 14, 2025 21:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

community Created by Linear-GitHub Sync ready-for-e2e size/XS

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants