React Component not showing on matched Route (react-router-dom)

Hey everyone I dont know whats going on. I have the following routes:

<BrowserRouter>
  <div>
    <Switch>
      <Route path="/patient/:id/" component={PatientWrapper} />
      <Route path="/patient/:id/patient_profile/admission_form" component={PatientAdmission} />
      <Route path="/patient/:id/patient_profile/discharge_form" component={PatientDischarge} />
      <Route path="/patient/:id/patient_profile/encounter_details" component={PatientEncounterDetails} />
      <Route path="/" component={App} />
    </Switch>
  </div>
</BrowserRouter>

Only Route with path="/" and Route with path="/patient/:id" are the ones working, the other 3 routes are just not showing the component that corresponds to the path.

This is how I access to the Route. I have a Header Component with the proper links on it. See below

<ul className="dropdown-menu dropdown-messages">
    <li><Link to={"/patient/" + this.props.id +"/patient_profile/admission_form"} id="admission-link" >Admission</Link></li>
     <li><Link to={"/patient/" + this.props.id +"/patient_profile/discharge_form"} id="discharge-link">Discharge</Link></li>
     <li className="divider"></li>
     <li><Link to={"/patient/" + this.props.id +"/patient_profile/encounter_details"} id="encounter-details">Encounter Details</Link></li>
</ul>

In the Header component I import { Link } from 'react-router-dom'; and in the file where I declare the routes I import { BrowserRouter, Route, Switch } from 'react-router-dom';

What am I doing wrong?