diff --git a/.changeset/afraid-baboons-roll.md b/.changeset/afraid-baboons-roll.md new file mode 100644 index 000000000000..35fd58da89d1 --- /dev/null +++ b/.changeset/afraid-baboons-roll.md @@ -0,0 +1,18 @@ +--- +"@refinedev/mui": minor +--- + +feat: [`useAutocomplete`](https://refine.dev/docs/ui-integrations/material-ui/hooks/use-auto-complete/)'s `queryResult` and `defaultValueQueryResult` is deprecated, use `query` and `defaultValueQuery` instead. #6179 + +```diff +import { useAutocomplete } from '@refinedev/mui'; + +- const { queryResult, defaultValueQueryResult } = useAutocomplete(); ++ const { query, defaultValueQuery } = useAutocomplete(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/bright-dryers-march.md b/.changeset/bright-dryers-march.md new file mode 100644 index 000000000000..b7ea86c368ae --- /dev/null +++ b/.changeset/bright-dryers-march.md @@ -0,0 +1,5 @@ +--- +"@refinedev/core": patch +--- + +Bump `@refinedev/devtools-internal` dependency to reflect the latest changes in the Refine Devtools. diff --git a/.changeset/chilled-cherries-sin.md b/.changeset/chilled-cherries-sin.md new file mode 100644 index 000000000000..7937842ab782 --- /dev/null +++ b/.changeset/chilled-cherries-sin.md @@ -0,0 +1,9 @@ +--- +"@refinedev/core": patch +--- + +fix(core): fixed type issue in useSelect. #6223 + +Previously, the types would not allow functions to be passed as props. After this change, it will be possible. + +[Resolves #6223](https://github.com/refinedev/refine/issues/6223) diff --git a/.changeset/cold-olives-allow.md b/.changeset/cold-olives-allow.md new file mode 100644 index 000000000000..b6b67e2c18cb --- /dev/null +++ b/.changeset/cold-olives-allow.md @@ -0,0 +1,11 @@ +--- +"@refinedev/mui": patch +--- + +fix(mui): horizontal scroll is broken in + +Due to the changes in CSS rendering in latest Google Chrome updates, `` components are not properly sized when used inside `` component. The `overflow: clip` property in the layout content is causing either miscalculations on the data grid width or causing an overflow on the container and overlapping with the sidebar. + +This change replaces the `overflow: clip` property with `min-height` and `min-width` properties to ensure the layout content is properly rendered and responsive to the content inside it. + +[Resolves #6077](https://github.com/refinedev/refine/issues/6077) diff --git a/.changeset/cool-cougars-shop.md b/.changeset/cool-cougars-shop.md new file mode 100644 index 000000000000..8cbae1304a5e --- /dev/null +++ b/.changeset/cool-cougars-shop.md @@ -0,0 +1,18 @@ +--- +"@refinedev/core": minor +--- + +feat: [`useSelect`](https://refine.dev/docs/data/hooks/use-select/)'s `queryResult` and `defaultValueQueryResult` is deprecated, use `query` and `defaultValueQuery` instead. #6179 + +```diff +import { useSelect } from '@refinedev/core'; + +- const { queryResult, defaultValueQueryResult } = useSelect(); ++ const { query, defaultValueQuery } = useSelect(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/cyan-fireants-melt.md b/.changeset/cyan-fireants-melt.md new file mode 100644 index 000000000000..768404dec693 --- /dev/null +++ b/.changeset/cyan-fireants-melt.md @@ -0,0 +1,11 @@ +--- +"@refinedev/cli": minor +--- + +feat(cli): improve the resource add command to generate page files for Next.js + +When using the add resource command in a project using Next.js, a page will be generated to perform the selected actions for that resource. + +These pages simply display generated components that perform actions on the resource. The placement of page files assumes operation with the App Router. If you prefer to use the Page Router instead, you'll need to move them manually. + +[Resolves #6091](https://github.com/refinedev/refine/issues/6091) diff --git a/.changeset/eleven-bottles-rush.md b/.changeset/eleven-bottles-rush.md new file mode 100644 index 000000000000..93c2fc6f3d90 --- /dev/null +++ b/.changeset/eleven-bottles-rush.md @@ -0,0 +1,7 @@ +--- +"@refinedev/cli": minor +--- + +feat: Automatically install `@refinedev/inferencer` if missing after generating new resources. + +[Resolves #6220](https://github.com/refinedev/refine/issues/6220) diff --git a/.changeset/famous-donuts-bake.md b/.changeset/famous-donuts-bake.md new file mode 100644 index 000000000000..920dad2fc93d --- /dev/null +++ b/.changeset/famous-donuts-bake.md @@ -0,0 +1,5 @@ +--- +"@refinedev/core": patch +--- + +AuthPage in Next.js generates code with i18n but the folder hooks is not created. imported useTranslate from @hooks to fix the issue diff --git a/.changeset/fast-badgers-drum.md b/.changeset/fast-badgers-drum.md new file mode 100644 index 000000000000..2f660942c6c2 --- /dev/null +++ b/.changeset/fast-badgers-drum.md @@ -0,0 +1,62 @@ +--- +"@refinedev/core": minor +--- + +feat: [Mutation parameters](https://refine.dev/docs/data/hooks/use-update/#mutation-parameters) should be given as a prop to the `useUpdate` hook. #6102 +From now on, you can pass mutation parameters to the `useUpdate` hook as a prop. + +Old usage of `useUpdate` hook: + +```tsx +import { useUpdate } from "@refinedev/core"; + +const { mutate } = useUpdate(); + +mutate( + { + resource: "products", + id: 1, + mutationMode: "optimistic", + successNotification: false, + values: { + name: "New Product", + material: "Wood", + }, + }, + { + onSuccess: () => { + /* do something after mutation success */ + }, + }, +); +``` + +New usage of `useUpdate` hook: + +```tsx +import { useUpdate } from "@refinedev/core"; + +const { mutate } = useUpdate({ + resource: "products", + successNotification: false, + mutationMode: "optimistic", + mutationOptions: { + onSuccess: () => { + /* do something after mutation success */ + }, + }, +}); + +mutate({ + // also you can override the parameters given to the hook + id: 1, + values: { + name: "New Product", + material: "Wood", + }, +}); +``` + +You can think of the parameters given to the `useUpdate` hook as default values, while the parameters given to the `mutate` function are the values used for that specific mutation or dynamic values. + +> 🚨 If you pass these parameters to the `mutate` function, it will override the values given to the hook. diff --git a/.changeset/fast-hounds-guess.md b/.changeset/fast-hounds-guess.md new file mode 100644 index 000000000000..f548f66278d2 --- /dev/null +++ b/.changeset/fast-hounds-guess.md @@ -0,0 +1,9 @@ +--- +"@refinedev/mui": patch +--- + +fix(use-data-grid): incompatible types when using data-grid-pro + +useDataGrid overide DataGridPropsType onFilterModelChange. + +[Fixes #5997](https://github.com/refinedev/refine/issues/5997) diff --git a/.changeset/five-pianos-march.md b/.changeset/five-pianos-march.md new file mode 100644 index 000000000000..fea5c89bbcd2 --- /dev/null +++ b/.changeset/five-pianos-march.md @@ -0,0 +1,44 @@ +--- +"@refinedev/react-router-v6": minor +--- + +feat: [``](https://refine.dev/docs/routing/integrations/react-router/#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. + +```tsx +import { + BrowserRouter, + DocumentTitleHandler, +} from "@refinedev/react-router-v6"; +import { Refine } from "@refinedev/core"; + +const App = () => { + return ( + + + {/* ... */} + { + 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 = " | "; + const title = actionPrefixMatcher[action || "list"] + suffix; + + return title; + }} + /> + + + ); +}; +``` diff --git a/.changeset/flat-boats-knock.md b/.changeset/flat-boats-knock.md new file mode 100644 index 000000000000..0e853968d6fe --- /dev/null +++ b/.changeset/flat-boats-knock.md @@ -0,0 +1,5 @@ +--- +"@refinedev/cli": patch +--- + +fix: `yarn refine update` removes semver range specifiers(`^`, `~`) from `package.json`. #6134 diff --git a/.changeset/four-carpets-fix.md b/.changeset/four-carpets-fix.md new file mode 100644 index 000000000000..3711dc3f484f --- /dev/null +++ b/.changeset/four-carpets-fix.md @@ -0,0 +1,44 @@ +--- +"@refinedev/nextjs-router": minor +--- + +feat: [``](https://refine.dev/docs/routing/integrations/next-js/#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. + +```tsx +import { + BrowserRouter, + DocumentTitleHandler, +} from "@refinedev/react-router-v6"; +import { Refine } from "@refinedev/core"; + +const App = () => { + return ( + + + {/* ... */} + { + 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 = " | "; + const title = actionPrefixMatcher[action || "list"] + suffix; + + return title; + }} + /> + + + ); +}; +``` diff --git a/.changeset/gentle-vans-tease.md b/.changeset/gentle-vans-tease.md new file mode 100644 index 000000000000..837bda3ce71c --- /dev/null +++ b/.changeset/gentle-vans-tease.md @@ -0,0 +1,36 @@ +--- +"@refinedev/antd": minor +--- + +feat: [`useSelect`](https://refine.dev/docs/ui-integrations/ant-design/hooks/use-select/)'s `queryResult` and `defaultValueQueryResult` is deprecated, use `query` and `defaultValueQuery` instead. #6179 + +```diff +import { useSelect } from '@refinedev/antd'; + +- const { queryResult, defaultValueQueryResult } = useSelect(); ++ const { query, defaultValueQuery } = useSelect(); +``` + +feat: [`useCheckboxGroup`](https://refine.dev/docs/ui-integrations/ant-design/hooks/use-checkbox-group/)'s `queryResult` is deprecated, use `query` instead. + +```diff +import { useCheckboxGroup } from '@refinedev/antd'; + +- const { queryResult } = useCheckboxGroup(); ++ const { query } = useCheckboxGroup(); +``` + +feat: [`useRadioGroup`](https://refine.dev/docs/ui-integrations/ant-design/hooks/use-radio-group/)'s `queryResult` is deprecated, use `query` instead. + +```diff +import { useRadioGroup } from '@refinedev/antd'; + +- const { queryResult } = useRadioGroup(); ++ const { query } = useRadioGroup(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/gorgeous-stingrays-unite.md b/.changeset/gorgeous-stingrays-unite.md new file mode 100644 index 000000000000..3c7878f11972 --- /dev/null +++ b/.changeset/gorgeous-stingrays-unite.md @@ -0,0 +1,60 @@ +--- +"@refinedev/core": minor +--- + +feat: [Mutation parameters](https://refine.dev/docs/data/hooks/use-create/#mutation-parameters) should be given as a prop to the `useCreate` hook. #6113 +From now on, you can pass mutation parameters to the `useCreate` hook as a prop. + +Old usage of `useCreate` hook: + +```tsx +import { useCreate } from "@refinedev/core"; + +const { mutate } = useCreate(); + +mutate( + { + resource: "products", + values: { + name: "New Product", + material: "Wood", + }, + mutationMode: "optimistic", + successNotification: false, + }, + { + onSuccess: () => { + /* do something after mutation success */ + }, + }, +); +``` + +New usage of `useCreate` hook: + +```tsx +import { useCreate } from "@refinedev/core"; + +const { mutate } = useCreate({ + resource: "products", + successNotification: false, + mutationMode: "optimistic", + mutationOptions: { + onSuccess: () => { + /* do something after mutation success */ + }, + }, +}); + +mutate({ + // also you can override the parameters given to the hook + values: { + name: "New Product", + material: "Wood", + }, +}); +``` + +You can think of the parameters given to the `useCreate` hook as default values, while the parameters given to the `mutate` function are the values used for that specific mutation or dynamic values. + +> 🚨 If you pass these parameters to the `mutate` function, it will override the values given to the hook. diff --git a/.changeset/great-hotels-teach.md b/.changeset/great-hotels-teach.md new file mode 100644 index 000000000000..b7c38d43b495 --- /dev/null +++ b/.changeset/great-hotels-teach.md @@ -0,0 +1,5 @@ +--- +"@refinedev/inferencer": patch +--- + +feat: inferencer now uses `query` a instead of the deprecated `queryResult` when generating code for `useShow`. #6173 diff --git a/.changeset/hot-cougars-dream.md b/.changeset/hot-cougars-dream.md new file mode 100644 index 000000000000..0dba6d21ea30 --- /dev/null +++ b/.changeset/hot-cougars-dream.md @@ -0,0 +1,7 @@ +--- +"@refinedev/supabase": patch +--- + +feat: added support for between filter in supabase dataProvider. Maps values to gte & lte. + +[Feat #6119](https://github.com/refinedev/refine/issues/6119) diff --git a/.changeset/itchy-dancers-walk.md b/.changeset/itchy-dancers-walk.md new file mode 100644 index 000000000000..f5b93127be74 --- /dev/null +++ b/.changeset/itchy-dancers-walk.md @@ -0,0 +1,18 @@ +--- +"@refinedev/core": minor +--- + +feat: [`useTable`](https://refine.dev/docs/data/hooks/use-table/)'s `tableQueryResult` is deprecated, use `tableQuery` instead. #6169 + +```diff +import { useTable } from '@refinedev/core'; + +- const { tableQueryResult } = useTable(); ++ const { tableQuery } = useTable(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/itchy-houses-provide.md b/.changeset/itchy-houses-provide.md new file mode 100644 index 000000000000..c3081b601071 --- /dev/null +++ b/.changeset/itchy-houses-provide.md @@ -0,0 +1,9 @@ +--- +"@refinedev/nestjsx-crud": patch +--- + +fix: update empty filter checks + +Updated the conditions to properly check empty filters + +[Fixes #6146](https://github.com/refinedev/refine/issues/6146) diff --git a/.changeset/lemon-days-press.md b/.changeset/lemon-days-press.md new file mode 100644 index 000000000000..6c0b07e97557 --- /dev/null +++ b/.changeset/lemon-days-press.md @@ -0,0 +1,18 @@ +--- +"@refinedev/core": minor +--- + +feat: [`useForm`](https://refine.dev/docs/data/hooks/use-form/)'s `queryResult` is deprecated, use `query` instead. #6163 + +```diff +import { useForm } from '@refinedev/core'; + +- const { queryResult } = useForm(); ++ const { query } = useForm(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/metal-eagles-notice.md b/.changeset/metal-eagles-notice.md new file mode 100644 index 000000000000..7407adb30fe6 --- /dev/null +++ b/.changeset/metal-eagles-notice.md @@ -0,0 +1,13 @@ +--- +"@refinedev/react-hook-form": minor +"@refinedev/inferencer": minor +"@refinedev/chakra-ui": minor +"@refinedev/codemod": minor +"@refinedev/mui": minor +--- + +feat(react-hook-form): update version constraint from `^7.30.0` to `^7.43.5` + +Update react-hook-form version to address runtime subscribe error + +[Fixes #6139](https://github.com/refinedev/refine/issues/6139) diff --git a/.changeset/modern-panthers-clean.md b/.changeset/modern-panthers-clean.md new file mode 100644 index 000000000000..16f5662a3dcd --- /dev/null +++ b/.changeset/modern-panthers-clean.md @@ -0,0 +1,13 @@ +--- +"@refinedev/devtools": patch +--- + +refactor(devtools): check both parent and child nodes for representation + +Previously, Refine Devtools's X-Ray feature looked for the representation of the components by looking at the parent nodes until a proper `stateNode` was found. This was problematic when the parent node was not a proper HTML element. A lack of type checking caused the feature to break in runtime in some cases. + +Adding only a type check for the `stateNode` is not enough since there may be cases where there are no proper HTML elements in the parent nodes. This change adds a check for the child nodes as well. This way, the feature will look for the representation in both the parent and child nodes. + +First check for a representation node will be done in the child nodes. If a proper representation is not found, an element will be searched in the parent nodes. If a no proper representation is found in the parent nodes, `document.body` will be used as the representation. + +[Resolves #6219](https://github.com/refinedev/refine/issues/6219) diff --git a/.changeset/nervous-spiders-check.md b/.changeset/nervous-spiders-check.md new file mode 100644 index 000000000000..5cd6543c37ab --- /dev/null +++ b/.changeset/nervous-spiders-check.md @@ -0,0 +1,72 @@ +--- +"@refinedev/core": minor +--- + +feat: [Mutation parameters](https://refine.dev/docs/data/hooks/use-create-many/#mutation-parameters) should be given as a prop to the `useCreateMany` hook. #6114 +From now on, you can pass mutation parameters to the `useCreateMany` hook as a prop. + +Old usage of `useCreateMany` hook: + +```tsx +import { useCreateMany } from "@refinedev/core"; + +const { mutate } = useCreateMany(); + +mutate( + { + resource: "products", + values: [ + { + name: "Product 1", + material: "Wood", + }, + { + name: "Product 2", + material: "Metal", + }, + ], + mutationMode: "optimistic", + successNotification: false, + }, + { + onSuccess: () => { + /* do something after mutation success */ + }, + }, +); +``` + +New usage of `useCreateMany` hook: + +```tsx +import { useCreateMany } from "@refinedev/core"; + +const { mutate } = useCreateMany({ + resource: "products", + successNotification: false, + mutationMode: "optimistic", + mutationOptions: { + onSuccess: () => { + /* do something after mutation success */ + }, + }, +}); + +mutate({ + // also you can override the parameters given to the hook + values: [ + { + name: "Product 1", + material: "Wood", + }, + { + name: "Product 2", + material: "Metal", + }, + ], +}); +``` + +You can think of the parameters given to the `useCreateMany` hook as default values, while the parameters given to the `mutate` function are the values used for that specific mutation or dynamic values. + +> 🚨 If you pass these parameters to the `mutate` function, it will override the values given to the hook. diff --git a/.changeset/odd-rats-travel.md b/.changeset/odd-rats-travel.md new file mode 100644 index 000000000000..5b91a7efd66d --- /dev/null +++ b/.changeset/odd-rats-travel.md @@ -0,0 +1,9 @@ +--- +"@refinedev/devtools-ui": patch +--- + +feat: Onboarding page of the DevTools improved. + +- Loading animation added. +- Client-side form validation added. +- Error handling improved. diff --git a/.changeset/odd-squids-invite.md b/.changeset/odd-squids-invite.md new file mode 100644 index 000000000000..f9d54479acba --- /dev/null +++ b/.changeset/odd-squids-invite.md @@ -0,0 +1,14 @@ +--- +"@refinedev/cli": patch +--- + +fix: `refine add resource` generating invalid React component name. #6225 + +`refine add resource blog-posts` command was generating invalid React component name when the resource name contains a hyphen. This issue has been fixed by converting the resource name to PascalCase before generating the React component name. + +```diff +- export const Blog-PostsList: React.FC = () => {}; ++ export const BlogPostsList: React.FC = () => {}; +``` + +[Resolves #6225](https://github.com/refinedev/refine/issues/6225) diff --git a/.changeset/perfect-monkeys-burn.md b/.changeset/perfect-monkeys-burn.md new file mode 100644 index 000000000000..9d3819ae5ef9 --- /dev/null +++ b/.changeset/perfect-monkeys-burn.md @@ -0,0 +1,18 @@ +--- +"@refinedev/mantine": minor +--- + +feat: [`useSelect`](https://refine.dev/docs/ui-integrations/mantine/hooks/use-select/)'s `queryResult` and `defaultValueQueryResult` is deprecated, use `query` and `defaultValueQuery` instead. #6179 + +```diff +import { useSelect } from '@refinedev/mantine'; + +- const { queryResult, defaultValueQueryResult } = useSelect(); ++ const { query, defaultValueQuery } = useSelect(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/polite-spies-smile.md b/.changeset/polite-spies-smile.md new file mode 100644 index 000000000000..a96e66427acf --- /dev/null +++ b/.changeset/polite-spies-smile.md @@ -0,0 +1,18 @@ +--- +"@refinedev/core": minor +--- + +feat: [`useShow`](https://refine.dev/docs/data/hooks/use-show/)'s `queryResult` is deprecated, use `query` instead. #6173 + +```diff +import { useShow } from '@refinedev/core'; + +- const { queryResult } = useShow(); ++ const { query } = useShow(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/popular-bees-smash.md b/.changeset/popular-bees-smash.md new file mode 100644 index 000000000000..207e07171d80 --- /dev/null +++ b/.changeset/popular-bees-smash.md @@ -0,0 +1,23 @@ +--- +"@refinedev/chakra-ui": patch +"@refinedev/mantine": patch +"@refinedev/antd": patch +"@refinedev/mui": patch +--- + +fix(auth-page): fix wrong translation keys in `type="register"` and `type="forgotPassword"` + +In `type="forgotPassword"`: + +- `"pages.register.buttons.haveAccount"` is replaced with `"pages.forgotPassword.buttons.haveAccount"` +- `"pages.login.signin"` is replaced with `"pages.forgotPassword.signin"` + +In `type="register"`: + +- `"pages.login.divider"` is replaced with `"pages.register.divider"` +- `"pages.login.buttons.haveAccount"` is replaced with `"pages.register.buttons.haveAccount"` +- `"pages.login.signin"` is replaced with `"pages.register.signin"` + +Wrong keys are kept as fallbacks in case the new keys are not found in the translation file. If you are using those keys in your project, make sure to update them accordingly. Fallback keys will be removed in future releases. + +[Resolves #5816](https://github.com/refinedev/refine/issues/5816) diff --git a/.changeset/pretty-gifts-try.md b/.changeset/pretty-gifts-try.md new file mode 100644 index 000000000000..e2cd457fa006 --- /dev/null +++ b/.changeset/pretty-gifts-try.md @@ -0,0 +1,7 @@ +--- +"@refinedev/nestjs-query": patch +--- + +Custom requests now correctly support GET requests and makes uses of custom URL and headers. + +Resolves #6112 diff --git a/.changeset/pretty-snails-shake.md b/.changeset/pretty-snails-shake.md new file mode 100644 index 000000000000..3872a2b2f284 --- /dev/null +++ b/.changeset/pretty-snails-shake.md @@ -0,0 +1,9 @@ +--- +"@refinedev/devtools-internal": patch +--- + +fix(devtools-internal): fix noop return on hooks for production builds + +Currently, `@refinedev/devtools-internal` returns noop function when bundled for production, yet the notation is not correctly interpreted by some bundlers. This PR fixes the issue by moving the empty return and noop functions to a separate definition. + +[Resolves #6030](https://github.com/refinedev/refine/issues/6030) diff --git a/.changeset/quick-rats-eat.md b/.changeset/quick-rats-eat.md new file mode 100644 index 000000000000..2085f2fded76 --- /dev/null +++ b/.changeset/quick-rats-eat.md @@ -0,0 +1,11 @@ +--- +"@refinedev/cli": patch +--- + +feat(cli): create base translation files for i18n provider in add provider command + +Currently `refine add provider i18n` command is only creating a demo i18n provider implementation but misses the translation files. This PR adds the base translation files for the i18n provider which is used by Refine internally in hooks, notifications and components. + +Now `locale/en.json` will be added with primarily used translation keys and values for the i18n provider. + +[Resolves #5918](https://github.com/refinedev/refine/issues/5918) diff --git a/.changeset/red-pans-tap.md b/.changeset/red-pans-tap.md new file mode 100644 index 000000000000..906d73471c9e --- /dev/null +++ b/.changeset/red-pans-tap.md @@ -0,0 +1,5 @@ +--- +"@refinedev/inferencer": patch +--- + +feat: inferencer now uses `query` and `mutation` instead of the deprecated `queryResult` and `mutationResult` when generating code for `useForm`. #6163 diff --git a/.changeset/rich-swans-prove.md b/.changeset/rich-swans-prove.md new file mode 100644 index 000000000000..431af2847721 --- /dev/null +++ b/.changeset/rich-swans-prove.md @@ -0,0 +1,18 @@ +--- +"@refinedev/mui": minor +--- + +feat: [`useDataGrid`](https://refine.dev/docs/ui-integrations/material-ui/hooks/use-data-grid/)'s `tableQueryResult` is deprecated, use `tableQuery` instead. #6169 + +```diff +import { useDataGrid } from '@refinedev/mui'; + +- const { tableQueryResult } = useDataGrid(); ++ const { tableQuery } = useDataGrid(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/shiny-planes-obey.md b/.changeset/shiny-planes-obey.md new file mode 100644 index 000000000000..d4e7c29c0c22 --- /dev/null +++ b/.changeset/shiny-planes-obey.md @@ -0,0 +1,11 @@ +--- +"@refinedev/cli": patch +--- + +fix(cli): avoid polluting `process.env` with unwanted environment variables + +Previously, the `@refinedev/cli` used `dotenv` to load environment variables from `.env` files and populate `process.env`. This caused issues when the users app has a different convention for environment variables, e.g. `.env.development`, `.env.production`, etc. + +Now, the `@refinedev/cli` will read the file but avoid populating `process.env` with the variables and keep the values in its scope without passing them to the child processes. This will prevent unwanted environment variables from being passed to the child processes and avoid conflicts with the user's environment variables. + +[Resolves #5803](https://github.com/refinedev/refine/issues/5803) diff --git a/.changeset/silly-lions-destroy.md b/.changeset/silly-lions-destroy.md new file mode 100644 index 000000000000..00e330983124 --- /dev/null +++ b/.changeset/silly-lions-destroy.md @@ -0,0 +1,12 @@ +--- +"@refinedev/chakra-ui": patch +"@refinedev/mantine": patch +"@refinedev/antd": patch +"@refinedev/mui": patch +--- + +fix(date-field): falsy values should render empty string + +Previously, `` was rendering the current date. After this change, it will render empty string if a falsy value is provided. + +[Resolves #6216](https://github.com/refinedev/refine/issues/6216) diff --git a/.changeset/silver-crabs-relax.md b/.changeset/silver-crabs-relax.md new file mode 100644 index 000000000000..a4c7838ee828 --- /dev/null +++ b/.changeset/silver-crabs-relax.md @@ -0,0 +1,16 @@ +--- +"@refinedev/appwrite": major +--- + +feat(package/appwrite): update `Appwrite` SDK to `v15` + +Updated `appwrite` SDK version to `v15` to match latest server version. Depending on your server version upgrading to this version should be safe but may require some changes in your codebase if you are using `appwrite` SDK directly. + +If you're using the `data-provider-appwrite` example as base or created your app using the `create-refine-app` CLI, your auth provider implementation may require a small change in the `login` method: + +```diff +- await account.createEmailSession(email, password); ++ await account.createEmailPasswordSession(email, password); +``` + +[Resolves #6090](https://github.com/refinedev/refine/issues/6090) diff --git a/.changeset/sixty-countries-nail.md b/.changeset/sixty-countries-nail.md new file mode 100644 index 000000000000..4e2ff50b0aaa --- /dev/null +++ b/.changeset/sixty-countries-nail.md @@ -0,0 +1,27 @@ +--- +"@refinedev/antd": minor +--- + +feat: [`useTable`](https://refine.dev/docs/ui-integrations/ant-design/hooks/use-table/)'s `tableQueryResult` is deprecated, use `tableQuery` instead. #6169 + +```diff +import { useTable } from '@refinedev/core'; + +- const { tableQueryResult } = useTable(); ++ const { tableQuery } = useTable(); +``` + +feat: [`useSimpleList`](https://refine.dev/docs/ui-integrations/ant-design/hooks/use-simple-list/)'s `queryResult` is deprecated, use `query` instead. #6169 + +```diff +import { useSimpleList } from '@refinedev/antd'; + +- const { queryResult } = useSimpleList(); ++ const { query } = useSimpleList(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/small-ghosts-know.md b/.changeset/small-ghosts-know.md new file mode 100644 index 000000000000..30538c3a2382 --- /dev/null +++ b/.changeset/small-ghosts-know.md @@ -0,0 +1,32 @@ +--- +"@refinedev/codemod": minor +--- + +feat: added `npx @refinedev/codemod@latest rename-query-and-mutation-result` to automatically refactor all deprecated values to their new values on the august release #6154 + +Following exameples are the changes that will be made: + +```diff +- const { tableQueryResult } = useTable(); // or useDataGrid ++ const { tableQuery } = useTable(); +``` + +```diff +- const { queryResult } = useSimpleList(); ++ const { query } = useSimpleList() +``` + +```diff +- const { queryResult, mutationResult } = useForm(); ++ const { query, mutation } = useForm(); +``` + +```diff +- const { queryResult } = useShow(); ++ const { query } = useShow(); +``` + +```diff +- const { queryResult, defaultValueQueryResult } = useSelect(); // or useAutocomplete, useCheckboxGroup, useRadioGroup ++ const { query, defaultValueQuery } = useSelect(); +``` diff --git a/.changeset/sour-ravens-begin.md b/.changeset/sour-ravens-begin.md new file mode 100644 index 000000000000..f3b92017cbc3 --- /dev/null +++ b/.changeset/sour-ravens-begin.md @@ -0,0 +1,16 @@ +--- +"@refinedev/core": patch +--- + +fix: `invalidates` prop of `useUpdateMany` doesn't work. #6209 + +From now on, the `invalidates` prop of the `useUpdateMany` hook will work as expected. + +```tsx +const { mutate } = useUpdateMany({ + resource: "posts", + invalidates: ["all"], // invalidates all queries of the "posts" resource +}); + +mutate({ ids: [1, 2, 3], values: { title: "new title" } }); +``` diff --git a/.changeset/spotty-rocks-matter.md b/.changeset/spotty-rocks-matter.md new file mode 100644 index 000000000000..783a147dd4f2 --- /dev/null +++ b/.changeset/spotty-rocks-matter.md @@ -0,0 +1,7 @@ +--- +"@refinedev/core": patch +--- + +chore(devtools): bump internal devtools dependency + +Bump `@refinedev/devtools-internal` version. diff --git a/.changeset/strange-nails-try.md b/.changeset/strange-nails-try.md new file mode 100644 index 000000000000..55c818008f93 --- /dev/null +++ b/.changeset/strange-nails-try.md @@ -0,0 +1,18 @@ +--- +"@refinedev/core": minor +--- + +feat: [`useForm`](https://refine.dev/docs/data/hooks/use-form/)'s `mutationResult` is deprecated, use `mutation` instead. #6163 + +```diff +import { useForm } from '@refinedev/core'; + +- const { mutationResult } = useForm(); ++ const { mutation } = useForm(); +``` + +> ✨ You can use `@refinedev/codemod` to automatically migrate your codebase. Simply run the following command in your project's root directory: +> +> ```bash +> npx @refinedev/codemod@latest rename-query-and-mutation-result +> ``` diff --git a/.changeset/thin-adults-complain.md b/.changeset/thin-adults-complain.md new file mode 100644 index 000000000000..7fbd9b9e0751 --- /dev/null +++ b/.changeset/thin-adults-complain.md @@ -0,0 +1,9 @@ +--- +"@refinedev/core": minor +--- + +fix: update debounce behavior on `onSearch` in `useSelect` + +Now debounce behavior is working correctly on `onSearch` in `useSelect` when using inside `Controller` of react-hook-form. + +Resolves [#6096](https://github.com/refinedev/refine/issues/6096) diff --git a/.changeset/thirty-files-crash.md b/.changeset/thirty-files-crash.md new file mode 100644 index 000000000000..ca8e4a51d886 --- /dev/null +++ b/.changeset/thirty-files-crash.md @@ -0,0 +1,7 @@ +--- +"@refinedev/devtools": patch +--- + +fix(devtools): styling issues in the X-Ray feature + +A minimum size was set for the X-Ray feature's overlay to prevent it from being too small. diff --git a/.changeset/tidy-peaches-flow.md b/.changeset/tidy-peaches-flow.md new file mode 100644 index 000000000000..e07655fdf3f0 --- /dev/null +++ b/.changeset/tidy-peaches-flow.md @@ -0,0 +1,62 @@ +--- +"@refinedev/core": minor +--- + +feat: [Mutation parameters](https://refine.dev/docs/data/hooks/use-update-many/#mutation-parameters) should be given as a prop to the `useUpdateMany` hook. #6115 +From now on, you can pass mutation parameters to the `useUpdateMany` hook as a prop. + +Old usage of `useUpdateMany` hook: + +```tsx +import { useUpdateMany } from "@refinedev/core"; + +const { mutate } = useUpdateMany(); + +mutate( + { + resource: "products", + values: { + name: "New Product", + material: "Wood", + }, + ids: [1, 2, 3], + mutationMode: "optimistic", + successNotification: false, + }, + { + onSuccess: () => { + /* do something after mutation success */ + }, + }, +); +``` + +New usage of `useUpdateMany` hook: + +```tsx +import { useUpdateMany } from "@refinedev/core"; + +const { mutate } = useUpdateMany({ + resource: "products", + successNotification: false, + mutationMode: "optimistic", + mutationOptions: { + onSuccess: () => { + /* do something after mutation success */ + }, + }, +}); + +mutate({ + ids: [1, 2, 3], + values: { + name: "New Product", + material: "Wood", + }, + // also you can override the parameters given to the hook +}); +``` + +You can think of the parameters given to the `useUpdateMany` hook as default values, while the parameters given to the `mutate` function are the values used for that specific mutation or dynamic values. + +> 🚨 If you pass these parameters to the `mutate` function, it will override the values given to the hook. diff --git a/.changeset/twenty-months-bathe.md b/.changeset/twenty-months-bathe.md new file mode 100644 index 000000000000..fd91b0298fc4 --- /dev/null +++ b/.changeset/twenty-months-bathe.md @@ -0,0 +1,26 @@ +--- +"@refinedev/cli": patch +"@refinedev/devtools-server": minor +"@refinedev/devtools-shared": minor +"@refinedev/devtools-ui": minor +"@refinedev/devtools": minor +"@refinedev/devtools-internal": minor +--- + +feat(devtools): ability to change the port of the devtools server + +Now users can change the port of the devtools server by setting the `REFINE_DEVTOOLS_PORT` environment variable. Previously, the port was hardcoded to "5001" and could not be changed. + +If you're using `@refinedev/cli`'s runner commands to start your development server, `REFINE_DEVTOOLS_PORT` will be propagated to your app with appropriate prefix. E.g. if you're using Vite, the environment variable will be `VITE_REFINE_DEVTOOLS_PORT` and it will be used by the `@refinedev/devtools`'s `` component to connect to the devtools server. + +- In Next.js apps, it will be prefixed with `NEXT_PUBLIC_` +- In Craco and Create React App apps, it will be prefixed with `REACT_APP_` +- In Remix apps and other custom setups, the environment variable will be used as is. + +In some scenarios where the environment variables are not passed to the browser, you may need to manually set the Refine Devtools URL in the `` component via the `url` prop. Remix apps do not automatically pass environment variables to the browser, so you will need to set the URL manually. If not set, the default URL will be used. + +While the port can be changed, this feature also allows users to host the devtools server on a different machine or domain and provide the `` with the custom domain URL. This such case will be useful if you're dockerizing your app and devtools server separately. + +**Enterprise Edition**: Refine Devtools running on ports other than "5001" is only available in the Enterprise Edition. If you're using the Community Edition, Refine Devtools will not work if the port is changed. + +[Resolves #5111](https://github.com/refinedev/refine/issues/5111) diff --git a/.changeset/warm-pots-relax.md b/.changeset/warm-pots-relax.md new file mode 100644 index 000000000000..a9bf7d8d34c6 --- /dev/null +++ b/.changeset/warm-pots-relax.md @@ -0,0 +1,7 @@ +--- +"@refinedev/chakra-ui": patch +--- + +fix(auth-page): fix wrong translation key in `type="register"` + +Previously, sign in link in Register page was using wrong translation key "pages.register.buttons.noAccount". Now it is replaced with "pages.register.buttons.haveAccount". diff --git a/.syncpackrc b/.syncpackrc index 783a2e7a1282..abb3699137b1 100644 --- a/.syncpackrc +++ b/.syncpackrc @@ -20,6 +20,12 @@ "dependencyTypes": ["peer"], "packages": ["**"], "isIgnored": true + }, + { + "dependencies": ["nock"], + "dependencyTypes": ["dev"], + "packages": ["@refinedev/appwrite"], + "isIgnored": true } ] } diff --git a/documentation/blog/2022-03-22-refine-with-react95.md b/documentation/blog/2022-03-22-refine-with-react95.md index a432dd519895..363ab0a61aa0 100644 --- a/documentation/blog/2022-03-22-refine-with-react95.md +++ b/documentation/blog/2022-03-22-refine-with-react95.md @@ -1055,7 +1055,7 @@ export const PostList = () => { setPageIndex, setPageSize, refineCore: { - tableQueryResult: { isLoading }, + tableQuery: { isLoading }, }, } = useTable({ columns, diff --git a/documentation/blog/2023-01-17-airtable-crud-app.md b/documentation/blog/2023-01-17-airtable-crud-app.md index 0dd0bf5cfd58..87e432da8da7 100644 --- a/documentation/blog/2023-01-17-airtable-crud-app.md +++ b/documentation/blog/2023-01-17-airtable-crud-app.md @@ -329,7 +329,7 @@ export const Layout: React.FC = ({ children }) => { const { push } = useNavigation(); return ( -
+
@@ -561,7 +561,7 @@ export const PostList: React.FC = () => { {flexRender( header.column.columnDef.header, @@ -580,7 +580,7 @@ export const PostList: React.FC = () => { return ( {flexRender( cell.column.columnDef.cell, @@ -684,7 +684,7 @@ export const PostList: React.FC = () => { getRowModel, setOptions, refineCore: { - tableQueryResult: { data: tableData }, + tableQuery: { data: tableData }, }, } = useTable({ columns }); @@ -726,7 +726,7 @@ export const PostList: React.FC = () => { {flexRender( header.column.columnDef.header, @@ -745,7 +745,7 @@ export const PostList: React.FC = () => { return ( {flexRender( cell.column.columnDef.cell, @@ -1526,7 +1526,7 @@ export const PostList: React.FC = () => { getRowModel, setOptions, refineCore: { - tableQueryResult: { data: tableData }, + tableQuery: { data: tableData }, }, getState, setPageIndex, diff --git a/documentation/blog/2023-04-13-refine-invoicer-4.md b/documentation/blog/2023-04-13-refine-invoicer-4.md index 29559aa22c9c..8d47d06f9aae 100644 --- a/documentation/blog/2023-04-13-refine-invoicer-4.md +++ b/documentation/blog/2023-04-13-refine-invoicer-4.md @@ -867,7 +867,7 @@ Endowed a due patience, we can see this in action among many others in the `@ref ```tsx title="node_modules/@refinedev/antd/src/hooks/table/useTable/useTable.ts" const { - tableQueryResult, + tableQuery, current, setCurrent, pageSize, diff --git a/documentation/blog/2023-07-02-refine-tremor-dashboard.md b/documentation/blog/2023-07-02-refine-tremor-dashboard.md index c56cfb4968c1..4bef0482a22a 100644 --- a/documentation/blog/2023-07-02-refine-tremor-dashboard.md +++ b/documentation/blog/2023-07-02-refine-tremor-dashboard.md @@ -170,7 +170,7 @@ const currencyFormatter = Intl.NumberFormat("en-US", { }); export default () => ( - + Revenue {currencyFormatter.format(3_500)} @@ -597,7 +597,7 @@ export const DashboardPage: React.FC = () => { - +
@@ -842,7 +842,7 @@ export const DashboardPage: React.FC = () => { - + //highlight-start -
+
); @@ -1246,7 +1246,7 @@ export const Details = () => { getHeaderGroups, getRowModel, refineCore: { - tableQueryResult: { data: tableData }, + tableQuery: { data: tableData }, }, getState, setPageIndex, @@ -1402,7 +1402,7 @@ export const Details = () => { { const { value } = e.target; diff --git a/documentation/blog/2023-07-26-refine-primereact-dashboard.md b/documentation/blog/2023-07-26-refine-primereact-dashboard.md index 246545b5e009..3f0c58d209ad 100644 --- a/documentation/blog/2023-07-26-refine-primereact-dashboard.md +++ b/documentation/blog/2023-07-26-refine-primereact-dashboard.md @@ -220,7 +220,7 @@ import { Button } from "primereact/Button"; export const Dashboard = () => { return ( -
+
); @@ -338,14 +338,14 @@ export const KpiCard = ({ if (total < trend) { return (
- +{calc}% + +{calc}%
); } return (
- -{calc}% + -{calc}%
); }; @@ -354,15 +354,15 @@ export const KpiCard = ({ +
- {title} -
+ {title} +
{formatTotal(total)}
@@ -797,7 +797,7 @@ import { IOrder, IOrderStatus } from "../../../interfaces"; export const RecentSales = () => { const { - tableQueryResult, + tableQuery, pageCount, current, pageSize, @@ -814,7 +814,7 @@ export const RecentSales = () => { }, }); - const orders = tableQueryResult?.data?.data; + const orders = tableQuery?.data?.data; const formatCurrency = (value: number) => { return value.toLocaleString("en-US", { @@ -867,7 +867,7 @@ export const RecentSales = () => { }; const header = ( -
+
-
+
@@ -1713,8 +1713,8 @@ export const ProductEdit = () => { -
+
+
-
+
@@ -1941,7 +1941,7 @@ export const ProductShow = () => { +
-
+
@@ -2459,8 +2459,8 @@ export const CategoryEdit = () => { -
+
+
-
+
@@ -2536,7 +2536,7 @@ export const CategoryShow = () => { +
} bottomContent={ -
+
{ {column.header} @@ -1911,7 +1911,7 @@ export const ProductCreate = () => { }} />
-
+
-
+
- +

Product details

 @@ -2274,13 +2274,13 @@ export const ProductShow = () => { alt={product.name} /> ) : null} -

Name

+

Name

{product?.name}

-

Price

+

Price

{currencyFormatter.format(product?.price ?? 0)}

-

Category

+

Category

{categoryData?.data.title}

-

Description

+

Description

{product?.description}

 @@ -2415,7 +2415,7 @@ const columns = [ export const CategoryList = () => { const { - tableQueryResult, + tableQuery, pageCount, current, pageSize, @@ -2438,13 +2438,13 @@ export const CategoryList = () => { direction: "ascending", }); - const categories = tableQueryResult?.data?.data ?? []; + const categories = tableQuery?.data?.data ?? []; const renderCell = useCallback((columnKey: string, item: IProduct) => { if (columnKey === "actions") { return ( -
+
-
+
{
} bottomContent={ -
+
{ {column.header} @@ -2731,7 +2731,7 @@ export const CategoryCreate = () => { }} />
-
+
-
+
- +

Category details

 {category?.cover ? ( {category.title} ) : null} -

Id

+

Id

{category?.id ?? 0}

-

Title

+

Title

{category?.title ?? ""}

 @@ -2968,16 +2968,16 @@ export const Menu = () => { const { menuItems } = useMenu(); return (