From 2f101d1db570e9308e1d5fd825189b18c18da6b1 Mon Sep 17 00:00:00 2001
From: Andrej Ocenas <mr.ocenas@gmail.com>
Date: Wed, 27 Nov 2019 09:52:41 +0100
Subject: [PATCH] DataLinks: Refactor title state (#20256)

---
 .../src/components/DataLinks/DataLinkEditor.tsx      | 12 +++---------
 1 file changed, 3 insertions(+), 9 deletions(-)

diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx
index e05aba24d67..dda63d4c8d7 100644
--- a/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx
+++ b/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx
@@ -1,4 +1,4 @@
-import React, { useState, ChangeEvent, useContext } from 'react';
+import React, { ChangeEvent, useContext } from 'react';
 import { DataLink } from '@grafana/data';
 import { FormField, Switch } from '../index';
 import { VariableSuggestion } from './DataLinkSuggestions';
@@ -31,17 +31,12 @@ export const DataLinkEditor: React.FC<DataLinkEditorProps> = React.memo(
   ({ index, value, onChange, onRemove, suggestions, isLast }) => {
     const theme = useContext(ThemeContext);
     const styles = getStyles(theme);
-    const [title, setTitle] = useState(value.title);
 
     const onUrlChange = (url: string, callback?: () => void) => {
       onChange(index, { ...value, url }, callback);
     };
     const onTitleChange = (event: ChangeEvent<HTMLInputElement>) => {
-      setTitle(event.target.value);
-    };
-
-    const onTitleBlur = () => {
-      onChange(index, { ...value, title: title });
+      onChange(index, { ...value, title: event.target.value });
     };
 
     const onRemoveClick = () => {
@@ -58,9 +53,8 @@ export const DataLinkEditor: React.FC<DataLinkEditorProps> = React.memo(
           <FormField
             className="gf-form--grow"
             label="Title"
-            value={title}
+            value={value.title}
             onChange={onTitleChange}
-            onBlur={onTitleBlur}
             inputWidth={0}
             labelWidth={5}
             placeholder="Show details"