2020-01-08 23:43:59 +00:00
|
|
|
import React, { useState, useEffect } from 'react';
|
2020-01-09 09:04:32 +00:00
|
|
|
import { BrowserRouter as Router, Switch, Route, Link, useParams } from 'react-router-dom';
|
2020-01-07 07:59:12 +00:00
|
|
|
import './light.css';
|
|
|
|
import Logo from './logo.svg';
|
2020-01-09 07:38:49 +00:00
|
|
|
import { Container, Divider, Dropdown, Form, Grid, Header, Icon, Image, Menu, Message, Segment, Table } from 'semantic-ui-react';
|
2020-01-07 07:59:12 +00:00
|
|
|
import { requester } from './utils.js';
|
2020-01-09 22:11:56 +00:00
|
|
|
import { Home } from './Home.js';
|
|
|
|
import { Transactions, TransactionDetail } from './Transactions.js';
|
|
|
|
import { Cards } from './Cards.js';
|
2020-01-10 00:29:52 +00:00
|
|
|
import { Training } from './Training.js';
|
2020-01-10 06:24:37 +00:00
|
|
|
import { Courses, CourseDetail } from './Courses.js';
|
|
|
|
import { Classes, ClassDetail } from './Classes.js';
|
2020-01-09 22:11:56 +00:00
|
|
|
import { NotFound, PleaseLogin } from './Misc.js';
|
2020-01-09 09:15:01 +00:00
|
|
|
|
2020-01-06 23:32:29 +00:00
|
|
|
function App() {
|
2020-01-08 23:43:59 +00:00
|
|
|
const [token, setToken] = useState(localStorage.getItem('token', ''));
|
|
|
|
const [user, setUser] = useState(JSON.parse(localStorage.getItem('user', 'false')));
|
|
|
|
|
2020-01-09 09:04:32 +00:00
|
|
|
function setTokenCache(x) {
|
2020-01-08 23:43:59 +00:00
|
|
|
setToken(x);
|
|
|
|
localStorage.setItem('token', x);
|
|
|
|
}
|
|
|
|
|
2020-01-09 09:04:32 +00:00
|
|
|
function setUserCache(x) {
|
2020-01-08 23:43:59 +00:00
|
|
|
setUser(x);
|
|
|
|
localStorage.setItem('user', JSON.stringify(x));
|
|
|
|
}
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
requester('/me/', 'GET', token)
|
|
|
|
.then(res => {
|
|
|
|
console.log(res);
|
|
|
|
setUserCache(res);
|
|
|
|
})
|
|
|
|
.catch(err => {
|
|
|
|
console.log(err);
|
|
|
|
setUser(false);
|
|
|
|
});
|
|
|
|
}, [token]);
|
|
|
|
|
2020-01-09 09:04:32 +00:00
|
|
|
function logout() {
|
|
|
|
window.location = '/';
|
2020-01-08 23:43:59 +00:00
|
|
|
setTokenCache('');
|
|
|
|
setUserCache(false);
|
|
|
|
}
|
|
|
|
|
2020-01-07 02:10:25 +00:00
|
|
|
return (
|
2020-01-09 07:38:49 +00:00
|
|
|
<Router>
|
2020-01-07 07:59:12 +00:00
|
|
|
<Container>
|
2020-01-08 23:43:59 +00:00
|
|
|
<div className='header'>
|
2020-01-07 07:59:12 +00:00
|
|
|
<img src={Logo} className='logo' />
|
2020-01-08 23:43:59 +00:00
|
|
|
</div>
|
2020-01-07 07:59:12 +00:00
|
|
|
</Container>
|
|
|
|
|
|
|
|
<Menu>
|
2020-01-09 07:38:49 +00:00
|
|
|
<Container>
|
2020-01-08 23:43:59 +00:00
|
|
|
<Menu.Item
|
2020-01-09 07:38:49 +00:00
|
|
|
content='Home'
|
|
|
|
as={Link}
|
|
|
|
to='/'
|
2020-01-08 23:43:59 +00:00
|
|
|
/>
|
2020-01-09 07:38:49 +00:00
|
|
|
|
2020-01-10 00:29:52 +00:00
|
|
|
<Dropdown item text='Profile' id='ps-menu'>
|
2020-01-09 07:38:49 +00:00
|
|
|
<Dropdown.Menu>
|
|
|
|
<Dropdown.Item
|
|
|
|
content='Transactions'
|
2020-01-09 09:04:32 +00:00
|
|
|
as={Link}
|
|
|
|
to='/transactions'
|
2020-01-09 07:38:49 +00:00
|
|
|
/>
|
2020-01-10 00:29:52 +00:00
|
|
|
<Dropdown.Item
|
|
|
|
content='Training'
|
|
|
|
as={Link}
|
|
|
|
to='/training'
|
|
|
|
/>
|
2020-01-09 07:38:49 +00:00
|
|
|
<Dropdown.Item
|
|
|
|
content='Cards'
|
2020-01-09 10:44:44 +00:00
|
|
|
as={Link}
|
|
|
|
to='/cards'
|
2020-01-09 07:38:49 +00:00
|
|
|
/>
|
|
|
|
</Dropdown.Menu>
|
|
|
|
</Dropdown>
|
|
|
|
|
|
|
|
<Dropdown item text='Space' id='ps-menu'>
|
|
|
|
<Dropdown.Menu>
|
|
|
|
<Dropdown.Item
|
|
|
|
content='Members'
|
|
|
|
/>
|
|
|
|
<Dropdown.Item
|
|
|
|
content='Courses'
|
2020-01-10 06:24:37 +00:00
|
|
|
as={Link}
|
|
|
|
to='/courses'
|
|
|
|
/>
|
|
|
|
<Dropdown.Item
|
|
|
|
content='Classes'
|
|
|
|
as={Link}
|
|
|
|
to='/classes'
|
2020-01-09 07:38:49 +00:00
|
|
|
/>
|
|
|
|
</Dropdown.Menu>
|
|
|
|
</Dropdown>
|
|
|
|
|
|
|
|
{user && <Menu.Menu position='right'>
|
|
|
|
<Menu.Item
|
|
|
|
content='Logout'
|
|
|
|
onClick={logout}
|
|
|
|
icon='cancel'
|
|
|
|
/>
|
|
|
|
<Menu.Item fitted content='' />
|
|
|
|
</Menu.Menu>}
|
|
|
|
</Container>
|
2020-01-07 07:59:12 +00:00
|
|
|
</Menu>
|
|
|
|
|
2020-01-09 07:38:49 +00:00
|
|
|
<Route exact path='/'>
|
|
|
|
<Home token={token} setTokenCache={setTokenCache} user={user} setUserCache={setUserCache} />
|
|
|
|
</Route>
|
|
|
|
|
2020-01-09 10:44:44 +00:00
|
|
|
<div className='topPadding'>
|
|
|
|
{user ?
|
|
|
|
<Switch>
|
|
|
|
<Route path='/transactions/:id'>
|
|
|
|
<TransactionDetail user={user} />
|
|
|
|
</Route>
|
|
|
|
<Route path='/transactions'>
|
|
|
|
<Transactions user={user} />
|
|
|
|
</Route>
|
|
|
|
|
|
|
|
<Route path='/cards'>
|
|
|
|
<Cards user={user} />
|
|
|
|
</Route>
|
|
|
|
|
2020-01-10 00:29:52 +00:00
|
|
|
<Route path='/training'>
|
|
|
|
<Training user={user} />
|
|
|
|
</Route>
|
|
|
|
|
2020-01-10 06:24:37 +00:00
|
|
|
<Route path='/courses/:id'>
|
|
|
|
<CourseDetail token={token} />
|
|
|
|
</Route>
|
|
|
|
<Route path='/courses'>
|
|
|
|
<Courses token={token} />
|
|
|
|
</Route>
|
|
|
|
|
|
|
|
<Route path='/classes/:id'>
|
|
|
|
<ClassDetail token={token} />
|
|
|
|
</Route>
|
|
|
|
<Route path='/classes'>
|
|
|
|
<Classes token={token} />
|
|
|
|
</Route>
|
|
|
|
|
2020-01-09 10:44:44 +00:00
|
|
|
<Route path='/:page'>
|
|
|
|
<NotFound />
|
|
|
|
</Route>
|
|
|
|
</Switch>
|
|
|
|
:
|
2020-01-09 09:15:01 +00:00
|
|
|
<Route path='/:page'>
|
2020-01-09 10:44:44 +00:00
|
|
|
<PleaseLogin />
|
2020-01-09 09:15:01 +00:00
|
|
|
</Route>
|
2020-01-09 10:44:44 +00:00
|
|
|
}
|
|
|
|
</div>
|
2020-01-09 09:04:32 +00:00
|
|
|
|
2020-01-09 07:38:49 +00:00
|
|
|
</Router>
|
|
|
|
)
|
|
|
|
};
|
2020-01-06 23:32:29 +00:00
|
|
|
|
|
|
|
export default App;
|