From 539b6a8a9695853da133d0f4210ecf541bc5e619 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Thu, 17 Nov 2022 14:20:18 +0000
Subject: [PATCH] Allow custom naming of components inside blocks for better
 ejection

---
 packages/client/src/components/BlockComponent.svelte        | 3 ++-
 packages/client/src/components/app/blocks/TableBlock.svelte | 4 ++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/client/src/components/BlockComponent.svelte b/packages/client/src/components/BlockComponent.svelte
index 2f756ce296..6d07ec54da 100644
--- a/packages/client/src/components/BlockComponent.svelte
+++ b/packages/client/src/components/BlockComponent.svelte
@@ -8,6 +8,7 @@
   export let props
   export let styles
   export let context
+  export let name
   export let order = 0
   export let containsSlot = false
 
@@ -25,7 +26,7 @@
   $: instance = {
     _component: `@budibase/standard-components/${type}`,
     _id: id,
-    _instanceName: type[0].toUpperCase() + type.slice(1),
+    _instanceName: name || type[0].toUpperCase() + type.slice(1),
     _styles: {
       ...styles,
       normal: styles?.normal || {},
diff --git a/packages/client/src/components/app/blocks/TableBlock.svelte b/packages/client/src/components/app/blocks/TableBlock.svelte
index 51d004b75c..b825ec97b1 100644
--- a/packages/client/src/components/app/blocks/TableBlock.svelte
+++ b/packages/client/src/components/app/blocks/TableBlock.svelte
@@ -208,12 +208,14 @@
       </BlockComponent>
       {#if clickBehaviour === "details"}
         <BlockComponent
+          name="Details side panel"
           type="sidepanel"
           bind:id={detailsSidePanelId}
           context="details-side-panel"
           order={2}
         >
           <BlockComponent
+            name="Details form block"
             type="formblock"
             props={{
               dataSource,
@@ -230,12 +232,14 @@
       {/if}
       {#if showTitleButton && titleButtonClickBehaviour === "new"}
         <BlockComponent
+          name="New row side panel"
           type="sidepanel"
           bind:id={newRowSidePanelId}
           context="new-side-panel"
           order={3}
         >
           <BlockComponent
+            name="New row form block"
             type="formblock"
             props={{
               dataSource,