fez5587/Superalgos
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Installing a clean linter for the frontend

Browse Source
This commit is contained in:
Nikola Bjelo committed 2018-11-06 02:38:16 +01:00
1 parent 6dd6fac7e6
commit b14828655f
33 files changed
+607 -401
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

client/src/Components/Event/Edit/index.js
+12 -12
View File
@@ -1,15 +1,15 @@
import React from 'react'
import { Query } from 'react-apollo'
import React from 'react';
import { Query } from 'react-apollo';
import Typography from '@material-ui/core/Typography'
import { withStyles } from '@material-ui/core/styles'
import Typography from '@material-ui/core/Typography';
import { withStyles } from '@material-ui/core/styles';
import styles from './styles'
import styles from './styles';
import { showEventCalls } from '../../../GraphQL/Calls/index'
import { showEventCalls } from '../../../GraphQL/Calls/index';
class Edit extends React.Component {
render () {
render() {
return (
<React.Fragment>
<Typography
@@ -25,18 +25,18 @@ class Edit extends React.Component {
variables={{ designator: this.props.match.params.slug }}
>
{({ loading, error, data }) => {
if (loading) return 'Loading...'
if (error) return `Error! ${error.message}`
if (loading) return 'Loading...';
if (error) return `Error! ${error.message}`;
return (
<p>
{data.events_Event.description}
</p>
)
);
}}
</Query>
</React.Fragment>
)
);
}
}
export default withStyles(styles)(Edit)
export default withStyles(styles)(Edit);
client/src/Components/Event/Edit/styles.js
+3 -3
View File
@@ -1,4 +1,4 @@
const styles = theme => ({
})
const styles = () => ({
});
export default styles
export default styles;
client/src/Components/Event/Show/index.js
+12 -12
View File
@@ -1,15 +1,15 @@
import React from 'react'
import { Query } from 'react-apollo'
import React from 'react';
import { Query } from 'react-apollo';
import Typography from '@material-ui/core/Typography'
import { withStyles } from '@material-ui/core/styles'
import Typography from '@material-ui/core/Typography';
import { withStyles } from '@material-ui/core/styles';
import styles from './styles'
import styles from './styles';
import { showEventCalls } from '../../../GraphQL/Calls/index'
import { showEventCalls } from '../../../GraphQL/Calls/index';
class Show extends React.Component {
render () {
render() {
return (
<React.Fragment>
<Typography
@@ -25,18 +25,18 @@ class Show extends React.Component {
variables={{ designator: this.props.match.params.slug }}
>
{({ loading, error, data }) => {
if (loading) return 'Loading...'
if (error) return `Error! ${error.message}`
if (loading) return 'Loading...';
if (error) return `Error! ${error.message}`;
return (
<p>
{data.events_Event.description}
</p>
)
);
}}
</Query>
</React.Fragment>
)
);
}
}
export default withStyles(styles)(Show)
export default withStyles(styles)(Show);
client/src/Components/Event/Show/styles.js
+3 -3
View File
@@ -1,4 +1,4 @@
const styles = theme => ({
})
const styles = () => ({
});
export default styles
export default styles;
client/src/Components/Events/index.js
+3 -7
View File
@@ -1,9 +1,5 @@
import React from 'react'
import React from 'react';
class Index extends React.Component {
render () {
return <p>Here will come a list the competitions you applied for</p>
}
}
const Index = () => <p>Here will come a list the competitions you applied for</p>;
export default Index
export default Index;
client/src/Components/HostedEvents/Event.js
+17 -15
View File
@@ -1,27 +1,27 @@
import React from 'react'
import { Link } from 'react-router-dom'
import React from 'react';
import { Link } from 'react-router-dom';
import {
Grid, Paper,
Typography,
Button
} from '@material-ui/core'
import { withStyles } from '@material-ui/core/styles'
import styles from './styles'
Button,
} from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles';
import styles from './styles';
import { toLocalTime } from '../../utils'
import { toLocalTime } from '../../utils';
class Event extends React.Component {
render () {
const classes = this.props.classes
render() {
const { classes } = this.props;
const {
name,
designator,
startDatetime,
finishDatetime,
host,
description
} = this.props.event
description,
} = this.props.event;
return (
<Paper className={classes.card}>
<Grid container spacing={16}>
@@ -31,7 +31,9 @@ class Event extends React.Component {
<Typography gutterBottom>To : {toLocalTime(finishDatetime)} </Typography>
</Grid>
<Grid item xs>
<Typography gutterBottom>Hosted by: {host.alias} ({host.lastName} {host.firstName}) </Typography>
<Typography gutterBottom>
Hosted by: {host.alias} ({host.lastName} {host.firstName})
</Typography>
<Typography gutterBottom>Formula: </Typography>
<Typography gutterBottom>First prize: </Typography>
</Grid>
@@ -58,7 +60,7 @@ class Event extends React.Component {
color='primary'
size='small'
component={Link}
to={'/show/' + designator}
to={`/show/${designator}`}
>
Show
</Button>
@@ -67,8 +69,8 @@ class Event extends React.Component {
</Grid>
</Grid>
</Paper>
)
);
}
}
export default withStyles(styles)(Event)
export default withStyles(styles)(Event);
client/src/Components/HostedEvents/New.js
+39 -33
View File
@@ -1,64 +1,70 @@
import React from 'react'
import { Mutation } from 'react-apollo'
import { hostedEventsCalls } from '../../GraphQL/Calls/index'
import { DateTime } from 'luxon'
import React from 'react';
import { Mutation } from 'react-apollo';
import { DateTime } from 'luxon';
import {
Button,
TextField
} from '@material-ui/core'
import { ChevronLeft, ChevronRight } from '@material-ui/icons'
import { DateTimePicker } from 'material-ui-pickers'
TextField,
} from '@material-ui/core';
import { ChevronLeft, ChevronRight } from '@material-ui/icons';
import { DateTimePicker } from 'material-ui-pickers';
import { hostedEventsCalls } from '../../GraphQL/Calls/index';
class New extends React.Component {
constructor (props) {
super(props)
constructor(props) {
super(props);
this.state = {
name: '',
description: '',
startDatetime: DateTime.local().plus({ days: 1 }).startOf('day'),
finishDatetime: DateTime.local().plus({ days: 8 }).startOf('day')
}
finishDatetime: DateTime.local().plus({ days: 8 }).startOf('day'),
};
}
render () {
const { name, description, startDatetime, finishDatetime } = this.state
render() {
const {
name, description, startDatetime, finishDatetime,
} = this.state;
return (
<Mutation mutation={hostedEventsCalls.EVENTS_HOSTEVENT}
update={(store, { data }) => {
const { events_EventsByHost: hostedEvents } = store.readQuery({ query: hostedEventsCalls.EVENTS_EVENTSBYHOST })
const { events_EventsByHost: hostedEvents } = store.readQuery({
query: hostedEventsCalls.EVENTS_EVENTSBYHOST,
});
store.writeQuery({
query: hostedEventsCalls.EVENTS_EVENTSBYHOST,
data: { events_EventsByHost: hostedEvents.concat([data.events_HostEvent]) }
})
this.props.handleNewEvent(data.events_HostEvent)
data: { events_EventsByHost: hostedEvents.concat([data.events_HostEvent]) },
});
this.props.handleNewEvent(data.events_HostEvent);
}
}
>
{(hostEvent, { data }) => (
{hostEvent => (
<div className='container'>
<form
onSubmit={e => {
e.preventDefault()
hostEvent({ variables: {
name: name,
description: description,
startDatetime: startDatetime.valueOf() / 1000,
finishDatetime: startDatetime.valueOf() / 1000
} })
onSubmit={(e) => {
e.preventDefault();
hostEvent({
variables: {
name,
description,
startDatetime: startDatetime.valueOf() / 1000,
finishDatetime: startDatetime.valueOf() / 1000,
},
});
}}
>
<TextField
label='Name'
value={name}
onChange={(e) => this.setState({ name: e.target.value })}
onChange={e => this.setState({ name: e.target.value })}
fullWidth
/>
<TextField
multiline
label='Description'
value={description}
onChange={(e) => this.setState({ description: e.target.value })}
onChange={e => this.setState({ description: e.target.value })}
fullWidth
/>
<DateTimePicker
@@ -70,7 +76,7 @@ class New extends React.Component {
leftArrowIcon={<ChevronLeft />}
rightArrowIcon={<ChevronRight />}
value={startDatetime}
onChange={(date) => this.setState({ startDatetime: date })}
onChange={date => this.setState({ startDatetime: date })}
helperText='Competition start date'
/>
<DateTimePicker
@@ -82,7 +88,7 @@ class New extends React.Component {
leftArrowIcon={<ChevronLeft />}
rightArrowIcon={<ChevronRight />}
value={finishDatetime}
onChange={(date) => this.setState({ finishDatetime: date })}
onChange={date => this.setState({ finishDatetime: date })}
helperText='Competition finishing date'
/>
<Button type='submit' variant='contained' color='secondary'>Create New Project</Button>
@@ -91,8 +97,8 @@ class New extends React.Component {
</div>
)}
</Mutation>
)
);
}
}
export default New
export default New;
client/src/Components/HostedEvents/index.js
+27 -28
View File
@@ -1,41 +1,41 @@
import React from 'react'
import { Query } from 'react-apollo'
import React from 'react';
import { Query } from 'react-apollo';
import {
Button,
Dialog,
DialogContent,
DialogContentText,
DialogTitle
} from '@material-ui/core'
DialogTitle,
} from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles'
import styles from './styles'
import { withStyles } from '@material-ui/core/styles';
import styles from './styles';
import { hostedEventsCalls } from '../../GraphQL/Calls/index'
import { hostedEventsCalls } from '../../GraphQL/Calls/index';
import New from './New'
import Event from './Event'
import New from './New';
import Event from './Event';
class HostedEvent extends React.Component {
constructor (props) {
super(props)
constructor(props) {
super(props);
this.state = {
isNewEventOpen: false
}
isNewEventOpen: false,
};
}
handleNewEvent = (event) => {
this.props.history.push(`/edit/${event.designator}`)
this.props.history.push(`/edit/${event.designator}`);
};
render () {
const { classes } = this.props
render() {
const { classes } = this.props;
return (
<React.Fragment>
<Button variant='contained' color='secondary'
aria-label='addNewEvent' className={classes.addButton}
onClick={() => { this.setState({ isNewEventOpen: true }) }} >
onClick={() => { this.setState({ isNewEventOpen: true }); }} >
Host a new event
</Button>
@@ -43,24 +43,22 @@ class HostedEvent extends React.Component {
query={hostedEventsCalls.EVENTS_EVENTSBYHOST}
>
{({ loading, error, data }) => {
if (loading) return 'Loading...'
if (error) return `Error! ${error.message}`
const list = data.events_EventsByHost.map((event, index) => {
return (
if (loading) return 'Loading...';
if (error) return `Error! ${error.message}`;
const list = data.events_EventsByHost.map((event, index) => (
<Event key={index} event={event} />
)
})
));
return (
<React.Fragment>
{ list }
</React.Fragment>
)
);
}}
</Query>
<Dialog
open={this.state.isNewEventOpen}
onClose={() => { this.setState({ isNewEventOpen: false }) }}
onClose={() => { this.setState({ isNewEventOpen: false }); }}
aria-labelledby='addEvent-dialog-title'
>
<DialogTitle id='addEvent-dialog-title'>
@@ -68,14 +66,15 @@ class HostedEvent extends React.Component {
</DialogTitle>
<DialogContent>
<DialogContentText>
Here you will add just the minimal information, will be settable in the edit page of your event.
Here you will add just the minimal information,
will be settable in the edit page of your event.
</DialogContentText>
<New handleNewEvent={this.handleNewEvent} classes={classes} />
</DialogContent>
</Dialog>
</React.Fragment>
)
);
}
}
export default withStyles(styles)(HostedEvent)
export default withStyles(styles)(HostedEvent);
client/src/Components/HostedEvents/styles.js
+7 -7
View File
@@ -5,22 +5,22 @@ const styles = theme => ({
marginTop: 20,
marginBottom: 20,
marginLeft: 400,
marginRight: 400
marginRight: 400,
},
buttonList: {
margin: theme.spacing.unit,
float: 'right'
float: 'right',
},
buttonGrid: {
marginTop: -20
marginTop: -20,
},
addButton: {
display: 'block',
padding: 20,
marginTop: 20,
marginRight: 20,
marginLeft: 'auto'
}
})
marginLeft: 'auto',
},
});
export default styles
export default styles;
client/src/Components/Search/Event.js
+17 -15
View File
@@ -1,27 +1,27 @@
import React from 'react'
import { Link } from 'react-router-dom'
import React from 'react';
import { Link } from 'react-router-dom';
import {
Grid, Paper,
Typography,
Button
} from '@material-ui/core'
import { withStyles } from '@material-ui/core/styles'
import styles from './styles'
Button,
} from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles';
import styles from './styles';
import { toLocalTime } from '../../utils'
import { toLocalTime } from '../../utils';
class Event extends React.Component {
render () {
const classes = this.props.classes
render() {
const { classes } = this.props;
const {
name,
designator,
startDatetime,
finishDatetime,
host,
description
} = this.props.event
description,
} = this.props.event;
return (
<Paper className={classes.card}>
<Grid container spacing={16}>
@@ -31,7 +31,9 @@ class Event extends React.Component {
<Typography gutterBottom>To : {toLocalTime(finishDatetime)} </Typography>
</Grid>
<Grid item xs>
<Typography gutterBottom>Hosted by: {host.alias} ({host.lastName} {host.firstName}) </Typography>
<Typography gutterBottom>
Hosted by: {host.alias} ({host.lastName} {host.firstName})
</Typography>
<Typography gutterBottom>Formula: </Typography>
<Typography gutterBottom>First prize: </Typography>
</Grid>
@@ -48,7 +50,7 @@ class Event extends React.Component {
color='primary'
size='small'
component={Link}
to={'/show/' + designator}
to={`/show/${designator}`}
>
Show
</Button>
@@ -57,8 +59,8 @@ class Event extends React.Component {
</Grid>
</Grid>
</Paper>
)
);
}
}
export default withStyles(styles)(Event)
export default withStyles(styles)(Event);
client/src/Components/Search/Tabs/Future.js
+12 -14
View File
@@ -1,21 +1,19 @@
import React from 'react'
import { Typography } from '@material-ui/core'
import React from 'react';
import { Typography } from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles'
import styles from '../styles'
import { withStyles } from '@material-ui/core/styles';
import styles from '../styles';
import Event from '../Event'
import Event from '../Event';
class Future extends React.Component {
render () {
const classes = this.props.classes
const { FutureEvents } = this.props
render() {
const { classes } = this.props;
const { FutureEvents } = this.props;
const futureEvents = FutureEvents.map((event, index) => {
return (
const futureEvents = FutureEvents.map((event, index) => (
<Event key={index} event={event} />
)
})
));
return (
<React.Fragment>
<Typography
@@ -29,8 +27,8 @@ class Future extends React.Component {
</Typography>
{futureEvents}
</React.Fragment>
)
);
}
}
export default withStyles(styles)(Future)
export default withStyles(styles)(Future);
client/src/Components/Search/Tabs/History.js
+8 -8
View File
@@ -1,12 +1,12 @@
import React from 'react'
import { Typography } from '@material-ui/core'
import React from 'react';
import { Typography } from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles'
import styles from '../styles'
import { withStyles } from '@material-ui/core/styles';
import styles from '../styles';
class History extends React.Component {
render () {
const classes = this.props.classes
render() {
const { classes } = this.props;
return (
<Typography
className={classes.title}
@@ -17,8 +17,8 @@ class History extends React.Component {
>
Your old events (maybe here, maybe not, who knows)
</Typography>
)
);
}
}
export default withStyles(styles)(History)
export default withStyles(styles)(History);
client/src/Components/Search/Tabs/Incoming.js
+14 -18
View File
@@ -1,26 +1,22 @@
import React from 'react'
import { Typography } from '@material-ui/core'
import React from 'react';
import { Typography } from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles'
import styles from '../styles'
import { withStyles } from '@material-ui/core/styles';
import styles from '../styles';
import Event from '../Event'
import Event from '../Event';
class Incoming extends React.Component {
render () {
const classes = this.props.classes
const { IncomingEvents, OngoingEvents } = this.props
render() {
const { classes } = this.props;
const { IncomingEvents, OngoingEvents } = this.props;
const incomingEvents = IncomingEvents.map((event, index) => {
return (
const incomingEvents = IncomingEvents.map((event, index) => (
<Event key={index} event={event} />
)
})
const ongoingEvents = OngoingEvents.map((event, index) => {
return (
));
const ongoingEvents = OngoingEvents.map((event, index) => (
<Event key={index} event={event} />
)
})
));
return (
<React.Fragment>
<Typography
@@ -49,8 +45,8 @@ class Incoming extends React.Component {
</Typography>
{incomingEvents}
</React.Fragment>
)
);
}
}
export default withStyles(styles)(Incoming)
export default withStyles(styles)(Incoming);
client/src/Components/Search/Tabs/Past.js
+12 -14
View File
@@ -1,21 +1,19 @@
import React from 'react'
import { Typography } from '@material-ui/core'
import React from 'react';
import { Typography } from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles'
import styles from '../styles'
import { withStyles } from '@material-ui/core/styles';
import styles from '../styles';
import Event from '../Event'
import Event from '../Event';
class Past extends React.Component {
render () {
const classes = this.props.classes
const { PastEvents } = this.props
render() {
const { classes } = this.props;
const { PastEvents } = this.props;
const pastEvents = PastEvents.map((event, index) => {
return (
const pastEvents = PastEvents.map((event, index) => (
<Event key={index} event={event} />
)
})
));
return (
<React.Fragment>
<Typography
@@ -29,8 +27,8 @@ class Past extends React.Component {
</Typography>
{pastEvents}
</React.Fragment>
)
);
}
}
export default withStyles(styles)(Past)
export default withStyles(styles)(Past);
client/src/Components/Search/Tabs/index.js
+6 -6
View File
@@ -1,11 +1,11 @@
import Future from './Future'
import History from './History'
import Incoming from './Incoming'
import Past from './Past'
import Future from './Future';
import History from './History';
import Incoming from './Incoming';
import Past from './Past';
export {
Future,
History,
Incoming,
Past
}
Past,
};
client/src/Components/Search/index.js
+38 -34
View File
@@ -1,68 +1,70 @@
import React from 'react'
import { Query } from 'react-apollo'
import { DateTime } from 'luxon'
import React from 'react';
import { Query } from 'react-apollo';
import { DateTime } from 'luxon';
import {
Typography,
AppBar,
Tabs,
Tab
} from '@material-ui/core'
Tab,
} from '@material-ui/core';
import {
GetApp as IncomingIcon,
AlarmAdd as FutureIcon,
History as HistoryIcon
} from '@material-ui/icons'
History as HistoryIcon,
} from '@material-ui/icons';
import { withStyles } from '@material-ui/core/styles'
import styles from './styles'
import { withStyles } from '@material-ui/core/styles';
import styles from './styles';
import { listEventsCalls } from '../../GraphQL/Calls/index'
import { listEventsCalls } from '../../GraphQL/Calls/index';
import {
Future,
History,
Incoming,
Past
} from './Tabs'
Past,
} from './Tabs';
function TabContainer (props) {
function TabContainer(props) {
return (
<Typography component='div' style={{ padding: 8 * 3 }}>
{props.children}
</Typography>
)
);
}
class Search extends React.Component {
constructor (props) {
super(props)
constructor(props) {
super(props);
this.state = {
value: 0
}
value: 0,
};
}
handleChange = (event, value) => {
this.setState({ value })
this.setState({ value });
}
render () {
const classes = this.props.classes
const { value } = this.state
render() {
const { classes } = this.props;
const { value } = this.state;
return (
<Query
query={listEventsCalls.EVENTS_EVENTS}
>
{({ loading, error, data }) => {
if (loading) return 'Loading...'
if (error) return `Error! ${error.message}`
const now = ~~(DateTime.local().valueOf() / 1000)
const inTwoWeeks = ~~(DateTime.local().plus({ weeks: 2 }).valueOf() / 1000)
if (loading) return 'Loading...';
if (error) return `Error! ${error.message}`;
const now = Math.floor(DateTime.local().valueOf() / 1000);
const inTwoWeeks = Math.floor(DateTime.local().plus({ weeks: 2 }).valueOf() / 1000);
const IncomingEvents = data.events_Events.filter(event => event.startDatetime > now && event.startDatetime < inTwoWeeks)
const OngoingEvents = data.events_Events.filter(event => event.finishDatetime > now && event.startDatetime < now)
const FutureEvents = data.events_Events.filter(event => event.startDatetime > now)
const PastEvents = data.events_Events.filter(event => event.finishDatetime < now)
const IncomingEvents = data.events_Events.filter(event => event.startDatetime > now
&& event.startDatetime < inTwoWeeks);
const OngoingEvents = data.events_Events.filter(event => event.finishDatetime > now
&& event.startDatetime < now);
const FutureEvents = data.events_Events.filter(event => event.startDatetime > now);
const PastEvents = data.events_Events.filter(event => event.finishDatetime < now);
return (
<React.Fragment>
@@ -98,17 +100,19 @@ class Search extends React.Component {
/>
</Tabs>
</AppBar>
{value === 0 && <TabContainer><Incoming IncomingEvents={IncomingEvents} OngoingEvents={OngoingEvents} /></TabContainer>}
{value === 0 && <TabContainer>
<Incoming IncomingEvents={IncomingEvents} OngoingEvents={OngoingEvents} />
</TabContainer>}
{value === 1 && <TabContainer><Future FutureEvents={FutureEvents} /></TabContainer>}
{value === 2 && <TabContainer><History /></TabContainer>}
{value === 3 && <TabContainer><Past PastEvents={PastEvents} /></TabContainer>}
</div>
</React.Fragment>
)
);
}}
</Query>
)
);
}
}
export default withStyles(styles)(Search)
export default withStyles(styles)(Search);
client/src/Components/Search/styles.js
+9 -9
View File
@@ -4,11 +4,11 @@ const styles = theme => ({
width: '100%',
backgroundColor: theme.palette.background.paper,
padding: 0,
margin: 0
margin: 0,
},
tabTitle: {
width: '25%',
maxWidth: 'none'
maxWidth: 'none',
},
card: {
flexGrow: 1,
@@ -16,18 +16,18 @@ const styles = theme => ({
marginTop: 20,
marginBottom: 20,
marginLeft: 400,
marginRight: 400
marginRight: 400,
},
buttonList: {
margin: theme.spacing.unit,
float: 'right'
float: 'right',
},
buttonGrid: {
marginTop: -20
marginTop: -20,
},
title: {
marginTop: 20
}
})
marginTop: 20,
},
});
export default styles
export default styles;
client/src/Components/TopBar/data.js
+14 -8
View File
@@ -1,11 +1,17 @@
import GamesIcon from '@material-ui/icons/Games'
import SearchIcon from '@material-ui/icons/Search'
import LibraryAddIcon from '@material-ui/icons/LibraryAdd'
import GamesIcon from '@material-ui/icons/Games';
import SearchIcon from '@material-ui/icons/Search';
import LibraryAddIcon from '@material-ui/icons/LibraryAdd';
const data = [
{ title: 'Look for an event', to: '/', icon: SearchIcon, text: '' },
{ title: 'Events you are enrolled in', to: '/my', icon: GamesIcon, text: '' },
{ title: 'Host your own competition', to: '/host', icon: LibraryAddIcon, text: '' }
]
{
title: 'Look for an event', to: '/', icon: SearchIcon, text: '',
},
{
title: 'Events you are enrolled in', to: '/my', icon: GamesIcon, text: '',
},
{
title: 'Host your own competition', to: '/host', icon: LibraryAddIcon, text: '',
},
];
export default data
export default data;
client/src/Components/TopBar/index.js
+16 -15
View File
@@ -1,16 +1,18 @@
import React from 'react'
import { Link } from 'react-router-dom'
import classNames from 'classnames'
import React from 'react';
import { Link } from 'react-router-dom';
import classNames from 'classnames';
import { AppBar, Toolbar, Typography, Button } from '@material-ui/core'
import { withStyles } from '@material-ui/core/styles'
import {
AppBar, Toolbar, Typography, Button,
} from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles';
import datas from './data'
import styles from './styles'
import datas from './data';
import styles from './styles';
const TopBar = ({ classes, user, match }) => {
const TopBar = ({ classes }) => {
const buttons = datas.map((data, index) => {
const Icon = data.icon
const Icon = data.icon;
return (
<Button
key={index}
@@ -22,9 +24,8 @@ const TopBar = ({ classes, user, match }) => {
to={data.to}>
<Icon className={classNames(classes.leftIcon, classes.iconSmall)} />
{data.text}
</Button>)
}
)
</Button>);
});
return (
<div className={classes.root}>
<AppBar position='static' color='secondary'>
@@ -36,7 +37,7 @@ const TopBar = ({ classes, user, match }) => {
</Toolbar>
</AppBar>
</div>
)
}
);
};
export default withStyles(styles)(TopBar)
export default withStyles(styles)(TopBar);
client/src/Components/TopBar/styles.js
+12 -12
View File
@@ -1,37 +1,37 @@
const styles = theme => ({
root: {
flexGrow: 1
flexGrow: 1,
},
flex: {
flexGrow: 1,
marginLeft: 30
marginLeft: 30,
},
menuButton: {
marginLeft: -12,
marginRight: 20
marginRight: 20,
},
cssRoot: {
color: '#FFFFFF',
backgroundColor: theme.palette.secondary,
'&:hover': {
backgroundColor: theme.palette.dark
backgroundColor: theme.palette.dark,
},
whiteSpace: 'nowrap',
paddingRight: 2 * theme.spacing.unit,
paddingLeft: 2 * theme.spacing.unit
paddingLeft: 2 * theme.spacing.unit,
},
button: {
margin: theme.spacing.unit
margin: theme.spacing.unit,
},
leftIcon: {
marginRight: theme.spacing.unit
marginRight: theme.spacing.unit,
},
rightIcon: {
marginLeft: theme.spacing.unit
marginLeft: theme.spacing.unit,
},
iconSmall: {
fontSize: 20
}
})
fontSize: 20,
},
});
export default styles
export default styles;
client/src/GraphQL/Calls/hostedEvents.js
+6 -6
View File
@@ -1,5 +1,5 @@
import gql from 'graphql-tag'
import { eventMinimalInfo } from '../Fragments'
import gql from 'graphql-tag';
import { eventMinimalInfo } from '../Fragments';
const EVENTS_HOSTEVENT = gql`
mutation Hosts_HostEvent($name: String!, $description: String!, $startDatetime: Int!, $finishDatetime: Int!) {
@@ -8,7 +8,7 @@ const EVENTS_HOSTEVENT = gql`
}
}
${eventMinimalInfo}
`
`;
const EVENTS_EVENTSBYHOST = gql`
query Hosts_EventsByHost{
events_EventsByHost {
@@ -16,8 +16,8 @@ const EVENTS_EVENTSBYHOST = gql`
}
}
${eventMinimalInfo}
`
`;
export default {
EVENTS_HOSTEVENT,
EVENTS_EVENTSBYHOST
}
EVENTS_EVENTSBYHOST,
};
client/src/GraphQL/Calls/index.js
+5 -5
View File
@@ -1,9 +1,9 @@
import hostedEventsCalls from './hostedEvents'
import listEventsCalls from './listEvents'
import showEventCalls from './showEvent'
import hostedEventsCalls from './hostedEvents';
import listEventsCalls from './listEvents';
import showEventCalls from './showEvent';
export {
hostedEventsCalls,
listEventsCalls,
showEventCalls
}
showEventCalls,
};
client/src/GraphQL/Calls/listEvents.js
+5 -5
View File
@@ -1,5 +1,5 @@
import gql from 'graphql-tag'
import { eventMinimalInfo } from '../Fragments'
import gql from 'graphql-tag';
import { eventMinimalInfo } from '../Fragments';
const EVENTS_EVENTS = gql`
query Hosts_Events{
@@ -8,7 +8,7 @@ const EVENTS_EVENTS = gql`
}
}
${eventMinimalInfo}
`
`;
export default {
EVENTS_EVENTS
}
EVENTS_EVENTS,
};
client/src/GraphQL/Calls/showEvent.js
+5 -5
View File
@@ -1,5 +1,5 @@
import gql from 'graphql-tag'
import { eventFullInfo } from '../Fragments'
import gql from 'graphql-tag';
import { eventFullInfo } from '../Fragments';
const EVENTS_EVENT = gql`
query Hosts_Event($designator: ID!) {
@@ -8,8 +8,8 @@ const EVENTS_EVENT = gql`
}
}
${eventFullInfo}
`
`;
export default {
EVENTS_EVENT
}
EVENTS_EVENT,
};
client/src/GraphQL/Fragments/event.js
+3 -3
View File
@@ -1,4 +1,4 @@
import gql from 'graphql-tag'
import gql from 'graphql-tag';
export const eventMinimalInfo = gql`
fragment EventMinimalInfo on events_Event {
@@ -13,7 +13,7 @@ export const eventMinimalInfo = gql`
}
description
}
`
`;
export const eventFullInfo = gql`
fragment EventFullInfo on events_Event {
@@ -58,4 +58,4 @@ export const eventFullInfo = gql`
}
}
}
`
`;
client/src/GraphQL/Fragments/index.js
+4 -4
View File
@@ -1,9 +1,9 @@
import {
eventMinimalInfo,
eventFullInfo
} from './event'
eventFullInfo,
} from './event';
export {
eventMinimalInfo,
eventFullInfo
}
eventFullInfo,
};
client/src/index.js
+24 -24
View File
@@ -1,40 +1,40 @@
import React, { Component } from 'react'
import { Route, BrowserRouter, Switch } from 'react-router-dom'
import React, { Component } from 'react';
import { Route, BrowserRouter, Switch } from 'react-router-dom';
import { MuiPickersUtilsProvider } from 'material-ui-pickers'
import LuxonUtils from 'material-ui-pickers/utils/luxon-utils'
import { MuiPickersUtilsProvider } from 'material-ui-pickers';
import LuxonUtils from 'material-ui-pickers/utils/luxon-utils';
import { getItem } from './utils/local-storage'
import { getItem } from './utils/local-storage';
import TopBar from './Components/TopBar'
import Search from './Components/Search'
import Events from './Components/Events'
import HostedEvents from './Components/HostedEvents'
import EditEvent from './Components/Event/Edit'
import TopBar from './Components/TopBar';
import Search from './Components/Search';
import Events from './Components/Events';
import HostedEvents from './Components/HostedEvents';
import EditEvent from './Components/Event/Edit';
class App extends Component {
constructor (props) {
super(props)
constructor(props) {
super(props);
this.state = {
user: null
}
user: null,
};
}
async componentDidMount () {
let user = await getItem('user')
async componentDidMount() {
let user = await getItem('user');
if (user !== null && user !== undefined && user !== 'undefined') {
user = JSON.parse(user)
this.setState({ user })
user = JSON.parse(user);
this.setState({ user });
}
}
render () {
let loggedIn
render() {
let loggedIn;
if (this.state.user !== null) {
loggedIn = (<TopBar match={this.props.match} user={this.state.user} />)
loggedIn = (<TopBar match={this.props.match} user={this.state.user} />);
} else {
loggedIn = ''
loggedIn = '';
}
return (
<MuiPickersUtilsProvider utils={LuxonUtils}>
@@ -51,8 +51,8 @@ class App extends Component {
</div>
</BrowserRouter>
</MuiPickersUtilsProvider>
)
);
}
}
export default App
export default App;
client/src/utils/index.js
+10 -8
View File
@@ -1,10 +1,12 @@
export const toLocalTime = (epoch) => {
let localDate = new Date(0)
localDate.setUTCSeconds(epoch)
var options = { year: 'numeric', month: 'long', day: '2-digit' }
const localDate = new Date(0);
localDate.setUTCSeconds(epoch);
const options = { year: 'numeric', month: 'long', day: '2-digit' };
return (
localDate.toLocaleDateString(options) +
' at ' +
localDate.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit' })
)
}
`${localDate.toLocaleDateString(options)
} at ${
localDate.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit' })}`
);
};
export const temporaryFunction = input => input;
client/src/utils/local-storage.js
+5 -5
View File
@@ -1,9 +1,9 @@
const getItem = async name => window.localStorage.getItem(name)
const setItem = async (name, value) => window.localStorage.setItem(name, value)
const removeItem = async name => window.localStorage.removeItem(name)
const getItem = async name => window.localStorage.getItem(name);
const setItem = async (name, value) => window.localStorage.setItem(name, value);
const removeItem = async name => window.localStorage.removeItem(name);
export {
getItem,
setItem,
removeItem
}
removeItem,
};