From 506a994ed39bba9e18d4f543e4304741d41ea87c Mon Sep 17 00:00:00 2001
From: COnokala <C.Onokala@gmail.com>
Date: Tue, 24 Sep 2019 10:20:00 -0400
Subject: [PATCH] checkpoint

---
 package-lock.json                         | 36 +++++++++++++++++------
 src/components/App/App.js                 | 28 ++++++++++++++++++
 src/components/Contact/Contact.js         | 20 +++++++++++++
 src/components/ContactList/ContactList.js | 12 ++++++++
 src/components/NewContact/NewContact.js   | 14 +++++++++
 src/contacts.json                         |  4 +++
 src/index.js                              |  7 ++++-
 7 files changed, 111 insertions(+), 10 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e528b83..c6adc6e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4565,7 +4565,8 @@
         },
         "ansi-regex": {
           "version": "2.1.1",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "aproba": {
           "version": "1.1.1",
@@ -4608,7 +4609,8 @@
         },
         "balanced-match": {
           "version": "0.4.2",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "bcrypt-pbkdf": {
           "version": "1.0.1",
@@ -4637,6 +4639,7 @@
         "brace-expansion": {
           "version": "1.1.7",
           "bundled": true,
+          "optional": true,
           "requires": {
             "balanced-match": "0.4.2",
             "concat-map": "0.0.1"
@@ -4672,7 +4675,8 @@
         },
         "concat-map": {
           "version": "0.0.1",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "console-control-strings": {
           "version": "1.1.0",
@@ -4765,11 +4769,13 @@
         },
         "fs.realpath": {
           "version": "1.0.0",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "fstream": {
           "version": "1.0.11",
           "bundled": true,
+          "optional": true,
           "requires": {
             "graceful-fs": "^4.1.2",
             "inherits": "~2.0.0",
@@ -4820,6 +4826,7 @@
         "glob": {
           "version": "7.1.2",
           "bundled": true,
+          "optional": true,
           "requires": {
             "fs.realpath": "^1.0.0",
             "inflight": "^1.0.4",
@@ -4831,7 +4838,8 @@
         },
         "graceful-fs": {
           "version": "4.1.11",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "har-schema": {
           "version": "1.0.5",
@@ -4881,6 +4889,7 @@
         "inflight": {
           "version": "1.0.6",
           "bundled": true,
+          "optional": true,
           "requires": {
             "once": "^1.3.0",
             "wrappy": "1"
@@ -4888,7 +4897,8 @@
         },
         "inherits": {
           "version": "2.0.3",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "ini": {
           "version": "1.3.4",
@@ -4988,17 +4998,20 @@
         "minimatch": {
           "version": "3.0.4",
           "bundled": true,
+          "optional": true,
           "requires": {
             "brace-expansion": "1.1.7"
           }
         },
         "minimist": {
           "version": "0.0.8",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "mkdirp": {
           "version": "0.5.1",
           "bundled": true,
+          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -5062,6 +5075,7 @@
         "once": {
           "version": "1.4.0",
           "bundled": true,
+          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -5087,7 +5101,8 @@
         },
         "path-is-absolute": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "performance-now": {
           "version": "0.2.0",
@@ -5173,6 +5188,7 @@
         "rimraf": {
           "version": "2.6.1",
           "bundled": true,
+          "optional": true,
           "requires": {
             "glob": "^7.0.5"
           }
@@ -5254,6 +5270,7 @@
         "strip-ansi": {
           "version": "3.0.1",
           "bundled": true,
+          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -5342,7 +5359,8 @@
         },
         "wrappy": {
           "version": "1.0.2",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         }
       }
     },
diff --git a/src/components/App/App.js b/src/components/App/App.js
index 9282283..9e5ec3e 100644
--- a/src/components/App/App.js
+++ b/src/components/App/App.js
@@ -1,4 +1,5 @@
 import React, { Component } from 'react';
+import { Route, Link, Switch } from 'react-router-dom'
 
 class App extends Component {
   render() {
@@ -8,4 +9,31 @@ class App extends Component {
   }
 }
 
+render() {
+  return (
+    <div className="App">
+      <header>
+        <nav>
+        <Link to="/">
+          <h1>Home</h1>
+        </Link>
+        <Link to="/new-contact">
+          <h1>New Contact</h1>
+        </Link>
+      </nav>
+      </header>
+      
+      <main>
+      <Route exact path="/"
+          render={(routerProps) => 
+          <Home ContactList={this.state.name} {...routerProps} /> }
+            />
+      <Route path="/new-contact"
+            render={(routerProps) => 
+            <New Contact Name={this.state.name} Email={this.state.email} Profile_Picture={this.state.profile_picture} {...routerProps} /> }
+            />
+      </main>
+        </div>
+          )
+        }
 export default App;
\ No newline at end of file
diff --git a/src/components/Contact/Contact.js b/src/components/Contact/Contact.js
index e69de29..9bf2201 100644
--- a/src/components/Contact/Contact.js
+++ b/src/components/Contact/Contact.js
@@ -0,0 +1,20 @@
+import React,  { Component } from "react";
+import "./Contact";
+
+let contact = {
+    name: 
+}
+
+class Contact extends Component {
+    render() {
+        return (
+            <div className="contact">
+                <Link to="/contact">
+                    <img src="https://upload.wikimedia.org/wikipedia/en/0/02/Tweety.svg" alt="">
+                    <h3>Name</h3>
+                    <h4>Email</h4>
+                </Link>
+            </div>
+        )
+    }
+}
\ No newline at end of file
diff --git a/src/components/ContactList/ContactList.js b/src/components/ContactList/ContactList.js
index e69de29..9e52429 100644
--- a/src/components/ContactList/ContactList.js
+++ b/src/components/ContactList/ContactList.js
@@ -0,0 +1,12 @@
+import React,  { Component } from "react";
+import "./ContactList.test";
+
+class ContactList extends Component {
+    render() {
+        return (
+            <div className="contact-list">
+                
+            </div>
+        )
+    }
+}
\ No newline at end of file
diff --git a/src/components/NewContact/NewContact.js b/src/components/NewContact/NewContact.js
index e69de29..3f9a6cb 100644
--- a/src/components/NewContact/NewContact.js
+++ b/src/components/NewContact/NewContact.js
@@ -0,0 +1,14 @@
+import React,  { Component } from "react";
+import "./NewContact";
+
+class Contact extends Component {
+    render() {
+        return (
+            <div className="newcontact">
+                <Link to="/newcontact">
+                    <h1>New Contact</h1>
+                </Link>
+            </div>
+        )
+    }
+}
\ No newline at end of file
diff --git a/src/contacts.json b/src/contacts.json
index 4fb136e..931a06c 100644
--- a/src/contacts.json
+++ b/src/contacts.json
@@ -3,6 +3,10 @@
     "name": "Bugs Bunny",
     "email": "bugs@gmail.com",
     "profile_picture": "https://upload.wikimedia.org/wikipedia/en/1/17/Bugs_Bunny.svg"
+  }, {
+    "name": "Tweety",
+    "email": "tweety@gmail.com",
+    "profile_picture": "https://upload.wikimedia.org/wikipedia/en/0/02/Tweety.svg"
   }, {
     "name": "Daffy Duck",
     "email": "daffy@gmail.com",
diff --git a/src/index.js b/src/index.js
index 9e5c6b1..8733d88 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,8 +1,13 @@
 import React from 'react';
+import { BrowserRouter as Router } from "react-router-dom";
 import ReactDOM from 'react-dom';
 import './styles/index.css';
 import App from './components/App/App';
 
 import contacts from "./contacts.json";
 
-ReactDOM.render(<App />, document.getElementById('root'));
+ReactDOM.render(
+<Router>
+<App />
+</Router>,
+document.getElementById('root'));