barefoot NOMAD
diff --git a/src/components/homepage.scss b/src/components/homepage.scss index e494a54..3b31633 100644 --- a/src/components/homepage.scss +++ b/src/components/homepage.scss @@ -35,7 +35,23 @@ font-size: 1.5em; } } - +.search-input{ + background-color: variables.$navFooterColor;; + border: 0; + border-bottom: 2px solid variables.$mainTextColor; + outline: none; + color: variables.$mainBgColor; + font-size: .9em; + padding-left: 5px; + padding-bottom: -10px; + height: 2.5em; + font-family: FontAwesome; +} + .nav-bar ::placeholder{ + color: variables.$mainTextColor; + text-align: end; + font-size: 1.5em; +} .book-btn, .start-btn{ background-color: variables.$btnBgColor; color: variables.$mainBgColor; diff --git a/src/components/resetPassword/button.js b/src/components/resetPassword/button.js new file mode 100644 index 0000000..2f5c321 --- /dev/null +++ b/src/components/resetPassword/button.js @@ -0,0 +1,9 @@ +import React from 'react'; +import {Button} from 'reactstrap'; + +const Mybutton = ({label})=>{ +return( + +) +} +export default Mybutton; diff --git a/src/components/resetPassword/forgotPassword.js b/src/components/resetPassword/forgotPassword.js new file mode 100644 index 0000000..8672871 --- /dev/null +++ b/src/components/resetPassword/forgotPassword.js @@ -0,0 +1,115 @@ +import React, { useState, useEffect } from "react"; +import image from "../../../Assets/forgot.png"; +import "./reset.scss"; +import { useDispatch, useSelector } from "react-redux"; +import { forgotAction } from "../../../redux/actions/forgotPassword"; +import "bootstrap/dist/css/bootstrap.min.css"; +import Mybutton from "./button"; +import { + Col, + Button, + Form, + Label, + Input, + Spinner, + Alert, + Container, + Row, +} from "reactstrap"; + +const ForgotPassword = () => { + //Create states + const dispatch = useDispatch(); + const [message, setMessage] = useState(""); + const [visible, setVisible] = useState(false); + const [color, setColor] = useState(""); + const [email, setEmail] = useState(""); + + //Add function to dispatch data when submitted and make input an object + const handleSubmit = (e) => { + const newEmail = { email }; + e.preventDefault(); + if (!email) setMessage(error); + setEmail(""); + dispatch(forgotAction(newEmail)); + }; + + //Get data from API + const error = useSelector((state) => state.forgot.error); + const response = useSelector((state) => state.forgot.message); + const loading = useSelector((state) => state.forgot.loading); + + //Add changes incase a state changes + useEffect(() => { + if (error) { + setMessage(error); + setVisible("true"); + setColor("danger"); + } + + if (response) { + setMessage(response); + setVisible("true"); + setColor("success"); + setTimeout(() => { + window.location = "./forgot/success"; + }, 3000); + } + }, [error, response]); + + return ( +
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* */}
+
diff --git a/src/tests/components/login.test.js b/src/tests/components/login.test.js
new file mode 100644
index 0000000..b5a3669
--- /dev/null
+++ b/src/tests/components/login.test.js
@@ -0,0 +1,45 @@
+import React from "react";
+import { mount } from "enzyme";
+import { act } from "react-dom/test-utils";
+import { useDispatch, useSelector } from "react-redux";
+import { Form, Input } from "reactstrap";
+
+
+import Login from "../../components/Login";
+
+const mockDispatch = jest.fn();
+const mockSelector = jest.fn();
+
+jest.mock("react-redux", () => ({
+ useSelector: () => mockSelector,
+ useDispatch: () => mockDispatch,
+}));
+
+describe("Login page", () => {
+ let wrapper;
+ beforeEach(() => {
+ act(() => {
+ wrapper = mount(
+
+
+
+`;
diff --git a/src/tests/components/resetPassword/__snapshots__/resetPassword.mock.test.js.snap b/src/tests/components/resetPassword/__snapshots__/resetPassword.mock.test.js.snap
new file mode 100644
index 0000000..54deda8
--- /dev/null
+++ b/src/tests/components/resetPassword/__snapshots__/resetPassword.mock.test.js.snap
@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`reset page Should render reset with no errors 1`] = `"![\\"image\\"](\\"test-file-stub\\")
"`;
diff --git a/src/tests/components/resetPassword/forgotPassword.mock.test.js b/src/tests/components/resetPassword/forgotPassword.mock.test.js
new file mode 100644
index 0000000..523296a
--- /dev/null
+++ b/src/tests/components/resetPassword/forgotPassword.mock.test.js
@@ -0,0 +1,25 @@
+import React from "react";
+import { mount } from "enzyme";
+import { ForgotPassword, Success } from "../../../components/resetPassword/forgotPassword";
+import {useSelector, useDispatch} from 'react-redux'
+import { act } from "react-dom/test-utils";
+
+const mockDispatch = jest.fn();
+const mockSelector = jest.fn();
+
+jest.mock("react-redux", () => ({
+ useSelector: () => mockSelector,
+ useDispatch: () => mockDispatch,
+}));
+
+describe("forgot page", () => {
+ let wrapper;
+ beforeEach(() => {
+ act(() => {
+ wrapper = mount(
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+