Different copy for login and signup

responsible-ai-collaborative · Dec 24, 2024 · a15093e · a15093e
1 parent 2908019
commit a15093e
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 16 deletions.
diff --git a/site/gatsby-site/src/pages/login.js b/site/gatsby-site/src/pages/login.js
@@ -36,7 +36,7 @@ const Login = () => {
         const result = await logIn(email, redirectTo);
 
         if (!result.error) {
-          navigate(`/verify-request/?email=${encodeURIComponent(email)}`);
+          navigate(`/verify-request`, { state: { email, operation: 'login' } });
         } else {
           throw result?.error;
         }

diff --git a/site/gatsby-site/src/pages/signup.js b/site/gatsby-site/src/pages/signup.js
@@ -42,7 +42,7 @@ const SignUp = () => {
       const result = await signUp(email, '/account/?askToCompleteProfile=1');
 
       if (!result.error) {
-        await navigate(`/verify-request/?email=${encodeURIComponent(email)}`);
+        await navigate(`/verify-request`, { state: { email, operation: 'signup' } });
       } else {
         // TODO: Add more specific error messages
         addToast({

diff --git a/site/gatsby-site/src/pages/verify-request.js b/site/gatsby-site/src/pages/verify-request.js
@@ -1,15 +1,12 @@
 import React from 'react';
 import { useUserContext } from 'contexts/UserContext';
 import { Trans, useTranslation } from 'react-i18next';
-import { StringParam, useQueryParams } from 'use-query-params';
 import HeadContent from 'components/HeadContent';
 import { Spinner } from 'flowbite-react';
 
-const VerifyRequest = () => {
+const VerifyRequest = ({ location: { state } }) => {
   const { user, loading } = useUserContext();
 
-  const [{ email }] = useQueryParams({ email: StringParam });
-
   if (loading) {
     return (
       <div>
@@ -26,16 +23,33 @@ const VerifyRequest = () => {
     );
   }
 
-  return (
-    <>
-      <h1>
-        <Trans>Check your email</Trans>
-      </h1>
-      <p>
-        <Trans>A sign in link has been sent to {email}</Trans>
-      </p>
-    </>
-  );
+  if (state?.operation == 'login') {
+    return (
+      <>
+        <h1>
+          <Trans>Check your email</Trans>
+        </h1>
+        <p>
+          <Trans>A sign in link has been sent to {state.email}</Trans>
+        </p>
+      </>
+    );
+  }
+
+  if (state?.operation == 'signup') {
+    return (
+      <>
+        <h1>
+          <Trans>Check your email</Trans>
+        </h1>
+        <p>
+          <Trans>A sign up link has been sent to {state.email}</Trans>
+        </p>
+      </>
+    );
+  }
+
+  return null;
 };
 
 export const Head = (props) => {