Moved maps to the liftoff reducer

stylesuxx · Feb 6, 2017 · 780499c · 780499c
1 parent 182a814
commit 780499c
Show file tree

Hide file tree

Showing 7 changed files with 63 additions and 26 deletions.
diff --git a/src/components/App.js b/src/components/App.js
@@ -125,6 +125,12 @@ AppComponent.propTypes = {
         value: React.PropTypes.string.isRequired,
         text: React.PropTypes.string.isRequired
       })
+    ).isRequired,
+    maps: React.PropTypes.arrayOf(
+      React.PropTypes.shape({
+        value: React.PropTypes.string.isRequired,
+        text: React.PropTypes.string.isRequired
+      })
     ).isRequired
   })
 };
@@ -180,7 +186,8 @@ AppComponent.defaultProps = {
     }
   },
   liftoff: {
-    markers: []
+    markers: [],
+    maps: []
   }
 };
 

diff --git a/src/components/trackSettings/Open.js b/src/components/trackSettings/Open.js
@@ -1,7 +1,6 @@
 import React from 'react';
 import cssmodules from 'react-css-modules';
 import {
-  FormControl,
   FormGroup,
   Button,
   Form,
@@ -10,19 +9,10 @@ import {
 } from 'react-bootstrap';
 import styles from './open.cssmodule.scss';
 import MonitoredTextbox from '../MonitoredTextbox';
+import MonitoredSelectbox from '../MonitoredSelectbox';
 
 class Open extends React.Component {
 
-  constructor(props) {
-    super(props);
-
-    this.handleMapChange = this.handleMapChange.bind(this);
-  }
-
-  handleMapChange(event) {
-    this.props.actions.setMap(event.target.value);
-  }
-
   render() {
     return (
       <Row className="open-component">
@@ -42,13 +32,11 @@ class Open extends React.Component {
                 onClick={this.props.actions.deletePoint}
               >Delete Point</Button>&nbsp;
 
-              <FormControl
-                componentClass="select"
-                onChange={this.handleMapChange}
-              >
-                <option value="LiftoffArena">Liftoff Arena</option>
-                <option value="TheDrawingBoard">The Drawing Board</option>
-              </FormControl>&nbsp;
+              <MonitoredSelectbox
+                updateSelection={this.props.actions.setMap}
+                selected={this.props.track.map}
+                options={this.props.liftoff.maps}
+              />&nbsp;
 
               <MonitoredTextbox
                 label=""
@@ -81,7 +69,16 @@ Open.propTypes = {
     setMap: React.PropTypes.func.isRequired,
   }).isRequired,
   track: React.PropTypes.shape({
-    name: React.PropTypes.string.isRequired
+    name: React.PropTypes.string.isRequired,
+    map: React.PropTypes.string.isRequired
+  }),
+  liftoff: React.PropTypes.shape({
+    maps: React.PropTypes.arrayOf(
+      React.PropTypes.shape({
+        value: React.PropTypes.string.isRequired,
+        text: React.PropTypes.string.isRequired
+      })
+    )
   })
 };
 /* istanbul ignore next */
@@ -94,7 +91,11 @@ Open.defaultProps = {
     setMap: () => {}
   },
   track: {
-    name: 'Trackname'
+    name: 'name (Open.js)',
+    map: 'map (Open.js)',
+  },
+  liftoff: {
+    maps: []
   }
 };
 

diff --git a/src/components/trackSettings/TrackSettings.js b/src/components/trackSettings/TrackSettings.js
@@ -21,7 +21,9 @@ class TrackSettings extends React.Component {
     return (
       <Open
         className="tracksettings-component"
-        actions={this.props.actions} />
+        actions={this.props.actions}
+        liftoff={this.props.liftoff}
+        track={this.props.track} />
     );
   }
 }
@@ -68,6 +70,12 @@ TrackSettings.propTypes = {
         value: React.PropTypes.string.isRequired,
         text: React.PropTypes.string.isRequired
       })
+    ).isRequired,
+    maps: React.PropTypes.arrayOf(
+      React.PropTypes.shape({
+        value: React.PropTypes.string.isRequired,
+        text: React.PropTypes.string.isRequired
+      })
     ).isRequired
   })
 };
@@ -91,6 +99,8 @@ TrackSettings.defaultProps = {
   },
   track: {
     markerType: 'DiscConeBlue01 (Tracksettings.js)',
+    name: 'name (Tracksettings.js)',
+    map: 'map (Tracksettings.js)',
     gatesEnabled: false,
     markerSpacing: 20,
     doubleLine: false,
@@ -109,7 +119,8 @@ TrackSettings.defaultProps = {
     }
   },
   liftoff: {
-    markers: []
+    markers: [],
+    maps: []
   }
 };
 

diff --git a/src/containers/App.js b/src/containers/App.js
@@ -106,6 +106,12 @@ App.propTypes = {
         value: React.PropTypes.string.isRequired,
         text: React.PropTypes.string.isRequired
       })
+    ).isRequired,
+    maps: React.PropTypes.arrayOf(
+      React.PropTypes.shape({
+        value: React.PropTypes.string.isRequired,
+        text: React.PropTypes.string.isRequired
+      })
     ).isRequired
   })
 };

diff --git a/src/reducers/liftoff.js b/src/reducers/liftoff.js
@@ -43,6 +43,16 @@ const initialState = {
       value: 'AirPylonLuGusStudios01',
       text: 'Air Polygon'
     }
+  ],
+  maps: [
+    {
+      value: 'LiftoffArena',
+      text: 'Liftoff Arena'
+    },
+    {
+      value: 'TheDrawingBoard',
+      text: 'The Drawing Board'
+    }
   ]
 };
 

diff --git a/test/components/trackSettings/OpenTest.js b/test/components/trackSettings/OpenTest.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { mount } from 'enzyme';
 import Open from 'components/trackSettings/Open.js';
 
 describe('<Open />', function () {
@@ -13,14 +13,14 @@ describe('<Open />', function () {
       setName: sinon.spy()
     };
 
-    const component = shallow(<Open actions={actions} />);
+    const component = mount(<Open actions={actions} />);
 
     it('should have a className of "open-component"', function () {
       expect(component.hasClass('open-component')).to.equal(true);
     });
 
     it('should trigger SET_MAP action', function () {
-      const wrapper = component.find('FormControl');
+      const wrapper = component.find('MonitoredSelectbox');
       wrapper.simulate('change', {target: {value: 'TheDrawingBoard'}});
 
       expect(actions.setMap.called).to.be.true;

diff --git a/test/components/trackSettings/TrackSettingsTest.js b/test/components/trackSettings/TrackSettingsTest.js
@@ -26,6 +26,8 @@ describe('<TrackSettings />', function () {
       download: false,
       closed: true,
       markerType: 'foo',
+      name: 'Trackname',
+      map: 'map'
     };
 
     component = shallow(<TrackSettings track={track} />);