CODEWITHSUNDEEP
reactjsreact-querytanstackreact-query
Amos
Amos

Reputation: 23

Type error in react query useMutation hook

Currently, i implement custom hook for useMuatation hook for separation of concern and reusable. Typescript is complaining my createBook function ***Type '(bookData: Shop) => Promise' has no properties in common with type 'UseMutationOptions<Shop, Error, Shop, unknown>' ***. Here is overview of my code.


useCustoumMatation.ts 

import apiClient from "@/services/api/api-client";
import { useMutation } from "@tanstack/react-query";

type Shop = {
  shopCode: string;
  shopName: string;
  mobileNo: string;
  address: string;
};

const createBook = async (bookData: Shop) => {
  const { data } = await apiClient.post("/books", bookData);
  return data;
};

export const useCreateBook = () => {
  return useMutation<Shop, Error, Shop, unknown>(createBook, {
    onSuccess: () => {
      // invalidate the query cache for 'shop'
    },
  });
};

ShopList.ts
const {mutate} = useCustoumMatation()

const onSubmit (data:Shop){
     mutate(data)
}

How can i properly pass type for that error. I am currently using react query v5.28.14.

Upvotes: 1

Views: 101

Answers (1)

Konrad
Konrad

Reputation: 24661

The error is pretty clear

 return useMutation<Shop, Error, Shop, unknown>({
    mutationFn: createBook,
    onSuccess: () => {
      // invalidate the query cache for 'shop'
    },
  });

Upvotes: 2

Related Questions