From d45ef4865e6add191a445e761bca6dac35777bb5 Mon Sep 17 00:00:00 2001
From: Gandharv <gandharvkumargarg@gmail.com>
Date: Fri, 25 Mar 2022 17:40:32 +0500
Subject: [PATCH] fix: auto save when component def changes (#2638)

* fix: auto save when component def changes

* remove callback
---
 frontend/src/Editor/Editor.jsx              |  5 +--
 frontend/src/Editor/Inspector/Inspector.jsx | 40 ++++++++++-----------
 2 files changed, 23 insertions(+), 22 deletions(-)

diff --git a/frontend/src/Editor/Editor.jsx b/frontend/src/Editor/Editor.jsx
index 9fe11e8d33..db57b4eb6f 100644
--- a/frontend/src/Editor/Editor.jsx
+++ b/frontend/src/Editor/Editor.jsx
@@ -503,8 +503,9 @@ class Editor extends React.Component {
       },
       this.handleAddPatch
     );
-
-    return setStateAsync(_self, newDefinition);
+    setStateAsync(_self, newDefinition).then(() => {
+      this.autoSave();
+    });
   };
 
   cloneComponent = (newComponent) => {
diff --git a/frontend/src/Editor/Inspector/Inspector.jsx b/frontend/src/Editor/Inspector/Inspector.jsx
index 78436a354b..210132a34d 100644
--- a/frontend/src/Editor/Inspector/Inspector.jsx
+++ b/frontend/src/Editor/Inspector/Inspector.jsx
@@ -162,30 +162,30 @@ export const Inspector = ({
         },
       };
 
-      componentDefinitionChanged(newComponent).then(() => {
-        //  Child componets should also have a mobile layout
-        const childComponents = Object.keys(allComponents).filter((key) => allComponents[key].parent === component.id);
+      componentDefinitionChanged(newComponent);
 
-        childComponents.forEach((componentId) => {
-          let newChild = {
-            id: componentId,
-            ...allComponents[componentId],
-          };
+      //  Child componets should also have a mobile layout
+      const childComponents = Object.keys(allComponents).filter((key) => allComponents[key].parent === component.id);
 
-          const { width, height } = newChild.layouts['desktop'];
+      childComponents.forEach((componentId) => {
+        let newChild = {
+          id: componentId,
+          ...allComponents[componentId],
+        };
 
-          newChild['layouts'] = {
-            ...newChild.layouts,
-            mobile: {
-              top: 100,
-              left: 0,
-              width: Math.min(width, 445),
-              height: height,
-            },
-          };
+        const { width, height } = newChild.layouts['desktop'];
 
-          componentDefinitionChanged(newChild);
-        });
+        newChild['layouts'] = {
+          ...newChild.layouts,
+          mobile: {
+            top: 100,
+            left: 0,
+            width: Math.min(width, 445),
+            height: height,
+          },
+        };
+
+        componentDefinitionChanged(newChild);
       });
     }
   }