get-convex / convex-react-query

Apache License 2.0
6 stars 0 forks source link

Typescript error for useMutation #4

Open hasanaktas opened 2 months ago

hasanaktas commented 2 months ago
import { api } from "@backend/convex/_generated/api";
import { useMutation } from "@tanstack/react-query";
import { useConvexMutation } from "@convex-dev/react-query";

  const mutation = useMutation({
    mutationFn: useConvexMutation(api.explore.react),

    onSuccess: async (data) => {

    },
    onError: async (error) => {

    },
  });

If I use it as specified in the document, there is no problem. However, when I try to access the API variables, TypeScript gets angry. The type of the variables is void.

import { api } from "@backend/convex/_generated/api";
import { useMutation } from "@tanstack/react-query";
import { useConvexMutation } from "@convex-dev/react-query";

  const mutation = useMutation({
    mutationFn: useConvexMutation(api.explore.react),

    onSuccess: async (data,variables) => {

    },
    onError: async (error,variables) => {

    },
  });

As a solution, if I create mutationFn as an external variable, typescript does not give an error and the type of the variables is shown correctly.

import { api } from "@backend/convex/_generated/api";
import { useMutation } from "@tanstack/react-query";
import { useConvexMutation } from "@convex-dev/react-query";

  const mutationFn = useConvexMutation(api.explore.react);

  const mutation = useMutation({
    mutationFn: mutationFn,

    onSuccess: async (data,variables) => {

    },
    onError: async (error,variables) => {

    },
  });

err1 err2