Реагировать на перенаправление маршрутизатора dom V6 на двойной путь

У меня проблема с маршрутизатором React V6. Я не добавил BrowserRouter в main.tsx.

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,

Мне нужно отображать заголовок только в определенных местах. Я читал, что могу сделать это, упомянув несколько элементов внутри элементов маршрута. Поэтому я добавил:

            <Route path = "invoices-list" element = {<InvoicesListPage />} />

            <Route path = "invoice-details" element = {(
              <>
                <Header />
                <InvoiceDetails />
              </>
            )} />

Итак, в приведенном выше коде мне нужно отобразить компонент заголовка только на маршруте invoice-details.

1. Я пытался переходить между страницами по URL-адресу, но если я перейду к другому маршруту из заголовка, мое местоположение просто добавит маршрут поверх существующего. Например, если я нахожусь на /profile и хочу перейти к invoice-details, URL-путь преобразуется в /profile/invoice-details...

Итак, если я настроил заголовок со ссылками, пути объединяются

<Link to = {'signup'}>Inregistreaza-te</Link>
<Link to = {'login'}>Login</Link>