diff --git a/ui/src/dashboards/components/Dashboard.js b/ui/src/dashboards/components/Dashboard.js
new file mode 100644
index 0000000000..20ba14773c
--- /dev/null
+++ b/ui/src/dashboards/components/Dashboard.js
@@ -0,0 +1,71 @@
+import React, {PropTypes} from 'react'
+import classnames from 'classnames'
+
+import LayoutRenderer from 'shared/components/LayoutRenderer'
+import Visualizations from 'src/dashboards/components/VisualizationSelector'
+
+const Dashboard = ({
+ dashboard,
+ isEditMode,
+ inPresentationMode,
+ source,
+ timeRange,
+}) => (
+
+
+ {isEditMode ? : null}
+ {Dashboard.renderDashboard(dashboard, timeRange, source)}
+
+
+)
+
+Dashboard.renderDashboard = (dashboard, timeRange, source) => {
+ const autoRefreshMs = 15000
+
+ const cellWidth = 4
+ const cellHeight = 4
+
+ const cells = dashboard.cells.map((cell, i) => {
+ const dashboardCell = Object.assign(cell, {
+ w: cellWidth,
+ h: cellHeight,
+ queries: cell.queries,
+ i: i.toString(),
+ })
+
+ dashboardCell.queries.forEach((q) => {
+ q.text = q.query;
+ q.database = source.telegraf;
+ });
+ return dashboardCell;
+ })
+
+ return (
+
+ )
+}
+
+const {
+ bool,
+ shape,
+ string,
+} = PropTypes
+
+Dashboard.propTypes = {
+ dashboard: shape({}).isRequired,
+ isEditMode: bool,
+ inPresentationMode: bool,
+ source: shape({
+ links: shape({
+ proxy: string,
+ }).isRequired,
+ }).isRequired,
+ timeRange: shape({}).isRequired,
+}
+
+export default Dashboard
diff --git a/ui/src/dashboards/components/VisualizationSelector.js b/ui/src/dashboards/components/VisualizationSelector.js
new file mode 100644
index 0000000000..b4d9f4c654
--- /dev/null
+++ b/ui/src/dashboards/components/VisualizationSelector.js
@@ -0,0 +1,17 @@
+import React from 'react'
+
+const VisualizationSelector = () => (
+
+
+ Visualizations
+
+ Line Graph
+
+
+ SingleStat
+
+
+
+)
+
+export default VisualizationSelector