Custom hook for mutation not working

[lagroms]

Hello !

I'm trying to implement a custom hook for mutation.
The idea for the custom hook is to take any endpoint, execute it, and then execute the successFn when onSuccess:

import { useMutation } from "@tanstack/react-query";
import useApi from "./useApi";
import { toast } from "react-toastify";

const useMutate = (endpoint, successFn, errorMessage = undefined) => {
    const api = useApi(endpoint, true, true);

    return useMutation({
        mutationFn: (...args) => {
            return api.request(...args);
        },
        onSuccess: (data) => {
            successFn(data);
        },
        onError: () => toast.error(errorMessage ?? "Something Wrong Happened!"),
    });
};

export default useMutate;

and then calling the customhook like this in my component

const { mutate: mutatePin } = useMutate(boardsApi.togglePostPin, onRefresh);

return (
    <PostItem onTogglePin={() => mutatePin(post.board.uuid, post.uuid)} />)
)

However I don't understand why it's throwing me an error :

EDIT: well I'm dumb... I just forgot to add the .js extension on my custom hook

[fredrik-andersson-yoin]

I think that if there are multiple arguments to the mutation function they must be supplied as an object.

mutationFn: (variables: TVariables) => Promise<TData>
and
mutate: (variables: TVariables, { onSuccess, onSettled, onError }) => void
from: https://tanstack.com/query/v4/docs/react/reference/useMutation

[lagroms]

Well I didn't know I have this issue, but thanks to you it's fixed as well 🤣

[TkDodo]

https://tkdodo.eu/blog/mastering-mutations-in-react-query#mutations-only-take-one-argument-for-variables