I am just starting to learn React and I am having trouble understanding why my dynamic routing is failing to work within my site I am working on. Currently when I link something within my pages it is going to the path that is mentioned first in

Here is a snippet I am referring to:

   <Router>
     <ParticleBackground />
     <Nav topics={topics} />
     <Routes>
        <Route path="/" element={<HomePage />} />
        <Route path="/:categories" element={<DataPage />} />
        <Route path="/:categories/:topicId" element={<DataPage />} />
        <Route path="/:selection" element={<EachEntity />} />
        <Route path="/:selection/:entityId" element={<EachEntity />} />
        <Route path="/LiveCounters" element={<CountersPage />} />
         </Routes>
       <Footer />
     </Router>

I am just starting to learn React and I am having trouble understanding why my dynamic routing is failing to work within my site I am working on.