improve signup container

packages/features/auth/src/components/sign-up-methods-container.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import type { Provider } from '@supabase/supabase-js';
+import { useRouter } from 'next/navigation';
 
 import { isBrowser } from '@kit/shared/utils';
 import { Alert, AlertDescription, AlertTitle } from '@kit/ui/alert';
@@ -19,15 +20,20 @@ export function SignUpMethodsContainer(props: {
     updateAccount: string;
   };
 
-  providers: {
-    password: boolean;
-    magicLink: boolean;
-    oAuth: Provider[];
+  authConfig: {
+    providers: {
+      password: boolean;
+      magicLink: boolean;
+      oAuth: Provider[];
+    };
+    displayTermsCheckbox: boolean | undefined;
+    isMailerAutoconfirmEnabled: boolean;
   };
 
-  displayTermsCheckbox?: boolean;
   inviteToken?: string;
 }) {
+  const router = useRouter();
+
   const redirectUrl = getCallbackUrl(props);
   const defaultValues = getDefaultValues();
 
@@ -37,26 +43,33 @@ export function SignUpMethodsContainer(props: {
         <InviteAlert />
       </If>
 
-      <If condition={props.providers.password}>
+      <If condition={props.authConfig.providers.password}>
         <EmailPasswordSignUpContainer
           emailRedirectTo={props.paths.callback}
           defaultValues={defaultValues}
-          displayTermsCheckbox={props.displayTermsCheckbox}
-          //onSignUp={() => redirect(redirectUrl)}
+          authConfig={props.authConfig}
+          onSignUp={() => {
+            if (!props.authConfig.isMailerAutoconfirmEnabled) {
+              return;
+            }
+            setTimeout(() => {
+              router.replace(props.paths.updateAccount)
+            }, 2_500);
+          }}
         />
       </If>
 
-      <If condition={props.providers.magicLink}>
+      <If condition={props.authConfig.providers.magicLink}>
         <MagicLinkAuthContainer
           inviteToken={props.inviteToken}
           redirectUrl={redirectUrl}
           shouldCreateUser={true}
           defaultValues={defaultValues}
-          displayTermsCheckbox={props.displayTermsCheckbox}
+          displayTermsCheckbox={props.authConfig.displayTermsCheckbox}
         />
       </If>
 
-      <If condition={props.providers.oAuth.length}>
+      <If condition={props.authConfig.providers.oAuth.length}>
         <div className="relative">
           <div className="absolute inset-0 flex items-center">
             <Separator />
@@ -70,7 +83,7 @@ export function SignUpMethodsContainer(props: {
         </div>
 
         <OauthProviders
-          enabledProviders={props.providers.oAuth}
+          enabledProviders={props.authConfig.providers.oAuth}
           inviteToken={props.inviteToken}
           shouldCreateUser={true}
           paths={{