basePath not working on top level component

Hello,

First - thanks for this nice library. I have s one struggle. In hookrouter you can use setPath function on start application (https://github.com/Paratron/hookrouter/blob/master/src-docs/pages/en/05_serverside-rendering.md#setting-the-path)

I have react application which is serving in subofolder - for example (www.sampleapp.com/subfolder/sampleapp.

In top level component i have define routes:

const route = useRoutes(AppRoutes, { basePath: "sampleapp" });

But this is not working.

Is there any workaround, how i use basePath(setPath) for this usecase?

Thanks

[martinsura]

Nice, this is exactly my use case and it works!

Thanks for the help.

[kyeotic]

This is because the <Link>s in the app render are outside of the useRoutes result, so they can’t inherit the basePath from it. The basePath is only provided to components rendered by useRoutes. Does that make sense?

You can provide the basePath to the <Link>, or you can create a wrapped version of the <Link> that has its own basePath defined.

const AppLink = (props) => <Link {...props} basePath='test' />

Check out this example