type broken on useServerFn?
Sorry for the AI generated summary, but just wanted a clean reproducible version of the issue:
import { useMutation } from "@tanstack/react-query";
import { useServerFn } from "@tanstack/react-start";
type SigninInput = { email: string; password: string };
type SigninResult = { user: { id: string; name: string }; token: string };
function signin$(args: { data: SigninInput }): Promise<SigninResult> {
return Promise.resolve({
user: { id: "123", name: "John Doe" },
token: "abc",
});
}
// Case 1: Inline use — causes type issue (data is `unknown`)
const inlineCase = useMutation({
mutationFn: useServerFn(signin$),
onSuccess: (data) => {
// @ts-expect-error — data is `unknown`
console.log(data.user.id);
},
});
inlineCase.mutate({ data: { email: "a@b.com", password: "123456" } });
// Case 2: Const-first use — fixes the type issue
const serverFn = useServerFn(signin$);
const constCase = useMutation({
mutationFn: serverFn,
onSuccess: (data) => {
const idUpper = data.user.id.toUpperCase();
console.log("constCase:", idUpper);
},
});
constCase.mutate({ data: { email: "a@b.com", password: "123456" } });import { useMutation } from "@tanstack/react-query";
import { useServerFn } from "@tanstack/react-start";
type SigninInput = { email: string; password: string };
type SigninResult = { user: { id: string; name: string }; token: string };
function signin$(args: { data: SigninInput }): Promise<SigninResult> {
return Promise.resolve({
user: { id: "123", name: "John Doe" },
token: "abc",
});
}
// Case 1: Inline use — causes type issue (data is `unknown`)
const inlineCase = useMutation({
mutationFn: useServerFn(signin$),
onSuccess: (data) => {
// @ts-expect-error — data is `unknown`
console.log(data.user.id);
},
});
inlineCase.mutate({ data: { email: "a@b.com", password: "123456" } });
// Case 2: Const-first use — fixes the type issue
const serverFn = useServerFn(signin$);
const constCase = useMutation({
mutationFn: serverFn,
onSuccess: (data) => {
const idUpper = data.user.id.toUpperCase();
console.log("constCase:", idUpper);
},
});
constCase.mutate({ data: { email: "a@b.com", password: "123456" } });