like-gold
like-gold15mo ago

Migration to v4: genetic routes

Hi 👋 So I've started migrating to v4 (🥳). In v3 I had the routerProvider which generated the routes automatically for my resources. Now, looking at the updated docs I see that we need to add BrowserRouter with manually-defined Routes. Is it still possible to have the routes created automatically, instead of manually providing them?
10 Replies
kapa.ai
kapa.ai15mo ago
Hey @YechiamTK! I'm the kapa.ai support bot. I've searched through the docs to try to answer your question. :wave:
kapa.ai
kapa.ai15mo ago
---------------------- Hi! In refine v4, the creation and control of routes are entirely up to the user, and you must manually create routes. The automatic route generation from resources is no longer available as it was in v3. This change provides more flexibility and control over your routes, allowing you to use refine with any React application without constraints. You can pass the routes to actions of your resources, and although there are methods for generating routes from resources, these methods are optional and not recommended for optimal flexibility. They are available under each router if you choose to use them [^1^]. Here's an example of how to manually define routes in v4:
import { BrowserRouter, Route, Routes } from "react-router-dom";
import { Refine } from "@refinedev/core";
import routerBindings from "@refinedev/react-router-v6";

const App = () => {
return (
<BrowserRouter>
<Refine
routerProvider={routerBindings}
resources={[
{
name: "products",
list: "/products",
show: "/products/show/:id",
create: "/products/create",
edit: "/products/edit/:id",
},
]}
>
<Routes>
{/* Define your routes here */}
</Routes>
</Refine>
</BrowserRouter>
);
};
import { BrowserRouter, Route, Routes } from "react-router-dom";
import { Refine } from "@refinedev/core";
import routerBindings from "@refinedev/react-router-v6";

const App = () => {
return (
<BrowserRouter>
<Refine
routerProvider={routerBindings}
resources={[
{
name: "products",
list: "/products",
show: "/products/show/:id",
create: "/products/create",
edit: "/products/edit/:id",
},
]}
>
<Routes>
{/* Define your routes here */}
</Routes>
</Refine>
</BrowserRouter>
);
};
For more information on how to migrate from v3 to v4, you can refer to the migration guide (https://refine.dev/docs/migration-guide/3x-to-4x). ^1^]: [https://refine.dev/docs/migration-guide/router-provider (https://refine.dev/docs/migration-guide/router-provider) ----------------------
kapa.ai
kapa.ai15mo ago
<@239743886581301248> kapa.ai is still learning and improving, please let us how it did by reacting below
like-gold
like-gold15mo ago
I missed the router provider migration page. I do see there something not quoted in the bot: "Although we provide methods for generating routes from resources..." - which methods? How can I use them? For those of you that remember my use case, I must generate the routes dynamically using the resources..
Omer
Omer15mo ago
React Router v6 | refine
refine provides router bindings and utilities for React Router v6. It is built on top of the react-router-dom package. This package will provide easy integration between refine and react-router-dom for both existing projects and new projects.
like-gold
like-gold15mo ago
Well that just might be that! I'd recommend adding a link for this in the migration page 🙂 Also, I tried using it now and I see that the inferencers don't receive their usual props?
Omer
Omer15mo ago
Actually, this is not the usage we recommend. It causes many restrictive points. It's the opposite of what we're trying to achieve with v4 🙂
like-gold
like-gold15mo ago
I know.. My use case neccesiate this usage though, because I provide a generic tool, without knowing the resources beforehand.
Omer
Omer15mo ago
Can you create a CodeSandbox that we can use to reproduce the issue?
like-gold
like-gold15mo ago
Yeah no problem, I'll create it tomorrow. Note that I'm doing it a bit more complicated than simply providing the routes with the built-in inferencers, because I'm overriding them for some customizations I do. I will first try with the ootb inferencers and see the behavior without my custom code and let you know if it's just my customizations.