tanner/spaceport
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Split classes into upcoming and recent

Browse Source
This commit is contained in:
Tanner Collin 2020-01-10 07:39:05 +00:00
parent 6698c04e91
commit 027a5fdfc1
2 changed files with 56 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
webclient/src/Classes.js
View File

@ -7,29 +7,13 @@ import moment from 'moment';
import { requester } from './utils.js';
import { NotFound, PleaseLogin } from './Misc.js';
export function Classes(props) {
const [classes, setClasses] = useState(false);
const { token } = props;
useEffect(() => {
requester('/sessions/', 'GET', token)
.then(res => {
console.log(res);
setClasses(res.results);
})
.catch(err => {
console.log(err);
});
}, []);
function ClassTable(props) {
const { classes } = props;
const getInstructor = (session) =>
session.instructor ? session.instructor.first_name : session.old_instructor;
return (
<Container>
<Header size='large'>Most Recent Classes</Header>
{classes ?
<Table basic='very'>
<Table.Header>
<Table.Row>
@ -50,7 +34,7 @@ export function Classes(props) {
<Table.Cell>{x.course.name}</Table.Cell>
<Table.Cell>
<Link to={'/classes/'+x.id}>
{moment.utc(x.datetime).format('LL')}
{moment.utc(x.datetime).format('ll')}
</Link>
</Table.Cell>
<Table.Cell>{getInstructor(x)}</Table.Cell>
@ -63,6 +47,40 @@ export function Classes(props) {
}
</Table.Body>
</Table>
);
};
export function Classes(props) {
const [classes, setClasses] = useState(false);
const { token } = props;
useEffect(() => {
requester('/sessions/', 'GET', token)
.then(res => {
console.log(res);
setClasses(res.results);
})
.catch(err => {
console.log(err);
});
}, []);
const now = new Date().toISOString();
return (
<Container>
<Header size='large'>Class List</Header>
<Header size='medium'>Upcoming</Header>
{classes ?
<ClassTable classes={classes.filter(x => x.datetime > now)} />
:
<p>Loading...</p>
}
<Header size='medium'>Recent</Header>
{classes ?
<ClassTable classes={classes.filter(x => x.datetime < now)} />
:
<p>Loading...</p>
}
@ -96,7 +114,7 @@ export function ClassDetail(props) {
{!error ?
clazz ?
<div>
<Header size='large'>Class Detail</Header>
<Header size='large'>Class Details</Header>
<Table unstackable basic='very'>
<Table.Body>
@ -111,7 +129,7 @@ export function ClassDetail(props) {
<Table.Row>
<Table.Cell>Date:</Table.Cell>
<Table.Cell>
{moment.utc(clazz.datetime).format('LL')}
{moment.utc(clazz.datetime).format('ll')}
</Table.Cell>
</Table.Row>
<Table.Row>

2
webclient/src/Courses.js
View File

@ -108,7 +108,7 @@ export function CourseDetail(props) {
<Table.Row key={i}>
<Table.Cell>
<Link to={'/classes/'+x.id}>
{moment.utc(x.datetime).format('LL')}
{moment.utc(x.datetime).format('ll')}
</Link>
</Table.Cell>
<Table.Cell>{moment.utc(x.datetime).format('LT')}</Table.Cell>