I have a sidebar which contains some tabs like profile, settings, insights now when click on one of the tab it should show particular content where routes should change but page should not be refresh.
I have no idea how to do?
In Nextjs you can use its routing mechanism to route between pages.
Next 13 use server rendered components, and supports other approaches too, which means it is not strictly client side SPA like routing.
See https://beta.nextjs.org/docs/routing/linking-and-navigating
If you want to prevent routing with reloading the ui, you can use shallow routing. See https://nextjs.org/docs/routing/shallow-routing