why doesn’t the Usenavigate() redirects to new page instead shows the requested page in the same page

[[](https://i.sstatic.net/F6SegAVo.png)](https://i.sstatic.net/fzG9jwU6.png)

enter image description here

I am using react-router-dom 6.26.1 but I have been facing an issue in my code.
UseNavigate() Should redirect to new page instead of showing data in the same page. Please answer this question if you think changes can be implemented.