implemented remember me feature

updated the login page to have functional remember me feature
main
danielq65 3 years ago
parent 0125f6f9f7
commit f23ad0bb25

@ -1,4 +1,4 @@
import React, { useState } from 'react' import React, { useEffect, useState } from 'react'
import { Container } from 'react-bootstrap' import { Container } from 'react-bootstrap'
import './Login.css' import './Login.css'
@ -6,6 +6,12 @@ export default function Login() {
const [email, setEmail] = useState(''); const [email, setEmail] = useState('');
const [password, setPassword] = useState(''); const [password, setPassword] = useState('');
const [errorText, setErrorText] = useState(null); const [errorText, setErrorText] = useState(null);
const [checked, setChecked] = useState(false);
// toggles state of checked for checkbox remember me feature
const handleCheckbox = () => {
setChecked(!checked);
}
function handleSubmit(event) { function handleSubmit(event) {
event.preventDefault(); event.preventDefault();
@ -25,9 +31,18 @@ export default function Login() {
console.log(data.error); console.log(data.error);
setErrorText(data.error); setErrorText(data.error);
} else { } else {
const session = data.session; if(checked) {
document.cookie = `session=${session}; path=/;` // the user chose Remember Me, cookie will expire in 7 days
window.location.href = '/dashboard'; const session = data.session;
const expires = (new Date(Date.now()+ 604800*1000)).toUTCString();
document.cookie = `session=${session}; expires=${expires}; path=/;`
window.location.href = '/dashboard';
}
else {
const session = data.session;
document.cookie = `session=${session}; path=/;`
window.location.href = '/dashboard';
}
} }
console.log(data); // Log the response from the server console.log(data); // Log the response from the server
}) })
@ -69,8 +84,9 @@ export default function Login() {
type="checkbox" type="checkbox"
className="custom-control-input" className="custom-control-input"
id="customCheck1" id="customCheck1"
onChange={handleCheckbox}
/> />
<label id="remember-me" className="custom-control-label" htmlFor="customCheck1"> <label id="remember-me" className="custom-control-label" htmlFor="customCheck1">
Remember me Remember me
</label> </label>
</div> </div>

Loading…
Cancel
Save