Function useUpdateOne

A hook that helps you update a single resource.

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 update will be applied permanently.

Example

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

type TData = { id: 1, name: 'Test' };
type TFormData = { name: string };
const PATH = 'users/{id}/messages';

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

update({
  id: 123,
  data: { name: 'John Doe' },
  resourceParams: { id: 1 },
  undoMessage: 'Message updated',
});
  • useUpdateOne<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>[];
                    id: 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>[];
                    id: string | number;
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "pending";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    id: 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>[];
                    id: string | number;
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "error";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    id: 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>[];
                    id: string | number;
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "success";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    id: string | number;
                    resource: Resource<TPath>;
                };
            };
        update: ((__namedParameters: UpdateBaseVariables<TPath, TFormData, "one", 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

    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>[];
                    id: 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>[];
                    id: string | number;
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "pending";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    id: 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>[];
                    id: string | number;
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "error";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    id: 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>[];
                    id: string | number;
                    resource: Resource<TPath>;
                }, unknown>;
                reset: (() => void);
                status: "success";
                submittedAt: number;
                variables: {
                    apiClientParams?: Partial<ApiProps>;
                    data: TFormData;
                    extraData?: TExtraData;
                    extraResources?: Resource<any>[];
                    id: string | number;
                    resource: Resource<TPath>;
                };
            };
        update: ((__namedParameters: UpdateBaseVariables<TPath, TFormData, "one", TExtraData>) => Promise<void>);
    }

    An object with a single properties, update and mutation.

    update is a function to perform the update operation. Accepts the ID, data, and params of the resource.

    mutation is result useMutation without propery mutate

    • 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>[];
                  id: 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>[];
                  id: string | number;
                  resource: Resource<TPath>;
              }, unknown>;
              reset: (() => void);
              status: "pending";
              submittedAt: number;
              variables: {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  id: 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>[];
                  id: string | number;
                  resource: Resource<TPath>;
              }, unknown>;
              reset: (() => void);
              status: "error";
              submittedAt: number;
              variables: {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  id: 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>[];
                  id: string | number;
                  resource: Resource<TPath>;
              }, unknown>;
              reset: (() => void);
              status: "success";
              submittedAt: number;
              variables: {
                  apiClientParams?: Partial<ApiProps>;
                  data: TFormData;
                  extraData?: TExtraData;
                  extraResources?: Resource<any>[];
                  id: string | number;
                  resource: Resource<TPath>;
              };
          }
    • update: ((__namedParameters: UpdateBaseVariables<TPath, TFormData, "one", TExtraData>) => Promise<void>)

Settings

Member Visibility