diff --git a/package.json b/package.json index 6962e41..39fd73e 100644 --- a/package.json +++ b/package.json @@ -8,6 +8,7 @@ "@capacitor/haptics": "1.1.4", "@capacitor/keyboard": "1.2.2", "@capacitor/status-bar": "1.0.8", + "@hookform/error-message": "^2.0.0", "@ionic/react": "^6.0.0", "@ionic/react-router": "^6.0.0", "@testing-library/jest-dom": "^5.11.9", @@ -23,6 +24,7 @@ "ionicons": "^5.4.0", "react": "^17.0.1", "react-dom": "^17.0.1", + "react-hook-form": "^7.30.0", "react-router": "^5.2.0", "react-router-dom": "^5.2.0", "typescript": "^4.1.3", diff --git a/src/constants/routes/sessionRoutes.ts b/src/constants/routes/sessionRoutes.ts index a33a439..11717b1 100644 --- a/src/constants/routes/sessionRoutes.ts +++ b/src/constants/routes/sessionRoutes.ts @@ -1,4 +1,4 @@ -const sessionRoutesDefault = '/session'; +const sessionRoutesDefault = '/sessions'; const sessionRoutes = { create: { url: `${sessionRoutesDefault}/` diff --git a/src/pages/login/Login.tsx b/src/pages/login/Login.tsx index 4ab3161..b31ceeb 100644 --- a/src/pages/login/Login.tsx +++ b/src/pages/login/Login.tsx @@ -23,48 +23,61 @@ import { import * as sessionRoutes from '../../services/session'; import LocalStorage from "../../LocalStorage"; -function validateEmail(email: string) { - const re = - /^((?:[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])+)\]))$/; - return re.test(String(email).toLowerCase()); -} - const Page: React.FC = () => { const history = useHistory(); const [email, setEmail] = useState("matheusalb3213@gmail.com"); - const [password, setPassword] = useState("1234"); + const [password, setPassword] = useState("123456"); const [isError, setIsError] = useState(false); const [message, setMessage] = useState(""); - const handleLogin = async () => { - // validação de inputs + function validateEmail(email: string) { + const re = + /^((?:[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])+)\]))$/; + return re.test(String(email).toLowerCase()); + } + + const validateForm = () => { if (!email) { setMessage("Por favor, informe um e-mail válido"); setIsError(true); - return; + return false; } if (validateEmail(email) === false) { setMessage("E-mail inválido"); setIsError(true); - return; + return false; } - if (!password || password.length < 6) { + if (!password) { setMessage("Por favor, digite a sua senha"); setIsError(true); - return; + return false; + } + + if(password.length < 6) { + setMessage("A senha deve conter ao menos 6 dígitos"); + setIsError(true); + return false; + } + + return true; + } + + const handleLogin = async () => { + if (!validateForm()) { + return } const singinForm = { - email: email, + login: email, password: password, }; await sessionRoutes.create(singinForm).then(response => { // if (!response) return - const { token } = response + const { token } = response.token LocalStorage.setToken(token); diff --git a/src/services/session.ts b/src/services/session.ts index 7cd6717..004ab03 100644 --- a/src/services/session.ts +++ b/src/services/session.ts @@ -7,8 +7,8 @@ let token: string | null; let header: AxiosRequestHeaders; interface createData { - email: string, - password: string, + login: string, + password: string, } function updateHeader() {