React navbar links don't work (Typescript)

Question

I made a NavBar with React that is not workink, or at least it does partially. Clickin on the link the page does not change, although the address bar show the right address each time. I was wondering it may be due to the fact I installed react-router-dom@5.2.0 with the latest react version? Cause I cannot find a single clue on the code (my bad) Thank you in advance for your precious time!

APP.TSX

import React from 'react';
import { BrowserRouter, Route, Switch } from 'react-router-dom';
import Homepage from './Components/Homepage/Homepage';
import LoginPage from './Components/LoginPage/LoginPage';
import NavBar from './Components/NavBar/NavBar';

function App() {
  return (
    <BrowserRouter>
      <NavBar />
      <Switch>
        <Route path='/' exact component={Homepage} />
        <Route path='/login' component={LoginPage} />
      </Switch>

    </BrowserRouter>
  );
}

export default App;

NAVBAR.TSX

import React from 'react';
import styles from './NavBar.module.css';
import { Link } from "react-router-dom";

export default function NavBar() {
  return (
    <div className={styles.navbarWrapper}>
      <ul className={styles.navbar}>
        <li><Link to='/'>Home</Link></li>
        <li><Link to='/login'>Login</Link></li>
      </ul>
    </div>
  );
}

PACKAGE.JSON

{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.5.2",
    "@types/node": "^16.11.59",
    "@types/react": "^18.0.21",
    "@types/react-dom": "^18.0.6",
    "@types/react-router-dom": "^5.3.3",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^5.2.0",
    "react-scripts": "5.0.1",
    "typescript": "^4.8.3",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}