solving initial table load issue

packages/builder/src/database/DatabaseRoot.svelte

@@ -76,7 +76,11 @@
         </ActionButton>
       {/if}
     </div>
+    {#if $backendUiStore.selectedDatabase.id}
       <ModelDataTable {selectRecord} />
+    {:else}
+      Please select a database
+    {/if}
   </div>
 </div>
 

packages/builder/src/database/ModelDataTable/ModelDataTable.svelte

@@ -21,7 +21,7 @@
   $: views = $store.hierarchy.indexes
   $: currentAppInfo = {
     appname: $store.appname,
-    instanceId: $backendUiStore.selectedDatabase.id
+    instanceId: $backendUiStore.selectedDatabase.id,
   }
   $: data = $backendUiStore.selectedView.records.slice(
     currentPage * ITEMS_PER_PAGE,
@@ -43,16 +43,17 @@
   }
 
   onMount(async () => {
-    if (showTable) {
+    if (views.length > 0) {
       await fetchRecordsForView(views[0].name, currentAppInfo)
     }
   })
 </script>
 
-{#if showTable} 
-  <section>
+<section>
   <div class="table-controls">
-      <h4 class="budibase__title--3">{$backendUiStore.selectedDatabase.name || ""}</h4>
+    <h4 class="budibase__title--3">
+      {$backendUiStore.selectedDatabase.name || ''}
+    </h4>
     <Select
       icon="ri-eye-line"
       on:change={e => fetchRecordsForView(e.target.value)}>
@@ -82,12 +83,7 @@
               <div uk-dropdown="mode: click">
                 <ul class="uk-nav uk-dropdown-nav">
                   <li>
-                      <div
-                        on:click={async () => {
-                            // fetch the child records for that particular row
-                        }}>
-                        View
-                      </div>
+                    <div on:click={async () => {}}>View</div>
                   </li>
                   <li
                     on:click={() => {
@@ -124,12 +120,11 @@
       {/each}
     </tbody>
   </table>
-    <TablePagination bind:currentPage pageItemCount={data.length} {ITEMS_PER_PAGE} />
-  </section>
-{:else}
-  Please select a database.
-{/if}
-
+  <TablePagination
+    bind:currentPage
+    pageItemCount={data.length}
+    {ITEMS_PER_PAGE} />
+</section>
 
 <style>
   table {

packages/builder/src/nav/BackendNav.svelte

@@ -49,9 +49,9 @@
         <UsersList />
       </div>
 
-      <NavItem name="ACCESS_LEVELS" label="User Levels" />
     </div>
   {/if}
+  <NavItem name="ACCESS_LEVELS" label="User Levels" />
 </div>
 
 <style>