Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
SRCT
whats-open-web
Commits
9aef0da3
Commit
9aef0da3
authored
Dec 28, 2017
by
Andrew Hrdy
Browse files
Code tidy-up. Fixed: Unused code, code structure, missing semicolons, outdated redux actions, etc.
parent
e2e41260
Pipeline
#1897
passed with stage
in 1 minute and 41 seconds
Changes
36
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
public/index.html
View file @
9aef0da3
<!doctype html>
<html
lang=
"en"
>
<head>
<meta
charset=
"utf-8"
>
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1, shrink-to-fit=no"
>
<meta
name=
"theme-color"
content=
"#000000"
>
<meta
name=
"apple-mobile-web-app-title"
content=
"What's Open"
>
<meta
name=
"apple-mobile-web-app-capable"
content=
"yes"
>
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link
rel=
"manifest"
href=
"%PUBLIC_URL%/manifest.json"
>
<link
rel=
"shortcut icon"
href=
"%PUBLIC_URL%/favicon.png"
>
<link
href=
"https://fonts.googleapis.com/css?family=Roboto"
rel=
"stylesheet"
>
<link
href=
'https://api.tiles.mapbox.com/mapbox-gl-js/v0.40.1/mapbox-gl.css'
rel=
'stylesheet'
/>
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
<head>
<meta
charset=
"utf-8"
>
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1, shrink-to-fit=no"
>
<meta
name=
"theme-color"
content=
"#000000"
>
<meta
name=
"apple-mobile-web-app-title"
content=
"What's Open"
>
<meta
name=
"apple-mobile-web-app-capable"
content=
"yes"
>
Unlike "/favicon.png" or "favicon.png", "%PUBLIC_URL%/favicon.png" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>
What's Open
</title>
</head>
<body>
<noscript>
You need to enable JavaScript to run this app.
</noscript>
<div
id=
"root"
></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
<link
rel=
"manifest"
href=
"%PUBLIC_URL%/manifest.json"
>
<link
rel=
"shortcut icon"
href=
"%PUBLIC_URL%/favicon.png"
>
<link
href=
"https://fonts.googleapis.com/css?family=Roboto"
rel=
"stylesheet"
>
<link
href=
'https://api.tiles.mapbox.com/mapbox-gl-js/v0.40.1/mapbox-gl.css'
rel=
'stylesheet'
/>
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
<title>
What's Open
</title>
</head>
<body>
<noscript>
You need to enable JavaScript to run this app.
</noscript>
<div
id=
"root"
></div>
</body>
</html>
src/actions/action-types.js
View file @
9aef0da3
export
const
TOGGLE_SIDEBAR
=
'
TOGGLE_SIDEBAR
'
;
export
const
SET_SIDEBAR
=
'
SET_SIDEBAR
'
;
export
const
TOGGLE_SIDEBAR_MAP
=
'
TOGGLE_SIDEBAR_MAP
'
;
export
const
SET_FACILITIES
=
'
SET_FACILITIES
'
;
export
const
GET_FACILITIES
=
'
GET_FACILITIES
'
;
export
const
SET_SELECTED_FACILITY
=
'
SET_SELECTED_FACILITY
'
;
...
...
src/actions/api.js
View file @
9aef0da3
import
{
GET_FACILITIES
,
SET_FACILITIES
,
SORT_BY_FAVORITES
}
from
'
./action-types
'
import
{
GET_FACILITIES
,
SET_FACILITIES
,
SORT_BY_FAVORITES
}
from
'
./action-types
'
;
export
const
apiTest
=
()
=>
{
return
(
dispatch
)
=>
{
return
fetch
(
'
/api/facilities
'
,
{
'
method
'
:
'
get
'
}).
then
((
res
)
=>
{
return
res
.
json
()
},
(
error
)
=>
{
console
.
log
(
error
)
}).
then
(
json
=>
{
console
.
log
(
json
[
0
])
})
}
};
const
API_GET_FACILITIES
=
'
https://api.srct.gmu.edu/whatsopen/v2/facilities/
'
;
export
const
getFacilities
=
()
=>
dispatch
=>
{
dispatch
({
type
:
GET_FACILITIES
});
const
request
=
new
Request
(
'
https://api.srct.gmu.edu/whatsopen/v2/facilities/
'
,
{
const
request
=
new
Request
(
API_GET_FACILITIES
,
{
method
:
'
GET
'
});
...
...
@@ -29,16 +18,16 @@ export const getFacilities = () => dispatch => {
}
return
res
.
json
();
})
.
then
(
json
=>
{
}).
then
(
json
=>
{
dispatch
(
setFacilities
(
JSON
.
stringify
(
json
)));
});
};
export
const
setFacilities
=
(
facilities
)
=>
{
try
{
try
{
localStorage
.
setItem
(
'
facilities
'
,
facilities
);
}
catch
(
e
){}
}
catch
(
e
)
{
}
return
{
type
:
SET_FACILITIES
,
facilities
:
JSON
.
parse
(
facilities
)
...
...
@@ -46,5 +35,5 @@ export const setFacilities = (facilities) => {
};
export
const
sortByFavorites
=
()
=>
({
type
:
SORT_BY_FAVORITES
})
\ No newline at end of file
type
:
SORT_BY_FAVORITES
});
\ No newline at end of file
src/actions/ui.js
View file @
9aef0da3
import
{
ADD_FAVORITE_FACILITY
,
REMOVE_FAVORITE_FACILITY
,
SET_SEARCH_TERM
,
SET_CAMPUS_REGION
,
TOGGLE_SIDEBAR
,
TOGGLE_SIDEBAR_MAP
,
SET_ALL_FAVORITES
,
SET_SELECTED_FACILITY
,
SET_SIDEBAR
ADD_FAVORITE_FACILITY
,
REMOVE_FAVORITE_FACILITY
,
SET_ALL_FAVORITES
,
SET_CAMPUS_REGION
,
SET_SEARCH_TERM
,
SET_SELECTED_FACILITY
,
SET_SIDEBAR
}
from
'
./action-types
'
;
export
const
toggleSidebar
=
()
=>
({
type
:
TOGGLE_SIDEBAR
,
});
export
const
setSidebar
=
(
setOpen
)
=>
({
type
:
SET_SIDEBAR
,
setOpen
});
export
const
toggleSidebarMap
=
()
=>
({
type
:
TOGGLE_SIDEBAR_MAP
,
});
export
const
setSelectedFacility
=
(
facility
)
=>
({
type
:
SET_SELECTED_FACILITY
,
facility
type
:
SET_SELECTED_FACILITY
,
facility
});
export
const
setSearchTerm
=
(
term
)
=>
({
type
:
SET_SEARCH_TERM
,
term
,
term
});
export
const
setCampusRegion
=
(
campusRegion
)
=>
({
type
:
SET_CAMPUS_REGION
,
campusRegion
type
:
SET_CAMPUS_REGION
,
campusRegion
});
export
const
addFavoriteFacility
=
slug
=>
({
...
...
@@ -48,7 +35,5 @@ export const removeFavoriteFacility = slug => ({
export
const
setAllFavorites
=
(
favorites
)
=>
({
type
:
SET_ALL_FAVORITES
,
favorites
,
favorites
});
src/components/AppBar.js
View file @
9aef0da3
...
...
@@ -6,11 +6,11 @@ import Button from 'material-ui/Button';
import
IconButton
from
'
material-ui/IconButton
'
;
import
MenuIcon
from
'
material-ui-icons/Menu
'
;
import
SearchBar
from
'
../containers/SearchBar
'
;
import
classNames
from
'
classnames
'
import
classNames
from
'
classnames
'
;
class
CustomAppBar
extends
React
.
Component
{
constructor
(
props
)
{
constructor
()
{
super
();
this
.
state
=
{
isAppBarExpanded
:
false
,
...
...
@@ -23,38 +23,38 @@ class CustomAppBar extends React.Component {
toggleExpand
()
{
this
.
setState
({
isAppBarExpanded
:
!
this
.
state
.
isAppBarExpanded
})
})
;
};
render
()
{
return
(
<
div
>
<
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
'
}
/
>
<
Typography
type
=
"
title
"
className
=
{
className
s
(
'
app-bar-
title
'
,
'
app-bar-text-color
'
)}
>
What
'
s Open
</Typography>
<SearchBar onSearchExpand={() => this.setState({isSearchExpanded: true})}
onSearch
Collapse
={() => this.setState({isSearchExpanded:
fals
e})}
/>
<IconButton onClick={this.toggleExpand} aria-label="Menu"
className={classNames(
'
app
-
bar
-
menu
-
button
'
,
'
app
-
bar
-
text
-
color
'
)}>
<MenuIcon/
>
</IconButt
on>
<div
className={classNames(
'
app
-
bar
-
link
-
container
'
, !this.state.isAppBarExpanded &&
'
app
-
bar
-
hide
'
)}>
<Button
className={classNames(
'
app
-
bar
-
link
-
button
'
,
'
app
-
bar
-
text
-
color
'
)}>
About
</Button>
<Button
className={classNames(
'
app
-
bar
-
link
-
button
'
,
'
app
-
bar
-
text
-
color
'
)}>
Feedback
</
Button
>
</
div
>
</
Toolb
ar>
</
AppBar
>
</div>
);
return
(
<
div
>
<
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
'
}
/
>
<
Typography
type
=
"
title
"
className
=
{
classNames
(
'
app-bar-title
'
,
'
app-bar-text-color
'
)}
>
What
'
s Open
</Typography>
<SearchBar
onSearch
Expand
={() => this.setState({isSearchExpanded:
tru
e})}
onSearchCollapse={() => this.setState({isSearchExpanded: false})}/>
<IconButton onClick={this.toggleExpand} aria-label="Menu"
className={classNames(
'
app
-
bar
-
menu
-
button
'
,
'
app
-
bar
-
text
-
color
'
)}
>
<MenuIc
on
/
>
</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
'
)}>
About
</Button>
<Button
className={classNames(
'
app
-
bar
-
link
-
button
'
,
'
app
-
bar
-
text
-
color
'
)}>
Feedback
</Button>
</
div
>
</
Toolbar
>
</
AppB
ar>
</
div
>
);
};
}
...
...
src/components/CardContainer.js
View file @
9aef0da3
import
React
from
'
react
'
import
FacilityCard
from
'
../containers/FacilityCard
'
import
React
from
'
react
'
;
import
FacilityCard
from
'
../containers/FacilityCard
'
;
import
Grid
from
'
material-ui/Grid
'
;
const
CardContainer
=
({
searchTerm
,
campusRegion
,
facilities
})
=>
{
...
...
src/components/FacilitiesMap.js
View file @
9aef0da3
import
React
from
'
react
'
import
ReactMapboxGl
,
{
Layer
,
Feature
,
Marker
,
Source
,
GeoJSONLayer
}
from
"
react-mapbox-gl
"
;
import
MapboxClient
from
'
mapbox
'
import
mapboxgl
from
'
mapbox-gl
'
import
React
from
'
react
'
;
import
ReactMapboxGl
,
{
Marker
}
from
"
react-mapbox-gl
"
;
import
{
withStyles
}
from
'
material-ui/styles
'
;
import
{
addRoute
,
getGeoLine
,
getMaxBounds
}
from
'
../utils/mapboxUtils
'
;
import
{
getMaxBounds
}
from
'
../utils/mapboxUtils
'
;
import
MapDialog
from
'
./MapDialog
'
;
const
token
=
"
pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA
"
;
const
mapboxToken
=
"
pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA
"
;
let
starbucksLogo
=
new
Image
();
starbucksLogo
.
src
=
require
(
'
../images/starbucksSVG.svg
'
)
starbucksLogo
.
width
=
60
starbucksLogo
.
height
=
60
const
images
=
[
'
starbucks
'
,
starbucksLogo
,{
pixelRatio
:
3
}]
starbucksLogo
.
src
=
require
(
'
../images/starbucksSVG.svg
'
)
;
starbucksLogo
.
width
=
60
;
starbucksLogo
.
height
=
60
;
const
Map
=
ReactMapboxGl
({
accessToken
:
t
oken
,
interactive
:
false
,
attributionControl
:
false
,
accessToken
:
mapboxT
oken
,
interactive
:
false
,
attributionControl
:
false
,
});
// const client = new MapboxClient(token);
const
Mark
=
{
backgroundColor
:
'
#e74c3c
'
,
borderRadius
:
'
50%
'
,
width
:
'
12px
'
,
height
:
'
12px
'
,
border
:
'
3px solid #EAA29B
'
,
backgroundColor
:
'
#e74c3c
'
,
borderRadius
:
'
50%
'
,
width
:
'
12px
'
,
height
:
'
12px
'
,
border
:
'
3px solid #EAA29B
'
,
};
class
FacilitiesMap
extends
React
.
Component
{
constructor
(
props
)
{
super
(
props
);
const
southWestBounds
=
[
-
77.321649
,
38.823919
];
//Coordinates for the south-west bound
const
northEastBounds
=
[
-
77.295213
,
38.835720
];
//Coordinates for the north-east bound
class
FacilitiesMap
extends
React
.
Component
{
constructor
(
props
){
super
(
props
)
var
sw
=
new
mapboxgl
.
LngLat
(
-
77.307045
,
38.827285
);
var
ne
=
new
mapboxgl
.
LngLat
(
-
77.303368
,
38.831866
);
var
llb
=
new
mapboxgl
.
LngLatBounds
(
sw
,
ne
);
this
.
state
=
{
positionReady
:
false
,
position
:{
longitude
:
0
,
latitude
:
0
},
mappedRoute
:
false
,
fitBounds
:[
[
-
77.321649
,
38.823919
],
// Southwest coordinates
[
-
77.295213
,
38.835720
]
// Northeast coordinates
],
positionReady
:
false
,
position
:
{
longitude
:
0
,
latitude
:
0
},
mappedRoute
:
false
,
fitBounds
:
[
southWestBounds
,
northEastBounds
],
maxBounds
:
getMaxBounds
(),
fitBoundsOptions
:{
},
mapDialogOpen
:
false
fitBoundsOptions
:
{},
mapDialogOpen
:
false
}
}
componentWillMount
=
()
=>
{
// if ("geolocation" in navigator) {
// const t1 = performance.now();
// navigator.geolocation.getCurrentPosition((position) =>{
// const newCoords = position.coords
// this.setState({
// position:newCoords,
// positionReady:true,
// })
// const t2 = performance.now()
// console.log("took "+(t2-t1)/1000 + " seconds to load your current position")
// })
// } else {
// console.log('geolocation is not availabe for your computer')
// }
}
// componentWillReceiveProps = (nextProps) =>{
// try {
// const coordsArr = nextProps.facility.facility_location.coordinate_location.coordinates
// const coordsObj = {latitude:coordsArr[1],longitude:coordsArr[0]}
// if(this.state.positionReady){
// getGeoLine(client,this.state.position,coordsObj,()=>{}).then((route)=>{
// const coords = route.geometry.coordinates
// const bounds = coords.reduce(function(bounds, coord) {
// return bounds.extend(coord);
// }, new mapboxgl.LngLatBounds(coords[0], coords[0]));
// const boundsArr = [[bounds._sw.lng,bounds._sw.lat],[bounds._ne.lng,bounds._ne.lat]]
// console.log(bounds)
// console.log(boundsArr)
// this.setState({
// mappedRoute:coords,
// fitBounds:boundsArr,
// fitBoundsOptions:{padding:20},
// })
// })
// }
// }catch(e){
// }
// }
handleRequestClose
=
()
=>
{
this
.
setState
({
mapDialogOpen
:
false
,
})
}
mapDialogOpen
:
false
,
});
};
render
()
{
const
{
facilities
,
facility
,
classes
,
isMapOpen
}
=
this
.
props
;
const
{
fitBounds
,
maxBounds
,
fitBoundsOptions
,
mapDialogOpen
}
=
this
.
state
;
render
(){
const
{
facilities
,
facility
,
classes
,
isMapOpen
}
=
this
.
props
const
{
position
,
positionReady
,
fitBounds
,
maxBounds
,
mappedRoute
,
fitBoundsOptions
,
mapDialogOpen
}
=
this
.
state
let
center
,
zoom
;
try
{
let
center
,
zoom
;
try
{
center
=
facility
.
facility_location
.
coordinate_location
.
coordinates
;
zoom
=
[
17
];
}
catch
(
e
){
center
=
[(
maxBounds
[
0
][
0
]
+
maxBounds
[
1
][
0
])
/
2
,(
maxBounds
[
0
][
1
]
+
maxBounds
[
1
][
1
])
/
2
]
zoom
=
[
17
];
}
catch
(
e
)
{
center
=
[(
maxBounds
[
0
][
0
]
+
maxBounds
[
1
][
0
])
/
2
,
(
maxBounds
[
0
][
1
]
+
maxBounds
[
1
][
1
])
/
2
]
;
zoom
=
[
17
];
}
return
(
<
div
className
=
{
classes
.
mapContainer
}
style
=
{{
'
transform
'
:
isMapOpen
?
'
translateY(0px)
'
:
'
translateY(436px)
'
}}
>
<
Map
onStyleLoad
=
{(
map
,
e
)
=>
{
// map.addControl(new mapboxgl.GeolocateControl({
// positionOptions: {
// enableHighAccuracy: true
// },
// trackUserLocation: true
// }));
}}
animationOptions
=
{{
animate
:
false
}}
onClick
=
{(
map
,
e
)
=>
{
this
.
setState
({
mapDialogOpen
:
true
})
console
.
log
(
'
changed
'
)
}}
style
=
"
mapbox://styles/mduffy8/cjbcdxi3v73hp2spiyhxbkjde
"
movingMethod
=
{
'
easeTo
'
}
containerStyle
=
{{
height
:
"
200px
"
,
width
:
"
380px
"
,
margin
:
"
10px
"
,
borderRadius
:
'
3px
'
,
cursor
:
'
pointer
'
,
}}
center
=
{
center
}
zoom
=
{
17
}
fitBounds
=
{
fitBounds
}
fitBoundsOptions
=
{
fitBoundsOptions
}
zoom
=
{
zoom
}
maxBounds
=
{
maxBounds
}
>
{(
facilities
.
length
>
0
)
&&
facilities
.
map
((
item
)
=>
{
return
(
<
Marker
key
=
{
item
.
slug
}
coordinates
=
{
item
.
facility_location
.
coordinate_location
.
coordinates
}
anchor
=
"
bottom
"
>
{
/*<img height={20} width={20} src={require('../images/starbucksSVG.svg')}/>*/
}
<
div
style
=
{
Mark
}
><
/div>
<
/Marker
>
)
})}
<
/Map
>
<
MapDialog
open
=
{
mapDialogOpen
}
facilities
=
{
facilities
}
facility
=
{
facility
}
maxBounds
=
{
maxBounds
}
zoom
=
{
zoom
}
center
=
{
center
}
onClose
=
{
this
.
handleRequestClose
}
/
>
<
/div
>
)
}
return
(
<
div
className
=
{
classes
.
mapContainer
}
style
=
{{
'
transform
'
:
isMapOpen
?
'
translateY(0px)
'
:
'
translateY(436px)
'
}}
>
<
Map
animationOptions
=
{{
animate
:
false
}}
onClick
=
{()
=>
{
this
.
setState
({
mapDialogOpen
:
true
});
}}
style
=
"
mapbox://styles/mduffy8/cjbcdxi3v73hp2spiyhxbkjde
"
movingMethod
=
{
'
easeTo
'
}
containerStyle
=
{{
height
:
"
200px
"
,
width
:
"
380px
"
,
margin
:
"
10px
"
,
borderRadius
:
'
3px
'
,
cursor
:
'
pointer
'
,
}}
center
=
{
center
}
fitBounds
=
{
fitBounds
}
fitBoundsOptions
=
{
fitBoundsOptions
}
zoom
=
{
zoom
}
maxBounds
=
{
maxBounds
}
>
{(
facilities
.
length
>
0
)
&&
facilities
.
map
((
item
)
=>
{
return
(
<
Marker
key
=
{
item
.
slug
}
coordinates
=
{
item
.
facility_location
.
coordinate_location
.
coordinates
}
anchor
=
"
bottom
"
>
<
div
style
=
{
Mark
}
/
>
<
/Marker
>
)
})}
<
/Map
>
<
MapDialog
open
=
{
mapDialogOpen
}
facilities
=
{
facilities
}
facility
=
{
facility
}
maxBounds
=
{
maxBounds
}
zoom
=
{
zoom
}
center
=
{
center
}
onClose
=
{
this
.
handleRequestClose
}
/
>
<
/div
>
)
}
}
const
styleSheet
=
{
const
styleSheet
=
{
mapContainer
:
{
transition
:
'
250ms ease-in-out
'
,
width
:
'
100%
'
...
...
@@ -180,12 +123,4 @@ const styleSheet = {
};
export
default
withStyles
(
styleSheet
)(
FacilitiesMap
)
// {<Layer
// type="line"
// layout={{"line-join": "round","line-cap": "round"}}
// paint={{"line-color": "#888","line-width": 5}}
// >
// {mappedRoute && <Feature coordinates={mappedRoute}/>}
// </Layer>}
\ No newline at end of file
export
default
withStyles
(
styleSheet
)(
FacilitiesMap
)
\ No newline at end of file
src/components/FacilityCategory.js
View file @
9aef0da3
import
React
from
'
react
'
;
import
{
withStyles
}
from
'
material-ui/styles
'
;
import
Avatar
from
'
material-ui/Avatar
'
;
import
Typography
from
'
material-ui/Typography
'
;
import
RestaurantIcon
from
'
material-ui-icons/Restaurant
'
;
import
StoreIcon
from
'
material-ui-icons/Store
'
;
import
LocalCafeIcon
from
'
material-ui-icons/LocalCafe
'
;
import
LocalPrintShopIcon
from
'
material-ui-icons/LocalPrintshop
'
;
import
LocalPostOfficeIcon
from
'
material-ui-icons/LocalPostOffice
'
;
import
FitnessCenterIcon
from
'
material-ui-icons/FitnessCenter
'
;
import
ShoppingCartIcon
from
'
material-ui-icons/ShoppingCart
'
import
{
red
,
blue
,
brown
,
grey
,
teal
,
deepOrange
,
lime
}
from
'
material-ui/colors
'
;
const
FacilityCategory
=
({
category
})
=>
{
const
generateAvatar
=
()
=>
{
let
color
;
let
icon
;
/*
TODO: May not want to hardcode the id's. Can be dynamically retrieved from /api/categories.
this wouldn't be of any use unless the API returns something to indicate the icon / color.
*/
/*
Proposed Category Types:
dining hall
convenience store
cafe
restaurant
food truck ???
athletic
mailroom
print services
retail
school offices