Skip to content

fix(www): resolve nested anchor hydration error in testimonials#925

Merged
Yeom-JinHo merged 4 commits intomagicuidesign:mainfrom
Yeom-JinHo:fix/nested-anchor
Mar 17, 2026
Merged

fix(www): resolve nested anchor hydration error in testimonials#925
Yeom-JinHo merged 4 commits intomagicuidesign:mainfrom
Yeom-JinHo:fix/nested-anchor

Conversation

@Yeom-JinHo
Copy link
Copy Markdown
Member

@Yeom-JinHo Yeom-JinHo commented Mar 17, 2026

Description

This PR fixes the testimonials tweet card hydration error caused by nested anchor tags.
The testimonials section no longer wraps the entire TweetCard in a Link, but it restores same-tab navigation for empty card areas through a client wrapper.
This preserves the internal links rendered by TweetCard, keeps the hover CTA, and restores navigation behavior on touch devices.

Changes

  • Replaced the outer Link wrapper around each testimonials tweet card with a non-interactive div.
  • Added a client-side testimonial wrapper that navigates to the tweet when users click or keyboard-activate a non-interactive area of the card.
  • Kept View Tweet as a same-tab CTA rendered as Button asChild with Link.
  • Preserved internal TweetCard links by ignoring clicks originating from nested interactive elements.
  • Kept the hover overlay behavior while restoring blank-area navigation on touch devices.

Motivation

TweetCard already renders multiple anchor elements internally for the profile, tweet permalink, and tweet entities.
Wrapping the full card with next/link produced invalid <a> inside <a> markup, which triggered a Next.js hydration error in the testimonials section.
This change removes the invalid DOM nesting without changing the visible UI design.

Breaking Changes

None.

Screenshots

Device / Browser / Viewport:
Not attached. This change only updates link structure and interaction boundaries; the visible UI remains the same.

Before After
The full testimonial card was wrapped in a Link, causing nested anchors and a hydration error. Only the overlay View Tweet CTA is linked, so nested anchors and the hydration error are removed.

@Yeom-JinHo Yeom-JinHo self-assigned this Mar 17, 2026
@vercel
Copy link
Copy Markdown

vercel bot commented Mar 17, 2026

@Yeom-JinHo is attempting to deploy a commit to the product-studio Team on Vercel.

A member of the Team first needs to authorize it.

@Yeom-JinHo Yeom-JinHo merged commit d419d18 into magicuidesign:main Mar 17, 2026
5 of 6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant