Theo's Typesafe Cult•5mo ago

redirect issues

I have issues with redirect not working properly when called from a server actions , the account deletion work as intended but

redirect('/')

redirect('/')

doesn't seems to work it just finish the task and remain on the same page what am I missing am using app-router with drizzle-orm

"use server";
import { redirect } from "next/navigation";
export async function deleteProfile() {
  const session = await getServerAuthSession();
  if (!session) return { message: "Unauthorized" };
  try {
    await db
      .delete(users)
      .where(eq(users.id, session.user.id))
      .catch((e) => {
        console.log(e);
      });
    revalidatePath("/dashboard/settings/profile");
    redirect("/");
  } catch (error) {
    return { message: "Error deleting profile" };
  }
}
//client code
'use client'
<Button variant="destructive" onClick={() => deleteProfile()} type="submit">
      delete profile
    </Button>

"use server";
import { redirect } from "next/navigation";
export async function deleteProfile() {
  const session = await getServerAuthSession();
  if (!session) return { message: "Unauthorized" };
  try {
    await db
      .delete(users)
      .where(eq(users.id, session.user.id))
      .catch((e) => {
        console.log(e);
      });
    revalidatePath("/dashboard/settings/profile");
    redirect("/");
  } catch (error) {
    return { message: "Error deleting profile" };
  }
}
//client code
'use client'
<Button variant="destructive" onClick={() => deleteProfile()} type="submit">
      delete profile
    </Button>

4 Replies

michaeldrotar•5mo ago

server code looks right with this example: https://nextjs.org/learn/dashboard-app/mutating-data#6-revalidate-and-redirect I think client code needs to use a form action

However, in React, the action attribute is considered a special prop - meaning React builds on top of it to allow actions to be invoked.

<form action={deleteProfile}>
  <button type="submit" ...>
</form>

<form action={deleteProfile}>
  <button type="submit" ...>
</form>

NOTE: I don't think there's any valid case for a submit button to have an onClick, as in your current code, except maybe analytics that tracks which submit button is used. Other actions are better off in the <form onSubmit={...}> If that still doesn't work for some reason: - does redirecting elsewhere work - does console.log('foo'); redirect('/'); console.log('bar') log both

smolensk•5mo ago

the catch clause seems to be blocking the redirect I wonder why ok I have just to put redirect outside of try catch block ty for help

michaeldrotar•5mo ago

ah yeah that sounds familiar.. something about redirect throwing an error that nextjs needs to catch glad you found it!

Prison Mike•5mo ago

did it work? I read some where on github that intercepting routes has issue with navigation.

Gaming

Programming

redirect issues