From 0d134ed5cb460e5a5f9fc8a4a79677f2464bab42 Mon Sep 17 00:00:00 2001
From: Andreas Schmidt <ndrscodes@gmail.com>
Date: Fri, 14 Jan 2022 16:41:43 +0100
Subject: [PATCH] prevent EditableList input from blurring

Signed-off-by: ndrscodes <ndrscodes@gmail.com>
---
 src/renderer/components/editable-list/editable-list.tsx | 2 ++
 src/renderer/components/input/input.tsx                 | 8 ++++++--
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/renderer/components/editable-list/editable-list.tsx b/src/renderer/components/editable-list/editable-list.tsx
index 6658d1e61b..5f4d842260 100644
--- a/src/renderer/components/editable-list/editable-list.tsx
+++ b/src/renderer/components/editable-list/editable-list.tsx
@@ -56,6 +56,7 @@ export class EditableList<T> extends React.Component<Props<T>> {
     if (val) {
       evt.preventDefault();
       this.props.add(val);
+      evt.stopPropagation();
     }
   }
 
@@ -70,6 +71,7 @@ export class EditableList<T> extends React.Component<Props<T>> {
             onSubmit={this.onSubmit}
             validators={validators}
             placeholder={placeholder}
+            blurOnEnter={false}
             iconRight={({ isDirty }) => isDirty ? <Icon material="keyboard_return" size={16} /> : null}
           />
         </div>
diff --git a/src/renderer/components/input/input.tsx b/src/renderer/components/input/input.tsx
index 9c7d6aa168..4e107bd40b 100644
--- a/src/renderer/components/input/input.tsx
+++ b/src/renderer/components/input/input.tsx
@@ -68,6 +68,7 @@ export type InputProps = Omit<InputElementProps, "onChange" | "onSubmit"> & {
   iconRight?: IconData;
   contentRight?: string | React.ReactNode; // Any component of string goes after iconRight
   validators?: InputValidator | InputValidator[];
+  blurOnEnter?: boolean;
   onChange?(value: string, evt: React.ChangeEvent<InputElement>): void;
   onSubmit?(value: string, evt: React.KeyboardEvent<InputElement>): void;
 };
@@ -86,6 +87,7 @@ const defaultProps: Partial<InputProps> = {
   maxRows: 10000,
   showValidationLine: true,
   validators: [],
+  blurOnEnter: true,
 };
 
 export class Input extends React.Component<InputProps, State> {
@@ -284,8 +286,10 @@ export class Input extends React.Component<InputProps, State> {
         this.setDirty();
       }
 
-      //pressing enter indicates that the edit is complete, we can unfocus now
-      this.blur();
+      if(this.props.blurOnEnter){
+        //pressing enter indicates that the edit is complete, we can unfocus now
+        this.blur();
+      }
     }
   }