OpenPanel/packages/remix/CHANGELOG.md
Stefan Pejcic 8595a9f4e5 back
2024-05-08 19:58:53 +02:00

16 KiB

@refinedev/remix-router

3.0.0

Major Changes

  • #5355 5acc257f8b Thanks @rodbs! - Upgrade to Remix v2

    Upgraded @refinedev/remix-router to use Remix v2. This version change does not contain any breaking changes on the @refinedev/remix-router side.

    Depending on your project's status, if you decide to upgrade to Remix v2, you may or may not need to make necessary changes to your project. Please refer to the Remix v2 upgrade guide for more information.

    If your project is created with create-refine-app which already initializes Remix projects using the v2 routing convention, you'll need to make the below changes to get rid of the warnings:

    /** @type {import('@remix-run/dev').AppConfig} */
    module.exports = {
    -  future: {
    -    v2_routeConvention: true,
    -  },
    };
    

    Due to the change in its default value, you may also need to set serverModuleFormat to "cjs" in your remix.config.js file:

    /** @type {import('@remix-run/dev').RemixConfig */
    module.exports = {
    +  serverModuleFormat: "cjs",
    };
    

    Other than the changes mentioned above, @refinedev/remix-router and rest of the Refine packages should work as expected without requiring any changes.

    Migration Guide for @refinedev/remix-router

    Install the latest version of @refinedev/remix-router and @refinedev/cli:

    npm i @refinedev/remix-router@latest @refinedev/cli@latest
    

    You'll also need to update your remix dependencies:

    npm i @remix-run/node@latest @remix-run/react@latest @remix-run/serve@latest
    

    Please refer to the Remix v2 upgrade guide for more information.

    You may also receive a warning when you try to build and run your production build on your local. This is because @remix-run/serve requires a built path to be passed to it. @refinedev/cli will provide a fallback value for this which may work for your app but CLI will still warn you about it. You can either ignore the warning or provide a built path to start command.

    {
      "scripts": {
    -    "start": "refine start",
    +    "start": "refine start ./build/index.js",
      },
    }
    

    There should be no changes necessary regarding @refinedev/remix-router but your app may need to be updated according to the changes in Remix v2. Please refer to the Remix v2 upgrade guide for more information.

2.3.1

Patch Changes

2.3.0

Minor Changes

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

2.2.0

Minor Changes

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

2.1.0

Minor Changes

  • Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk! parseTableParams helper is added to let users parse the query params in loaders to persist syncWithLocation feature in tables.

  • Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk!

    🪄 Migrating your project automatically with refine-codemod

    @refinedev/codemod package handles the breaking changes for your project automatically, without any manual steps. It migrates your project from 3.x.x to 4.x.x.

    Just cd into root folder of your project (where package.json is contained) and run this command:

    npx @refinedev/codemod@latest refine3-to-refine4
    

    And it's done. Now your project uses refine@4.x.x.

    📝 Changelog

    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/remix-router/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 @remix-run/react. 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 @remix-run/react. 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 under the hood.
    • Link: A component that accepts to prop and renders a link to the given path. Uses Link component from @remix-run/react 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 passes JSX.Element if there's a match for the given path, undefined is passed otherwise. You can use this in # @pankod/refine-remix-router splat route to render the matching action component for a resource. We're encouraging our users to use file based routing instead of # @pankod/refine-remix-router splat route which provides more flexibility and a better development experience with its performance benefits.

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

  • Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk! AuthProvider is renamed to LegacyAuthProvider with refine@4. Components and functions are updated to support LegacyAuthProvider.

  • 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

1.9.0

Minor Changes

1.8.0

Minor Changes

1.7.2

Patch Changes

1.7.1

Patch Changes

1.7.0

Minor Changes

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

  • Add splat route support to remix with handleRefineParams helper.

1.6.0

Minor Changes

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

  • Add splat route support to remix with handleRefineParams helper.

1.5.0

Minor Changes

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

  • #2486 ee4d0d112a Thanks @aliemir! - Add splat route support to remix with handleRefineParams helper.

1.4.0

Minor Changes

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

1.3.0

Minor Changes

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

1.2.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;
    }
    

1.2.2

Patch Changes

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

1.2.0

Minor Changes

  • Add checkAuthentication to handle authentication processes more easily

1.1.0

Minor Changes

1.0.2

Patch Changes

  • Our Story with Remix begins 👊

1.0.1

Patch Changes