Commit 5a5067a6 authored by Mattias J Duffy's avatar Mattias J Duffy
Browse files

scaffolding done

parent fbaa10f8
export const TOGGLE_DRAWER = 'TOGGLE_DRAWER';
export const SET_FACILITIES = 'SET_FACILITIES'
export const GET_FACILITIES = 'GET_FACILITIES'
\ No newline at end of file
export const SET_FACILITIES = 'SET_FACILITIES';
export const GET_FACILITIES = 'GET_FACILITIES';
export const SET_SIDEBAR = 'SET_SIDEBAR';
\ No newline at end of file
import { TOGGLE_DRAWER } from './action-types';
import { TOGGLE_DRAWER,SET_SIDEBAR } from './action-types';
export const toggleDrawer = () => ({
type:TOGGLE_DRAWER,
});
export const setSidebar = (facility) => ({
type:SET_SIDEBAR,
facility,
})
\ No newline at end of file
import React from 'react'
import {withStyles} from 'material-ui/styles';
import FacilityCard from '../containers/FacilityCard'
const CardContainer = ({classes,facilities}) => {
return (
<div className={classes.root}>
{facilities.map((item) =>{
return <FacilityCard key={item.slug} facility={item}/>
})}
</div>
)
}
const styleSheet = {
root:{
width:'100%',
height:'100%',
display:'flex',
flexWrap:'wrap',
}
}
export default withStyles(styleSheet)(CardContainer)
\ No newline at end of file
......@@ -5,12 +5,22 @@ import Avatar from 'material-ui/Avatar'
import Typography from 'material-ui/Typography'
import Divider from 'material-ui/Divider';
import TextwTitle from '../components/TextwTitle'
const Sidebar = ({classes}) => {
const Sidebar = ({classes,facility}) => {
const removeBrackets = (name) => {
if(typeof(name) === "undefined"){
return ""
}
const openBracket = name.indexOf('[')
if(openBracket !== -1){
return name.substring(0,openBracket)
}
return name
}
return(<Paper className={classes.root}>
<div className={classes.row1}>
<Avatar className={classes.avatar} src={require('../images/chipotleLogo.png')} />
<div className={classes.title}>
<Typography type='display1'>Chipotle</Typography>
<Typography type='display1'>{removeBrackets(facility.facility_name)}</Typography>
</div>
</div>
<Divider className={classes.divider}/>
......
import React from 'react'
import {withStyles} from 'material-ui/styles';
import Paper from 'material-ui/Paper';
import {compose} from 'redux'
import {connect} from 'react-redux'
import {setSidebar} from '../actions/ui'
const FacilityCard = ({classes,facility,setSidebar}) => {
const handleClick = () => {
setSidebar(facility)
}
const removeBrackets = (name) => {
if(typeof(name) === "undefined"){
return ""
}
const openBracket = name.indexOf('[')
if(openBracket !== -1){
return name.substring(0,openBracket)
}
return name
}
return(
<Paper onClick={handleClick} className={classes.root}>
{removeBrackets(facility.facility_name)}
</Paper>
)
}
const styleSheet = {
root:{
width:100,
height:100,
}
}
export default compose(connect(null,{setSidebar}),withStyles(styleSheet))(FacilityCard)
\ No newline at end of file
......@@ -7,6 +7,7 @@ import AppBar from '../components/AppBar';
import Sidebar from '../components/Sidebar';
import {getFacilities, setFacilities} from '../actions/api'
import Button from 'material-ui/Button';
import CardContainer from '../components/CardContainer'
class Layout extends React.Component {
constructor(props){
super(props);
......@@ -21,17 +22,18 @@ class Layout extends React.Component {
}
render() {
const {classes, isDrawerOpen, toggleDrawer, getFacilities} = this.props;
const {classes, isDrawerOpen, toggleDrawer, getFacilities,sidebarFacility} = this.props;
return (
<div className={classes.root}>
<AppBar isOpen={isDrawerOpen} handleMenuClick={ toggleDrawer }/>
<div className={classes.container}>
<div className={classes.mainContent}>
<Button raised onClick={getFacilities} className={classes.button}>
{/* <Button raised onClick={getFacilities} className={classes.button}>
Default
</Button>
</Button> */}
<CardContainer facilities={this.props.facilities}/>
</div>
<Sidebar/>
<Sidebar facility={sidebarFacility}/>
</div>
</div>
)
......@@ -53,13 +55,15 @@ const styleSheet = {
boxSizing:'border-box',
flex:'1 1 100%',
height:'100%',
margin:16,
},
}
function mapStateToProps(state) {
return {
facilities: state.facilities.data,
isLoading: state.facilities.isLoading
isLoading: state.facilities.isLoading,
sidebarFacility:state.ui.sidebar,
}
}
......
import {TOGGLE_DRAWER } from '../actions/action-types'
import {TOGGLE_DRAWER,SET_SIDEBAR } from '../actions/action-types'
function isOpen(state=false,action){
switch (action.type) {
......@@ -11,7 +11,16 @@ function isOpen(state=false,action){
const drawer = (state={},action) => ({
isOpen:isOpen(state.isOpen,action)
})
const sidebar = (state={},action) => {
switch(action.type){
case SET_SIDEBAR:
return action.facility
default:
return {}
}
}
const ui = (state={},action) =>({
drawer:drawer(state.drawer,action),
sidebar:sidebar(state.sidbar,action),
})
export default ui;
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment