CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-08-18 11:31:28 +12:00
Code Issues Projects Releases Wiki Activity

Prevent flashing CTA buttons when initially loading table data

Browse source
This commit is contained in:
Andrew Kingston 2022-04-07 15:48:35 +01:00
parent 9e20f0406c
commit 620008fc42
2 changed files with 20 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/bbui/src/Table/Table.svelte
View file

@ -588,7 +588,7 @@
border-top: none;
grid-column: 1 / -1;
background-color: var(--table-bg);
padding: 60px 40px;
padding: 40px;
}
.placeholder--no-fields {
border-top: var(--table-border);

27
packages/builder/src/components/backend/DataTable/DataTable.svelte
View file

@ -28,7 +28,7 @@
$: id = $tables.selected?._id
$: fetch = createFetch(id)
$: hasCols = checkHasCols(schema)
$: hasRows = !!$fetch.data?.length
$: hasRows = !!$fetch.rows?.length
const enrichSchema = schema => {
let tempSchema = { ...schema }
@ -124,14 +124,17 @@
>
<div class="buttons">
<div class="left-buttons">
<CreateColumnButton highlighted on:updatecolumns={onUpdateColumns} />
<CreateColumnButton
highlighted={$fetch.loaded && (!hasCols || !hasRows)}
on:updatecolumns={onUpdateColumns}
/>
{#if !isUsersTable}
<CreateRowButton
on:updaterows={onUpdateRows}
title={"Create row"}
modalContentComponent={CreateEditRow}
disabled={!hasCols}
highlighted={hasCols && !hasRows}
highlighted={$fetch.loaded && hasCols && !hasRows}
/>
{/if}
{#if isInternal}
@ -169,11 +172,19 @@
</div>
<div slot="placeholder">
<Layout gap="S">
<Heading>Let's create some columns!</Heading>
<Body>
Start building out your table structure<br />
by adding some columns
</Body>
{#if !hasCols}
<Heading>Let's create some columns</Heading>
<Body>
Start building out your table structure<br />
by adding some columns
</Body>
{:else}
<Heading>Now let's add a row</Heading>
<Body>
Add some data to your table<br />
by adding some rows
</Body>
{/if}
</Layout>
</div>
</Table>