From 31913285a3f0cea77d778bd1c66f2f3106d58671 Mon Sep 17 00:00:00 2001
From: Ariana Bray <aribray@gmail.com>
Date: Tue, 25 Jun 2019 21:19:34 -0700
Subject: [PATCH] refactored app to use react-router

---
 src/App.js                 | 32 +++++++++++++++++++++++---------
 src/components/Customer.js |  2 --
 2 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/src/App.js b/src/App.js
index 2553ea084..deb93bd72 100644
--- a/src/App.js
+++ b/src/App.js
@@ -46,15 +46,29 @@ class App extends Component {
   render() {
     return (
       <div>
-        <header>
-          {/* <Search /> */}
-          <button onClick={this.showMovieToggle}>Show Movies</button>
-          <button onClick={this.showCustomerToggle}>Show Customers</button>
-        </header>
-        <main>
-          {this.state.showCustomers && <CustomerList />}
-          {this.state.showMovies && <RentalLibrary />}
-        </main>
+        <Router>
+          <div>
+            <nav>
+              <ul>
+            {/* <Search /> */}
+                <li>
+                    <Link to="/movies" className="movies">Movies</Link>
+                  </li>
+                <li>
+                  <Link to="/customers" className="customers">Customers</Link>
+                </li>
+              {/* <button onClick={this.showMovieToggle}>Show Movies</button>
+              <button onClick={this.showCustomerToggle}>Show Customers</button> */}
+              </ul>
+            </nav>
+          </div>
+          <main>
+            <Route path="/movies" component={RentalLibrary} />
+            <Route path="/customers" component={CustomerList} />
+            {/* {this.state.showCustomers && <CustomerList />}
+            {this.state.showMovies && <RentalLibrary />} */}
+          </main>
+        </Router>
       </div>
     );
   // return (
diff --git a/src/components/Customer.js b/src/components/Customer.js
index be081119f..a879dfbef 100644
--- a/src/components/Customer.js
+++ b/src/components/Customer.js
@@ -3,8 +3,6 @@ import PropTypes from 'prop-types';
 
 const Customer = (props) => {
 
-
-
   return (
     <div className="customer">
         <div className="content">