From 2106f4c5f52bde1a59fbe9ed68c44f5758c1296d Mon Sep 17 00:00:00 2001
From: Jayden-Chiu <57676066+Jayden-Chiu@users.noreply.github.com>
Date: Sat, 23 Oct 2021 06:41:58 -0400
Subject: [PATCH] Fixes app being able to be named empty or whitespace string
 in editor (#1197)

---
 frontend/src/Editor/Editor.jsx | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/frontend/src/Editor/Editor.jsx b/frontend/src/Editor/Editor.jsx
index 510c74427a..b9de7f30c9 100644
--- a/frontend/src/Editor/Editor.jsx
+++ b/frontend/src/Editor/Editor.jsx
@@ -309,6 +309,23 @@ class Editor extends React.Component {
     });
   };
 
+  saveAppName = (id, name, notify = false) => {
+
+    if (!name.trim()) {
+      toast.warn("App name can't be empty or whitespace", {
+        hideProgressBar: true,
+        position: 'top-center',
+      });
+
+      this.setState({
+        app: { ...this.state.app, name: this.state.oldName },
+      })
+
+      return;
+    }
+    this.saveApp(id, {name}, notify);
+  }
+
   renderDataSource = (dataSource) => {
     const sourceMeta = DataSourceTypes.find((source) => source.kind === dataSource.kind);
     return (
@@ -569,8 +586,9 @@ class Editor extends React.Component {
                   <input
                     type="text"
                     style={{ width: '200px', left: '80px', position: 'absolute' }}
+                    onFocus={(e) => this.setState({ oldName: e.target.value })}
                     onChange={(e) => this.onNameChanged(e.target.value)}
-                    onBlur={(e) => this.saveApp(this.state.app.id, { name: e.target.value })}
+                    onBlur={(e) => this.saveAppName(this.state.app.id, e.target.value)}
                     className="form-control-plaintext form-control-plaintext-sm"
                     value={this.state.app.name}
                   />