NextJS prefetch functionality?

[J4v4Scr1pt]

I know we need to setup the NextUI prvider and pass router.push to use nextjs navigation.
But it seems like this do not trigger the prefetch that at least most NextJS users want.

Antoher example is that I have the NextUI pro sidebar that use ListboxItems to display each navigation option. Which in the end becomes a tag. But no prefetch.

How can we achive this functionality with NextUI?

[J4v4Scr1pt]

I have spent a couple of hours now to search and test. We can user router.prefetch(item.href); But when the component re-renders for some reason. It triggers the prefetch again. We could use memoization etc.. but nahh..

Then.. I realized the as prop.. NextUI shows once again why its the best UI-lib.

This is how I solved it with the ListBoxItem for the sidebar, works as expected and it prefetch in production.

	<ListboxItem
			as={item.href ? Link : 'li'}
			{...{ ...item, href: undefined }}
			href={item.href || undefined}
			key={item.href || item.key}
			aria-label={t(item.key)}
                        ..................