diff --git a/.gitignore b/.gitignore index 144e1e8..cff44fc 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ +/server/craban /server/craban.sqlite /server/web/static/* /webapp/node_modules/ diff --git a/server/craban b/server/craban deleted file mode 100755 index f382286..0000000 Binary files a/server/craban and /dev/null differ diff --git a/webapp/src/client.js b/webapp/src/client.js index b5909ea..1e48c86 100644 --- a/webapp/src/client.js +++ b/webapp/src/client.js @@ -1,14 +1,13 @@ export class Client { login(username, password) { - console.log('Logging with', username) - + // ToDo: handle error return fetch("/api/login", { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ username, password }) }).then(r => r.text()).then(token => { - console.log("GOT TOKEN") localStorage.setItem('token', token) + return token }) } } diff --git a/webapp/src/index.js b/webapp/src/index.js index dfbc4a5..e76c70b 100644 --- a/webapp/src/index.js +++ b/webapp/src/index.js @@ -1,3 +1,4 @@ +import { useState, useContext } from 'react' import ReactDOM from 'react-dom' import { BrowserRouter as Router, @@ -9,12 +10,13 @@ import { import { CssBaseline } from '@material-ui/core'; +import UserContext from './user-context' import Login from './pages/login' +import Home from './pages/home' const Secure = ({children}) => { - const token = localStorage.getItem('token') - + const { token } = useContext(UserContext) if (!token) { return } @@ -22,26 +24,26 @@ const Secure = ({children}) => { return children } -const Home = () => { - return

Home

-} - const App = () => { - return ( - - - - - - + const [token, setToken] = useState(localStorage.getItem('token')) - - - - - - - + return ( + + + + + + + + + + + + + + + + ) } diff --git a/webapp/src/pages/home.js b/webapp/src/pages/home.js new file mode 100644 index 0000000..84b337d --- /dev/null +++ b/webapp/src/pages/home.js @@ -0,0 +1,33 @@ +import { useContext } from 'react' +import { + Box, + Button +} from '@material-ui/core'; + +import UserContext from '../user-context' + + +const Home = () => { + const { token, setToken } = useContext(UserContext) + + const handleLogout = (e) => { + e.preventDefault() + localStorage.removeItem('token') + setToken(null) + } + + return ( + +

Home

+ + +
+ ) +} + +export default Home diff --git a/webapp/src/pages/login.js b/webapp/src/pages/login.js index b4fcfe6..25d94c7 100644 --- a/webapp/src/pages/login.js +++ b/webapp/src/pages/login.js @@ -1,4 +1,4 @@ -import { useState } from 'react' +import { useState, useContext } from 'react' import { Redirect } from 'react-router-dom' import { Box, @@ -7,9 +7,12 @@ import { } from '@material-ui/core'; import client from '../client' +import UserContext from '../user-context' const Login = () => { - if (localStorage.getItem('token')) { + const { token, setToken } = useContext(UserContext) + + if (token) { return } @@ -18,9 +21,8 @@ const Login = () => { const handleSubmit = (e) => { e.preventDefault() - client.login(username, password).then(() => { - setUsername('') - setPassword('') + client.login(username, password).then(token => { + setToken(token) }) } diff --git a/webapp/src/user-context.js b/webapp/src/user-context.js new file mode 100644 index 0000000..d254589 --- /dev/null +++ b/webapp/src/user-context.js @@ -0,0 +1,5 @@ +import React from 'react' + +const UserContext = React.createContext() + +export default UserContext