signIn, signUp, signOut are indeed happening in client, they aren't supported for being used in server yet
https://docs.amplify.aws/react/build-a-backend/server-side-rendering/#supported-apis-for-nextjs-server-side-usage
And according to docs: The redirect function can be used in Server Components, Route Handlers, and Server Actions.
https://nextjs.org/docs/app/api-reference/functions/redirect
being able to use it on server action doesn't necessary makes it run on the server, server actions are just endpoints after all

I think all occur in the client

if I say "use client" and use useRouter instead, it complains and says that hooks can only be used in functional component and not utils or async function files like mine 😦

So I still do not get why redirect works in some lines of code of that file and not in others

hooks like useRouter can only be used on client components
server action is running on client, but is not a client component

Hmmm maybe I am missing something, I am not getting it into my head jaja 😦

export async function handleSignUp(prevState, formData) {
console.log(formData);
try {
const { isSignUpComplete, userId, nextStep } = await signUp({
username: formData.get("username"),
password: formData.get("password"),
options: {
userAttributes: {
email: formData.get("email"),
},
autoSignIn: true, // Optional feature can be set here
},
});

localStorage.setItem("username", formData.get("username"));
localStorage.setItem("email", formData.get("email"));
} catch (error) {
return getErrorMessage(error);
}
redirect("/confirm-signup"); //This works as expected. This is in the server but runs on the client?
}



export async function handleConfirmSignUp(prevState, formData) {
try {
const { isSignUpComplete, nextStep } = await confirmSignUp({
username: formData.get("username"),
confirmationCode: formData.get("code"),
});

await signIn({
username: formData.get("username"),
password: formData.get("password"),
});
console.log("worked");

redirect("/selectUsername"); //This does not work. Why?

} catch (error) {
console.log("qqqq");
return getErrorMessage(error);
}
}

Its the second function's redirect that is giving me the problem

redirect can't be inside a try catch, because inside of it, it throws an error to redirect

should be something like

export async function handleConfirmSignUp(prevState, formData) {
let flag = false
try {
const { isSignUpComplete, nextStep } = await confirmSignUp({
username: formData.get("username"),
confirmationCode: formData.get("code"),
});

const {isSignedIn} = await signIn({
username: formData.get("username"),
password: formData.get("password"),
});
console.log("worked");

flag = isSignedIn

} catch (error) {
console.log("qqqq");
return getErrorMessage(error);
}

if( isSignedIn){
redirect("/selectUsername"); //This does not work. Why?
}
}

Oh my god!! I cannot believe I missed that, jajaja thank you so much!!!

Got it all working 🙂

can you mark as solved the answer that helped u most?