added ability to recover password from login page

client/node_modules/.cache/babel-loader/31ce7dc0ab44ecc1ffb65b6ad4ec01d7.json

+{"ast":null,"code":"export default {\n  oidc: {\n    clientId: '0oa1f4zfeiiZPB6DF5d7',\n    issuer: 'https://dev-91882654.okta.com/oauth2/default',\n    redirectUri: window.location.origin + '/login/callback',\n    scopes: ['openid', 'profile', 'email'],\n    pkce: true\n  },\n  serviceAPI: {\n    messagesURL: 'http://localhost:3030/api/messages',\n    createNewUserURL: 'http://localhost:3030/api/create-user',\n    resetPasswordURL: 'http://localhost:3030/api/reset-user-password'\n  }\n};","map":{"version":3,"sources":["C:/Users/Bruger/Desktop/Web-projects/pipit/client/src/config.js"],"names":["oidc","clientId","issuer","redirectUri","window","location","origin","scopes","pkce","serviceAPI","messagesURL","createNewUserURL","resetPasswordURL"],"mappings":"AAAA,eAAe;AACbA,EAAAA,IAAI,EAAE;AACJC,IAAAA,QAAQ,EAAE,sBADN;AAEJC,IAAAA,MAAM,EAAE,8CAFJ;AAGJC,IAAAA,WAAW,EAAEC,MAAM,CAACC,QAAP,CAAgBC,MAAhB,GAAyB,iBAHlC;AAIJC,IAAAA,MAAM,EAAE,CAAC,QAAD,EAAW,SAAX,EAAsB,OAAtB,CAJJ;AAKJC,IAAAA,IAAI,EAAE;AALF,GADO;AAQbC,EAAAA,UAAU,EAAE;AACVC,IAAAA,WAAW,EAAE,oCADH;AAEVC,IAAAA,gBAAgB,EAAE,uCAFR;AAGVC,IAAAA,gBAAgB,EAAE;AAHR;AARC,CAAf","sourcesContent":["export default {\r\n  oidc: {\r\n    clientId: '0oa1f4zfeiiZPB6DF5d7',\r\n    issuer: 'https://dev-91882654.okta.com/oauth2/default',\r\n    redirectUri: window.location.origin + '/login/callback',\r\n    scopes: ['openid', 'profile', 'email'],\r\n    pkce: true\r\n  },\r\n  serviceAPI: {\r\n    messagesURL: 'http://localhost:3030/api/messages',\r\n    createNewUserURL: 'http://localhost:3030/api/create-user',\r\n    resetPasswordURL: 'http://localhost:3030/api/reset-user-password'\r\n  }\r\n};"]},"metadata":{},"sourceType":"module"}
\ No newline at end of file

client/src/components/login/Login.css

@@ -84,6 +84,16 @@ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0c4d99', end
   color: black;
 }
 
+.signInForm span {
+  font-size: 10px;
+  color: grey;
+}
+
+.signInForm span a:hover {
+  cursor: pointer;
+  text-decoration: underline;
+}
+
 .signUpForm .password-requirements {
   font-size: 10px;
   color: grey;

client/src/components/login/Login.jsx

@@ -49,15 +49,20 @@ const SignUp = () => {
     password: `${password}`
   })
 
-  const requestOptions = {
+  const loginRequestOptions = {
     method: 'POST',
     body: userInputData
   };
 
+  const resetPasswordRequestOptions = {
+    method: 'PUT',
+    body: userInputData
+  }
+
   const handleSignUpFormSubmit = (e) => {
     e.preventDefault();
 
-    fetch(config.serviceAPI.createNewUserURL, requestOptions)
+    fetch(config.serviceAPI.createNewUserURL, loginRequestOptions)
       .then((res) => {
         if (!res.ok) {
           window.alert("Error")
@@ -104,12 +109,30 @@ const SignUp = () => {
     return null;
   }
 
+  const handlePasswordReset = () => {
+    if (!username == '') {
+      fetch(config.serviceAPI.resetPasswordURL, resetPasswordRequestOptions)
+        .then((res) => {
+          if (!res.ok) {
+            window.alert("Error: something went wrong")
+            Promise.reject("")
+            return
+          }
+          if (res.ok) {
+            // do something
+          }
+        })
+    }
+    else {
+      window.alert("Please enter a valid email into the login form")
+    }
+  }
+
   return (
     <div className="pageContainer">
       {/* The Modal */}
       <div className={`modal ${signUpFormVisibilityState ? "active" : "inactive"}`}>
 
-        {/* Modal content */}
         <div ref={signUpFormRef} className="modal-content">
           <div className="signUpForm">
             <h2>Sign Up</h2>
@@ -186,9 +209,9 @@ const SignUp = () => {
             <FontAwesomeIcon icon="sign-in-alt"></FontAwesomeIcon>
           </button>
         </form>
-        <div className="signInPrompt">
-          <span>Dont have an account yet?&nbsp;
-            <a onClick={toggleSignInFormVisible}>Sign up</a>
+        <div className="password-forgot-prompt">
+          <span>
+            <a onClick={handlePasswordReset}>Forgot password</a>
           </span>
         </div>
       </div>

client/src/config.js

@@ -8,6 +8,7 @@ export default {
   },
   serviceAPI: {
     messagesURL: 'http://localhost:3030/api/messages',
-    createNewUserURL: 'http://localhost:3030/api/create-user'
+    createNewUserURL: 'http://localhost:3030/api/create-user',
+    resetPasswordURL: 'http://localhost:3030/api/reset-user-password'
   }
 };
\ No newline at end of file