From 033b5ca45d315afbc14c396d42e131de2c5803f0 Mon Sep 17 00:00:00 2001
From: Fedor Katurov <gotham48@gmail.com>
Date: Wed, 9 Oct 2019 15:47:58 +0700
Subject: [PATCH] timeout-based form sending

---
 src/components/node/Tags/index.tsx | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/components/node/Tags/index.tsx b/src/components/node/Tags/index.tsx
index cf2bcdb8..09469ac2 100644
--- a/src/components/node/Tags/index.tsx
+++ b/src/components/node/Tags/index.tsx
@@ -35,7 +35,9 @@ export const Tags: FC<IProps> = ({ tags, is_editable, onTagsChange, ...props })
   const onInput = useCallback(
     ({ target: { value } }: ChangeEvent<HTMLInputElement>) => {
       setInput(value);
-      if (timer) clearTimeout(timer.current);
+      if (timer) {
+        clearTimeout(timer.current);
+      }
     },
     [setInput, timer]
   );
@@ -69,8 +71,10 @@ export const Tags: FC<IProps> = ({ tags, is_editable, onTagsChange, ...props })
   const onSubmit = useCallback(() => {
     if (length(tags) === length(data) && isEmpty(symmetricDifference(tags, data))) return;
 
+    if (timer.current) clearTimeout(timer.current);
+
     onTagsChange(data.map(tag => tag.title));
-  }, [tags, data, onTagsChange]);
+  }, [tags, data, onTagsChange, timer]);
 
   const onBlur = useCallback(() => {
     clearTimeout(timer.current);
@@ -79,10 +83,14 @@ export const Tags: FC<IProps> = ({ tags, is_editable, onTagsChange, ...props })
 
   useEffect(() => setData(tags), [tags]);
   useEffect(() => {
-    timer.current = setTimeout(onSubmit, 3000);
+    timer.current = setTimeout(() => {
+      onSubmit();
+    }, 3000);
 
-    return () => clearTimeout(timer.current);
-  }, [data]);
+    return () => {
+      clearTimeout(timer.current);
+    };
+  }, [data, tags]);
 
   return (
     <TagField {...props}>