Commit 2806cdb7 authored by Andrew Hrdy's avatar Andrew Hrdy

Code now adheres to new linting standards.

parent 1f0feb48
Pipeline #1925 passed with stage
in 1 minute and 42 seconds
......@@ -22,6 +22,7 @@
"rules": {
//Overridden from eslint:reccomended
"no-console": "off",
"no-case-declarations": "off",
//Possible Errors
"no-template-curly-in-string": "warn",
//Best Practices
......@@ -31,7 +32,7 @@
"no-multi-spaces": "error",
"no-self-compare": "warn",
//Variables
"no-shadow": "error",
"no-shadow": "warn",
"no-shadow-restricted-names": "error",
"no-undef-init": "error",
//Styling
......@@ -43,18 +44,26 @@
"comma-spacing": "warn",
"computed-property-spacing": "error",
"func-call-spacing": "error",
"indent": "error",
"indent": [
"error",
4,
{
"SwitchCase": 1
}
],
"jsx-quotes": "error",
"key-spacing": "warn",
"keyword-spacing": "warn",
"no-lonely-if": "warn",
"no-multiple-empty-lines": "warn",
"no-tabs": "error",
"no-trailing-spaces": "error",
"no-whitespace-before-property": "error",
"object-curly-newline": [
"warn", {
"ObjectExpression": {"minProperties": 1},
"warn",
{
"ObjectExpression": {
"minProperties": 1
},
"ObjectPattern": "never"
}
],
......@@ -114,6 +123,7 @@
"template-curly-spacing": "error",
//Overriden from plugin:react/reccommended
"react/no-unescaped-entities": "off",
"react/prop-types": "off",
//plugin:react
"react/boolean-prop-naming": "warn",
"react/no-danger": "error",
......
......@@ -4420,8 +4420,7 @@
},
"jsbn": {
"version": "0.1.1",
"bundled": true,
"optional": true
"bundled": true
},
"json-schema": {
"version": "0.2.3",
......@@ -10287,6 +10286,18 @@
"whatwg-fetch": "2.0.3"
},
"dependencies": {
"babel-eslint": {
"version": "7.2.3",
"resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-7.2.3.tgz",
"integrity": "sha1-sv4tgBJkcPXBlELcdXJTqJdxCCc=",
"dev": true,
"requires": {
"babel-code-frame": "6.26.0",
"babel-traverse": "6.26.0",
"babel-types": "6.26.0",
"babylon": "6.18.0"
}
},
"babel-runtime": {
"version": "6.23.0",
"resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz",
......
......@@ -28,6 +28,7 @@
"redux-thunk": "^2.2.0"
},
"devDependencies": {
"babel-eslint": "^7.2.3",
"eslint-plugin-react": "^7.5.1",
"react-scripts": "1.0.10"
},
......
......@@ -2,7 +2,7 @@ import {GET_FACILITIES, SET_FACILITIES, SORT_BY_FAVORITES} from './action-types'
const API_GET_FACILITIES = 'https://api.srct.gmu.edu/whatsopen/v2/facilities/';
export const getFacilities = () => dispatch => {
export const getFacilities = () => (dispatch) => {
dispatch({
type: GET_FACILITIES
});
......@@ -12,13 +12,13 @@ export const getFacilities = () => dispatch => {
});
return fetch(request)
.then(res => {
.then((res) => {
if (res.status < 200 || res.status >= 300) {
throw new Error(res.statusText);
}
return res.json();
}).then(json => {
}).then((json) => {
dispatch(setFacilities(JSON.stringify(json)));
});
};
......@@ -27,11 +27,12 @@ export const setFacilities = (facilities) => {
try {
localStorage.setItem('facilities', facilities);
} catch (e) {
console.error('Set localstorage fail for facilities.');
}
return {
type: SET_FACILITIES,
facilities: JSON.parse(facilities)
}
};
};
export const sortByFavorites = () => ({
......
......@@ -23,12 +23,12 @@ export const setCampusRegion = (campusRegion) => ({
campusRegion
});
export const addFavoriteFacility = slug => ({
export const addFavoriteFacility = (slug) => ({
type: ADD_FAVORITE_FACILITY,
slug
});
export const removeFavoriteFacility = slug => ({
export const removeFavoriteFacility = (slug) => ({
type: REMOVE_FAVORITE_FACILITY,
slug
});
......
......@@ -14,7 +14,7 @@ class CustomAppBar extends React.Component {
super();
this.state = {
isAppBarExpanded: false,
isSearchExpanded: false,
isSearchExpanded: false
};
this.toggleExpand = this.toggleExpand.bind(this);
......@@ -24,7 +24,7 @@ class CustomAppBar extends React.Component {
this.setState({
isAppBarExpanded: !this.state.isAppBarExpanded
});
};
}
render() {
return (
......@@ -32,24 +32,28 @@ class CustomAppBar extends React.Component {
<AppBar position="absolute"
className={classNames('app-bar', this.state.isSearchExpanded && 'app-bar-search-expanded')}>
<Toolbar className={'app-bar-tool-bar'}>
<img src={require('../images/SRCT_square.svg')} className={'app-bar-logo'}/>
<img src={require('../images/SRCT_square.svg')} className={'app-bar-logo'} />
<Typography type="title" className={classNames('app-bar-title', 'app-bar-text-color')}>
What's Open
</Typography>
<SearchBar onSearchExpand={() => this.setState({isSearchExpanded: true})}
onSearchCollapse={() => this.setState({isSearchExpanded: false})}/>
<SearchBar onSearchExpand={() => this.setState({
isSearchExpanded: true
})}
onSearchCollapse={() => this.setState({
isSearchExpanded: false
})} />
<IconButton onClick={this.toggleExpand} aria-label="Menu"
className={classNames('app-bar-menu-button', 'app-bar-text-color')}>
<MenuIcon/>
<MenuIcon />
</IconButton>
<div
className={classNames('app-bar-link-container', !this.state.isAppBarExpanded && 'app-bar-hide')}>
<Button className={classNames('app-bar-link-button', 'app-bar-text-color')}
href={'https://srct.gmu.edu/'} target='_blank'>
href={'https://srct.gmu.edu/'} target="_blank">
About
</Button>
<Button className={classNames('app-bar-link-button', 'app-bar-text-color')}
href={'https://srct.gmu.edu/contact/'} target='_blank'>
href={'https://srct.gmu.edu/contact/'} target="_blank">
Feedback
</Button>
</div>
......@@ -57,7 +61,7 @@ class CustomAppBar extends React.Component {
</AppBar>
</div>
);
};
}
}
export default CustomAppBar;
......@@ -16,11 +16,11 @@ const CardContainer = ({searchTerm, campusRegion, facilities}) => {
const facilityTags = facility.facility_product_tags;
facilityTags.forEach((tag) => {
return tag.toLowerCase()
return tag.toLowerCase();
});
let index = facilityTags.findIndex((tag) => {
return tag.includes(lSearchTerm)
const index = facilityTags.findIndex((tag) => {
return tag.includes(lSearchTerm);
});
const hasTag = index !== -1;
......@@ -31,15 +31,15 @@ const CardContainer = ({searchTerm, campusRegion, facilities}) => {
return (
<Grid container className={'card-container-root'} spacing={24} justify={'center'} alignItems={'flex-end'}>
{facilities.filter(filterCards).map(item => {
{facilities.filter(filterCards).map((item) => {
return (
<Grid key={item.slug} item>
<FacilityCard facility={item} facilities={facilities}/>
<FacilityCard facility={item} facilities={facilities} />
</Grid>
)
);
})}
</Grid>
)
);
};
export default CardContainer;
\ No newline at end of file
import React from 'react';
import ReactMapboxGl, {Marker} from "react-mapbox-gl";
import ReactMapboxGl, {Marker} from 'react-mapbox-gl';
import {withStyles} from 'material-ui/styles';
import {getMaxBounds} from '../utils/mapboxUtils';
import MapDialog from './MapDialog';
const mapboxToken = "pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA";
const mapboxToken = 'pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA';
let starbucksLogo = new Image();
const starbucksLogo = new Image();
starbucksLogo.src = require('../images/starbucksSVG.svg');
starbucksLogo.width = 60;
starbucksLogo.height = 60;
......@@ -14,7 +14,7 @@ starbucksLogo.height = 60;
const Map = ReactMapboxGl({
accessToken: mapboxToken,
interactive: false,
attributionControl: false,
attributionControl: false
});
const Mark = {
......@@ -22,7 +22,7 @@ const Mark = {
borderRadius: '50%',
width: '12px',
height: '12px',
border: '3px solid #EAA29B',
border: '3px solid #EAA29B'
};
......@@ -35,19 +35,21 @@ class FacilitiesMap extends React.Component {
this.state = {
positionReady: false,
position: {longitude: 0, latitude: 0},
position: {
longitude: 0,
latitude: 0
},
mappedRoute: false,
fitBounds: [southWestBounds, northEastBounds],
maxBounds: getMaxBounds(),
fitBoundsOptions: {},
mapDialogOpen: false
}
};
}
handleRequestClose = () => {
this.setState({
mapDialogOpen: false,
mapDialogOpen: false
});
};
......@@ -66,7 +68,9 @@ class FacilitiesMap extends React.Component {
return (
<div className={classes.mapContainer}
style={{'transform': isMapOpen ? 'translateY(0px)' : 'translateY(436px)'}}>
style={{
transform: isMapOpen ? 'translateY(0px)' : 'translateY(436px)'
}}>
<Map
animationOptions={{
animate: false
......@@ -79,11 +83,11 @@ class FacilitiesMap extends React.Component {
style="mapbox://styles/mduffy8/cjbcdxi3v73hp2spiyhxbkjde"
movingMethod={'easeTo'}
containerStyle={{
height: "200px",
width: "380px",
margin: "10px",
height: '200px',
width: '380px',
margin: '10px',
borderRadius: '3px',
cursor: 'pointer',
cursor: 'pointer'
}}
center={center}
fitBounds={fitBounds}
......@@ -96,22 +100,21 @@ class FacilitiesMap extends React.Component {
key={item.slug}
coordinates={item.facility_location.coordinate_location.coordinates}
anchor="bottom">
<div style={Mark}/>
<div style={Mark} />
</Marker>
)
);
})}
</Map>
<MapDialog
open={mapDialogOpen}
facilities={facilities}
facility={facility}
maxBounds={maxBounds}
zoom={zoom}
center={center}
onClose={this.handleRequestClose}
/>
</div>
)
);
}
}
......@@ -123,4 +126,4 @@ const styleSheet = {
};
export default withStyles(styleSheet)(FacilitiesMap)
\ No newline at end of file
export default withStyles(styleSheet)(FacilitiesMap);
\ No newline at end of file
......@@ -8,7 +8,7 @@ const FacilityCategory = ({category}) => {
{category.name}
</Typography>
</div>
)
);
};
export default FacilityCategory;
\ No newline at end of file
......@@ -21,12 +21,14 @@ class FacilityDialog extends React.Component {
this.state = {
isMapOpen: false,
maxBounds: getMaxBounds()
}
};
}
toggleMap = e => {
toggleMap = (e) => {
e.stopPropagation();
this.setState({isMapOpen: !this.state.isMapOpen});
this.setState({
isMapOpen: !this.state.isMapOpen
});
};
render() {
......@@ -43,15 +45,18 @@ class FacilityDialog extends React.Component {
}
return (
<Dialog classes={{root: 'fd-dialog-root', paper: 'fd-dialog-paper'}} open={isOpen} onClose={onClose}>
<Dialog classes={{
root: 'fd-dialog-root',
paper: 'fd-dialog-paper'
}} open={isOpen} onClose={onClose}>
<IconButton className={'fd-close-btn'} onClick={onClose}>
<CloseIcon/>
<CloseIcon />
</IconButton>
<Grid container className={'fd-container'} justify={'center'}>
<Grid item className={'fd-header-container'}>
<Grid container className={'fd-header'}>
<Grid item>
<Avatar src={require('../images/chipotleLogo.png')}/>
<Avatar src={require('../images/chipotleLogo.png')} />
</Grid>
<Grid item className={'fd-header-text-container'}>
<Typography className={'fd-header-text'} type={'headline'}>
......@@ -63,7 +68,7 @@ class FacilityDialog extends React.Component {
<Grid item className={'fd-location-wrapper'}>
<Typography type={'caption'}>
<LocationOnIcon/>
<LocationOnIcon />
</Typography>
<Typography title={facility.facility_location.building} type={'caption'} align={'center'}>
{facility.facility_location.building}
......@@ -71,11 +76,11 @@ class FacilityDialog extends React.Component {
</Grid>
<Grid item className={'fd-facility-tags'}>
<FacilityTags facility={facility}/>
<FacilityTags facility={facility} />
</Grid>
<Grid item className={'fd-week-hours'}>
<WeekHours facility={facility}/>
<WeekHours facility={facility} />
</Grid>
<Grid item className={'fd-toggle-map-btn-container'}>
......@@ -93,7 +98,7 @@ class FacilityDialog extends React.Component {
onClose={this.toggleMap}
/>
</Dialog>
)
);
}
}
......
......@@ -8,10 +8,9 @@ const FacilityStatus = ({facility}) => {
/**
* Generates information about the facility's status.
*
* @param facility The facility to get generate information about.
* @returns {{label: string, color: *, icon: *}} Information about the facility.
*/
const generateStatusInfo = facility => {
const generateStatusInfo = () => {
let label;
let isOpen;
......@@ -25,18 +24,18 @@ const FacilityStatus = ({facility}) => {
return {
label: label,
isOpen: isOpen,
}
isOpen: isOpen
};
};
const statusInfo = generateStatusInfo(facility);
const statusInfo = generateStatusInfo();
return (
<Typography type={'caption'}
className={classNames('facility-status-text', statusInfo.isOpen ? 'facility-status-open' : 'facility-status-closed')}>
{statusInfo.label}
</Typography>
)
);
};
export default FacilityStatus;
\ No newline at end of file
......@@ -4,11 +4,11 @@ import Chip from 'material-ui/Chip';
const FacilityTags = ({facility}) => {
return (
<div className={'tag-chip-holder'}>
{facility.facility_product_tags && facility.facility_product_tags.map(tag =>
<Chip className={'tag-chip'} key={tag} label={tag}/>
{facility.facility_product_tags && facility.facility_product_tags.map((tag) =>
<Chip className={'tag-chip'} key={tag} label={tag} />
)}
</div>
)
);
};
export default FacilityTags;
\ No newline at end of file
import React from 'react'
import React from 'react';
import FavoriteBorderIcon from 'material-ui-icons/FavoriteBorder';
import FavoriteIcon from 'material-ui-icons/Favorite';
import PropTypes from 'prop-types';
......@@ -9,8 +9,8 @@ class FavoriteButton extends React.Component {
constructor(props) {
super(props);
this.state = {
isHovered: false,
}
isHovered: false
};
}
handleClick = (e) => {
......@@ -28,11 +28,11 @@ class FavoriteButton extends React.Component {
const {isHovered} = this.props;
if (this.props.isFavorite) {
return (<FavoriteIcon onClick={this.handleClick}
className={classNames('favorite-button-heart', 'favorite-button-heart-favorited')}/>);
className={classNames('favorite-button-heart', 'favorite-button-heart-favorited')} />);
}
return (<FavoriteBorderIcon onClick={this.handleClick}
className={classNames('favorite-button-heart', isHovered ? 'favorite-button-heart-hover' : 'favorite-button-heart-no-hover')}/>);
className={classNames('favorite-button-heart', isHovered ? 'favorite-button-heart-hover' : 'favorite-button-heart-no-hover')} />);
}
}
......@@ -40,7 +40,7 @@ FavoriteButton.propTypes = {
facility: PropTypes.object.isRequired,
isFavorite: PropTypes.bool.isRequired,
addFavoriteFacility: PropTypes.func.isRequired,
removeFavoriteFacility: PropTypes.func.isRequired,
removeFavoriteFacility: PropTypes.func.isRequired
};
export default FavoriteButton;
\ No newline at end of file
import React from 'react';
import ReactMapboxGl, {Marker} from "react-mapbox-gl";
import ReactMapboxGl, {Marker} from 'react-mapbox-gl';
import mapboxgl from 'mapbox-gl';
import PropTypes from 'prop-types';
import Dialog from 'material-ui/Dialog';
const mapboxToken = "pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA";
const mapboxToken = 'pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA';
const Map = ReactMapboxGl({
accessToken: mapboxToken,
attributionControl: false,
attributionControl: false
});
let starbucksLogo = new Image();
const starbucksLogo = new Image();
starbucksLogo.src = require('../images/starbucksSVG.svg');
starbucksLogo.width = 60;
starbucksLogo.height = 60;
......@@ -22,7 +22,7 @@ class MapDialog extends React.Component {
};
render() {
const {facilities, facility, zoom, center, maxBounds, ...other} = this.props;
const {facilities, zoom, center, maxBounds, ...other} = this.props;
return (
<Dialog onClose={this.handleRequestClose} {...other}>
......@@ -30,7 +30,7 @@ class MapDialog extends React.Component {
onStyleLoad={(map) => {
map.addControl(new mapboxgl.GeolocateControl({
positionOptions: {
enableHighAccuracy: true,
enableHighAccuracy: true
},
trackUserLocation: true
}));
......@@ -44,9 +44,9 @@ class MapDialog extends React.Component {
style="mapbox://styles/mduffy8/cjbcdxi3v73hp2spiyhxbkjde"
movingMethod={'easeTo'}
containerStyle={{
height: "500px",
width: "600px",
borderRadius: '5px',
height: '500px',
width: '600px',
borderRadius: '5px'
}}
center={center}
zoom={zoom}
......@@ -57,9 +57,9 @@ class MapDialog extends React.Component {
key={item.slug}
coordinates={item.facility_location.coordinate_location.coordinates}
anchor="bottom">
<img height={20} width={20} src={require('../images/starbucksSVG.svg')}/>
<img height={20} width={20} src={require('../images/starbucksSVG.svg')} />
</Marker>
)
);
})}
</Map>
</Dialog>
......@@ -69,7 +69,7 @@ class MapDialog extends React.Component {
MapDialog.propTypes = {
onClose: PropTypes.func,
selectedValue: PropTypes.string,
selectedValue: PropTypes.string
};
export default MapDialog;
......@@ -17,28 +17,28 @@ const Sidebar = ({facility, isSidebarOpen, isSidebarMapOpen, facilities}) => {
<Paper
className={classNames(['sidebar-root', (isSidebarOpen && 'sidebar-open'), (!isSidebarOpen && 'sidebar-closed')])}>
<div className={'sidebar-row1'}>
<Avatar className={'sidebar-avatar'} src={require('../images/chipotleLogo.png')}/>
<Avatar className={'sidebar-avatar'} src={require('../images/chipotleLogo.png')} />
<div className={'sidebar-title'}>
<Typography type='display1'>{removeBrackets(facility.facility_name)}</Typography>
<Typography type="display1">{removeBrackets(facility.facility_name)}</Typography>
</div>
</div>
<Divider className={'sidebar-divider'}/>
<Divider className={'sidebar-divider'} />
<div className={'sidebar-scroll'}>
<div className={'sidebar-label-holder'}>
<TextwTitle label="Building"
content={facility.facility_location && facility.facility_location.building}/>
content={facility.facility_location && facility.facility_location.building} />
<TextwTitle label="Address"
content={facility.facility_location && facility.facility_location.address}/>
<TextwTitle label="Tags" content={<FacilityTags facility={facility}/>}/>
<TextwTitle label="Hours" content={<WeekHours facility={facility}/>}/>
content={facility.facility_location && facility.facility_location.address} />
<TextwTitle label="Tags" content={<FacilityTags facility={facility} />} />
<TextwTitle label="Hours" content={<WeekHours facility={facility} />} />
</div>
</div>
<div className={'sidebar-row2'}>
<FacilitiesMap isMapOpen={isSidebarMapOpen} facilities={facilities} facility={facility}/>
<FacilitiesMap isMapOpen={isSidebarMapOpen} facilities={facilities} facility={facility} />
</div>
</Paper>
</div>
)
);
};
export default Sidebar;
......
......@@ -9,7 +9,7 @@ const TextwTitle = ({label, content}) => {
<div className={'text-w-title-content'}>
{content}
</div>
</div>)
</div>);
};
export default TextwTitle;
\ No newline at end of file
......@@ -4,38 +4,35 @@ import facilityUtils from '../utils/facilityUtils';
const WeekHours = ({facility}) => {
const weekDays = [
"Mon",
"Tue",
"Wed",
"Thu",
"Fri",
"Sat",
"Sun"
'Mon',
'Tue',
'Wed',
'Thu',
'Fri',
'Sat',
'Sun'
];