loginname to authenticator setup

apps/login/src/app/(login)/authenticator/set/page.tsx

@@ -1,5 +1,6 @@
 import { Alert } from "@/components/alert";
 import { BackButton } from "@/components/back-button";
+import { ChooseAuthenticatorToSetup } from "@/components/choose-authenticator-to-setup";
 import { DynamicTheme } from "@/components/dynamic-theme";
 import { UserAvatar } from "@/components/user-avatar";
 import { getSessionCookieById } from "@/lib/cookies";
@@ -11,26 +12,9 @@ import {
   getUserByID,
   listAuthenticationMethodTypes,
 } from "@/lib/zitadel";
-import { Timestamp, timestampDate } from "@zitadel/client";
 import { Session } from "@zitadel/proto/zitadel/session/v2/session_pb";
 import { getLocale, getTranslations } from "next-intl/server";
 
-function isSessionValid(session: Partial<Session>): {
-  valid: boolean;
-  verifiedAt?: Timestamp;
-} {
-  const validPassword = session?.factors?.password?.verifiedAt;
-  const validPasskey = session?.factors?.webAuthN?.verifiedAt;
-  const stillValid = session.expirationDate
-    ? timestampDate(session.expirationDate) > new Date()
-    : true;
-
-  const verifiedAt = validPassword || validPasskey;
-  const valid = !!((validPassword || validPasskey) && stillValid);
-
-  return { valid, verifiedAt };
-}
-
 export default async function Page({
   searchParams,
 }: {
@@ -46,8 +30,6 @@ export default async function Page({
     ? await loadSessionById(sessionId, organization)
     : await loadSessionByLoginname(loginName, organization);
 
-  console.log("sessionWithData", sessionWithData);
-
   async function getAuthMethodsAndUser(session?: Session) {
     const userId = session?.factors?.user?.id;
 
@@ -101,16 +83,10 @@ export default async function Page({
     sessionWithData.factors?.user?.organizationId,
   );
 
-  const { valid } = isSessionValid(sessionWithData);
-
   const params = new URLSearchParams({
     initial: "true", // defines that a code is not required and is therefore not shown in the UI
   });
 
-  // if (sessionWithData?.factors?.user?.id) {
-  //   params.set("userId", sessionWithData.factors.user.id);
-  // }
-
   if (loginName) {
     params.set("loginName", loginName);
   }
@@ -126,9 +102,9 @@ export default async function Page({
   return (
     <DynamicTheme branding={branding}>
       <div className="flex flex-col items-center space-y-4">
-        <h1>{t("set.title")}</h1>
+        <h1>{t("title")}</h1>
 
-        <p className="ztdl-p">{t("set.description")}</p>
+        <p className="ztdl-p">{t("description")}</p>
 
         {sessionWithData && (
           <UserAvatar
@@ -141,16 +117,14 @@ export default async function Page({
 
         {!(loginName || sessionId) && <Alert>{tError("unknownContext")}</Alert>}
 
-        {!valid && <Alert>{tError("sessionExpired")}</Alert>}
-
-        {/* {loginSettings && sessionWithData && (
+        {loginSettings && sessionWithData && (
           <ChooseAuthenticatorToSetup
             authMethods={sessionWithData.authMethods}
             sessionFactors={sessionWithData.factors}
             loginSettings={loginSettings}
             params={params}
           ></ChooseAuthenticatorToSetup>
-        )} */}
+        )}
 
         <div className="mt-8 flex w-full flex-row items-center">
           <BackButton />

apps/login/src/components/choose-authenticator-to-setup.tsx

@@ -7,7 +7,6 @@ import { AuthenticationMethodType } from "@zitadel/proto/zitadel/user/v2/user_se
 import { useTranslations } from "next-intl";
 import { Alert, AlertType } from "./alert";
 import { PASSKEYS, PASSWORD } from "./auth-methods";
-import { UserAvatar } from "./user-avatar";
 
 type Props = {
   authMethods: AuthenticationMethodType[];
@@ -26,14 +25,6 @@ export function ChooseAuthenticatorToSetup({
 
   return (
     <>
-      {sessionFactors && (
-        <UserAvatar
-          loginName={sessionFactors.user?.loginName}
-          displayName={sessionFactors.user?.displayName}
-          showDropdown
-        ></UserAvatar>
-      )}
-
       {loginSettings.passkeysType === PasskeysType.ALLOWED &&
         !loginSettings.allowUsernamePassword && (
           <Alert type={AlertType.ALERT}>{t("noMethodsAvailable")}</Alert>
@@ -45,7 +36,7 @@ export function ChooseAuthenticatorToSetup({
           PASSWORD(false, "/password/set?" + params)}
         {!authMethods.includes(AuthenticationMethodType.PASSKEY) &&
           loginSettings.passkeysType === PasskeysType.ALLOWED &&
-          PASSKEYS(false, "/passkeys/set?" + params)}
+          PASSKEYS(false, "/passkey/set?" + params)}
       </div>
     </>
   );

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

@@ -185,10 +185,29 @@ export async function sendLoginname(command: SendLoginnameCommand) {
 
         redirect("/verify?" + paramsVerify);
       }
-      return {
-        error:
-          "User has no available authentication methods. Contact your administrator to setup authentication for the requested user.",
-      };
+      // what to do with users with valid email but no auth methods? redirect to /authenticator/set?
+      // return {
+      //   error:
+      //     "User has no available authentication methods. Contact your administrator to setup authentication for the requested user.",
+      // };
+
+      const paramsAuthenticatorSetup = new URLSearchParams({
+        loginName: session.factors?.user?.loginName,
+        userId: session.factors?.user?.id, // verify needs user id
+      });
+
+      if (command.organization || session.factors?.user?.organizationId) {
+        paramsAuthenticatorSetup.append(
+          "organization",
+          command.organization ?? session.factors?.user?.organizationId,
+        );
+      }
+
+      if (command.authRequestId) {
+        paramsAuthenticatorSetup.append("authRequestId", command.authRequestId);
+      }
+
+      redirect("/authenticator/set?" + paramsAuthenticatorSetup);
     }
 
     if (methods.authMethodTypes.length == 1) {