chore(package): Update to react-bootstrap@0.30

This required a little of refactoring to get working
correctly.

common/app/components/Nav/Avatar-Nav-Item.jsx

@@ -0,0 +1,22 @@
+import React, { PropTypes } from 'react';
+import { Link } from 'react-router';
+
+// this is separated out to prevent react bootstrap's
+// NavBar from injecting unknown props to the li component
+export default function AvatarNavItem({ picture }) {
+  return (
+    <li
+      className='hidden-xs hidden-sm avatar'
+      key='user'
+      >
+      <Link to='/settings'>
+        <img
+          className='profile-picture float-right'
+          src={ picture }
+        />
+      </Link>
+    </li>
+  );
+}
+
+AvatarNavItem.propTypes = { picture: PropTypes.string };

common/app/components/Nav/Nav.jsx

@@ -1,6 +1,5 @@
 import React, { PropTypes } from 'react';
 import ReactDOM from 'react-dom';
-import { Link } from 'react-router';
 import { LinkContainer } from 'react-router-bootstrap';
 import {
   Col,
@@ -12,6 +11,7 @@ import {
 
 import navLinks from './links.json';
 import FCCNavItem from './NavItem.jsx';
+import AvatarNavItem from './Avatar-Nav-Item.jsx';
 
 const fCClogo = 'https://s3.amazonaws.com/freecodecamp/freecodecamp_logo.svg';
 
@@ -188,20 +188,7 @@ export default class extends React.Component {
       return null;
     }
     if (username) {
-      return (
-        <li
-          className='hidden-xs hidden-sm avatar'
-          eventKey={ 2 }
-          key='user'
-          >
-          <Link to='/settings'>
-            <img
-              className='profile-picture float-right'
-              src={ picture }
-            />
-          </Link>
-        </li>
-      );
+      return <AvatarNavItem picture={ picture } />;
     } else {
       return (
         <NavItem
@@ -233,7 +220,7 @@ export default class extends React.Component {
         >
         <NavbarBrand>{ logoElement }</NavbarBrand>
         <Navbar.Toggle children={ toggleButtonChild } />
-        <Navbar.Collapse eventKey={ 0 }>
+        <Navbar.Collapse>
           <Nav
             className='hamburger-dropdown'
             navbar={ true }

common/app/components/Nav/NavItem.jsx

@@ -50,8 +50,7 @@ export default React.createClass({
       target,
       children,
       'aria-controls': ariaControls,  // eslint-disable-line react/prop-types
-      className,
-      ...props
+      className
     } = this.props;
 
     const linkClassName = classNames(className, {
@@ -76,7 +75,6 @@ export default React.createClass({
 
     return (
       <li
-        {...props}
         role='presentation'
         >
         <a

package.json

@@ -86,7 +86,7 @@
     "passport-twitter": "^1.0.3",
     "pmx": "~0.6.2",
     "react": "^15.0.2",
-    "react-bootstrap": "~0.29.4",
+    "react-bootstrap": "^0.30.0",
     "react-codemirror": "^0.2.6",
     "react-css-transition-replace": "^1.2.0-beta",
     "react-dom": "^15.0.2",
@@ -110,12 +110,12 @@
     "reselect": "^2.0.2",
     "rx": "^4.0.0",
     "sanitize-html": "^1.11.1",
+    "snyk": "^1.17.1",
     "stampit": "^2.1.1",
     "store": "https://github.com/berkeleytrue/store.js.git#feature/noop-server",
     "url-regex": "^3.0.0",
     "validator": "^5.0.0",
-    "xss-filters": "^1.2.6",
-    "snyk": "^1.17.1"
+    "xss-filters": "^1.2.6"
   },
   "devDependencies": {
     "adler32": "~0.1.7",