From af6168028ade6e7fb91364f12b6931728ed578b1 Mon Sep 17 00:00:00 2001
From: Drew Larson <drew@drwlrsn.com>
Date: Sun, 5 Feb 2017 11:14:53 -0600
Subject: [PATCH] Add close button button.

---
 .../js/bikes/components/BikeForm/index.jsx      |  6 ++++--
 .../js/bikes/components/BikeModal/index.jsx     | 17 +----------------
 2 files changed, 5 insertions(+), 18 deletions(-)

diff --git a/bikeshop_project/assets/js/bikes/components/BikeForm/index.jsx b/bikeshop_project/assets/js/bikes/components/BikeForm/index.jsx
index 0e1f6a8..5a82914 100644
--- a/bikeshop_project/assets/js/bikes/components/BikeForm/index.jsx
+++ b/bikeshop_project/assets/js/bikes/components/BikeForm/index.jsx
@@ -25,6 +25,7 @@ class BikeForm extends React.Component {
   static propTypes = {
     bike: PropTypes.object,
     editing: PropTypes.bool,
+    handleClose: PropTypes.func,
   }
   constructor({ bike, editing = false }) {
     super();
@@ -244,8 +245,9 @@ class BikeForm extends React.Component {
           }
         </div>
         <div className="mdl-grid">
-          <div className="mdl-cell right">
-            <RaisedButton label="Save" onTouchTap={this.handleSave} />
+          <div style={{ textAlign: 'right' }} className="mdl-cell mdl-cell--12-col">
+            <RaisedButton label="Cancel" onTouchTap={this.props.handleClose} secondary />
+            <RaisedButton label="Save" onTouchTap={this.props.handleSave} default />
           </div>
         </div>
       </div>
diff --git a/bikeshop_project/assets/js/bikes/components/BikeModal/index.jsx b/bikeshop_project/assets/js/bikes/components/BikeModal/index.jsx
index 26bd788..363d16a 100644
--- a/bikeshop_project/assets/js/bikes/components/BikeModal/index.jsx
+++ b/bikeshop_project/assets/js/bikes/components/BikeModal/index.jsx
@@ -37,20 +37,6 @@ export default class BikeModal extends React.Component {
   };
 
   render() {
-    const actions = [
-      <FlatButton
-        label="Cancel"
-        primary
-        onTouchTap={this.handleClose}
-      />,
-      <FlatButton
-        label="Submit"
-        primary
-        disabled
-        onTouchTap={this.handleClose}
-      />,
-    ];
-
     const title = this.state.bike && this.state.bike.stolen ?
       (<div>
         <h3>{this.props.editing ? 'Edit Bike' : 'Add Bike'}</h3>
@@ -61,8 +47,6 @@ export default class BikeModal extends React.Component {
     return (<div>
       <Dialog
         title={title}
-        actions={actions}
-        modal
         open={this.state.open}
         autoScrollBodyContent
       >
@@ -71,6 +55,7 @@ export default class BikeModal extends React.Component {
             bike={this.state.bike}
             editing={this.state.editing}
             getBikes={this.props.getBikes}
+            handleClose={this.handleClose}
           /> :
           <div>Unable to edit bike.</div>
         }