From c610d0b49838186d3b7a3f8a86689503d1e70ca0 Mon Sep 17 00:00:00 2001 From: Yan Luiz Date: Wed, 18 Sep 2024 22:14:53 -0300 Subject: [PATCH 1/3] chore: sign-in and sign-up unified --- pages/auth/index.js | 338 ++++++++++---------------- public/locales/en/translation.json | 6 +- public/locales/pt-BR/translation.json | 6 +- 3 files changed, 137 insertions(+), 213 deletions(-) diff --git a/pages/auth/index.js b/pages/auth/index.js index dd6ece3f..548f4062 100644 --- a/pages/auth/index.js +++ b/pages/auth/index.js @@ -1,6 +1,6 @@ import Link from 'next/link' import Router from 'next/router' -import { useState } from 'react' +import { useState, useEffect } from 'react' import { useForm } from 'react-hook-form' import { toast } from 'react-toastify' import useAuth from '../../hooks/useAuth' @@ -14,16 +14,23 @@ import { GrGithub } from 'react-icons/gr' import { useTranslation } from 'react-i18next' function authPage() { - const { login, loginGoogle, loginGithub } = useAuth() + const { login, signup, loginGoogle, loginGithub } = useAuth() const [showpass, setShowPass] = useState(false) const { t } = useTranslation() - const [isDisable, setIsDisable] = useState(false) - const { register, handleSubmit } = useForm() + const [isSignUp, setIsSignUp] = useState(false) // Toggle for sign-up const [email, setEmail] = useState('') + const { register, handleSubmit } = useForm() + + const onSubmit = (data) => { + if (isSignUp) { + signup(data) // Handle sign-up + } else { + login(data) // Handle login + } + } - const onLoginSubmit = (data) => login(data) - const onLoginError = (errors, e) => { + const onError = (errors, e) => { toast.error(errors, e, { position: 'top-right', autoClose: 5000, @@ -34,233 +41,146 @@ function authPage() { progress: undefined, }) } + function handleResetPassword(auth, email) { sendPasswordResetEmail(auth, email) .then(() => { toast.success(t('messages.email_sent_success')) - setIsDisable(false) }) .catch((error) => { - const errorCode = error.code const errorMessage = error.message - errorCode.includes('not-found') - ? toast.error(t('messages.email_not_found')) - : toast.error(errorMessage) + toast.error(errorMessage) }) } - const denyLogin = () => { - sessionStorage.clear() - Router.push('/auth') - } return ( <> - Login - WEB3DEV + {isSignUp ? 'Sign Up' : 'Login'} - WEB3DEV
- {sessionStorage.getItem('credential') ? ( - <> -
-

{t('link_github_account')}

-
- - -
-
- - ) : ( -
-

- {isDisable ? t('buttons.reset_password') : t('buttons.sign_in')} -

-

+

+ {isSignUp ? t('buttons.register') : t('buttons.sign_in')} +

+

+ {isSignUp ? t('form.already_have_account') : t('form.no_account')}{' '} + setIsSignUp(!isSignUp)} // Toggle between sign-in and sign-up + className="cursor-pointer text-sm font-medium leading-none text-primary-300 hover:text-gray-500" > - {t('form.no_account')}{' '} - +

+
+
+
diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 94855c22..837183cf 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -145,7 +145,8 @@ "log_in": "Log in", "recover_password": "Recover password", "login_with_github": "Login with GitHub", - "login_with_google": "Login with Google" + "login_with_google": "Login with Google", + "register": "Register" }, "form": { "no_account": "Don't have an account?", @@ -154,7 +155,8 @@ "password": "Password", "enter_password": "Please enter your password", "verify_password": "Verify your password", - "or": "OR" + "or": "OR", + "already_have_account": "Already have an account?" }, "link_github_account": "Do you want to link GitHub to your already registered account?", "peopleBuilding": "people building in this section", diff --git a/public/locales/pt-BR/translation.json b/public/locales/pt-BR/translation.json index 5e285291..3e72ba7e 100644 --- a/public/locales/pt-BR/translation.json +++ b/public/locales/pt-BR/translation.json @@ -146,7 +146,8 @@ "log_in": "Entrar", "recover_password": "Recuperar senha", "login_with_github": "Login com o Github", - "login_with_google": "Login com o Google" + "login_with_google": "Login com o Google", + "register": "Registre-se" }, "form": { "no_account": "Não tem uma conta?", @@ -155,7 +156,8 @@ "password": "Senha", "enter_password": "Por favor, insira sua senha", "verify_password": "Verifique sua senha", - "or": "OU" + "or": "OU", + "already_have_account": "Já tem uma conta?" }, "peopleBuilding": "pessoas construindo nessa seção", "createStudyGroup": "Criar Grupo de Estudo", From 55acd2bc5d263aef3f5fe6fc72156c46686a8063 Mon Sep 17 00:00:00 2001 From: Yan Luiz Date: Wed, 18 Sep 2024 22:48:05 -0300 Subject: [PATCH 2/3] fix: svg path and email regex --- pages/auth/index.js | 21 +++++++++++++-------- public/assets/img/eye.svg | 2 ++ 2 files changed, 15 insertions(+), 8 deletions(-) create mode 100644 public/assets/img/eye.svg diff --git a/pages/auth/index.js b/pages/auth/index.js index 548f4062..0318276b 100644 --- a/pages/auth/index.js +++ b/pages/auth/index.js @@ -18,15 +18,15 @@ function authPage() { const [showpass, setShowPass] = useState(false) const { t } = useTranslation() - const [isSignUp, setIsSignUp] = useState(false) // Toggle for sign-up + const [isSignUp, setIsSignUp] = useState(false) const [email, setEmail] = useState('') const { register, handleSubmit } = useForm() const onSubmit = (data) => { if (isSignUp) { - signup(data) // Handle sign-up + signup(data) } else { - login(data) // Handle login + login(data) } } @@ -70,7 +70,7 @@ function authPage() { > {isSignUp ? t('form.already_have_account') : t('form.no_account')}{' '} setIsSignUp(!isSignUp)} // Toggle between sign-in and sign-up + onClick={() => setIsSignUp(!isSignUp)} className="cursor-pointer text-sm font-medium leading-none text-primary-300 hover:text-gray-500" > {isSignUp ? t('buttons.sign_in') : t('buttons.register_now')} @@ -93,7 +93,8 @@ function authPage() { {...register('email', { required: t('form.enter_email'), message: t('form.invalid_email'), - pattern: /.../, // Your email regex pattern + pattern: + /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/i, })} />
@@ -109,6 +110,7 @@ function authPage() { id="password" type={showpass ? 'text' : 'password'} className="mt-2 w-full rounded border bg-gray-200 py-3 pl-3 text-xs font-medium leading-none text-gray-800" + placeholder="" {...register('password', { required: t('form.enter_password'), message: t('form.verify_password'), @@ -119,8 +121,11 @@ function authPage() { onClick={() => setShowPass(!showpass)} className="absolute right-0 mt-2 mr-3 cursor-pointer" > - {showpass ? Hide : Show}{' '} - {/* Ensure the text is displayed */} + {showpass
@@ -142,7 +147,7 @@ function authPage() { >

)} - {!isSignUp && ( // Ensure this shows only during login + {!isSignUp && (

+ \ No newline at end of file From 34bd701b2ebe5a694ac87caf5044905da03c159d Mon Sep 17 00:00:00 2001 From: Yan Luiz Date: Wed, 18 Sep 2024 22:54:31 -0300 Subject: [PATCH 3/3] remove uncessary route --- pages/auth/signup/index.js | 194 ------------------------------------- 1 file changed, 194 deletions(-) delete mode 100644 pages/auth/signup/index.js diff --git a/pages/auth/signup/index.js b/pages/auth/signup/index.js deleted file mode 100644 index 534efec5..00000000 --- a/pages/auth/signup/index.js +++ /dev/null @@ -1,194 +0,0 @@ -import Image from 'next/image' -import Link from 'next/link' -import Head from 'next/head' -import { useState } from 'react' -import { useForm } from 'react-hook-form' -import { toast } from 'react-toastify' -import useAuth from '../../../hooks/useAuth' -import { withPublic } from '../../../hooks/route' -import { Button } from '@nextui-org/react' -import { FcGoogle } from 'react-icons/fc' -import { GrGithub } from 'react-icons/gr' -import { useRouter } from 'next/router' - -function signUpPage() { - const { signup, loginGoogle, loginGithub } = useAuth() - const [showpass, setShowPass] = useState(false) - const router = useRouter() - - const { register, handleSubmit } = useForm() - const onSignUpSubmit = async (data) => { - try { - await signup(data) - const destination = router.query.from || '/courses' - router.push(destination) - } catch (error) { - toast.error(error.message) - } - } - const onSignUpError = (errors, e) => { - toast.error(errors, e, { - position: 'top-right', - autoClose: 5000, - hideProgressBar: false, - closeOnClick: true, - pauseOnHover: true, - draggable: true, - progress: undefined, - }) - } - - return ( - <> - - Cadastro - WEB3DEV - -

-
-
- -

web3dev

-
-
-

- Registre sua conta -

-

- Já tem uma conta?{' '} - - - Entre agora! - - -

-
-
- - -
-
- -
- - -
setShowPass(!showpass)} - className="absolute right-0 mt-2 mr-3 cursor-pointer" - > -
- - - -
-
- - - - - - -
-
-
-
-
- -
-
- -
-
-

OU

-
-
-
- - -
-
-
-
- - ) -} - -export default withPublic(signUpPage)