reusable mutation

[hi-reeve]

right now on the UseMutationOptions type property mutation are required.
the problem is when we wanted to create a reusable function that pass a mutation options

i.e

type Payload = { id : string, name : string}
export const useAddName = (
	mutationOpts?: UseMutationOptions<any, Payload>
) => {
	const { $api } = useNuxtApp();
	return useMutation({
		...mutationOpts,
		mutation: ({ id, name }: Payload) =>
			$api(`/add/${id}`, {
				body: { name },
				method: "POST",
			}),
	});
};

but when we want to use the composable like this

const { mutate, isLoading } = useAddName({
	onSettled() {
		refresh();
		form.resetForm();
	},
});

this will got an error because property mutation is required

'UseMutationOptions<any, Payload, Error, _EmptyObject>'.
  Property 'mutation' is missing in type '{ onSettled(): void; }' but required in type 'UseMutationOptions<any, Payload, Error, _EmptyObject>'.

[posva]

Omit the mutation from the type:

type Payload = { id : string, name : string}
export const useAddName = (
	mutationOpts?: Omit<UseMutationOptions<any, Payload>, 'mutation'>
) => {
	const { $api } = useNuxtApp();
	return useMutation({
		...mutationOpts,
		mutation: ({ id, name }: Payload) =>
			$api(`/add/${id}`, {
				body: { name },
				method: "POST",
			}),
	});
};

[hi-reeve]

doing this and still got an error

Type 'Promise<unknown>' is not assignable to type 'Promise<any>'.

well it's not an error if use any, but if the return type is other than any, it got an error

[posva]

Isn’t that the type of your api call?

[hi-reeve]

oh yeah sorry, my bad. it is from my api type.