Use patch when deleting components

packages/builder/src/builderStore/store/frontend.js

@@ -431,7 +431,7 @@ export const getFrontendStore = () => {
           return
         }
 
-        // Create screen patch function
+        // Patch screen
         const patch = screen => {
           // Find the selected component
           const currentComponent = findComponent(
@@ -492,39 +492,34 @@ export const getFrontendStore = () => {
         if (!component) {
           return
         }
-        const asset = get(currentAsset)
+        const state = get(store)
-        if (!asset) {
+        let parentId
-          return
-        }
-
-        // Fetch full definition
-        component = findComponent(asset.props, component._id)
-
-        // Ensure we aren't deleting the screen slot
-        if (component._component?.endsWith("/screenslot")) {
-          throw "You can't delete the screen slot"
-        }
 
-        // Ensure we aren't deleting something that contains the screen slot
+        // Patch screen
-        const screenslot = findComponentType(
+        const patch = screen => {
-          component,
+          // Check component exists
-          "@budibase/standard-components/screenslot"
+          component = findComponent(screen.props, component._id)
-        )
+          if (!component) {
-        if (screenslot != null) {
+            return false
-          throw "You can't delete a component that contains the screen slot"
+          }
-        }
 
-        const parent = findComponentParent(asset.props, component._id)
+          // Check component has a valid parent
-        if (parent) {
+          const parent = findComponentParent(screen.props, component._id)
+          if (!parent) {
+            return false
+          }
+          parentId = parent._id
           parent._children = parent._children.filter(
             child => child._id !== component._id
           )
-          store.update(state => {
-            state.selectedComponentId = parent._id
-            return state
-          })
         }
-        await store.actions.preview.saveSelected()
+        await store.actions.screens.patch(state.selectedScreenId, patch)
+
+        // Select the deleted component's parent
+        store.update(state => {
+          state.selectedComponentId = parentId
+          return state
+        })
       },
       copy: (component, cut = false, selectParent = true) => {
         const selectedAsset = get(currentAsset)