feat(hooks): mutation error typing

marmelab · May 19, 2022 · 7746921 · 7746921
1 parent af0bcb5
commit 7746921
Show file tree

Hide file tree

Showing 13 changed files with 194 additions and 77 deletions.
diff --git a/docs/useCreate.md b/docs/useCreate.md
@@ -55,3 +55,17 @@ const LikeButton = ({ record }) => {
     return <button disabled={isLoading} onClick={handleClick}>Like</button>;
 };
 ```
+
+**Tip**: If you use TypeScript, you can specify the record and error types for more type safety:
+
+```tsx
+useCreate<Product, Error>(undefined, undefined, {
+    onError: (error) => {
+        // error is an instance of Error.
+    },
+    onSettled: (data, error) => {
+        // data is an instance of Product.
+        // error is an instance of Error.
+    },
+})
+```
diff --git a/docs/useDelete.md b/docs/useDelete.md
@@ -59,3 +59,17 @@ const DeleteButton = ({ record }) => {
     return <button disabled={isLoading} onClick={handleClick}>Delete</button>;
 };
 ```
+
+**Tip**: If you use TypeScript, you can specify the record and error types for more type safety:
+
+```tsx
+useDelete<Product, Error>(undefined, undefined, {
+    onError: (error) => {
+        // error is an instance of Error.
+    },
+    onSettled: (data, error) => {
+        // data is an instance of Product.
+        // error is an instance of Error.
+    },
+})
+```
diff --git a/docs/useDeleteMany.md b/docs/useDeleteMany.md
@@ -59,3 +59,17 @@ const BulkDeletePostsButton = ({ selectedIds }) => {
     return <button disabled={isLoading} onClick={handleClick}>Delete selected posts</button>;
 };
 ```
+
+**Tip**: If you use TypeScript, you can specify the record and error types for more type safety:
+
+```tsx
+useDeleteMany<Product, Error>(undefined, undefined, {
+    onError: (error) => {
+        // error is an instance of Error.
+    },
+    onSettled: (data, error) => {
+        // data is an instance of Product.
+        // error is an instance of Error.
+    },
+})
+```
diff --git a/docs/useUpdate.md b/docs/useUpdate.md
@@ -61,3 +61,17 @@ const IncreaseLikeButton = ({ record }) => {
     return <button disabled={isLoading} onClick={handleClick}>Like</button>;
 };
 ```
+
+**Tip**: If you use TypeScript, you can specify the record and error types for more type safety:
+
+```tsx
+useUpdate<Product, Error>(undefined, undefined, {
+    onError: (error) => {
+        // error is an instance of Error.
+    },
+    onSettled: (data, error) => {
+        // data is an instance of Product.
+        // error is an instance of Error.
+    },
+})
+```
diff --git a/docs/useUpdateMany.md b/docs/useUpdateMany.md
@@ -60,3 +60,17 @@ const BulkResetViewsButton = ({ selectedIds }) => {
     return <button disabled={isLoading} onClick={handleClick}>Reset views</button>;
 };
 ```
+
+**Tip**: If you use TypeScript, you can specify the record and error types for more type safety:
+
+```tsx
+useUpdateMany<Product, Error>(undefined, undefined, {
+    onError: (error) => {
+        // error is an instance of Error.
+    },
+    onSettled: (data, error) => {
+        // data is an instance of Product.
+        // error is an instance of Error.
+    },
+})
+```
diff --git a/packages/ra-core/src/controller/create/useCreateController.ts b/packages/ra-core/src/controller/create/useCreateController.ts
@@ -35,8 +35,11 @@ import {
  *     return <CreateView {...controllerProps} {...props} />;
  * }
  */
-export const useCreateController = <RecordType extends RaRecord = RaRecord>(
-    props: CreateControllerProps<RecordType> = {}
+export const useCreateController = <
+    RecordType extends RaRecord = RaRecord,
+    MutationOptionsError = unknown
+>(
+    props: CreateControllerProps<RecordType, MutationOptionsError> = {}
 ): CreateControllerResult<RecordType> => {
     const {
         disableAuthentication,
@@ -63,11 +66,10 @@ export const useCreateController = <RecordType extends RaRecord = RaRecord>(
         unregisterMutationMiddleware,
     } = useMutationMiddlewares();
 
-    const [create, { isLoading: saving }] = useCreate<RecordType>(
-        resource,
-        undefined,
-        otherMutationOptions
-    );
+    const [create, { isLoading: saving }] = useCreate<
+        RecordType,
+        MutationOptionsError
+    >(resource, undefined, otherMutationOptions);
 
     const save = useCallback(
         (
@@ -166,7 +168,10 @@ export const useCreateController = <RecordType extends RaRecord = RaRecord>(
     };
 };
 
-export interface CreateControllerProps<RecordType extends RaRecord = RaRecord> {
+export interface CreateControllerProps<
+    RecordType extends RaRecord = RaRecord,
+    MutationOptionsError = unknown
+> {
     disableAuthentication?: boolean;
     hasEdit?: boolean;
     hasShow?: boolean;
@@ -175,7 +180,7 @@ export interface CreateControllerProps<RecordType extends RaRecord = RaRecord> {
     resource?: string;
     mutationOptions?: UseMutationOptions<
         RecordType,
-        unknown,
+        MutationOptionsError,
         UseCreateMutateParams<RecordType>
     >;
     transform?: TransformData;

diff --git a/packages/ra-core/src/controller/edit/useEditController.ts b/packages/ra-core/src/controller/edit/useEditController.ts
@@ -39,8 +39,11 @@ import { SaveContextValue, useMutationMiddlewares } from '../saveContext';
  *     return <EditView {...controllerProps} {...props} />;
  * }
  */
-export const useEditController = <RecordType extends RaRecord = any>(
-    props: EditControllerProps<RecordType> = {}
+export const useEditController = <
+    RecordType extends RaRecord = any,
+    MutationOptionsError = unknown
+>(
+    props: EditControllerProps<RecordType, MutationOptionsError> = {}
 ): EditControllerResult<RecordType> => {
     const {
         disableAuthentication,
@@ -101,11 +104,10 @@ export const useEditController = <RecordType extends RaRecord = any>(
 
     const recordCached = { id, previousData: record };
 
-    const [update, { isLoading: saving }] = useUpdate<RecordType>(
-        resource,
-        recordCached,
-        { ...otherMutationOptions, mutationMode }
-    );
+    const [update, { isLoading: saving }] = useUpdate<
+        RecordType,
+        MutationOptionsError
+    >(resource, recordCached, { ...otherMutationOptions, mutationMode });
 
     const save = useCallback(
         (
@@ -211,13 +213,16 @@ export const useEditController = <RecordType extends RaRecord = any>(
     };
 };
 
-export interface EditControllerProps<RecordType extends RaRecord = any> {
+export interface EditControllerProps<
+    RecordType extends RaRecord = any,
+    MutationOptionsError = unknown
+> {
     disableAuthentication?: boolean;
     id?: RecordType['id'];
     mutationMode?: MutationMode;
     mutationOptions?: UseMutationOptions<
         RecordType,
-        unknown,
+        MutationOptionsError,
         UseUpdateMutateParams<RecordType>
     >;
     queryOptions?: UseQueryOptions<RecordType>;

diff --git a/packages/ra-core/src/dataProvider/useCreate.ts b/packages/ra-core/src/dataProvider/useCreate.ts
@@ -66,11 +66,14 @@ import { RaRecord, CreateParams } from '../types';
  * const [create, { data }] = useCreate<Product>('products', { data: product });
  *                    \-- data is Product
  */
-export const useCreate = <RecordType extends RaRecord = any>(
+export const useCreate = <
+    RecordType extends RaRecord = any,
+    MutationError = unknown
+>(
     resource?: string,
     params: Partial<CreateParams<Partial<RecordType>>> = {},
-    options: UseCreateOptions<RecordType> = {}
-): UseCreateResult<RecordType> => {
+    options: UseCreateOptions<RecordType, MutationError> = {}
+): UseCreateResult<RecordType, boolean, MutationError> => {
     const dataProvider = useDataProvider();
     const queryClient = useQueryClient();
     const paramsRef = useRef<Partial<CreateParams<Partial<RecordType>>>>(
@@ -79,7 +82,7 @@ export const useCreate = <RecordType extends RaRecord = any>(
 
     const mutation = useMutation<
         RecordType,
-        unknown,
+        MutationError,
         Partial<UseCreateMutateParams<RecordType>>
     >(
         ({
@@ -119,7 +122,7 @@ export const useCreate = <RecordType extends RaRecord = any>(
         callTimeParams: Partial<CreateParams<RecordType>> = {},
         createOptions: MutateOptions<
             RecordType,
-            unknown,
+            MutationError,
             Partial<UseCreateMutateParams<RecordType>>,
             unknown
         > & { returnPromise?: boolean } = {}
@@ -147,30 +150,32 @@ export interface UseCreateMutateParams<RecordType extends RaRecord = any> {
 }
 
 export type UseCreateOptions<
-    RecordType extends RaRecord = any
+    RecordType extends RaRecord = any,
+    MutationError = unknown
 > = UseMutationOptions<
     RecordType,
-    unknown,
+    MutationError,
     Partial<UseCreateMutateParams<RecordType>>
 >;
 
 export type UseCreateResult<
     RecordType extends RaRecord = any,
-    TReturnPromise extends boolean = boolean
+    TReturnPromise extends boolean = boolean,
+    MutationError = unknown
 > = [
     (
         resource?: string,
         params?: Partial<CreateParams<Partial<RecordType>>>,
         options?: MutateOptions<
             RecordType,
-            unknown,
+            MutationError,
             Partial<UseCreateMutateParams<RecordType>>,
             unknown
         > & { returnPromise?: TReturnPromise }
     ) => Promise<TReturnPromise extends true ? RecordType : void>,
     UseMutationResult<
         RecordType,
-        unknown,
+        MutationError,
         Partial<UseCreateMutateParams<RecordType>>,
         unknown
     >

diff --git a/packages/ra-core/src/dataProvider/useDelete.ts b/packages/ra-core/src/dataProvider/useDelete.ts
@@ -68,11 +68,14 @@ import { RaRecord, DeleteParams, MutationMode } from '../types';
  * const [delete, { data }] = useDelete<Product>('products', { id, previousData: product });
  *                    \-- data is Product
  */
-export const useDelete = <RecordType extends RaRecord = any>(
+export const useDelete = <
+    RecordType extends RaRecord = any,
+    MutationError = unknown
+>(
     resource?: string,
     params: Partial<DeleteParams<RecordType>> = {},
-    options: UseDeleteOptions<RecordType> = {}
-): UseDeleteResult<RecordType> => {
+    options: UseDeleteOptions<RecordType, MutationError> = {}
+): UseDeleteResult<RecordType, MutationError> => {
     const dataProvider = useDataProvider();
     const queryClient = useQueryClient();
     const { id, previousData } = params;
@@ -141,7 +144,7 @@ export const useDelete = <RecordType extends RaRecord = any>(
 
     const mutation = useMutation<
         RecordType,
-        unknown,
+        MutationError,
         Partial<UseDeleteMutateParams<RecordType>>
     >(
         ({
@@ -176,7 +179,7 @@ export const useDelete = <RecordType extends RaRecord = any>(
                 }
             },
             onError: (
-                error: unknown,
+                error: MutationError,
                 variables: Partial<UseDeleteMutateParams<RecordType>> = {},
                 context: { snapshot: Snapshot }
             ) => {
@@ -227,7 +230,7 @@ export const useDelete = <RecordType extends RaRecord = any>(
             },
             onSettled: (
                 data: RecordType,
-                error: unknown,
+                error: MutationError,
                 variables: Partial<UseDeleteMutateParams<RecordType>> = {},
                 context: { snapshot: Snapshot }
             ) => {
@@ -258,7 +261,7 @@ export const useDelete = <RecordType extends RaRecord = any>(
         callTimeParams: Partial<DeleteParams<RecordType>> = {},
         updateOptions: MutateOptions<
             RecordType,
-            unknown,
+            MutationError,
             Partial<UseDeleteMutateParams<RecordType>>,
             unknown
         > & { mutationMode?: MutationMode } = {}
@@ -388,27 +391,31 @@ export interface UseDeleteMutateParams<RecordType extends RaRecord = any> {
 }
 
 export type UseDeleteOptions<
-    RecordType extends RaRecord = any
+    RecordType extends RaRecord = any,
+    MutationError = unknown
 > = UseMutationOptions<
     RecordType,
-    unknown,
+    MutationError,
     Partial<UseDeleteMutateParams<RecordType>>
 > & { mutationMode?: MutationMode };
 
-export type UseDeleteResult<RecordType extends RaRecord = any> = [
+export type UseDeleteResult<
+    RecordType extends RaRecord = any,
+    MutationError = unknown
+> = [
     (
         resource?: string,
         params?: Partial<DeleteParams<RecordType>>,
         options?: MutateOptions<
             RecordType,
-            unknown,
+            MutationError,
             Partial<UseDeleteMutateParams<RecordType>>,
             unknown
         > & { mutationMode?: MutationMode }
     ) => Promise<void>,
     UseMutationResult<
         RecordType,
-        unknown,
+        MutationError,
         Partial<DeleteParams<RecordType> & { resource?: string }>,
         unknown
     >