Delay rendering blocks until the schema has been attempted to be loaded

packages/client/src/components/app/blocks/CardsBlock.svelte

@@ -45,6 +45,7 @@
   let dataProviderId
   let repeaterId
   let schema
+  let schemaLoaded = false
 
   $: fetchSchema(dataSource)
   $: enrichedSearchColumns = enrichSearchColumns(searchColumns, schema)
@@ -113,10 +114,12 @@
     if (dataSource) {
       schema = await fetchDatasourceSchema(dataSource)
     }
+    schemaLoaded = true
   }
 </script>
 
-<Block>
+{#if schemaLoaded}
+  <Block>
     <div class="card-list" use:styleable={$component.styles}>
       <BlockComponent type="form" bind:id={formId} props={{ dataSource }}>
         {#if title || enrichedSearchColumns?.length || showTitleButton}
@@ -207,7 +210,8 @@
         </BlockComponent>
       </BlockComponent>
     </div>
-</Block>
+  </Block>
+{/if}
 
 <style>
   .header {

packages/client/src/components/app/blocks/TableBlock.svelte

@@ -96,7 +96,8 @@
   }
 </script>
 
-<Block>
+{#if schemaLoaded}
+  <Block>
     <div class={size} use:styleable={$component.styles}>
       <BlockComponent type="form" bind:id={formId} props={{ dataSource }}>
         {#if title || enrichedSearchColumns?.length || showTitleButton}
@@ -136,7 +137,6 @@
             </div>
           </div>
         {/if}
-      {#if schema}
         <BlockComponent
           type="dataprovider"
           bind:id={dataProviderId}
@@ -165,10 +165,10 @@
             }}
           />
         </BlockComponent>
-      {/if}
       </BlockComponent>
     </div>
-</Block>
+  </Block>
+{/if}
 
 <style>
   .header {