daltonmenezes / electron-router-dom

🧬 A react-router-dom adapter for Electron apps
https://electron-router-dom.daltonmenezes.com
MIT License
134 stars 3 forks source link

Component-level routing #9

Closed Undead34 closed 1 year ago

Undead34 commented 1 year ago

Wow! I really like your library, but I'm having trouble using component level routes something like that, I don't know if I'm wrong but I can't find any documentation for it.


const App = () => {
  const { activeSong } = useSelector((state) => state.player);

  return (
    <div className="relative flex">
      <Sidebar />
      <div className="flex-1 flex flex-col bg-gradient-to-br from-black to-[#121286]">
        <Searchbar />

        <div className="px-6 h-[calc(100vh-72px)] overflow-y-scroll hide-scrollbar flex xl:flex-row flex-col-reverse">
          <div className="flex-1 h-fit pb-40">
            <Routes>
              <Route path="/" element={<Discover />} />
              <Route path="/top-artists" element={<TopArtists />} />
              <Route path="/top-charts" element={<TopCharts />} />
              <Route path="/around-you" element={<AroundYou />} />
              <Route path="/artists/:id" element={<ArtistDetails />} />
              <Route path="/songs/:songid" element={<SongDetails />} />
              <Route path="/search/:searchTerm" element={<Search />} />
            </Routes>
          </div>
          <div className="xl:sticky relative top-0 h-fit">
            <TopPlay />
          </div>
        </div>
      </div>

      {activeSong?.title && (
        <div className="absolute h-28 bottom-0 left-0 right-0 flex animate-slideup bg-gradient-to-br from-white/10 to-[#2a2a80] backdrop-blur-lg rounded-t-3xl z-10">
          <MusicPlayer />
        </div>
      )}
    </div>
  );
};```

If there is no way to do that, it would be great if you could add it, thanks in advance.
daltonmenezes commented 1 year ago

Thanks @Undead34 , could you please provide a reproducible example?

csanchez-jetdev commented 7 months ago

Hi @daltonmenezes , I try to use your library with the Routes component, did you have more informations since ?

daltonmenezes commented 7 months ago

@csanchez-jetdev an example of right usage: https://github.com/daltonmenezes/electron-app/blob/main/src/renderer/routes.tsx

csanchez-jetdev commented 7 months ago

@daltonmenezes Thanks ! I solve my problem. I'm developping an app with electron and router. The problem was on windows on build package. I was using an ui lib and the routing was not correct. It add an "C:/" on each route ...

Thanks for your lib !