Can you redirect in server functions?
Is it possible to redirect in a server function? It's not working for me. I see a
Error:
Code:
uncaught (in promise)uncaught (in promise) error client-side.Error:
Uncaught (in promise)
isRedirect: true
params: {teamId: 3}
statusCode: 307
to: "/$teamId"
[[Prototype]]: ObjectUncaught (in promise)
isRedirect: true
params: {teamId: 3}
statusCode: 307
to: "/$teamId"
[[Prototype]]: ObjectCode:
const signIn = createServerFn('POST', async (data: z.infer<typeof loginFormSchema>, ctx) => {
const session = await createClient(ctx).auth.signInWithPassword({
email: data.email,
password: data.password,
});
const userId = session.data.user?.id;
if (!userId) {
throw session.error || new Error('An error occurred');
}
const firstTeam = await db.query.teamMemberTable.findFirst({
where: (teamMember, { eq }) => eq(teamMember.userId, userId),
orderBy: (teamMember, { asc }) => asc(teamMember.createdAt),
with: { team: true },
});
if (!firstTeam) {
throw redirect({ to: '/login', search: { error: 'no-team-found' } });
}
throw redirect({
to: '/$teamId',
params: { teamId: firstTeam.team.id },
headers: ctx.request.headers,
});
});
async function login(e: React.FormEvent<HTMLFormElement>) {
e.preventDefault();
const data = new FormData(e.currentTarget);
const payload = loginFormSchema.parse(Object.fromEntries(data.entries()));
await signIn(payload);
}
export default function Page() {
// ...
return (
// ...
<form onSubmit={login}>
)
}const signIn = createServerFn('POST', async (data: z.infer<typeof loginFormSchema>, ctx) => {
const session = await createClient(ctx).auth.signInWithPassword({
email: data.email,
password: data.password,
});
const userId = session.data.user?.id;
if (!userId) {
throw session.error || new Error('An error occurred');
}
const firstTeam = await db.query.teamMemberTable.findFirst({
where: (teamMember, { eq }) => eq(teamMember.userId, userId),
orderBy: (teamMember, { asc }) => asc(teamMember.createdAt),
with: { team: true },
});
if (!firstTeam) {
throw redirect({ to: '/login', search: { error: 'no-team-found' } });
}
throw redirect({
to: '/$teamId',
params: { teamId: firstTeam.team.id },
headers: ctx.request.headers,
});
});
async function login(e: React.FormEvent<HTMLFormElement>) {
e.preventDefault();
const data = new FormData(e.currentTarget);
const payload = loginFormSchema.parse(Object.fromEntries(data.entries()));
await signIn(payload);
}
export default function Page() {
// ...
return (
// ...
<form onSubmit={login}>
)
}