We have a react App with react router, We build a Docker container and serve the App with an Nginx. Here is the nginx.conf:

server {
  listen       80;
  location / {
    root   /usr/share/nginx/html;
    index  index.html index.htm;
    try_files $uri /index.html =404;
  }
}

We show a list of Items on a page and on a click one can see some more information about the item:

<Routes>
      <Route path="/" element={<Patients />} />
      <Route path="/add" element={<AddPatient />} />
      <Route path="/:patientId" element={<Patient />} />
      <Route path="/:patientId/update" element={<UpdatePatient />} />
      <Route path="/:patientId/wounds/add" element={<AddWound />} />
      <Route path="/:patientId/wounds/:woundId/update" element={<UpdateWound />} />
      <Route path="*" element={<Navigate to="/" />} />
</Routes>

However when I deploy the App something weired happens:

I expect the App to use a Route like this:

https://<publicDomain>/app/patients/605db06b642296fa97b7c4c0

But it uses this link:

https://<publicDomain>/app/patients/app/patients/605db06b642296fa97b7c4c0

So a part of the URL is duplicated which leads to the fact that the app surely is not opening any new details view.

How can I stop it, that parts of the route are duplicated?