23 KiB
@refinedev/react-router-v6
4.5.5
Patch Changes
- #5425
190af9fce2
Thanks @aliemir! - Updated@refinedev/core
peer dependencies to latest (^4.46.1
)
4.5.4
Patch Changes
- #5000
847124858e0
Thanks @dzcpy! - fix: addedtypes
path to export inpackage.json
4.5.3
Patch Changes
- #5000
847124858e0
Thanks @dzcpy! - fix: addedtypes
path to export inpackage.json
4.5.2
Patch Changes
-
#5022
80513a4e42f
Thanks @BatuhanW! - chore: update README.md- fix grammar errors.
- make all README.md files consistent.
- add code example code snippets.
4.5.1
Patch Changes
-
#5022
80513a4e42f
Thanks @BatuhanW! - chore: update README.md- fix grammar errors.
- make all README.md files consistent.
- add code example code snippets.
4.5.0
Minor Changes
- #4741
026ccf34356
Thanks @aliemir! - AddedsideEffects: false
topackage.json
to help bundlers tree-shake unused code.
4.4.0
Minor Changes
- #4741
026ccf34356
Thanks @aliemir! - AddedsideEffects: false
topackage.json
to help bundlers tree-shake unused code.
4.3.2
Patch Changes
- #4406
ad1856f741f
Thanks @aliemir! - Fix the issue ofmatchPath
when the resource action is defined as a function or an object. Switched to using matched route string instead of using the route value from theresource
definition.
4.3.1
Patch Changes
- #4406
ad1856f741f
Thanks @aliemir! - Fix the issue ofmatchPath
when the resource action is defined as a function or an object. Switched to using matched route string instead of using the route value from theresource
definition.
4.3.0
Minor Changes
-
#4313
28fe67047a0
Thanks @abdellah711! - feat: dynamic window titleThis feature enables users to generate document titles for each page. To activate it, users need to include the
DocumentTitleHandler
component within the<Refine>
component. By default, theDocumentTitleHandler
will generate titles using thegenerateDefaultDocumentTitle
exported from@refinedev/core
.The
DocumentTitleHandler
component accepts an optional prop calledhandler
, which is a callback function. This function is triggered whenever thepathname
changes and receives an object with the following parameters:{ resource, // 'posts' action, // 'create' params, // {id: 1} pathname, // '/posts/create' autoGeneratedTitle; // 'Create new Post | refine' }
The
handler
callback should return the new title based on the provided parameters. To update the title in a child component, the user can use theuseDocumentTitle
hook. It accepts either a string representing the new title or an object with the propertyi18nKey
if the app supports multiple languages.useDocumentTitle({ i18nKey: "documentTitle.default" });
4.2.0
Minor Changes
-
#4313
28fe67047a0
Thanks @abdellah711! - feat: dynamic window titleThis feature enables users to generate document titles for each page. To activate it, users need to include the
DocumentTitleHandler
component within the<Refine>
component. By default, theDocumentTitleHandler
will generate titles using thegenerateDefaultDocumentTitle
exported from@refinedev/core
.The
DocumentTitleHandler
component accepts an optional prop calledhandler
, which is a callback function. This function is triggered whenever thepathname
changes and receives an object with the following parameters:{ resource, // 'posts' action, // 'create' params, // {id: 1} pathname, // '/posts/create' autoGeneratedTitle; // 'Create new Post | refine' }
The
handler
callback should return the new title based on the provided parameters. To update the title in a child component, the user can use theuseDocumentTitle
hook. It accepts either a string representing the new title or an object with the propertyi18nKey
if the app supports multiple languages.useDocumentTitle({ i18nKey: "documentTitle.default" });
4.1.0
Minor Changes
-
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk! We're releasing a new way to connect your router to refine.
The legacy
routerProvider
and its exports are now deprecated but accessible at@refinedev/react-router-v6/legacy
path.The new
routerBindings
are smaller and more flexible than the previos one.New
routerBindings
exportNew
routerBindings
contains following properties;go
: Which returns a function to handle the navigation inreact-router-v6
. It accepts a config object and navigates to the given path. UsesuseNavigate
hook under the hood.back
: Which returns a function to handle the navigation inreact-router-v6
. It navigates back to the previous page. UsesuseNavigate
hook under the hood.parse
: Which returns a function to parse the given path and returns theresource
,id
,action
and additionalparams
. UsesuseParams
anduseLocation
hooks andqs
package under the hood.Link
: A component that acceptsto
prop and renders a link to the given path. UsesLink
component fromreact-router-dom
under the hood.
Complemetary Components
-
RefineRoutes
- A component that renders the routes for the resources when the actions are defined as components. This can be used to achieve the legacy behavior ofrouterProvider
prop.RefineRoutes
component accepts a render function as a child and passed aJSX.Element
array containingRoute
components for the resource routes. You can wrap it to aRoutes
component and let it handle the route creation process for you. Additionally, If you want to add custom routes, you can place them inside theRoutes
component or you can place an anotherRoutes
component. Both apporaches are now valid and accepted by refine. -
NavigateToResource
- A component that navigates to the firstlist
action of theresources
array of<Refine>
. Optionally, you can pass aresource
prop to navigate tolist
action of the resource. This can be placed at theindex
route of your app to redirect to the first resource. -
UnsavedChangesNotifier
- This component handles the prompt when the user tries to leave the page with unsaved changes. It can be placed under theRefine
component.
Exported values from
react-router-dom
In earlier versions, we've re-exported the
react-router-dom
package. This was a bad practice and we've removed it in this version. If you're usingreact-router-dom
in your project, you should install it as a dependency and import the values from it. -
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk! Moving to the
@refinedev
scope 🎉🎉Moved to the
@refinedev
scope and updated our packages to use the new scope. From now on, all packages will be published under the@refinedev
scope with their new names.Now, we're also removing the
refine
prefix from all packages. So, the@pankod/refine-core
package is now@refinedev/core
,@pankod/refine-antd
is now@refinedev/antd
, and so on.
Patch Changes
3.40.0
Minor Changes
- #3822
0baa99ba787
Thanks @BatuhanW! - - refine v4 release announcement added to "postinstall". - refine v4 is released 🎉 The new version is 100% backward compatible. You can upgrade to v4 with a single command! See the migration guide here: https://refine.dev/docs/migration-guide/3x-to-4x
3.39.0
Minor Changes
- #3822
0baa99ba787
Thanks @BatuhanW! - - refine v4 release announcement added to "postinstall". - refine v4 is released 🎉 The new version is 100% backward compatible. You can upgrade to v4 with a single command! See the migration guide here: https://refine.dev/docs/migration-guide/3x-to-4x
3.38.0
Minor Changes
- #3144
c0aea17837c
Thanks @omeraplak! - Added react-router-dom's exports
3.37.0
Minor Changes
- #3144
c0aea17837c
Thanks @omeraplak! - Added react-router-dom's exports
3.36.6
Patch Changes
- #3126
ccaf8bde357
Thanks @thaihuynhxyz! - fix: react extract incorrect resource from encoded pathname
3.36.5
Patch Changes
- #3126
ccaf8bde357
Thanks @thaihuynhxyz! - fix: react extract incorrect resource from encoded pathname
3.36.4
Patch Changes
- #3039
54eee2911a2
Thanks @alonp99! - Fixed TypeScript type ofuseParams
hook
3.36.3
Patch Changes
- #3039
54eee2911a2
Thanks @alonp99! - Fixed TypeScript type ofuseParams
hook
3.36.2
Patch Changes
- Add missing
BrowserRouterComponent
export to@pankod/refine-react-router-v6
package.
3.36.1
Patch Changes
- #2780
0417b7bf64
Thanks @aliemir! - Add missingBrowserRouterComponent
export to@pankod/refine-react-router-v6
package.
3.36.0
Minor Changes
- Added ability to manage the initial route of refine by binding
initialRoute
variable toRouterComponent
component.
3.35.0
Minor Changes
- Added ability to manage the initial route of refine by binding
initialRoute
variable toRouterComponent
component.
3.34.0
Minor Changes
- #2486
ee4d0d112a
Thanks @aliemir! - Added ability to manage the initial route of refine by bindinginitialRoute
variable toRouterComponent
component.
3.33.2
Patch Changes
- Fixed version of react-router to
6.3.0
3.33.1
Patch Changes
- #2501
4095a578d4
Thanks @omeraplak! - Fixed version of react-router to6.3.0
3.33.0
Minor Changes
- Update type declaration generation with
tsc
instead oftsup
for better navigation throughout projects source code.
3.32.0
Minor Changes
- #2440
0150dcd070
Thanks @aliemir! - Update type declaration generation withtsc
instead oftsup
for better navigation throughout projects source code.
3.31.3
Patch Changes
- Fixed default login page is
<LoginPage>
.
-
🎉 Added
AuthPage
component to therefine
app. This page is used to login, register, forgot password and update password. Login page is default page and oldLoginPage
component is deprecated.New Auth Hooks
📌 Added
useRegister
hook. This hook is used to register new user.useRegister
falls into register function ofAuthProvider
.📌 Added
useForgotPassword
hook. This hook is used to forgot password.useForgotPassword
falls intoforgotPassword
function ofAuthProvider
.📌 Added
useUpdatePassword
hook. This hook is used to update password.useUpdatePassword
falls intoupdatePassword
function ofAuthProvider
.- <LoginPage> + <AuthPage>
New
AuthPage
props:interface IAuthPageProps extends IAuthCommonProps { type?: "login" | "register" | "forgotPassword" | "updatePassword"; } interface IAuthCommonProps { submitButton?: React.ReactNode; registerLink?: React.ReactNode; loginLink?: React.ReactNode; forgotPasswordLink?: React.ReactNode; updatePasswordLink?: React.ReactNode; backLink?: React.ReactNode; providers?: IProvider[]; } interface IProvider { name: string; icon?: React.ReactNode; label?: string; }
3.31.2
Patch Changes
- #2415
f7c98f0ef9
Thanks @biskuvit! - Fixed default login page is<LoginPage>
.
3.31.1
Patch Changes
-
#2299
a02cb9e8ef
Thanks @biskuvit! - 🎉 AddedAuthPage
to therefine
app. This page is used to login, register, forgot password and update password. Login page is default page and oldLoginPage
component is deprecated.New Auth Hooks
📌 Added
useRegister
hook. This hook is used to register new user.useRegister
falls into register function ofAuthProvider
.📌 Added
useForgotPassword
hook. This hook is used to forgot password.useForgotPassword
falls intoforgotPassword
function ofAuthProvider
.📌 Added
useUpdatePassword
hook. This hook is used to update password.useUpdatePassword
falls intoupdatePassword
function ofAuthProvider
.- <LoginPage> + <AuthPage>
New
AuthPage
props:interface IAuthPageProps extends IAuthCommonProps { type?: "login" | "register" | "forgotPassword" | "updatePassword"; } interface IAuthCommonProps { registerLink?: React.ReactNode; loginLink?: React.ReactNode; forgotPasswordLink?: React.ReactNode; updatePasswordLink?: React.ReactNode; backLink?: React.ReactNode; providers?: IProvider[]; } interface IProvider { name: string; icon?: React.ReactNode; label?: string; }
Add
AuthPage
as a default page to Routers📌 Added
AuthPage
to therefine-nextjs-router
. Default page isAuthPage
.📌 Added
AuthPage
to therefine-react-location
. Default page isAuthPage
.📌 Added
AuthPage
to therefine-react-router-v6
. Default page isAuthPage
.📌 Added
AuthPage
to therefine-remix-router
. Default page isAuthPage
.
3.31.0
Minor Changes
- Add React@18 support 🚀
3.30.0
Minor Changes
- #1718
b38620d842
Thanks @omeraplak! - Add React@18 support 🚀
3.29.0
Minor Changes
-
Pass the full
resource
to theaccessControlProvider
can method. This will enable Attribute Based Access Control (ABAC), for example granting permissions based on the value of a field in the resource object.const App: React.FC = () => { <Refine // other providers and props accessControlProvider={{ can: async ({ resource, action, params }) => { if (resource === "posts" && action === "edit") { return Promise.resolve({ can: false, reason: "Unauthorized", }); } // or you can access directly *resource object // const resourceName = params?.resource?.name; // const anyUsefulOption = params?.resource?.options?.yourUsefulOption; // if (resourceName === "posts" && anyUsefulOption === true && action === "edit") { // return Promise.resolve({ // can: false, // reason: "Unauthorized", // }); // } return Promise.resolve({ can: true }); }, }} />; };
3.28.0
Minor Changes
-
e78b181b12
Thanks @omeraplak! - Pass the fullresource
to theaccessControlProvider
can method. This will enable Attribute Based Access Control (ABAC), for example granting permissions based on the value of a field in the resource object.const App: React.FC = () => { <Refine // other providers and props accessControlProvider={{ can: async ({ resource, action, params }) => { if (resource === "posts" && action === "edit") { return Promise.resolve({ can: false, reason: "Unauthorized", }); } // or you can access directly *resource object // const resourceName = params?.resource?.name; // const anyUsefulOption = params?.resource?.options?.yourUsefulOption; // if (resourceName === "posts" && anyUsefulOption === true && action === "edit") { // return Promise.resolve({ // can: false, // reason: "Unauthorized", // }); // } return Promise.resolve({ can: true }); }, }} />; };
3.27.0
Minor Changes
-
All of the refine packages have dependencies on the
@pankod/refine-core
package. So far we have managed these dependencies withpeerDependencies
+dependencies
but this causes issues like #2183. (having more than one @pankod/refine-core version in node_modules and creating different instances)Managing as
peerDependencies
+devDependencies
seems like the best way for now to avoid such issues.
Patch Changes
- Fix adding the current path to the
to
parameter when redirecting to the login page afterlogout
- #2211
3.26.0
Minor Changes
-
#2217
b4aae00f77
Thanks @omeraplak! - All of the refine packages have dependencies on the@pankod/refine-core
package. So far we have managed these dependencies withpeerDependencies
+dependencies
but this causes issues like #2183. (having more than one @pankod/refine-core version in node_modules and creating different instances)Managing as
peerDependencies
+devDependencies
seems like the best way for now to avoid such issues.
3.25.3
Patch Changes
- #2214
91db05caf7
Thanks @omeraplak! - Fix adding the current path to theto
parameter when redirecting to the login page afterlogout
- #2211
3.25.2
Patch Changes
- Fixed a bug that caused
<ErrorComponent/>
to does not appear in the404
state
3.25.1
Patch Changes
- #1918
b8a4093fda
Thanks @biskuvit! - Fixed a bug that caused<ErrorComponent/>
to does not appear in the404
state
3.22.2
Patch Changes
- Updated dependencies [
2deb19babf
]:- @pankod/refine-core@3.23.2