diff --git a/next/pages/api/user/registerAccount.js b/next/pages/api/user/registerAccount.js
index c283abf1..7ad2cc5e 100644
--- a/next/pages/api/user/registerAccount.js
+++ b/next/pages/api/user/registerAccount.js
@@ -3,9 +3,8 @@ import axios from "axios";
const API_URL= `${process.env.NEXT_PUBLIC_API_URL}/api/v1/graphql`
export default async function registerAccount({
- userName,
firstName,
- lastName,
+ lastName = "",
email,
password,
}) {
@@ -21,7 +20,7 @@ export default async function registerAccount({
mutation {
CreateUpdateAccount (input:
{
- username : "${userName}"
+ username : "${email}"
email: "${email}"
firstName: "${firstName}"
lastName: "${lastName}"
diff --git a/next/pages/user/login.js b/next/pages/user/login.js
index 136101e5..072fa54d 100644
--- a/next/pages/user/login.js
+++ b/next/pages/user/login.js
@@ -1,10 +1,9 @@
import {
+ Box,
Stack,
FormControl,
FormLabel,
FormErrorMessage,
- Alert,
- AlertIcon,
} from "@chakra-ui/react";
import { useState } from "react";
import cookies from 'js-cookie';
@@ -14,12 +13,15 @@ import {
getUser
} from "../api/user";
+import Display from "../../components/atoms/Display";
import Input from "../../components/atoms/SimpleInput";
import Button from "../../components/atoms/RoundedButton";
import ButtonSimple from "../../components/atoms/SimpleButton";
import SectionText from "../../components/atoms/SectionText";
+import { isMobileMod } from "../../hooks/useCheckMobile.hook"
import { MainPageTemplate } from "../../components/templates/main";
+import Exclamation from "../../public/img/icons/exclamationIcon";
import { EyeIcon, EyeOffIcon } from "../../public/img/icons/eyeIcon";
export default function Login() {
@@ -37,11 +39,11 @@ export default function Login() {
const handleSubmit = () => {
let validationErrors = {}
if (!formData.email) {
- validationErrors.email = "O email é necessário"
+ validationErrors.email = "Por favor, insira um endereço de e-mail válido."
} else if (!/^\S+@\S+$/.test(formData.email)) {
- validationErrors.email = "Email inválido"
+ validationErrors.email = "Por favor, insira um endereço de e-mail válido."
}
- if (!formData.password) validationErrors.password = "A senha é necessária"
+ if (!formData.password) validationErrors.password = "Por favor, insira a senha."
setErrors(validationErrors)
if (Object.keys(validationErrors).length === 0) {
@@ -52,7 +54,7 @@ export default function Login() {
const fetchToken = async ({ email, password }) => {
const result = await getToken({email: email, password: password})
- if(result?.tokenAuth === null || result?.errors?.length > 0) return setErrors({login:"Email ou senha inválida"})
+ if(result?.tokenAuth === null || result?.errors?.length > 0) return setErrors({login:"E-mail ou senha incorretos."})
try {
const userData = await getUser(result.tokenAuth.payload.email)
@@ -63,13 +65,16 @@ export default function Login() {
}
}
- const LabelTextForm = ({ text }) => {
+ const LabelTextForm = ({ text, ...props }) => {
return (
{text}
)
}
@@ -85,39 +90,76 @@ export default function Login() {
+ Faça login
+
{errors.login &&
-
-
+
{errors.login}
-
+
}
-
-
+
+
+
- {errors.email}
+
+ {errors.email}
+
-
-
+
+
+
+ window.open("./password-recovery", "_self")}
+ >Esqueceu a senha?
+
+
+
setShowPassword(!showPassword)
}}
elmRight={showPassword ?
:
}
/>
- {errors.password}
+
+ {errors.password}
+
-
- {/* window.open("./password-recovery", "_self")}
- >Esqueceu a senha?
- */}
-
-
- Não tem uma conta?
- window.open("./register", "_self")}
- >{" "}cadastre-se
-
-
-
-
+
+
+ Não tem uma conta?
+ window.open("./register", "_self")}
+ >{" "}cadastre-se
+ .
+
)
diff --git a/next/pages/user/register.js b/next/pages/user/register.js
index fb1f4436..d93c88b6 100644
--- a/next/pages/user/register.js
+++ b/next/pages/user/register.js
@@ -1,16 +1,12 @@
import {
Stack,
- Flex,
FormControl,
FormLabel,
FormErrorMessage,
UnorderedList,
ListItem,
- Popover,
- PopoverTrigger,
- PopoverContent,
- PopoverCloseButton,
- PopoverHeader,
+ VStack,
+ Text
} from "@chakra-ui/react";
import { useState } from "react";
@@ -18,14 +14,16 @@ import { registerAccount, getToken } from "../api/user";
import Input from "../../components/atoms/SimpleInput";
import Button from "../../components/atoms/RoundedButton";
+import Display from "../../components/atoms/Display";
import { MainPageTemplate } from "../../components/templates/main";
+import { isMobileMod } from "../../hooks/useCheckMobile.hook"
import { EyeIcon, EyeOffIcon } from "../../public/img/icons/eyeIcon";
-
+import Exclamation from "../../public/img/icons/exclamationIcon";
+import Link from "../../components/atoms/Link";
export default function Register() {
const [formData, setFormData] = useState({
- userName: "",
firstName: "",
lastName: "",
email: "",
@@ -33,17 +31,10 @@ export default function Register() {
confirmPassword: ""
})
const [errors, setErrors] = useState({
- userName: "",
firstName: "",
- lastName: "",
email: "",
password: "",
- regexPassword: {
- amount: false,
- uppercaseLowercase: false,
- number: false,
- special: false
- },
+ regexPassword: {},
confirmPassword: ""
})
const [showPassword, setShowPassword] = useState(true)
@@ -61,20 +52,14 @@ export default function Register() {
const validationErrors = {}
e.preventDefault()
- if (!formData.userName) {
- validationErrors.userName = "O nome de usuário é necessário"
- }
if (!formData.firstName) {
- validationErrors.firstName = "O primeiro nome é necessário"
- }
- if (!formData.lastName) {
- validationErrors.lastName = "O sobrenome é necessário"
+ validationErrors.firstName = "Por favor, insira seu nome."
}
if (!formData.email) {
- validationErrors.email = "O email é necessário"
+ validationErrors.email = "Endereço de e-mail inválido ou já existe uma conta com este e-mail."
}
if (!/^\S+@\S+$/.test(formData.email)) {
- validationErrors.email = "Email inválido"
+ validationErrors.email = "Endereço de e-mail inválido ou já existe uma conta com este e-mail."
}
if(!/^.{8,}$/.test(formData.password)) {
regexPassword = {...regexPassword, amount: true}
@@ -88,17 +73,14 @@ export default function Register() {
if(!/(?=.*?[#?!@$%^&*-])/.test(formData.password)) {
regexPassword = {...regexPassword, special: true}
}
- if (!formData.password) {
- validationErrors.password = "A senha é necessária"
- }
if (!formData.confirmPassword) {
validationErrors.confirmPassword = "Confirmar a senha é necessário"
}
if(formData.confirmPassword !== formData.password) {
- validationErrors.confirmPassword = "As senhas tem que ser iguais"
+ validationErrors.confirmPassword = "A senha inserida não coincide com a senha criada no campo acima. Por favor, verifique se não há erros de digitação e tente novamente."
}
- if (Object.keys(regexPassword).length != 0) validationErrors.regexPassword = regexPassword
+ validationErrors.regexPassword = regexPassword
setErrors(validationErrors)
if (Object.keys(validationErrors).length === 0) {
@@ -106,13 +88,12 @@ export default function Register() {
}
}
- const fetchRegister = async ({ userName, firstName, lastName, email, password }) => {
- const result = await registerAccount({userName, firstName, lastName, email, password})
+ const fetchRegister = async ({ firstName, lastName, email, password }) => {
+ const result = await registerAccount({ firstName, lastName, email, password })
let arrayErrors = {}
if(result?.errors?.length > 0) {
result.errors.map((elm) => {
- if(elm.field === "username") arrayErrors = ({...arrayErrors, userName: elm.messages})
if(elm.field === "email") arrayErrors = ({...arrayErrors, email: elm.messages})
})
}
@@ -133,7 +114,9 @@ export default function Register() {
color="#252A32"
fontFamily="ubuntu"
letterSpacing="0.2px"
- lineHeight="24px"
+ lineHeight="16px"
+ fontWeight="400"
+ fontSize="16px"
>{text}
)
}
@@ -143,34 +126,40 @@ export default function Register() {
-
-
-
- {errors.userName}
-
+ Cadastre-se
-
-
-
+
+
+
- {errors.firstName}
+
+ {errors.firstName}
+
@@ -180,105 +169,169 @@ export default function Register() {
name="lastName"
value={formData.lastName}
onChange={handleInputChange}
- placeholder="Dados"
+ placeholder="Insira seu sobrenome (opcional)"
+ fontFamily="ubuntu"
+ height="40px"
+ fontSize="14px"
+ borderRadius="16px"
+ _invalid={{boxShadow:"0 0 0 2px #D93B3B"}}
/>
- {errors.lastName}
+
+ {errors.lastName}
+
-
-
-
-
- {errors.email}
-
+
+
+
+
+ {errors.email}
+
+
-
-
- setShowPassword(!showPassword)
- }}
- elmRight={showPassword ?
-
- :
-
- }
- />
-
- Ter no mínimo 8 caracteres
- Pelo menos uma letra maiúscula e minúscula
- Um dígito
- E um caractere especial
-
- {errors.password}
-
+
+
+ setShowPassword(!showPassword)
+ }}
+ elmRight={showPassword ?
+
+ :
+
+ }
+ />
+ 0 ? "#D93B3B" : "#7D7D7D"}
+ fontFamily= "Ubuntu"
+ fontSize= "12px"
+ fontWeight= "400"
+ lineHeight= "16px"
+ letterSpacing= "0.3px"
+ display="flex"
+ flexDirection="row"
+ gap="4px"
+ alignItems="flex-start"
+ > 0 ? "flex" : "none"}/> Certifique-se que a senha tenha no mínimo:
+
+ Ter no mínimo 8 caracteres
+ Pelo menos uma letra maiúscula e minúscula
+ Um dígito
+ E um caractere especial
+
+
-
-
- setShowConfirmPassword(!showConfirmPassword)
- }}
- elmRight={showConfirmPassword ?
-
- :
-
- }
- />
- {errors.confirmPassword}
-
+
+
+ setShowConfirmPassword(!showConfirmPassword)
+ }}
+ elmRight={showConfirmPassword ?
+
+ :
+
+ }
+ />
+
+ {errors.confirmPassword}
+
+
+
+
+
+ Ao clicar em “Cadastrar” acima, você confirma que leu, compreendeu e aceita os Termos de uso e Políticas de privacidade da Base dos Dados.
+
+
+
+ Já tem uma conta? Faça login.
+
)