feat: useSelect's queryResult to query

.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 use-select-query-result
+> ```

.changeset/bright-dancers-tie.md

@@ -0,0 +1,10 @@
+---
+"@refinedev/codemod": minor
+---
+
+feat: added `npx @refinedev/codemod@latest use-select-query-result` to automatically refactor `useSelect`'s `queryResult` and `defaultValueQueryResult` to `query` and `defaultValueQuery` #6179
+
+```diff
+- const { queryResult, defaultValueQueryResult } = useSelect(); // or useAutocomplete, useCheckboxGroup, useRadioGroup
++ const { query, defaultValueQuery } = useSelect();
+```

.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 use-select-query-result
+> ```

.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 use-select-query-result
+> ```

.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 use-select-query-result
+> ```

documentation/docs/data/hooks/use-select/index.md

@@ -462,14 +462,14 @@ useSelect({
 
 ### Can I create the options manually?
 
-Sometimes it may not be enough to create `optionLabel` and `optionValue` options. In this case we create options with `queryResult`.
+Sometimes it may not be enough to create `optionLabel` and `optionValue` options. In this case we create options with `query`.
 
 ```tsx
-const { queryResult } = useSelect({
+const { query } = useSelect({
   resource: "categories",
 });
 
-const options = queryResult.data?.data.map((item) => ({
+const options = query.data?.data.map((item) => ({
   label: item.name,
   value: item.id,
 }));
@@ -501,13 +501,13 @@ return (
 
 ### Return values
 
-| Property                | Description                                    | Type                                                                                                         |
-| ----------------------- | ---------------------------------------------- | ------------------------------------------------------------------------------------------------------------ |
-| options                 | It returns possible options                    | `{ label: string; value: string }`                                                                           |
-| queryResult             | Result of the query of a record                | [`QueryObserverResult<{ data: TData; error: TError }>`](https://react-query.tanstack.com/reference/useQuery) |
-| defaultValueQueryResult | Result of the query of a `defaultValue` record | [`QueryObserverResult<{ data: TData; error: TError }>`](https://react-query.tanstack.com/reference/useQuery) |
-| onSearch                | A function to set the search value             | `onSearch: (value: string) => void`                                                                          |
-| overtime                | Overtime loading props                         | `{ elapsedTime?: number }`                                                                                   |
+| Property          | Description                                    | Type                                                                                                         |
+| ----------------- | ---------------------------------------------- | ------------------------------------------------------------------------------------------------------------ |
+| options           | It returns possible options                    | `{ label: string; value: string }`                                                                           |
+| query             | Result of the query of a record                | [`QueryObserverResult<{ data: TData; error: TError }>`](https://react-query.tanstack.com/reference/useQuery) |
+| defaultValueQuery | Result of the query of a `defaultValue` record | [`QueryObserverResult<{ data: TData; error: TError }>`](https://react-query.tanstack.com/reference/useQuery) |
+| onSearch          | A function to set the search value             | `onSearch: (value: string) => void`                                                                          |
+| overtime          | Overtime loading props                         | `{ elapsedTime?: number }`                                                                                   |
 
 ## Example
 

documentation/docs/ui-integrations/ant-design/hooks/use-select/index.md

@@ -471,12 +471,12 @@ useSelect({
 
 ### Can I create the options manually?
 
-Sometimes it may not be enough to create `optionLabel` and `optionValue` options. In this case we create options with `queryResult`.
+Sometimes it may not be enough to create `optionLabel` and `optionValue` options. In this case we create options with `query`.
 
 ```tsx
-const { queryResult } = useSelect();
+const { query } = useSelect();
 
-const options = queryResult.data?.data.map((item) => ({
+const options = query.data?.data.map((item) => ({
   label: item.title,
   value: item.id,
 }));
@@ -507,8 +507,8 @@ return <Select options={options} />;
 | Property                   | Description                                    | Type                                                                                          |
 | -------------------------- | ---------------------------------------------- | --------------------------------------------------------------------------------------------- |
 | selectProps                | Ant design Select props                        | [`Select`](https://ant.design/components/select/#API)                                         |
-| queryResult                | Result of the query of a record                | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
-| defaultValueQueryResult    | Result of the query of a `defaultValue` record | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
+| query                      | Result of the query of a record                | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
+| defaultValueQuery          | Result of the query of a `defaultValue` record | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
 | defaultValueQueryOnSuccess | Default value onSuccess method                 | `() => void`                                                                                  |
 | overtime                   | Overtime loading props                         | `{ elapsedTime?: number }`                                                                    |
 

documentation/docs/ui-integrations/mantine/hooks/use-select/index.md

@@ -460,12 +460,12 @@ useSelect({
 
 ### Can I create the options manually?
 
-Sometimes it may not be enough to create `optionLabel` and `optionValue` options. In this case we create options with `queryResult`.
+Sometimes it may not be enough to create `optionLabel` and `optionValue` options. In this case we create options with `query`.
 
 ```tsx
-const { queryResult } = useSelect();
+const { query } = useSelect();
 
-const options = queryResult.data?.data.map((item) => ({
+const options = query.data?.data.map((item) => ({
   label: item.title,
   value: item.id,
 }));
@@ -496,8 +496,8 @@ return <Select options={options} />;
 | Property                   | Description                                    | Type                                                                                          |
 | -------------------------- | ---------------------------------------------- | --------------------------------------------------------------------------------------------- |
 | selectProps                | Mantine Select props                           | [`SelectPropsType`](#selectpropstype)                                                         |
-| queryResult                | Result of the query of a record                | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
-| defaultValueQueryResult    | Result of the query of a `defaultValue` record | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
+| query                      | Result of the query of a record                | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
+| defaultValueQuery          | Result of the query of a `defaultValue` record | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
 | defaultValueQueryOnSuccess | Default value onSuccess method                 | `() => void`                                                                                  |
 | overtime                   | Overtime loading props                         | `{ elapsedTime?: number }`                                                                    |
 

documentation/docs/ui-integrations/material-ui/hooks/use-auto-complete/index.md

@@ -407,12 +407,12 @@ In some cases we only have `id`, it may be necessary to show it selected in the
 
 ### Can I create the options manually?
 
-You can create a new `options` object with `queryResult`.
+You can create a new `options` object with `query`.
 
 ```tsx
-const { autocompleteProps, queryResult } = useAutocomplete();
+const { autocompleteProps, query } = useAutocomplete();
 
-const options = queryResult.data?.data.map((item) => ({
+const options = query.data?.data.map((item) => ({
   title: item.title,
   value: item.id,
 }));
@@ -447,8 +447,8 @@ By default, Refine does the search using the [`useList`](/docs/data/hooks/use-de
 | Property                   | Description                                    | Type                                                                                          |
 | -------------------------- | ---------------------------------------------- | --------------------------------------------------------------------------------------------- |
 | autocompleteProps          | Material UI Autocomplete props                 | [`AutoCompleteReturnValues`](#autocompletereturnvalues)                                       |
-| queryResult                | Result of the query of a record                | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
-| defaultValueQueryResult    | Result of the query of a `defaultValue` record | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
+| query                      | Result of the query of a record                | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
+| defaultValueQuery          | Result of the query of a `defaultValue` record | [`QueryObserverResult<{ data: TData }>`](https://react-query.tanstack.com/reference/useQuery) |
 | defaultValueQueryOnSuccess | Default value onSuccess method                 | `() => void`                                                                                  |
 | overtime                   | Overtime loading props                         | `{ elapsedTime?: number }`                                                                    |
 

packages/antd/src/hooks/fields/useCheckboxGroup/index.ts

@@ -22,6 +22,10 @@ export type UseCheckboxGroupReturnType<
   > & {
     options: TOption[];
   };
+  query: QueryObserverResult<GetListResponse<TData>>;
+  /**
+   * @deprecated Use `query` instead
+   */
   queryResult: QueryObserverResult<GetListResponse<TData>>;
 };
 
@@ -74,12 +78,7 @@ export const useCheckboxGroup = <
   TError,
   TData
 >): UseCheckboxGroupReturnType<TData, TOption> => {
-  const { queryResult, options } = useSelect<
-    TQueryFnData,
-    TError,
-    TData,
-    TOption
-  >({
+  const { query, options } = useSelect<TQueryFnData, TError, TData, TOption>({
     resource,
     sort,
     sorters,
@@ -103,6 +102,7 @@ export const useCheckboxGroup = <
       options,
       defaultValue,
     },
-    queryResult,
+    query,
+    queryResult: query,
   };
 };

packages/antd/src/hooks/fields/useRadioGroup/index.spec.ts

@@ -130,4 +130,22 @@ describe("render hook default options", () => {
 
     expect(mockFunc).toBeCalled();
   });
+
+  it("should work with queryResult and query", async () => {
+    const { result } = renderHook(
+      () =>
+        useRadioGroup({
+          resource: "posts",
+        }),
+      {
+        wrapper: TestWrapper({}),
+      },
+    );
+
+    await waitFor(() => {
+      expect(result.current.queryResult.isSuccess).toBeTruthy();
+    });
+
+    expect(result.current.query).toEqual(result.current.queryResult);
+  });
 });

packages/antd/src/hooks/fields/useRadioGroup/index.ts

@@ -19,6 +19,10 @@ export type UseRadioGroupReturnType<
   radioGroupProps: Omit<React.ComponentProps<typeof Radio.Group>, "options"> & {
     options: TOption[];
   };
+  query: QueryObserverResult<GetListResponse<TData>>;
+  /**
+   * @deprecated Use `query` instead
+   */
   queryResult: QueryObserverResult<GetListResponse<TData>>;
 };
 
@@ -70,12 +74,7 @@ export const useRadioGroup = <
   TData,
   TOption
 > => {
-  const { queryResult, options } = useSelect<
-    TQueryFnData,
-    TError,
-    TData,
-    TOption
-  >({
+  const { query, options } = useSelect<TQueryFnData, TError, TData, TOption>({
     resource,
     sort,
     sorters,
@@ -100,6 +99,7 @@ export const useRadioGroup = <
       options,
       defaultValue,
     },
-    queryResult,
+    query,
+    queryResult: query,
   };
 };

packages/antd/src/hooks/fields/useSelect/index.spec.ts

@@ -347,4 +347,26 @@ describe("useSelect Hook", () => {
     );
     expect(mockFunc).toBeCalled();
   });
+
+  it("should work with queryResult and query", async () => {
+    const { result } = renderHook(
+      () =>
+        useSelect({
+          resource: "posts",
+          defaultValue: ["1", "2", "3", "4"],
+        }),
+      {
+        wrapper: TestWrapper({
+          dataProvider: MockJSONServer,
+          resources: [{ name: "posts" }],
+        }),
+      },
+    );
+
+    await waitFor(() => {
+      expect(result.current.queryResult.isSuccess).toBeTruthy();
+    });
+
+    expect(result.current.query).toEqual(result.current.queryResult);
+  });
 });

packages/antd/src/hooks/fields/useSelect/index.ts

@@ -16,7 +16,15 @@ export type UseSelectReturnType<
   TOption extends BaseOption = BaseOption,
 > = {
   selectProps: SelectProps<TOption>;
+  query: QueryObserverResult<GetListResponse<TData>>;
+  defaultValueQuery: QueryObserverResult<GetManyResponse<TData>>;
+  /**
+   * @deprecated Use `query` instead
+   */
   queryResult: QueryObserverResult<GetListResponse<TData>>;
+  /**
+   * @deprecated Use `defaultValueQuery` instead
+   */
   defaultValueQueryResult: QueryObserverResult<GetManyResponse<TData>>;
 };
 
@@ -39,18 +47,24 @@ export const useSelect = <
 >(
   props: UseSelectProps<TQueryFnData, TError, TData>,
 ): UseSelectReturnType<TData, TOption> => {
-  const { queryResult, defaultValueQueryResult, onSearch, options } =
-    useSelectCore<TQueryFnData, TError, TData, TOption>(props);
+  const { query, defaultValueQuery, onSearch, options } = useSelectCore<
+    TQueryFnData,
+    TError,
+    TData,
+    TOption
+  >(props);
 
   return {
     selectProps: {
       options,
       onSearch,
-      loading: defaultValueQueryResult.isFetching,
+      loading: defaultValueQuery.isFetching,
       showSearch: true,
       filterOption: false,
     },
-    queryResult,
-    defaultValueQueryResult,
+    query,
+    defaultValueQuery,
+    queryResult: query,
+    defaultValueQueryResult: defaultValueQuery,
   };
 };

packages/codemod/src/index.ts

@@ -113,6 +113,10 @@ export function runTransform({ files, flags, transformer }) {
 }
 
 const TRANSFORMER_INQUIRER_CHOICES = [
+  {
+    name: "Refactor[useSelect, useAutocomplete, useCheckboxGroup, useRadioGroup]: { queryResult, defaultValueQueryResult } to { query, defaultValueQuery }",
+    value: "use-select-query-result",
+  },
   {
     name: "refine3-to-refine4: Transform from refine 3.x.x to at least 4.0.0",
     value: "refine3-to-refine4",