TanStackT
TanStack•2y ago•
3 replies
verbal-lime

Modifying the type of mutateAsync's

I'm doing an optimistic update when adding an entry to a table and calling mutateAsync with partial data for that entry. However, the type for the variables of the mutateAsync function seem to be the same as each element in my 
useQuery
 result, and this gives me a type error, because I'm leaving out a bunch of fields that the database will eventually default to.

Specifically, I have this:

  const { mutateAsync: addDataExport } = useMutation({
    mutationFn: (newDataExport: DataExportInsert) => queueDataExport(newDataExport),
    onMutate: async (newDataExport: DataExport) => {
      await queryClient.cancelQueries({ queryKey });
      const previousData = queryClient.getQueryData(queryKey);

      queryClient.setQueryData(queryKey, (old: DataExport[]) => {
        old.unshift(newDataExport);

        return old;
      });

      return { previousData };
    },


DataExport requires certain keys, but if I leave those out, Drizzle will set defaults, so I want variables to be of DataExportInsert instead.

I tried explicitly setting the type like this:

  type AddDataExportVariables = UseMutateAsyncFunction<
    DataExport[],
    Error,
    DataExportInsert,
    {
      previousData: unknown;
    }
  >;

  const { mutateAsync: addDataExport }: { mutateAsync: AddDataExportVariables } = useMutation({...


...but that gives me a new error, ultimately saying Types of parameters variables and variables are incompatible..

So for now, I just explicitly set all the optional variables to 
null
 like Drizzle will end up doing, but I wonder if there's a better way to set the type.
Was this page helpful?