Improve drawer state management between instances

packages/bbui/src/Drawer/Drawer.svelte

@@ -8,6 +8,7 @@
   // Context level stores to keep drawers in sync
   const openDrawers = writable([])
   const modal = writable(false)
+  const resizable = writable(true)
   const drawerLeft = writable(null)
   const drawerWidth = writable(null)
 
@@ -45,8 +46,13 @@
       return
     }
     observer?.disconnect()
+
+    // Reset state
     observer = null
     modal.set(false)
+    resizable.set(true)
+    drawerLeft.set(null)
+    drawerWidth.set(null)
   }
 </script>
 
@@ -93,6 +99,7 @@
     }
     if (forceModal) {
       modal.set(true)
+      resizable.set(false)
     }
     observe()
     visible = true
@@ -114,7 +121,7 @@
     hide,
     show,
     modal,
-    forceModal,
+    resizable,
   })
 
   const easeInOutQuad = x => {

packages/builder/src/components/common/bindings/BindingPanel.svelte

@@ -34,6 +34,7 @@
   import { capitalise } from "helpers"
   import DrawerBindableInput from "components/common/bindings/DrawerBindableInput.svelte"
   import { Utils } from "@budibase/frontend-core"
+  import { get } from "svelte/store"
 
   const dispatch = createEventDispatcher()
 
@@ -213,7 +214,7 @@
               <Icon name={tab} size="S" />
             </ActionButton>
           {/each}
-          {#if drawerContext && !drawerContext.forceModal}
+          {#if drawerContext && get(drawerContext.resizable)}
             <ActionButton
               size="M"
               quiet