From 48114edc8685cd88489d98fe1b02fff09613a033 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Fri, 8 Mar 2019 13:30:47 +0100
Subject: [PATCH] Minor refactoring of new react text panel

---
 public/app/plugins/panel/text2/TextPanel.tsx  | 15 ++++++--------
 .../plugins/panel/text2/TextPanelEditor.tsx   | 20 ++++++++++++-------
 2 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/public/app/plugins/panel/text2/TextPanel.tsx b/public/app/plugins/panel/text2/TextPanel.tsx
index 26bb2b2dcb9..688c2734a55 100644
--- a/public/app/plugins/panel/text2/TextPanel.tsx
+++ b/public/app/plugins/panel/text2/TextPanel.tsx
@@ -1,9 +1,11 @@
+// Libraries
 import React, { PureComponent } from 'react';
-
 import Remarkable from 'remarkable';
+import { debounce } from 'lodash';
+
+// Utils
 import { sanitize } from 'app/core/utils/text';
 import config from 'app/core/config';
-import { debounce } from 'lodash';
 
 // Types
 import { TextOptions } from './types';
@@ -42,13 +44,8 @@ export class TextPanel extends PureComponent<Props, State> {
     const { replaceVariables } = this.props;
 
     html = config.disableSanitizeHtml ? html : sanitize(html);
-    try {
-      return replaceVariables(html);
-    } catch (e) {
-      // TODO -- put the error in the header window
-      console.log('Text panel error: ', e);
-      return html;
-    }
+
+    return replaceVariables(html);
   }
 
   prepareText(content: string): string {
diff --git a/public/app/plugins/panel/text2/TextPanelEditor.tsx b/public/app/plugins/panel/text2/TextPanelEditor.tsx
index d604b32c82c..7bf8704bd46 100644
--- a/public/app/plugins/panel/text2/TextPanelEditor.tsx
+++ b/public/app/plugins/panel/text2/TextPanelEditor.tsx
@@ -1,6 +1,10 @@
-import React, { PureComponent } from 'react';
+// Libraries
+import React, { PureComponent, ChangeEvent } from 'react';
+
+// Components
 import { PanelEditorProps, PanelOptionsGroup, Select, SelectOptionItem } from '@grafana/ui';
 
+// Types
 import { TextOptions } from './types';
 
 export class TextPanelEditor extends PureComponent<PanelEditorProps<TextOptions>> {
@@ -12,19 +16,21 @@ export class TextPanelEditor extends PureComponent<PanelEditorProps<TextOptions>
 
   onModeChange = (item: SelectOptionItem) => this.props.onOptionsChange({ ...this.props.options, mode: item.value });
 
-  onContentChange = evt => this.props.onOptionsChange({ ...this.props.options, content: (event.target as any).value });
+  onContentChange = (evt: ChangeEvent<HTMLTextAreaElement>) => {
+    this.props.onOptionsChange({ ...this.props.options, content: (event.target as any).value });
+  };
 
   render() {
     const { mode, content } = this.props.options;
 
     return (
       <PanelOptionsGroup title="Text">
-        <div className="gf-form">
-          <span className="gf-form-label">Mode</span>
-          <Select onChange={this.onModeChange} value={this.modes.find(e => mode === e.value)} options={this.modes} />
+        <div className="gf-form-inline">
+          <div className="gf-form">
+            <span className="gf-form-label">Mode</span>
+            <Select onChange={this.onModeChange} value={this.modes.find(e => mode === e.value)} options={this.modes} />
+          </div>
         </div>
-
-        {/* TODO: <code-editor */}
         <textarea value={content} onChange={this.onContentChange} className="gf-form-input" rows={10} />
       </PanelOptionsGroup>
     );