I am working on a product website with React and each time I click on a particular menu, it refreshes my entire page instead of just rendering component.

Clicking the same Link element more than once doubles the url params when using with an onClick function that updates state. Removing the onClick makes the Link function as expected.

[PrivateRoute] is not a component. All component children of must be a or <React.Fragment>

Could someone help me with this issue? I’m encountering a problem while developing a React project. I’ve created several components, including a header and footer, and linked them using React Router DOM. Now, suppose I scroll to the footer on the homepage and then click on a link to another component, instead of starting from the top, it resumes from where I last scrolled. I attempted to use useEffect to render components afresh upon navigation, but this introduced another issue, submit buttons trigger animations to highlight errors when empty, but they unexpectedly scroll the page to the top upon clicking, which is quite disruptive. Furthermore, I’ve implemented a popup login box that only occupies half the screen, but clicking its login button also causes the page to scroll to the top.

Even though my login is successful and I am getting the isAuthenticated = true, system is not redirecting to the admin component/ page in my react app. What could be the issue here, can someone please advise ? I am not getting any error.

Refresh page navigate user to “/”
I have this App.tsx in which if user is not logged in and he is on privacy-policy page then if user refresh the page it directly navigate to index page (“/” route).
and could you guys please help me to reduce the logic ?
thank you in advance !

Refresh page navigate user to “/”
I have this App.tsx in which if user is not logged in and he is on privacy-policy page then if user refresh the page it directly navigate to index page (“/” route).
and could you guys please help me to reduce the logic ?
thank you in advance !

I’m using ReactJS to develop my frontend web.

I’m using selective rendering in my Navbar for few buttons. First I’m checking if accessToken is found in localStorage only then render those buttons, but when I login and navigate user to a new page the navbar doesn’t update to show those buttons.

currently i am trying to transform below router into createBrowserRouter version