UniqueSoft/openpanel
2
0
Fork 0
mirror of https://github.com/stefanpejcic/openpanel synced 2025-06-26 18:28:26 +00:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity
830cb41cd4
openpanel/packages/react-router-v6/CHANGELOG.md
Stefan Pejcic 09f9f9502d packages
2024-11-07 19:03:37 +01:00

28 KiB
Raw Blame History

@refinedev/react-router-v6

4.6.0

Minor Changes

  • #6159 ad401d52957bf831e47707e86cb1e2f8b8c20f4b Thanks @alicanerdurmaz! - feat: <DocumentTitleHandler/> should populated resource.meta.label field if it's not provided on the Refine's resource definition. From now on, users be able to use the resource.meta.label field to customize document title more easily.

    import {
  BrowserRouter,
  DocumentTitleHandler,
} from "@refinedev/react-router-v6";
import { Refine } from "@refinedev/core";

const App = () => {
  return (
    <BrowserRouter>
      <Refine
      /* ... */
      >
        {/* ... */}
        <DocumentTitleHandler
          handler={({ action, params, resource }) => {
            const id = params?.id ?? "";

            const actionPrefixMatcher = {
              create: "Create new ",
              clone: `#${id} Clone ${resource?.meta?.label}`,
              edit: `#${id} Edit ${resource?.meta?.label}`,
              show: `#${id} Show ${resource?.meta?.label}`,
              list: `${resource?.meta?.label}`,
            };

            const suffix = " | <Company Name>";
            const title = actionPrefixMatcher[action || "list"] + suffix;

            return title;
          }}
        />
      </Refine>
    </BrowserRouter>
  );
};

4.5.11

Patch Changes

4.5.10

Patch Changes

4.5.9

Patch Changes

  • #5928 db9756e7908 Thanks @aliemir! - fix: type errors on typescript <5

    Due to the changes in #5881, typescript users below version 5 are facing type errors. This PR fixes the type errors by updating the file extensions required by the d.mts declaration files to provide a compatible declarations for both typescript 4 and 5 users.

4.5.8

Patch Changes

  • #5850 c2ef59bf82f Thanks @aliemir! - fix: replace imports of qs with default imports

    Updated qs imports and usage to prevent issues with ESM builds and to ensure correctly importing the module.

  • #5881 ba719f6ea26 Thanks @aliemir! - fix: declaration files in node10, node16 and nodenext module resolutions

4.5.7

Patch Changes

  • #5765 0c197d82393 Thanks @aliemir! - refactor: package bundles and package.json configuration for exports

    Previously, Refine packages had exported ESM and CJS bundles with same .js extension and same types for both with .d.ts extensions. This was causing issues with bundlers and compilers to pick up the wrong files for the wrong environment. Now we're outputting ESM bundles with .mjs extension and CJS bundles with .cjs extension. Also types are now exported with both .d.mts and .d.cts extensions.

    In older versions ESM and CJS outputs of some packages were using wrong imports/requires to dependencies causing errors in some environments. This will be fixed since now we're also enforcing the module type with extensions.

    Above mentioned changes also supported with changes in package.json files of the packages to support the new extensions and types. All Refine packages now include exports fields in their configuration to make sure the correct bundle is picked up by the bundlers and compilers.

  • #5754 56ed144a0f5 Thanks @alicanerdurmaz! - chore: TypeScript upgraded to v5.x.x. #5752

4.5.6

Patch Changes

4.5.5

Patch Changes

4.5.4

Patch Changes

4.5.3

Patch Changes

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! - Added sideEffects: false to package.json to help bundlers tree-shake unused code.

4.4.0

Minor Changes

  • #4741 026ccf34356 Thanks @aliemir! - Added sideEffects: false to package.json to help bundlers tree-shake unused code.

4.3.2

Patch Changes

  • #4406 ad1856f741f Thanks @aliemir! - Fix the issue of matchPath 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 the resource definition.

4.3.1

Patch Changes

  • #4406 ad1856f741f Thanks @aliemir! - Fix the issue of matchPath 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 the resource definition.

4.3.0

Minor Changes

  • #4313 28fe67047a0 Thanks @abdellah711! - feat: dynamic window title

    This 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, the DocumentTitleHandler will generate titles using the generateDefaultDocumentTitle exported from @refinedev/core.

    The DocumentTitleHandler component accepts an optional prop called handler, which is a callback function. This function is triggered whenever the pathname 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 the useDocumentTitle hook. It accepts either a string representing the new title or an object with the property i18nKey if the app supports multiple languages.

    useDocumentTitle({ i18nKey: "documentTitle.default" });

4.2.0

Minor Changes

  • #4313 28fe67047a0 Thanks @abdellah711! - feat: dynamic window title

    This 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, the DocumentTitleHandler will generate titles using the generateDefaultDocumentTitle exported from @refinedev/core.

    The DocumentTitleHandler component accepts an optional prop called handler, which is a callback function. This function is triggered whenever the pathname 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 the useDocumentTitle hook. It accepts either a string representing the new title or an object with the property i18nKey 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 export

    New routerBindings contains following properties;

    • go: Which returns a function to handle the navigation in react-router-v6. It accepts a config object and navigates to the given path. Uses useNavigate hook under the hood.
    • back: Which returns a function to handle the navigation in react-router-v6. It navigates back to the previous page. Uses useNavigate hook under the hood.
    • parse: Which returns a function to parse the given path and returns the resource, id, action and additional params. Uses useParams and useLocation hooks and qs package under the hood.
    • Link: A component that accepts to prop and renders a link to the given path. Uses Link component from react-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 of routerProvider prop. RefineRoutes component accepts a render function as a child and passed a JSX.Element array containing Route components for the resource routes. You can wrap it to a Routes component and let it handle the route creation process for you. Additionally, If you want to add custom routes, you can place them inside the Routes component or you can place an another Routes component. Both apporaches are now valid and accepted by refine.

    • NavigateToResource - A component that navigates to the first list action of the resources array of <Refine>. Optionally, you can pass a resource prop to navigate to list action of the resource. This can be placed at the index 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 the Refine 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 using react-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

3.39.0

Minor Changes

3.38.0

Minor Changes

3.37.0

Minor Changes

3.36.6

Patch Changes

3.36.5

Patch Changes

3.36.4

Patch Changes

3.36.3

Patch Changes

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 missing BrowserRouterComponent 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 to RouterComponent component.

3.35.0

Minor Changes

  • Added ability to manage the initial route of refine by binding initialRoute variable to RouterComponent component.

3.34.0

Minor Changes

  • #2486 ee4d0d112a Thanks @aliemir! - Added ability to manage the initial route of refine by binding initialRoute variable to RouterComponent component.

3.33.2

Patch Changes

  • Fixed version of react-router to 6.3.0

3.33.1

Patch Changes

3.33.0

Minor Changes

  • Update type declaration generation with tsc instead of tsup for better navigation throughout projects source code.

3.32.0

Minor Changes

  • #2440 0150dcd070 Thanks @aliemir! - Update type declaration generation with tsc instead of tsup for better navigation throughout projects source code.

3.31.3

Patch Changes

  • Fixed default login page is <LoginPage>.

  • 🎉 Added AuthPage component to the refine app. This page is used to login, register, forgot password and update password. Login page is default page and old LoginPage component is deprecated.

    New Auth Hooks

    📌 Added useRegister hook. This hook is used to register new user. useRegister falls into register function of AuthProvider.

    📌 Added useForgotPassword hook. This hook is used to forgot password. useForgotPassword falls into forgotPassword function of AuthProvider.

    📌 Added useUpdatePassword hook. This hook is used to update password. useUpdatePassword falls into updatePassword function of AuthProvider.

    - <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

3.31.1

Patch Changes

  • #2299 a02cb9e8ef Thanks @biskuvit! - 🎉 Added AuthPage to the refine app. This page is used to login, register, forgot password and update password. Login page is default page and old LoginPage component is deprecated.

    New Auth Hooks

    📌 Added useRegister hook. This hook is used to register new user. useRegister falls into register function of AuthProvider.

    📌 Added useForgotPassword hook. This hook is used to forgot password. useForgotPassword falls into forgotPassword function of AuthProvider.

    📌 Added useUpdatePassword hook. This hook is used to update password. useUpdatePassword falls into updatePassword function of AuthProvider.

    - <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 the refine-nextjs-router. Default page is AuthPage.

    📌 Added AuthPage to the refine-react-location. Default page is AuthPage.

    📌 Added AuthPage to the refine-react-router-v6. Default page is AuthPage.

    📌 Added AuthPage to the refine-remix-router. Default page is AuthPage.

3.31.0

Minor Changes

  • Add React@18 support 🚀

3.30.0

Minor Changes

3.29.0

Minor Changes

  • Pass the full resource to the accessControlProvider 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 full resource to the accessControlProvider 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 with peerDependencies + 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 after logout - #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 with peerDependencies + 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 the to parameter when redirecting to the login page after logout - #2211

3.25.2

Patch Changes

  • Fixed a bug that caused <ErrorComponent/> to does not appear in the 404 state

3.25.1

Patch Changes

3.22.2

Patch Changes

  • Updated dependencies [2deb19babf]:
    • @pankod/refine-core@3.23.2