Repo-view page with header, sidebar and body

static/js/directives/components/pages/repo-page/header.tsx

@@ -1,8 +1,36 @@
 import * as React from "react";
 
-class repoHeader extends React.Component<{}, {}> {
+interface IHeader {
+  name: string,
+  namespace: string
+}
+
+class repoHeader extends React.Component<IHeader, {}> {
+  static propTypes = {
+    name: React.PropTypes.string.isRequired,
+    namespace: React.PropTypes.string.isRequired
+  }
   render () {
-    return <div> The component for the header</div>;
+    return(
+      <div className="row rp-header__row">
+        <div className="rp-title">{this.props.namespace}/{this.props.name}</div>
+        <div className="rp-button">
+          <div className="dropdown">
+            <button className="btn rp-button__dropdown dropdown-toggle" type="button" data-toggle="dropdown">
+              <span className="rp-button__text">
+                Run with <span className="rp-button__text--bold">Docker</span>
+              </span>
+              <span className="caret"></span>
+            </button>
+            <ul className="dropdown-menu">
+              <li><a href="#">Squashed Docker Image</a></li>
+              <li><a href="#">Rocket Fetch</a></li>
+              <li><a href="#">Basic Docker Pull</a></li>
+            </ul>
+          </div>
+        </div>        
+      </div>      
+    );
   }
 }