From 70c808130f2b95e4a49989aaf266a4cd42fa9676 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Thu, 28 Jun 2018 04:31:55 -0700
Subject: [PATCH] react panels wip

---
 .../dashboard/dashgrid/PanelEditor.tsx        | 13 +++++++----
 public/app/features/panel/DataPanel.tsx       | 23 +++++++++++++++++++
 .../app/features/plugins/plugin_component.ts  |  1 -
 3 files changed, 31 insertions(+), 6 deletions(-)
 create mode 100644 public/app/features/panel/DataPanel.tsx

diff --git a/public/app/features/dashboard/dashgrid/PanelEditor.tsx b/public/app/features/dashboard/dashgrid/PanelEditor.tsx
index c1350729ddd..ebcde802b7f 100644
--- a/public/app/features/dashboard/dashgrid/PanelEditor.tsx
+++ b/public/app/features/dashboard/dashgrid/PanelEditor.tsx
@@ -19,8 +19,15 @@ interface PanelEditorTab {
 
 @observer
 export class PanelEditor extends React.Component<PanelEditorProps, any> {
+  tabs: PanelEditorTab[];
+
   constructor(props) {
     super(props);
+
+    this.tabs = [
+      { id: 'queries', text: 'Queries', icon: 'fa fa-database' },
+      { id: 'viz', text: 'Visualization', icon: 'fa fa-line-chart' },
+    ];
   }
 
   renderQueriesTab() {
@@ -37,16 +44,12 @@ export class PanelEditor extends React.Component<PanelEditorProps, any> {
 
   render() {
     const activeTab: string = store.view.query.get('tab') || 'queries';
-    const tabs: PanelEditorTab[] = [
-      { id: 'queries', text: 'Queries', icon: 'fa fa-database' },
-      { id: 'viz', text: 'Visualization', icon: 'fa fa-line-chart' },
-    ];
 
     return (
       <div className="tabbed-view tabbed-view--panel-edit-new">
         <div className="tabbed-view-header">
           <ul className="gf-tabs">
-            {tabs.map(tab => {
+            {this.tabs.map(tab => {
               return <TabItem tab={tab} activeTab={activeTab} onClick={this.onChangeTab} key={tab.id} />;
             })}
           </ul>
diff --git a/public/app/features/panel/DataPanel.tsx b/public/app/features/panel/DataPanel.tsx
new file mode 100644
index 00000000000..5ea490e497d
--- /dev/null
+++ b/public/app/features/panel/DataPanel.tsx
@@ -0,0 +1,23 @@
+import React, { Component, ComponentClass } from 'react';
+import _ from 'lodash';
+
+export interface Props {
+  type: string;
+  queries: Query[];
+}
+
+interface State {
+  isLoading: boolean;
+  timeSeries: TimeSeriesServerResponse[];
+}
+
+export interface OriginalProps {
+  data: TimeSeriesServerResponse[];
+  isLoading: boolean;
+}
+
+const DataPanel = (ComposedComponent: ComponentClass<OriginalProps & Props>) => {
+  class Wrapper extends Component<Props, State> {}
+
+  return Wrapper;
+};
diff --git a/public/app/features/plugins/plugin_component.ts b/public/app/features/plugins/plugin_component.ts
index 2ca3dd6bd0b..1936e57f558 100644
--- a/public/app/features/plugins/plugin_component.ts
+++ b/public/app/features/plugins/plugin_component.ts
@@ -110,7 +110,6 @@ function pluginDirectiveLoader($compile, datasourceSrv, $rootScope, $q, $http, $
         let datasource = scope.target.datasource || scope.ctrl.panel.datasource;
         return datasourceSrv.get(datasource).then(ds => {
           scope.datasource = ds;
-          console.log('scope', scope);
 
           return importPluginModule(ds.meta.module).then(dsModule => {
             return {