Fixed : Docs URL refresh when using side nav issue #9486

[devmamunur]

Fixes Issue

Closes #9486

Changes proposed

Now, the docs side-nav link click will not refresh the full page. All docs pages will load without refreshing the URL.

Check List (Check all the applicable boxes)

• My code follows the code style of this project.
• This PR does not contain plagiarized content.
• The title of my pull request is a short description of the requested changes.

Video

BioDrop.-.connect.to.your.audience.with.a.single.link.mp4

[amandamartin-dev]

Tested in Gitpod works as expected. This fix is also what is recommended for working with Next from headless UI github issue convo. Looks good to me, thanks for the contribution

[eddiejaoude]

I saw from the docs they recommend using as, interested to know people's thoughts?

[amandamartin-dev]

I saw from the docs they recommend using as, interested to know people's thoughts?

Yes, using "as" recommended and what we had previously, but if you look further this issue is common when using the next framework and in such case is recommended to use a Link component

In reading through the Github Issue here Refresh Issue

is how I came to the conclusion that this fix is needed and appropriate in this case as it seems to be an issue within the Headless UI components.

wdyt? perhaps I missed something?

[devmamunur]

Hi, @eddiejaoude and @amandamartin-dev

I made a new solution to fix this issue. We can use headless UI as For that we need to do a small hack. we can prevent this issue using a custom function when clicking the link we need to use preventDefault(), then push the link. It works perfectly.

[eddiejaoude]

small hack

Thank you for looking at alternative solutions, but I don't like the idea of a "small hack" 🤔

[amandamartin-dev]

I saw from the docs they recommend using as, interested to know people's thoughts?

Yes, using "as" recommended and what we had previously, but if you look further this issue is common when using the next framework and in such case is recommended to use a Link component

In reading through the Github Issue here Refresh Issue

is how I came to the conclusion that this fix is needed and appropriate in this case as it seems to be an issue within the Headless UI components.

wdyt? perhaps I missed something?

@eddiejaoude bumping my original comment about the initial version of this in the PR since this has been open for a bit now (not the update with the "small hack"). Take a look and lmk what you think

[eddiejaoude]

Thank you for reminding me Amanda 👍

[eddiejaoude]

Great collaboration 💪