fix signup code usage

src/app/auth/pages/SignupPage.tsx

@@ -20,7 +20,7 @@ export default function SignupPage({ authService }: SignupPageProps) {
   const { code } = useParams()
   const [signupCode, setSignupCode] = useState<string | null>(null)
   const [isSubmitting, setIsSubmitting] = useState(false)
-
+  const [error, setError] = useState<string>('')
   const [username, setUsername, usernameError, validateUsername] =
     useValidatedInput(isValidUsername)
 
@@ -44,6 +44,7 @@ export default function SignupPage({ authService }: SignupPageProps) {
       localStorage.setItem(SignupCodeKey, theSignupCode)
     } else {
       theSignupCode = localStorage.getItem(SignupCodeKey)
+      setSignupCode(theSignupCode)
     }
 
     if (!theSignupCode) {
@@ -51,6 +52,10 @@ export default function SignupPage({ authService }: SignupPageProps) {
     }
   }, [code, signupCode])
 
+  useEffect(() => {
+    console.debug('signup code', signupCode)
+  }, [signupCode])
+
   const onSubmit = async (e: FormEvent<HTMLFormElement>) => {
     e.preventDefault()
 
@@ -78,6 +83,9 @@ export default function SignupPage({ authService }: SignupPageProps) {
     try {
       await authService.signup(username, password, signupCode)
       navigate('/')
+    } catch (e: unknown) {
+      const err = e as Error
+      setError(err.message)
     } finally {
       setIsSubmitting(false)
     }
@@ -120,6 +128,8 @@ export default function SignupPage({ authService }: SignupPageProps) {
             <LinkButton secondary to={'/login'}>
               login instead?
             </LinkButton>
+
+            <span className="text-xs h-3 text-red-500">{error}</span>
           </form>
         </div>
       </main>