fix: Editing title in sidebar allows removal of title (outline#2364)

johnoscott · Jul 25, 2021 · c9bd3bb · c9bd3bb
1 parent f61f970
commit c9bd3bb
Showing 1 changed file with 24 additions and 16 deletions.
diff --git a/app/components/Sidebar/components/EditableTitle.js b/app/components/Sidebar/components/EditableTitle.js
@@ -14,6 +14,7 @@ function EditableTitle({ title, onSubmit, canUpdate }: Props) {
   const [originalValue, setOriginalValue] = React.useState(title);
   const [value, setValue] = React.useState(title);
   const { showToast } = useToasts();
+
   React.useEffect(() => {
     setValue(title);
   }, [title]);
@@ -38,26 +39,33 @@ function EditableTitle({ title, onSubmit, canUpdate }: Props) {
     [originalValue]
   );
 
-  const handleSave = React.useCallback(async () => {
-    setIsEditing(false);
+  const handleSave = React.useCallback(
+    async (ev) => {
+      ev.preventDefault();
 
-    if (value === originalValue) {
-      return;
-    }
+      setIsEditing(false);
 
-    if (document) {
-      try {
-        await onSubmit(value);
-        setOriginalValue(value);
-      } catch (error) {
+      const trimmedValue = value.trim();
+      if (trimmedValue === originalValue || trimmedValue.length === 0) {
         setValue(originalValue);
-        showToast(error.message, {
-          type: "error",
-        });
-        throw error;
+        return;
+      }
+
+      if (document) {
+        try {
+          await onSubmit(trimmedValue);
+          setOriginalValue(trimmedValue);
+        } catch (error) {
+          setValue(originalValue);
+          showToast(error.message, {
+            type: "error",
+          });
+          throw error;
+        }
       }
-    }
-  }, [originalValue, showToast, value, onSubmit]);
+    },
+    [originalValue, showToast, value, onSubmit]
+  );
 
   return (
     <>