Function useUpdateMany

A hook that helps you update multiple resources.

The hook uses useMutation from @tanstack/react-query under the hood, so it accepts all the same options. It performs an optimistic update by immediately applying the update to the cache before the update request is sent. If the update request fails, the previous state is restored in the cache.

If the undoable mode is enabled, the hook allows the update to be undone within a certain period of time. If the undo action is not performed, the updates will be applied permanently.

Example

import { useUpdateMany } from 'react-query-manager';

type TData = { id: 1, name: 'Test' };
type TFormData = { status: 'active' | 'inactive' };
const PATH = 'users/{id}/messages';

const { update } = useUpdateMany<typeof PATH, TData, TFormData>({
  resourcePath: PATH,
});

update({
  ids: [123, 456],
  data: { status: 'active' },
  resourceParams: { id: 1 },
  undoMessage: 'Messages updated',
});
  • useUpdateMany<TPath, TData, TFormData, TExtraData>(props): {
        mutation:
            | {
                context: unknown;
                data: undefined;
                error: null;
                failureCount: number;
                failureReason: null | CustomError;
                isError: false;
                isIdle: true;
                isPaused: boolean;
                isPending: false;
                isSuccess: false;
                mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "idle";
                submittedAt: number;
                variables: undefined;
            }
            | {
                context: unknown;
                data: undefined;
                error: null;
                failureCount: number;
                failureReason: null | CustomError;
                isError: false;
                isIdle: false;
                isPaused: boolean;
                isPending: true;
                isSuccess: false;
                mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "pending";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                };
            }
            | {
                context: unknown;
                data: undefined;
                error: CustomError;
                failureCount: number;
                failureReason: null | CustomError;
                isError: true;
                isIdle: false;
                isPaused: boolean;
                isPending: false;
                isSuccess: false;
                mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "error";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                };
            }
            | {
                context: unknown;
                data: QueryResponse<TData>[];
                error: null;
                failureCount: number;
                failureReason: null | CustomError;
                isError: false;
                isIdle: false;
                isPaused: boolean;
                isPending: false;
                isSuccess: true;
                mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "success";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                };
            };
        update: ((__namedParameters: UpdateBaseVariables<TPath, TFormData, "many", TExtraData>) => Promise<void>);
    }

  • Type Parameters

    • TPath extends string

      The API path as a string.

    • TData = any

      The expected shape of the data returned by the API.

    • TFormData = OnlyObject

      The shape of the data that will be sent to the API during the mutation.

    • TExtraData = any

    Parameters

    • props: Omit<UpdateBase<TPath, TData, TFormData, "many", TExtraData>, "type">

      The options for the hook.

      update is a function to perform the update operation. Accepts the array of IDs, data, and params of the resources.

      mutation is result useMutation without propery mutate

    Returns {
        mutation:
            | {
                context: unknown;
                data: undefined;
                error: null;
                failureCount: number;
                failureReason: null | CustomError;
                isError: false;
                isIdle: true;
                isPaused: boolean;
                isPending: false;
                isSuccess: false;
                mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "idle";
                submittedAt: number;
                variables: undefined;
            }
            | {
                context: unknown;
                data: undefined;
                error: null;
                failureCount: number;
                failureReason: null | CustomError;
                isError: false;
                isIdle: false;
                isPaused: boolean;
                isPending: true;
                isSuccess: false;
                mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "pending";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                };
            }
            | {
                context: unknown;
                data: undefined;
                error: CustomError;
                failureCount: number;
                failureReason: null | CustomError;
                isError: true;
                isIdle: false;
                isPaused: boolean;
                isPending: false;
                isSuccess: false;
                mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "error";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                };
            }
            | {
                context: unknown;
                data: QueryResponse<TData>[];
                error: null;
                failureCount: number;
                failureReason: null | CustomError;
                isError: false;
                isIdle: false;
                isPaused: boolean;
                isPending: false;
                isSuccess: true;
                mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "success";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    ids: (string | number)[];
                    resource: Resource<TPath>;
                };
            };
        update: ((__namedParameters: UpdateBaseVariables<TPath, TFormData, "many", TExtraData>) => Promise<void>);
    }

    • mutation:
          | {
              context: unknown;
              data: undefined;
              error: null;
              failureCount: number;
              failureReason: null | CustomError;
              isError: false;
              isIdle: true;
              isPaused: boolean;
              isPending: false;
              isSuccess: false;
              mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  ids: (string | number)[];
                  resource: Resource<TPath>;
              }, unknown>;
              reset: (() => void);
              status: "idle";
              submittedAt: number;
              variables: undefined;
          }
          | {
              context: unknown;
              data: undefined;
              error: null;
              failureCount: number;
              failureReason: null | CustomError;
              isError: false;
              isIdle: false;
              isPaused: boolean;
              isPending: true;
              isSuccess: false;
              mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  ids: (string | number)[];
                  resource: Resource<TPath>;
              }, unknown>;
              reset: (() => void);
              status: "pending";
              submittedAt: number;
              variables: {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  ids: (string | number)[];
                  resource: Resource<TPath>;
              };
          }
          | {
              context: unknown;
              data: undefined;
              error: CustomError;
              failureCount: number;
              failureReason: null | CustomError;
              isError: true;
              isIdle: false;
              isPaused: boolean;
              isPending: false;
              isSuccess: false;
              mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  ids: (string | number)[];
                  resource: Resource<TPath>;
              }, unknown>;
              reset: (() => void);
              status: "error";
              submittedAt: number;
              variables: {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  ids: (string | number)[];
                  resource: Resource<TPath>;
              };
          }
          | {
              context: unknown;
              data: QueryResponse<TData>[];
              error: null;
              failureCount: number;
              failureReason: null | CustomError;
              isError: false;
              isIdle: false;
              isPaused: boolean;
              isPending: false;
              isSuccess: true;
              mutateAsync: UseMutateAsyncFunction<QueryResponse<TData>[], CustomError, {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  ids: (string | number)[];
                  resource: Resource<TPath>;
              }, unknown>;
              reset: (() => void);
              status: "success";
              submittedAt: number;
              variables: {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  ids: (string | number)[];
                  resource: Resource<TPath>;
              };
          }
    • update: ((__namedParameters: UpdateBaseVariables<TPath, TFormData, "many", TExtraData>) => Promise<void>)

Settings

Member Visibility