From fe2c487c625967f5b8ef9d29b7c4bed6d8739481 Mon Sep 17 00:00:00 2001
From: Andrew Watkins <watts@influxdb.com>
Date: Thu, 29 Mar 2018 14:56:14 -0700
Subject: [PATCH] Move GraphTips to TypeScript

---
 ui/src/shared/components/GraphTips.js  | 27 --------------------------
 ui/src/shared/components/GraphTips.tsx | 24 +++++++++++++++++++++++
 2 files changed, 24 insertions(+), 27 deletions(-)
 delete mode 100644 ui/src/shared/components/GraphTips.js
 create mode 100644 ui/src/shared/components/GraphTips.tsx

diff --git a/ui/src/shared/components/GraphTips.js b/ui/src/shared/components/GraphTips.js
deleted file mode 100644
index 9701895594..0000000000
--- a/ui/src/shared/components/GraphTips.js
+++ /dev/null
@@ -1,27 +0,0 @@
-import React from 'react'
-import ReactTooltip from 'react-tooltip'
-
-const GraphTips = React.createClass({
-  render() {
-    const graphTipsText =
-      '<h1>Graph Tips:</h1><p><code>Click + Drag</code> Zoom in (X or Y)<br/><code>Shift + Click</code> Pan Graph Window<br/><code>Double Click</code> Reset Graph Window</p><h1>Static Legend Tips:</h1><p><code>Click</code>Focus on single Series<br/><code>Shift + Click</code> Show/Hide single Series</p>'
-    return (
-      <div
-        className="graph-tips"
-        data-for="graph-tips-tooltip"
-        data-tip={graphTipsText}
-      >
-        <span>?</span>
-        <ReactTooltip
-          id="graph-tips-tooltip"
-          effect="solid"
-          html={true}
-          place="bottom"
-          class="influx-tooltip"
-        />
-      </div>
-    )
-  },
-})
-
-export default GraphTips
diff --git a/ui/src/shared/components/GraphTips.tsx b/ui/src/shared/components/GraphTips.tsx
new file mode 100644
index 0000000000..11ac085af1
--- /dev/null
+++ b/ui/src/shared/components/GraphTips.tsx
@@ -0,0 +1,24 @@
+import React, {SFC} from 'react'
+import ReactTooltip from 'react-tooltip'
+
+const graphTipsText =
+  '<h1>Graph Tips:</h1><p><code>Click + Drag</code> Zoom in (X or Y)<br/><code>Shift + Click</code> Pan Graph Window<br/><code>Double Click</code> Reset Graph Window</p><h1>Static Legend Tips:</h1><p><code>Click</code>Focus on single Series<br/><code>Shift + Click</code> Show/Hide single Series</p>'
+
+const GraphTips: SFC = () => (
+  <div
+    className="graph-tips"
+    data-for="graph-tips-tooltip"
+    data-tip={graphTipsText}
+  >
+    <span>?</span>
+    <ReactTooltip
+      id="graph-tips-tooltip"
+      effect="solid"
+      html={true}
+      place="bottom"
+      class="influx-tooltip"
+    />
+  </div>
+)
+
+export default GraphTips