Skip to content

fix: prevent nested <a> element in NavigationItem#27985

Open
devanshu0x wants to merge 2 commits intocalcom:mainfrom
devanshu0x:fix/navigation-item-nested-anchor
Open

fix: prevent nested <a> element in NavigationItem#27985
devanshu0x wants to merge 2 commits intocalcom:mainfrom
devanshu0x:fix/navigation-item-nested-anchor

Conversation

@devanshu0x
Copy link
Contributor

@devanshu0x devanshu0x commented Feb 16, 2026

What does this PR do?

Problem

The NavigationItem component renders nested <a> elements due to an additional Link wrapper.

Solution

Instead of using Link, render the badge inside a non interactive <div> with an onClick handler that calls router.push("/bookings/unconfirmed") to preserve the intended navigation without introducing nested interactive elements.

Visual Demo

Before

Before.mp4

After

After-2.mp4

Note: After the fix, all the errors and warnings related to nested <a> element have been resolved

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. (N/A)
  • I confirm automated tests are in place that prove my fix is effective or that my feature works.

How should this be tested?

Steps to Reproduce

  • Run the project locally (yarn dx)
  • Navigate to a http://localhost:3000/event-types or a page which renders the navigation sidebar
  • Ensure sidebar navigation is visible
  • Error pops up from Next and in browser console

Expected Behavior (After Fix)

  • Repeat the steps above after applying this PR.
  • No console error related to nested anchor tag should appear.

Open with Devin

@github-actions github-actions bot added the 🐛 bug Something isn't working label Feb 16, 2026
@graphite-app graphite-app bot added the community Created by Linear-GitHub Sync label Feb 16, 2026
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

Copy link
Member

@sahitya-chandra sahitya-chandra left a comment

Choose a reason for hiding this comment

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

Can you add a before and after video of the changes?

and always make sure to add these videos in your future prs, otherwise we will not be able to approve your prs.

@devanshu0x
Copy link
Contributor Author

Can you add a before and after video of the changes?

and always make sure to add these videos in your future prs, otherwise we will not be able to approve your prs.

@sahitya-chandra I have added before and after video of the fix, I will make sure to include relevant visual demos in future prs as well

devin-ai-integration[bot]

This comment was marked as resolved.

devin-ai-integration[bot]

This comment was marked as resolved.

@devanshu0x devanshu0x force-pushed the fix/navigation-item-nested-anchor branch from 40ea5f1 to 1df7bfe Compare February 17, 2026 13:44
@pull-request-size pull-request-size bot added size/M and removed size/S labels Feb 17, 2026
Copy link
Contributor

@devin-ai-integration devin-ai-integration bot left a comment

Choose a reason for hiding this comment

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

Devin Review found 1 new potential issue.

View 7 additional findings in Devin Review.

Open in Devin Review

@devanshu0x devanshu0x force-pushed the fix/navigation-item-nested-anchor branch from 1df7bfe to 5278c75 Compare February 17, 2026 14:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🐛 bug Something isn't working community Created by Linear-GitHub Sync size/M

Projects

None yet

Development

Successfully merging this pull request may close these issues.

NavigationItem renders nested <a> elements when wrapped in Tooltip

2 participants

Comments