redirect outside try catch, await cookie

apps/login/src/components/session-item.tsx

@@ -6,6 +6,7 @@ import { XCircleIcon } from "@heroicons/react/24/outline";
 import { Timestamp, timestampDate } from "@zitadel/client";
 import { Session } from "@zitadel/proto/zitadel/session/v2/session_pb";
 import moment from "moment";
+import { redirect } from "next/navigation";
 import { useState } from "react";
 import { Avatar } from "./avatar";
 
@@ -57,18 +58,33 @@ export function SessionItem({
 
   return (
     <button
-      onClick={() => {
+      onClick={async () => {
         if (valid && session?.factors?.user) {
           return continueWithSession({
             ...session,
             authRequestId: authRequestId,
           });
         } else if (session.factors?.user) {
-          return sendLoginname({
+          setLoading(true);
+          const res = await sendLoginname({
             loginName: session.factors?.user?.loginName,
             organization: session.factors.user.organizationId,
             authRequestId: authRequestId,
-          });
+          })
+            .catch(() => {
+              setError("An internal error occurred");
+            })
+            .finally(() => {
+              setLoading(false);
+            });
+
+          if (res?.redirect) {
+            redirect(res.redirect);
+          }
+
+          if (res?.error) {
+            setError(res.error);
+          }
         }
       }}
       className="group flex flex-row items-center bg-background-light-400 dark:bg-background-dark-400  border border-divider-light hover:shadow-lg dark:hover:bg-white/10 py-2 px-4 rounded-md transition-all"

apps/login/src/components/username-form.tsx

@@ -2,7 +2,7 @@
 
 import { sendLoginname } from "@/lib/server/loginname";
 import { useTranslations } from "next-intl";
-import { useRouter } from "next/navigation";
+import { redirect, useRouter } from "next/navigation";
 import { ReactNode, useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { Alert } from "./alert";
@@ -60,6 +60,10 @@ export function UsernameForm({
         setLoading(false);
       });
 
+    if (res?.redirect) {
+      redirect(res.redirect);
+    }
+
     if (res?.error) {
       setError(res.error);
     }

apps/login/src/lib/cookies.ts

@@ -1,7 +1,7 @@
 "use server";
 
 import { timestampDate, timestampFromMs } from "@zitadel/client";
-import { cookies, type UnsafeUnwrappedCookies } from "next/headers";
+import { cookies } from "next/headers";
 import { LANGUAGE_COOKIE_NAME } from "./i18n";
 
 // TODO: improve this to handle overflow
@@ -20,8 +20,8 @@ export type Cookie = {
 
 type SessionCookie<T> = Cookie & T;
 
-function setSessionHttpOnlyCookie<T>(sessions: SessionCookie<T>[]) {
-  const cookiesList = cookies() as unknown as UnsafeUnwrappedCookies;
+async function setSessionHttpOnlyCookie<T>(sessions: SessionCookie<T>[]) {
+  const cookiesList = await cookies();
 
   return cookiesList.set({
     name: "sessions",

apps/login/src/lib/server/loginname.ts

@@ -5,7 +5,6 @@ import { ChecksSchema } from "@zitadel/proto/zitadel/session/v2/session_service_
 import { UserState } from "@zitadel/proto/zitadel/user/v2/user_pb";
 import { AuthenticationMethodType } from "@zitadel/proto/zitadel/user/v2/user_service_pb";
 import { headers } from "next/headers";
-import { redirect } from "next/navigation";
 import { idpTypeToIdentityProviderType, idpTypeToSlug } from "../idp";
 
 import {
@@ -70,7 +69,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
       });
 
       if (resp?.nextStep.case === "authUrl") {
-        return redirect(resp.nextStep.value);
+        return { redirect: resp.nextStep.value };
       }
     }
   };
@@ -115,7 +114,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
       });
 
       if (resp?.nextStep.case === "authUrl") {
-        return redirect(resp.nextStep.value);
+        return { redirect: resp.nextStep.value };
       }
     }
   };
@@ -154,7 +153,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
         params.append("authRequestid", command.authRequestId);
       }
 
-      return redirect("/password/set?" + params);
+      return { redirect: "/password/set?" + params };
     }
 
     const methods = await listAuthenticationMethodTypes(
@@ -184,7 +183,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
           paramsVerify.append("authRequestId", command.authRequestId);
         }
 
-        redirect("/verify?" + paramsVerify);
+        return { redirect: "/verify?" + paramsVerify };
       }
 
       const paramsAuthenticatorSetup = new URLSearchParams({
@@ -203,7 +202,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
         paramsAuthenticatorSetup.append("authRequestId", command.authRequestId);
       }
 
-      redirect("/authenticator/set?" + paramsAuthenticatorSetup);
+      return { redirect: "/authenticator/set?" + paramsAuthenticatorSetup };
     }
 
     if (methods.authMethodTypes.length == 1) {
@@ -225,7 +224,10 @@ export async function sendLoginname(command: SendLoginnameCommand) {
             paramsPassword.authRequestId = command.authRequestId;
           }
 
-          return redirect("/password?" + new URLSearchParams(paramsPassword));
+          return {
+            redirect: "/password?" + new URLSearchParams(paramsPassword),
+          };
+
         case AuthenticationMethodType.PASSKEY: // AuthenticationMethodType.AUTHENTICATION_METHOD_TYPE_PASSKEY
           const paramsPasskey: any = { loginName: command.loginName };
           if (command.authRequestId) {
@@ -237,7 +239,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
               command.organization ?? session.factors?.user?.organizationId;
           }
 
-          return redirect("/passkey?" + new URLSearchParams(paramsPasskey));
+          return { redirect: "/passkey?" + new URLSearchParams(paramsPasskey) };
       }
     } else {
       // prefer passkey in favor of other methods
@@ -256,7 +258,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
             command.organization ?? session.factors?.user?.organizationId;
         }
 
-        return redirect("/passkey?" + new URLSearchParams(passkeyParams));
+        return { redirect: "/passkey?" + new URLSearchParams(passkeyParams) };
       } else if (
         methods.authMethodTypes.includes(AuthenticationMethodType.IDP)
       ) {
@@ -276,9 +278,9 @@ export async function sendLoginname(command: SendLoginnameCommand) {
             command.organization ?? session.factors?.user?.organizationId;
         }
 
-        return redirect(
-          "/password?" + new URLSearchParams(paramsPasswordDefault),
-        );
+        return {
+          redirect: "/password?" + new URLSearchParams(paramsPasswordDefault),
+        };
       }
     }
   }
@@ -326,7 +328,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
         params.set("loginName", command.loginName);
       }
 
-      return redirect("/register?" + params);
+      return { redirect: "/register?" + params };
     }
   }
 
@@ -343,7 +345,7 @@ export async function sendLoginname(command: SendLoginnameCommand) {
       paramsPasswordDefault.append("organization", command.organization);
     }
 
-    return redirect("/password?" + paramsPasswordDefault);
+    return { redirect: "/password?" + paramsPasswordDefault };
   }
 
   // fallbackToPassword