diff --git a/cypress/integration/pages/Forgot/index.test.js b/cypress/integration/pages/Forgot/index.test.js new file mode 100644 index 0000000..9693984 --- /dev/null +++ b/cypress/integration/pages/Forgot/index.test.js @@ -0,0 +1,21 @@ + +describe("Forgot", () => { + + it.only("should show success message when ApiForgot return 200", () => { + cy.visit("/auth/forgot") + + cy.server() + cy.route({ + method: 'POST', // Route all GET requests + url: '/api/forgot_password', + response: [] + }).as("ApiForgot") + + cy.get("input[name=email]").type("brunooomelo") + cy.contains("Enviar").click() + cy.wait("@ApiForgot") + cy.get("span#success").contains("Por favor, verifique seu e-mail.") + cy.get("input[name=email]").should("have.value", "") + }) + +}) diff --git a/cypress/videos/pages/Forgot/index.test.js.mp4 b/cypress/videos/pages/Forgot/index.test.js.mp4 new file mode 100644 index 0000000..30d3e54 Binary files /dev/null and b/cypress/videos/pages/Forgot/index.test.js.mp4 differ diff --git a/src/components/MessageCollab/index.js b/src/components/MessageCollab/index.js new file mode 100644 index 0000000..2caac52 --- /dev/null +++ b/src/components/MessageCollab/index.js @@ -0,0 +1,9 @@ +import React from "react"; + +import { Message } from "./styles"; + +function MessageCollab(props) { + return {props.content}; +} + +export default MessageCollab; diff --git a/src/components/MessageCollab/styles.js b/src/components/MessageCollab/styles.js new file mode 100644 index 0000000..7f86165 --- /dev/null +++ b/src/components/MessageCollab/styles.js @@ -0,0 +1,17 @@ +import styled from "styled-components"; + +import { _h6 } from "../../styles/tools/Typography"; + +export const Message = styled.span` + ${_h6}; + display: flex; + flex: 1; + height: 50px; + background: #75daad; + color: white; + flex-direction: column; + justify-content: center; + text-align: center; + margin-top: 50px; + border-radius: var(--radius-big); +` diff --git a/src/components/SubmitCollab/index.js b/src/components/SubmitCollab/index.js new file mode 100644 index 0000000..1746414 --- /dev/null +++ b/src/components/SubmitCollab/index.js @@ -0,0 +1,12 @@ +import React from "react"; +import { Button, Content } from "./styles"; + +function ButtonCollab(props) { + return ( + + ); +} + +export default ButtonCollab; diff --git a/src/components/SubmitCollab/styles.js b/src/components/SubmitCollab/styles.js new file mode 100644 index 0000000..924913e --- /dev/null +++ b/src/components/SubmitCollab/styles.js @@ -0,0 +1,34 @@ +import styled from "styled-components"; + +import { _h6 } from "../../styles/tools/Typography"; + +export const Button = styled.button` + ${_h6}; + box-shadow: 2px 2px 4px rgba(0,0,0,0.25); + width: 100%; + height: 42px; + margin-top: var(--gap-bigger); + display: flex; + align-items: center; + justify-content: center; + position: relative; + text-decoration: none; + border: none; + border-radius: var(--radius-big); + background-color: var(--color-fiery-rose); + color: var(--color-floral-white); + opacity: 0.9; + transition: opacity 100ms linear, transform 50ms linear; + z-index: 1; + + &:hover, + &:focus { + opacity: 1; + } + + &:active { + transform: translateY(2px); + } +`; + +export const Content = styled.span``; diff --git a/src/containers/FormForgot/index.js b/src/containers/FormForgot/index.js index 000cbbd..eb26476 100644 --- a/src/containers/FormForgot/index.js +++ b/src/containers/FormForgot/index.js @@ -1,15 +1,32 @@ -import React from "react"; +import React, {useState} from "react"; import TitleCollab from "../../components/TitleCollab"; import FieldCollab from "../../components/FieldCollab"; -import ButtonCollab from "../../components/ButtonCollab"; +import SubmitCollab from "../../components/SubmitCollab"; import FormAuth from "../../containers/FormAuth"; import LabelCollab from "../../components/LabelCollab"; +import AuthService from "../../services/AuthService"; +import MessageCollab from "../../components/MessageCollab"; + function FormForgot() { + const [email, setEmail] = useState("") + const [success, setSuccess] = useState(false) + + function onChange(e) { + setEmail(e.target.value) + } + + async function onSubmit(e) { + e.preventDefault() + + return AuthService.forgot(email).then(() => setSuccess(true)).then(() => setEmail("")); + } + + return ( - + - + - + + { success && } ); } diff --git a/src/services/AuthService.js b/src/services/AuthService.js index c9f51b9..37c94f7 100644 --- a/src/services/AuthService.js +++ b/src/services/AuthService.js @@ -9,4 +9,13 @@ function signup(user) { .send(user); } -export default { signup }; +function forgot(email) { + const { REACT_APP_API_AUTH } = process.env; + + return request + .post(`${REACT_APP_API_AUTH}/api/forgot_password`) + .set("Content-Type", "application/json") + .send(email) +} + +export default { signup, forgot };