create session with password on register

apps/login/ui/AuthenticationMethodRadio.tsx

@@ -41,7 +41,7 @@ export default function AuthenticationMethodRadio({
                         ? "bg-background-light-400 dark:bg-background-dark-400"
                         : "bg-background-light-400 dark:bg-background-dark-400"
                     }
-                      relative border boder-divider-light dark:border-divider-dark flex cursor-pointer rounded-lg px-5 py-4 focus:outline-none hover:shadow-md`
+                      relative border boder-divider-light dark:border-divider-dark flex cursor-pointer rounded-lg px-5 py-4 focus:outline-none hover:shadow-lg dark:hover:bg-white/10`
                 }
               >
                 {({ active, checked }) => (

apps/login/ui/RegisterFormWithoutPassword.tsx

@@ -141,7 +141,11 @@ export default function RegisterFormWithoutPassword({ legal }: Props) {
         />
       )}
 
-      <div className="py-4">
+      <p className="mt-4 ztdl-p mb-6 block text-text-light-secondary-500 dark:text-text-dark-secondary-500">
+        Select the method you would like to authenticate
+      </p>
+
+      <div className="pb-4">
         <AuthenticationMethodRadio
           selected={selected}
           selectionChanged={setSelected}

apps/login/ui/SessionsList.tsx

@@ -13,7 +13,7 @@ export default function SessionsList({ sessions }: Props) {
   const [list, setList] = useState<Session[]>(sessions);
 
   return sessions ? (
-    <div className="flex flex-col">
+    <div className="flex flex-col space-y-2">
       {list
         .filter((session) => session?.factors?.user?.loginName)
         .map((session, index) => {

apps/login/ui/SetPasswordForm.tsx

@@ -1,14 +1,10 @@
 "use client";
 
-import {
-  LegalAndSupportSettings,
-  PasswordComplexitySettings,
-} from "@zitadel/server";
+import { PasswordComplexitySettings } from "@zitadel/server";
 import PasswordComplexity from "./PasswordComplexity";
 import { useState } from "react";
 import { Button, ButtonVariants } from "./Button";
 import { TextInput } from "./Input";
-import { PrivacyPolicyCheckboxes } from "./PrivacyPolicyCheckboxes";
 import { FieldValues, useForm } from "react-hook-form";
 import {
   lowerCaseValidator,
@@ -71,9 +67,36 @@ export default function SetPasswordForm({
     return res.json();
   }
 
+  async function createSessionWithLoginNameAndPassword(
+    loginName: string,
+    password: string
+  ) {
+    setLoading(true);
+    const res = await fetch("/session", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({
+        loginName: loginName,
+        password: password,
+      }),
+    });
+
+    setLoading(false);
+    if (!res.ok) {
+      throw new Error("Failed to set user");
+    }
+    return res.json();
+  }
+
   function submitAndLink(value: Inputs): Promise<boolean | void> {
-    return submitRegister(value).then((resp: any) => {
-      return router.push(`/verify?userID=${resp.userId}`);
+    return submitRegister(value).then((humanResponse: any) => {
+      return createSessionWithLoginNameAndPassword(email, value.password).then(
+        () => {
+          return router.push(`/verify?userID=${humanResponse.userId}`);
+        }
+      );
     });
   }