CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-08 15:56:23 +12:00
Code Issues Projects Releases Wiki Activity

Optimise loading in overview tab and add transition to dash card header

Browse source
This commit is contained in:
Andrew Kingston 2022-08-08 12:25:49 +01:00
parent 50c04c801f
commit e18e941449
2 changed files with 25 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
packages/builder/src/components/common/DashCard.svelte
View file

@ -37,6 +37,7 @@
border-bottom: 1px solid var(--spectrum-global-color-gray-300);
display: flex;
justify-content: space-between;
transition: background-color 130ms ease-out;
}
.dash-card-body {
padding: var(--spacing-xl) calc(var(--spacing-xl) * 2);

48
packages/builder/src/pages/builder/portal/overview/_components/OverviewTab.svelte
View file

@ -27,22 +27,26 @@
},
})
let appEditor, appEditorPromise
let appEditor
$: updateAvailable = clientPackage.version !== $store.version
$: isPublished = app && app?.status === AppStatus.DEPLOYED
$: isPublished = app?.status === AppStatus.DEPLOYED
$: appEditorId = !app?.updatedBy ? $auth.user._id : app?.updatedBy
$: appEditorText = appEditor?.firstName || appEditor?.email
$: fetchAppEditor(appEditorId)
$: appUsers = $appUsersFetch.rows || []
$: appUsersFetch.update({
query: {
appId: apps.getProdAppID(app.devId),
},
})
const unpublishApp = () => {
dispatch("unpublish", app)
}
async function fetchAppEditor(editorId) {
appEditorPromise = users.get(editorId)
appEditor = await appEditorPromise
appEditor = await users.get(editorId)
}
const getInitials = user => {
@ -89,11 +93,9 @@
</div>
</div>
</DashCard>
<DashCard title={"Last Edited"} dataCy={"edited-by"}>
<div class="last-edited-content">
{#await appEditorPromise}
<Avatar size="M" initials={"-"} />
{:then _}
{#if appEditor}
<DashCard title={"Last Edited"} dataCy={"edited-by"}>
<div class="last-edited-content">
<div class="updated-by">
{#if appEditor}
<Avatar size="M" initials={getInitials(appEditor)} />
@ -102,22 +104,20 @@
</div>
{/if}
</div>
{:catch error}
<p>Could not fetch user: {error.message}</p>
{/await}
<div class="last-edit-text">
{#if app}
{processStringSync(
"Last edited {{ duration time 'millisecond' }} ago",
{
time:
new Date().getTime() - new Date(app?.updatedAt).getTime(),
}
)}
{/if}
<div class="last-edit-text">
{#if app}
{processStringSync(
"Last edited {{ duration time 'millisecond' }} ago",
{
time:
new Date().getTime() - new Date(app?.updatedAt).getTime(),
}
)}
{/if}
</div>
</div>
</div>
</DashCard>
</DashCard>
{/if}
<DashCard
title={"App Version"}
showIcon={true}