You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@camel.apache.org by ma...@apache.org on 2024/03/26 15:22:17 UTC

(camel-karavan) branch main updated: Fix #1203

This is an automated email from the ASF dual-hosted git repository.

marat pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/camel-karavan.git


The following commit(s) were added to refs/heads/main by this push:
     new 4058487a Fix #1203
4058487a is described below

commit 4058487a8e3596145fff624577461331c7fc3e28
Author: Marat Gubaidullin <ma...@talismancloud.io>
AuthorDate: Tue Mar 26 11:22:10 2024 -0400

    Fix #1203
---
 .../webui/src/designer/kamelet/KameletInput.tsx    | 33 ++++++++++++++--------
 .../src/designer/kamelet/KameletInput.tsx          | 33 ++++++++++++++--------
 .../src/designer/kamelet/KameletInput.tsx          | 33 ++++++++++++++--------
 3 files changed, 66 insertions(+), 33 deletions(-)

diff --git a/karavan-app/src/main/webui/src/designer/kamelet/KameletInput.tsx b/karavan-app/src/main/webui/src/designer/kamelet/KameletInput.tsx
index ebab83d7..c6ef9ad6 100644
--- a/karavan-app/src/main/webui/src/designer/kamelet/KameletInput.tsx
+++ b/karavan-app/src/main/webui/src/designer/kamelet/KameletInput.tsx
@@ -44,20 +44,24 @@ interface Props {
 
 export function KameletInput(props: Props) {
 
-    const [inputValue, setInputValue] = useState(props.value)
+    const [inputValue, setInputValue] = useState(props.value);
+    const [checkChanges, setCheckChanges] = useState<boolean>(false);
 
     useEffect(()=> {
-        const interval = setInterval(() => {
-            if (props.value !== inputValue) {
-                saveValue(inputValue);
+        if (checkChanges) {
+            const interval = setInterval(() => {
+                if (props.value !== inputValue) {
+                    saveValue(inputValue);
+                }
+            }, 1000);
+            return () => {
+                clearInterval(interval)
             }
-        }, 3000);
-        return () => {
-            clearInterval(interval)
         }
-    }, [inputValue])
+    }, [checkChanges, inputValue])
 
     function saveValue(value?: string) {
+        setCheckChanges(false)
         props.setValue(value ? value : inputValue);
     }
 
@@ -66,7 +70,10 @@ export function KameletInput(props: Props) {
             <InputGroup>
                 <InputGroupItem isFill>
                     <TextInput className="text-field" type="text" id={props.elementKey} name={props.elementKey}
-                               onChange={(_, value) => setInputValue(value)}
+                               onChange={(_, value) => {
+                                   setInputValue(value);
+                                   setCheckChanges(true);
+                               }}
                                onBlur={() => saveValue()}
                                value={inputValue}/>
                 </InputGroupItem>
@@ -77,7 +84,10 @@ export function KameletInput(props: Props) {
     function getTextArea() {
         return (<InputGroup>
             <InputGroupItem isFill> <TextArea type="text" id={props.elementKey} name={props.elementKey} autoResize
-                                              onChange={(_, value) => setInputValue(value)}
+                                              onChange={(_, value) => {
+                                                  setInputValue(value);
+                                                  setCheckChanges(true);
+                                              }}
                                               onBlur={() => saveValue()}
                                               value={inputValue}/></InputGroupItem></InputGroup>)
     }
@@ -108,7 +118,8 @@ export function KameletInput(props: Props) {
                     isSelected={inputValue === option}
                     onChange={(_, selected) => {
                         setInputValue(option);
-                        saveValue(option)
+                        saveValue(option);
+                        setCheckChanges(false);
                     }}
                 />
             )}
diff --git a/karavan-designer/src/designer/kamelet/KameletInput.tsx b/karavan-designer/src/designer/kamelet/KameletInput.tsx
index ebab83d7..c6ef9ad6 100644
--- a/karavan-designer/src/designer/kamelet/KameletInput.tsx
+++ b/karavan-designer/src/designer/kamelet/KameletInput.tsx
@@ -44,20 +44,24 @@ interface Props {
 
 export function KameletInput(props: Props) {
 
-    const [inputValue, setInputValue] = useState(props.value)
+    const [inputValue, setInputValue] = useState(props.value);
+    const [checkChanges, setCheckChanges] = useState<boolean>(false);
 
     useEffect(()=> {
-        const interval = setInterval(() => {
-            if (props.value !== inputValue) {
-                saveValue(inputValue);
+        if (checkChanges) {
+            const interval = setInterval(() => {
+                if (props.value !== inputValue) {
+                    saveValue(inputValue);
+                }
+            }, 1000);
+            return () => {
+                clearInterval(interval)
             }
-        }, 3000);
-        return () => {
-            clearInterval(interval)
         }
-    }, [inputValue])
+    }, [checkChanges, inputValue])
 
     function saveValue(value?: string) {
+        setCheckChanges(false)
         props.setValue(value ? value : inputValue);
     }
 
@@ -66,7 +70,10 @@ export function KameletInput(props: Props) {
             <InputGroup>
                 <InputGroupItem isFill>
                     <TextInput className="text-field" type="text" id={props.elementKey} name={props.elementKey}
-                               onChange={(_, value) => setInputValue(value)}
+                               onChange={(_, value) => {
+                                   setInputValue(value);
+                                   setCheckChanges(true);
+                               }}
                                onBlur={() => saveValue()}
                                value={inputValue}/>
                 </InputGroupItem>
@@ -77,7 +84,10 @@ export function KameletInput(props: Props) {
     function getTextArea() {
         return (<InputGroup>
             <InputGroupItem isFill> <TextArea type="text" id={props.elementKey} name={props.elementKey} autoResize
-                                              onChange={(_, value) => setInputValue(value)}
+                                              onChange={(_, value) => {
+                                                  setInputValue(value);
+                                                  setCheckChanges(true);
+                                              }}
                                               onBlur={() => saveValue()}
                                               value={inputValue}/></InputGroupItem></InputGroup>)
     }
@@ -108,7 +118,8 @@ export function KameletInput(props: Props) {
                     isSelected={inputValue === option}
                     onChange={(_, selected) => {
                         setInputValue(option);
-                        saveValue(option)
+                        saveValue(option);
+                        setCheckChanges(false);
                     }}
                 />
             )}
diff --git a/karavan-space/src/designer/kamelet/KameletInput.tsx b/karavan-space/src/designer/kamelet/KameletInput.tsx
index ebab83d7..c6ef9ad6 100644
--- a/karavan-space/src/designer/kamelet/KameletInput.tsx
+++ b/karavan-space/src/designer/kamelet/KameletInput.tsx
@@ -44,20 +44,24 @@ interface Props {
 
 export function KameletInput(props: Props) {
 
-    const [inputValue, setInputValue] = useState(props.value)
+    const [inputValue, setInputValue] = useState(props.value);
+    const [checkChanges, setCheckChanges] = useState<boolean>(false);
 
     useEffect(()=> {
-        const interval = setInterval(() => {
-            if (props.value !== inputValue) {
-                saveValue(inputValue);
+        if (checkChanges) {
+            const interval = setInterval(() => {
+                if (props.value !== inputValue) {
+                    saveValue(inputValue);
+                }
+            }, 1000);
+            return () => {
+                clearInterval(interval)
             }
-        }, 3000);
-        return () => {
-            clearInterval(interval)
         }
-    }, [inputValue])
+    }, [checkChanges, inputValue])
 
     function saveValue(value?: string) {
+        setCheckChanges(false)
         props.setValue(value ? value : inputValue);
     }
 
@@ -66,7 +70,10 @@ export function KameletInput(props: Props) {
             <InputGroup>
                 <InputGroupItem isFill>
                     <TextInput className="text-field" type="text" id={props.elementKey} name={props.elementKey}
-                               onChange={(_, value) => setInputValue(value)}
+                               onChange={(_, value) => {
+                                   setInputValue(value);
+                                   setCheckChanges(true);
+                               }}
                                onBlur={() => saveValue()}
                                value={inputValue}/>
                 </InputGroupItem>
@@ -77,7 +84,10 @@ export function KameletInput(props: Props) {
     function getTextArea() {
         return (<InputGroup>
             <InputGroupItem isFill> <TextArea type="text" id={props.elementKey} name={props.elementKey} autoResize
-                                              onChange={(_, value) => setInputValue(value)}
+                                              onChange={(_, value) => {
+                                                  setInputValue(value);
+                                                  setCheckChanges(true);
+                                              }}
                                               onBlur={() => saveValue()}
                                               value={inputValue}/></InputGroupItem></InputGroup>)
     }
@@ -108,7 +118,8 @@ export function KameletInput(props: Props) {
                     isSelected={inputValue === option}
                     onChange={(_, selected) => {
                         setInputValue(option);
-                        saveValue(option)
+                        saveValue(option);
+                        setCheckChanges(false);
                     }}
                 />
             )}