Lesson 12 Final

modules/Repo.js

@@ -2,9 +2,10 @@ import React from 'react'
 
 export default React.createClass({
   render() {
+    const { userName, repoName } = this.props.params
     return (
       <div>
-        <h2>{this.props.params.repoName}</h2>
+        <h2>{userName} / {repoName}</h2>
       </div>
     )
   }

modules/Repos.js

@@ -2,6 +2,18 @@ import React from 'react'
 import NavLink from './NavLink'
 
 export default React.createClass({
+  contextTypes: {
+    router: React.PropTypes.object
+  },
+
+  handleSubmit(event) {
+    event.preventDefault()
+    const userName = event.target.elements[0].value
+    const repo = event.target.elements[1].value
+    const path = `/repos/${userName}/${repo}`
+    this.context.router.push(path)
+  },
+
   render() {
     return (
       <div>
@@ -9,6 +21,13 @@ export default React.createClass({
         <ul>
           <li><NavLink to="/repos/rackt/react-router">React Router</NavLink></li>
           <li><NavLink to="/repos/facebook/react">React</NavLink></li>
+          <li>
+            <form onSubmit={this.handleSubmit}>
+              <input type="text" placeholder="userName"/> / {' '}
+              <input type="text" placeholder="repo"/>{' '}
+              <button type="submit">Go</button>
+            </form>
+          </li>
         </ul>
         {this.props.children}
       </div>