From aa4f33a76c8d545991779691aeb907b75944435f Mon Sep 17 00:00:00 2001
From: Joe Reuter <johannes.reuter@elastic.co>
Date: Wed, 25 Nov 2020 12:12:43 +0100
Subject: [PATCH] [Lens] Fix label input debouncing (#84121)

---
 .../dimension_panel/dimension_editor.tsx                    | 6 +-----
 .../operations/definitions/filters/filter_popover.tsx       | 4 ----
 .../definitions/shared_components/label_input.tsx           | 6 +-----
 3 files changed, 2 insertions(+), 14 deletions(-)

diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/dimension_editor.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/dimension_editor.tsx
index cd196745f3315..1141673c9b726 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/dimension_editor.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/dimension_editor.tsx
@@ -6,7 +6,7 @@
 
 import './dimension_editor.scss';
 import _ from 'lodash';
-import React, { useState, useMemo, useEffect } from 'react';
+import React, { useState, useMemo } from 'react';
 import { i18n } from '@kbn/i18n';
 import {
   EuiListGroup,
@@ -46,10 +46,6 @@ export interface DimensionEditorProps extends IndexPatternDimensionEditorProps {
 const LabelInput = ({ value, onChange }: { value: string; onChange: (value: string) => void }) => {
   const [inputValue, setInputValue] = useState(value);
 
-  useEffect(() => {
-    setInputValue(value);
-  }, [value, setInputValue]);
-
   const onChangeDebounced = useMemo(() => _.debounce(onChange, 256), [onChange]);
 
   const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/filters/filter_popover.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/filters/filter_popover.tsx
index b9d9d6306b9ae..ca84c072be5ce 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/filters/filter_popover.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/filters/filter_popover.tsx
@@ -110,10 +110,6 @@ export const QueryInput = ({
 }) => {
   const [inputValue, setInputValue] = useState(value);
 
-  React.useEffect(() => {
-    setInputValue(value);
-  }, [value, setInputValue]);
-
   useDebounce(() => onChange(inputValue), 256, [inputValue]);
 
   const handleInputChange = (input: Query) => {
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/shared_components/label_input.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/shared_components/label_input.tsx
index f0ee30bb4331b..ddcb5633b376f 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/shared_components/label_input.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/shared_components/label_input.tsx
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React, { useState, useEffect } from 'react';
+import React, { useState } from 'react';
 import useDebounce from 'react-use/lib/useDebounce';
 import { EuiFieldText, keys } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
@@ -28,10 +28,6 @@ export const LabelInput = ({
 }) => {
   const [inputValue, setInputValue] = useState(value);
 
-  useEffect(() => {
-    setInputValue(value);
-  }, [value, setInputValue]);
-
   useDebounce(() => onChange(inputValue), 256, [inputValue]);
 
   const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {