From 93459b7a4833b7fdddc835c290cb51755252d1f8 Mon Sep 17 00:00:00 2001
From: Alex P <thealexpaxton@gmail.com>
Date: Thu, 22 Jun 2017 13:47:09 -0700
Subject: [PATCH] Make dashboards index header into component

---
 .../dashboards/components/DashboardsHeader.js | 28 +++++++++++++++++++
 .../dashboards/containers/DashboardsPage.js   | 15 ++--------
 2 files changed, 30 insertions(+), 13 deletions(-)
 create mode 100644 ui/src/dashboards/components/DashboardsHeader.js

diff --git a/ui/src/dashboards/components/DashboardsHeader.js b/ui/src/dashboards/components/DashboardsHeader.js
new file mode 100644
index 000000000..3774f7293
--- /dev/null
+++ b/ui/src/dashboards/components/DashboardsHeader.js
@@ -0,0 +1,28 @@
+import React, {PropTypes} from 'react'
+
+import SourceIndicator from 'shared/components/SourceIndicator'
+
+const DashboardsHeader = ({sourceName}) => {
+  return (
+    <div className="page-header">
+      <div className="page-header__container">
+        <div className="page-header__left">
+          <h1 className="page-header__title">
+            Dashboards
+          </h1>
+        </div>
+        <div className="page-header__right">
+          <SourceIndicator sourceName={sourceName} />
+        </div>
+      </div>
+    </div>
+  )
+}
+
+const {string} = PropTypes
+
+DashboardsHeader.propTypes = {
+  sourceName: string.isRequired,
+}
+
+export default DashboardsHeader
diff --git a/ui/src/dashboards/containers/DashboardsPage.js b/ui/src/dashboards/containers/DashboardsPage.js
index d1562c008..0ccf2cf22 100644
--- a/ui/src/dashboards/containers/DashboardsPage.js
+++ b/ui/src/dashboards/containers/DashboardsPage.js
@@ -5,7 +5,7 @@ import {bindActionCreators} from 'redux'
 
 import _ from 'lodash'
 
-import SourceIndicator from 'shared/components/SourceIndicator'
+import DashboardsHeader from 'src/dashboards/components/DashboardsHeader'
 import DeleteConfirmTableCell from 'shared/components/DeleteConfirmTableCell'
 import FancyScrollbar from 'shared/components/FancyScrollbar'
 
@@ -63,18 +63,7 @@ const DashboardsPage = React.createClass({
 
     return (
       <div className="page">
-        <div className="page-header">
-          <div className="page-header__container">
-            <div className="page-header__left">
-              <h1 className="page-header__title">
-                Dashboards
-              </h1>
-            </div>
-            <div className="page-header__right">
-              <SourceIndicator sourceName={this.props.source.name} />
-            </div>
-          </div>
-        </div>
+        <DashboardsHeader sourceName={this.props.source.name} />
         <FancyScrollbar className="page-contents">
           <div className="container-fluid">
             <div className="row">