diff --git a/src/App.js b/src/App.js index a0ed407..dde83b5 100644 --- a/src/App.js +++ b/src/App.js @@ -5,7 +5,7 @@ import DashboardComponent from './components/views/dashboard' import EditComponent from './components/views/edit' import LogoutComponent from './components/views/logout' import ForgotComponent from './components/views/forgot' -import { UsernameToken, UserExistsToken, AuthenticatedToken } from './components/token' +import { UsernameToken } from './components/token' import './styles/App.css' @@ -15,68 +15,50 @@ import { BrowserRouter, Route, Switch } from 'react-router-dom' export default function App() { const { username, setUsername } = UsernameToken() - const { userExists, setUserExists } = UserExistsToken() - const { authenticated, setAuthenticated } = AuthenticatedToken() return (
- +
diff --git a/src/components/token.js b/src/components/token.js index 8b2d1a9..68d5235 100644 --- a/src/components/token.js +++ b/src/components/token.js @@ -19,44 +19,6 @@ export function UsernameToken() { } } -export function UserExistsToken() { - const getUserExists = () => { - const existsToken = JSON.parse(localStorage.getItem('exists')) - return existsToken - } - - const [exists, setUserExists] = useState(getUserExists()) - - const saveUserExists = existsToken => { - localStorage.setItem('exists', JSON.stringify(existsToken)) - setUserExists(existsToken) - } - - return { - setUserExists: saveUserExists, - exists - } -} - -export function AuthenticatedToken() { - const getAuthenticated = () => { - const authToken = JSON.parse(localStorage.getItem('authenticated')) - return authToken - } - - const [authenticated, setAuthenticated] = useState(getAuthenticated()) - - const saveAuthenticated = authToken => { - localStorage.setItem('authenticated', JSON.stringify(authToken)) - setAuthenticated(authToken) - } - - return { - setAuthenticated: saveAuthenticated, - authenticated - } -} - export function ClearToken(tokenName) { localStorage.removeItem(tokenName) } diff --git a/src/components/views/authenticate.js b/src/components/views/authenticate.js index 73bd0dc..ac55496 100644 --- a/src/components/views/authenticate.js +++ b/src/components/views/authenticate.js @@ -13,10 +13,6 @@ import "../../styles/authenticate.css" export default function AuthenticateComponent({ username, - userExists, - setUserExists, - authenticated, - setAuthenticated, registering }) { const [loading, setLoading] = useState(false) @@ -155,14 +151,14 @@ export default function AuthenticateComponent({ }) } - const handleLockChange = async (files) => { + const handleLockChange = (files) => { setLockFiles(files) - await generateFileList(files, null) + generateFileList(files, null) } - const handleUnlockChange = async (files) => { + const handleUnlockChange = (files) => { setUnlockFiles(files) - await generateFileList(null, files) + generateFileList(null, files) } const handleSubmit = async e => { @@ -174,10 +170,10 @@ export default function AuthenticateComponent({ const userCreateRes = await createUser() setLoading(false) - // If successful at creating user, move to login + // If successful at creating user, move to dashboard if (userCreateRes === true) { - setUserExists(userCreateRes) - setAuthenticated(true) + localStorage.setItem('exists', true) + localStorage.setItem('authenticated', true) window.location.href = "/dashboard" } else { // If unsuccessful, return to default registration with error alert @@ -195,10 +191,9 @@ export default function AuthenticateComponent({ // If successful at logging in user, move to dashboard if (userLoginRes === true) { - setAuthenticated(true) + localStorage.setItem('authenticated', true) window.location.href = "/dashboard" } else if (userLoginRes.CODE === 10) { - setAuthenticated(false) alert(`Failed to login with given face or unlock credentials\n${userLoginRes.MESSAGE}`) window.location.href = "/login" } else { @@ -263,13 +258,13 @@ export default function AuthenticateComponent({ Chose at least 4 gestures as your lock gesture combination (OPTIONAL) - setShowLockDisplay(!showLockDisplay)} - /> + setShowLockDisplay(!showLockDisplay)} + /> handleUnlockChange(e.target.files)}> Chose at least 4 other gestures as your unlock gesture combination - setShowUnlockDisplay(!showUnlockDisplay)} - /> + setShowUnlockDisplay(!showUnlockDisplay)} + />
) } else { @@ -310,13 +305,13 @@ export default function AuthenticateComponent({ Please enter your unlock combination - setShowUnlockDisplay(!showUnlockDisplay)} - /> + setShowUnlockDisplay(!showUnlockDisplay)} + />
) @@ -345,13 +340,13 @@ export default function AuthenticateComponent({ } } - if (authenticated) { + if (localStorage.getItem('authenticated')) { window.location.href = "/dashboard" - } else if (!username || !localStorage.getItem("exists")) { + } else if (!username) { window.location.href = "/" - } else if (localStorage.getItem("exists") === 'true' && window.location.pathname === "/register") { + } else if (localStorage.getItem('exists') === 'true' && window.location.pathname === "/register" && !localStorage.getItem('authenticated')) { window.location.href = "/login" - } else if (localStorage.getItem("exists") === 'false' && window.location.pathname === "/login") { + } else if (localStorage.getItem('exists') === 'false' && window.location.pathname === "/login" && !localStorage.getItem('authenticated')) { window.location.href = "/register" } else { if (navigator.mediaDevices.getUserMedia !== null) { @@ -392,9 +387,5 @@ export default function AuthenticateComponent({ AuthenticateComponent.propTypes = { username: PropTypes.string, - userExists: PropTypes.bool, - setUserExists: PropTypes.func, - authenticated: PropTypes.bool, - setAuthenticated: PropTypes.func, registering: PropTypes.bool.isRequired } diff --git a/src/components/views/dashboard.js b/src/components/views/dashboard.js index 2ba10e3..7b1df62 100644 --- a/src/components/views/dashboard.js +++ b/src/components/views/dashboard.js @@ -8,7 +8,7 @@ import '../../styles/dashboard.css' import { ClearTokens } from '../token' -export default function DashboardComponent({ username, authenticated }) { +export default function DashboardComponent({ username }) { const [deleting, setDeleting] = useState(false) const handleDeleteClick = async e => { @@ -51,7 +51,7 @@ export default function DashboardComponent({ username, authenticated }) { } } - if (!authenticated) { + if (!localStorage.getItem('authenticated')) { window.location.href = "/" } else { if (deleting) { diff --git a/src/components/views/edit.js b/src/components/views/edit.js index 3723b0d..b29c502 100644 --- a/src/components/views/edit.js +++ b/src/components/views/edit.js @@ -9,7 +9,7 @@ import Webcam from 'react-webcam' import { uploadFiles, uploadEncoded, checkCombination } from '../middleware' -export default function EditComponent({ username, authenticated }) { +export default function EditComponent({ username }) { const [loading, setLoading] = useState(false) const [streaming, setStreaming] = useState(false) const [editFace, setEditFace] = useState(false) @@ -171,32 +171,34 @@ export default function EditComponent({ username, authenticated }) { Lock Gesture Combination - setShowLockDisplay(!showLockDisplay)} - /> + setShowLockDisplay(!showLockDisplay)} + /> ) } else { return ( - handleLockChange(e.target.files)}> - - Lock Gesture Combination - - +
+ handleLockChange(e.target.files)}> + + Lock Gesture Combination + + + setShowLockDisplay(!showLockDisplay)} /> - +
) } } @@ -232,7 +234,7 @@ export default function EditComponent({ username, authenticated }) { } } - if (!authenticated) { + if (!localStorage.getItem('authenticated')) { window.location.href = "/" } else { if (navigator.mediaDevices.getUserMedia !== null && editFace === true) { @@ -286,13 +288,13 @@ export default function EditComponent({ username, authenticated }) { Unlock Gesture Combination - setShowUnlockDisplay(!showUnlockDisplay)} - />
+ setShowUnlockDisplay(!showUnlockDisplay)} + /> {getButton()}