Elevator info hooked up

src/js/components/root.js

@@ -4,11 +4,26 @@ import _ from 'lodash';
 import { HeaderBar } from "./lib/header-bar.js"
 
 class ElevatorWidget extends Component {
+
+  statuses() {
+    const elevatorStatuses = this.props.elevatorStatuses;
+    if (elevatorStatuses.length === 0) {
+      return <p>No elevators are known to be out of service.</p>;
+    }
+    return (<div>
+      { _.map(elevatorStatuses, (st, idx) => {
+        const desc = st.description['#cdata-section'];
+        return <p key={idx}>{desc}</p>;
+      })
+      }
+    </div>);
+  }
+
   render() {
     return (<div className="cf w-100 flex flex-column pa4 ba-m ba-l ba-xl b--gray2 br1 h-100 h-100-minus-40-s h-100-minus-40-m h-100-minus-40-l h-100-minus-40-xl f9 white-d overflow-x-hidden">
         <h1 className="mt0 f8 fw4">BART Info - Elevator status</h1>
         <Link to="/~bartinfo">Route planner</Link>
-        No elevators are known to be out of service.
+        { this.statuses() }
     </div>);
   }
 }
@@ -125,7 +140,10 @@ export class Root extends Component {
       <BrowserRouter>
         <div className="absolute h-100 w-100 bg-gray0-d ph4-m ph4-l ph4-xl pb4-m pb4-l pb4-xl">
           <HeaderBar/>
-          <Route exact path="/~bartinfo/elevators" render={ () => <ElevatorWidget/> }/>
+          <Route exact path="/~bartinfo/elevators" render={ () =>
+            <ElevatorWidget
+              elevatorStatuses={this.state.elevators || []}
+            /> }/>
           <Route exact path="/~bartinfo" render={ () =>
             <RoutePlanner
               stations={this.state.stations || []}

src/js/reducers/update.js

@@ -9,6 +9,11 @@ export class UpdateReducer {
             if (stations) {
                 state.stations = stations;
             }
+
+            const elevators = _.get(data, "elevators", false);
+            if (elevators) {
+                state.elevators = elevators;
+            }
         }
     }
 }