diff --git a/static/src/js/components/navbar/dropdown-item.js b/static/src/js/components/navbar/dropdown-item.js
new file mode 100644
index 0000000..12048a9
--- /dev/null
+++ b/static/src/js/components/navbar/dropdown-item.js
@@ -0,0 +1,9 @@
+import React from 'react';
+
+export default class DropdownItem extends React.Component {
+ render() {
+ return (
+
{this.props.children}
+ );
+ }
+}
diff --git a/static/src/js/components/navbar/dropdown.js b/static/src/js/components/navbar/dropdown.js
new file mode 100644
index 0000000..93bb529
--- /dev/null
+++ b/static/src/js/components/navbar/dropdown.js
@@ -0,0 +1,20 @@
+import React from 'react';
+
+export default class Dropdown extends React.Component {
+ render() {
+ return (
+
+
+ { this.props.title }
+
+
+ { this.props.children }
+
+
+ );
+ }
+}
diff --git a/static/src/js/components/navbar/navbar-header.js b/static/src/js/components/navbar/header.js
similarity index 91%
rename from static/src/js/components/navbar/navbar-header.js
rename to static/src/js/components/navbar/header.js
index b92722b..5b2137c 100644
--- a/static/src/js/components/navbar/navbar-header.js
+++ b/static/src/js/components/navbar/header.js
@@ -1,6 +1,6 @@
import React from 'react';
-export default class NavBarHeader extends React.Component {
+export default class Header extends React.Component {
render() {
const items = [0, 1, 2];
var iconBars = items.map(function (item) {
diff --git a/static/src/js/components/navbar/navbar.js b/static/src/js/components/navbar/navbar.js
index 2cf7b57..726f89f 100644
--- a/static/src/js/components/navbar/navbar.js
+++ b/static/src/js/components/navbar/navbar.js
@@ -1,5 +1,7 @@
import React from 'react';
-import NavBarHeader from './navbar-header';
+import Header from './header';
+import Dropdown from './dropdown';
+import DropdownItem from './dropdown-item';
var NavItem = require('react-bootstrap').NavItem;
export default class NavBar extends React.Component {
@@ -10,28 +12,19 @@ export default class NavBar extends React.Component {