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 };