pass close fn/forwardref to promptlink

[John-Paul-Larkin]

✨ Codu Pull Request 💻

Pull Request details

The dropdown nav is a headless UI disclosure, usually handles closing. From docs >>
To close a disclosure manually when clicking a child of its panel, render that child as a Disclosure.Button. You can use the ‘as’ prop to customize which element is being rendered.

However in this case it is not working, because the as prop is passed the PromptLink component.
<Disclosure.Button
as={Link} // import Link as PromptLink
to={item.href}

{item.name}
</Disclosure.Button>

Fix
The disclosure component exposes a close render prop, which I drill down and invoke in the PromptLink component.
Nav > MobileNav > SubNav > PromptLink

Note:
Before I made modifications to the code, a forwardRef error was being displayed in the console. I resolved this issue by introducing a ref to the disclosure button, passing it as a forwardRef to PromptLink, and then applying the ref to the next/Link component.

I also added a displayName to the PromptLink component to please the linting gods.

Any Breaking changes

None

Associated Screenshots

• IF YOU HAVE ANY SCREENSHOTS, INCLUDE THEM HERE. ( Welcome file extensions include gifs/png screenshots of your feature in action )
• None

[vercel]

@John-Paul-Larkin is attempting to deploy a commit to the Codú Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
codu	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 17, 2024 8:07pm

[NiallJoeMaher]

Nice one! This will help for sure.