Fix sign up loading page

Author: MartinBraquet

web/components/auth-context.tsx

@@ -20,7 +20,7 @@ import { getPrivateUserSafe, getUserSafe } from 'web/lib/supabase/users'
 import { useWebsocketPrivateUser, useWebsocketUser } from 'web/hooks/use-user'
 import { identifyUser, setUserProperty } from 'web/lib/service/analytics'
 
-// Either we haven't looked up the logged in user yet (undefined), or we know
+// Either we haven't looked up the logged-in user yet (undefined), or we know
 // the user is not logged in (null), or we know the user is logged in.
 export type AuthUser =
   | undefined

web/components/widgets/editor.tsx

@@ -259,7 +259,7 @@ export function Content(props: {
   return typeof content === 'string' ? (
     <Linkify
       className={clsx('whitespace-pre-line', proseClass(size), className)}
-      text={content}
+      text={content || ''}
     />
   ) : (
     <RichContent {...(props as any)} />

web/pages/register.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import {Suspense, useState} from "react";
+import {Suspense, useEffect, useState} from "react";
 import Link from "next/link";
 import {FcGoogle} from "react-icons/fc";
 import {useSearchParams} from "next/navigation";
@@ -13,6 +13,7 @@ import {LovePage} from "web/components/love-page";
 import {getLoverRow} from "common/love/lover";
 import {db} from "web/lib/supabase/db";
 import Router from "next/router";
+import {useUser} from "web/hooks/use-user";
 
 
 export default function RegisterPage() {
@@ -31,24 +32,32 @@ function RegisterComponent() {
   const [isLoading, setIsLoading] = useState(false);
   const [registrationSuccess, setRegistrationSuccess] = useState(false);
   const [registeredEmail, setRegisteredEmail] = useState('');
+  const user = useUser()
 
   // function redirect() {
   //   // Redirect to complete profile page
   //   window.location.href = href;
   // }
 
+  useEffect(() => {
+    const checkLoverAndRedirect = async () => {
+      if (user) {
+        const lover = await getLoverRow(user.id, db)
+        if (lover) {
+          await Router.push('/')
+        } else {
+          await Router.push('/signup')
+        }
+        setIsLoading(false);
+      }
+    }
+    checkLoverAndRedirect()
+  }, [user]);
+
   const handleEmailPasswordSignUp = async (email: string, password: string) => {
     try {
       const creds = await createUserWithEmailAndPassword(auth, email, password);
       console.log("User signed up:", creds.user);
-      await Router.push('/')
-      const userId = creds?.user.uid
-      if (userId) {
-        const lover = await getLoverRow(userId, db)
-        if (!lover) {
-          await Router.push('/signup')
-        }
-      }
     } catch (error) {
       console.error("Error signing up:", error);
       if (error instanceof Error && error.message.includes("email-already-in-use")) {
@@ -94,7 +103,6 @@ function RegisterComponent() {
 
     } catch (error) {
       handleError(error);
-    } finally {
       setIsLoading(false);
     }
   }

web/pages/signup.tsx

@@ -4,21 +4,23 @@ import {initialRequiredState, RequiredLoveUserForm,} from 'web/components/requir
 import {OptionalLoveUserForm} from 'web/components/optional-lover-form'
 import {useUser} from 'web/hooks/use-user'
 import {LoadingIndicator} from 'web/components/widgets/loading-indicator'
-import {GoogleSignInButton} from 'web/components/buttons/sign-up-button'
-import {CACHED_REFERRAL_USERNAME_KEY, firebaseLogin,} from 'web/lib/firebase/users'
+import {CACHED_REFERRAL_USERNAME_KEY,} from 'web/lib/firebase/users'
 import {api} from 'web/lib/api'
-import {useRouter} from 'next/router'
+import Router, {useRouter} from 'next/router'
 import ManifoldLoveLogo from 'web/components/manifold-love-logo'
 import {useTracking} from 'web/hooks/use-tracking'
 import {track} from 'web/lib/service/analytics'
 import {safeLocalStorage} from 'web/lib/util/local'
 import {removeUndefinedProps} from 'common/util/object'
 import {useLoverByUserId} from 'web/hooks/use-lover'
 import {LoverRow} from 'common/love/lover'
+import {LovePage} from "web/components/love-page";
+import {Button} from "web/components/buttons/button";
 
 export default function SignupPage() {
   const [step, setStep] = useState(0)
   const user = useUser()
+  console.log('user:', user)
   const router = useRouter()
   useTracking('view love signup page')
 
@@ -40,17 +42,38 @@ export default function SignupPage() {
     }
   }, [existingLover])
 
+  if (step === 1 && user) {
+    return <LovePage trackPageView={'register'}>
+      <Col className={'w-full px-6 py-4'}>
+        <OptionalLoveUserForm
+          setLover={setLoverState}
+          lover={loverForm}
+          user={user}
+          fromSignup
+        />
+      </Col>
+    </LovePage>
+  }
+
   return (
     <Col className="items-center">
       {user === undefined ? (
         <div/>
       ) : user === null ? (
         <Col className={'items-center justify-around gap-4 pt-[20vh]'}>
-          <ManifoldLoveLogo noLink/>
-          <GoogleSignInButton onClick={firebaseLogin}/>
+          <ManifoldLoveLogo/>
+          <Button
+            color={'gray-outline'}
+            size={'2xl'}
+            className={''}
+            onClick={() => {
+              Router.push('register')
+            }}>
+            Sign up
+          </Button>
         </Col>
       ) : (
-        <Col className={'bg-canvas-0 w-full max-w-2xl px-6 py-4'}>
+        <Col className={'w-full max-w-2xl px-6 py-4'}>
           {step === 0 ? (
             <RequiredLoveUserForm
               user={user}
@@ -89,12 +112,7 @@ export default function SignupPage() {
               }}
             />
           ) : step === 1 ? (
-            <OptionalLoveUserForm
-              setLover={setLoverState}
-              lover={loverForm}
-              user={user}
-              fromSignup
-            />
+            <></>
           ) : (
             <LoadingIndicator/>
           )}