ufkc7e3d
/
budibase
forked from tsai/budibase
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Updating UI after pulling in latest changes.

master
mike12345567 4 years ago
parent
f9ce10cf65
commit
c01c35386b
7 changed files with 54 additions and 86 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 21
      packages/builder/src/components/portal/overview/HistoryDetailsPanel.svelte
  2. 10
      packages/builder/src/components/portal/overview/HistoryTab.svelte
  3. 24
      packages/builder/src/components/portal/overview/StatusRenderer.svelte
  4. 39
      packages/builder/src/pages/builder/portal/overview/[application]/index.svelte
  5. 10
      packages/builder/src/pages/builder/portal/overview/_components/OverviewTab.svelte
  6. 18
      packages/server/yarn.lock
  7. 18
      packages/worker/yarn.lock

21
packages/builder/src/components/portal/overview/HistoryDetailsPanel.svelte
View File

@ -1,35 +1,29 @@
<script> <script>
import { Body, Layout, Icon, ActionButton, Heading } from "@budibase/bbui" import { Layout, Icon, ActionButton } from "@budibase/bbui"
import { capitalise } from "helpers"
import StatusRenderer from "components/portal/overview/StatusRenderer.svelte" import StatusRenderer from "components/portal/overview/StatusRenderer.svelte"
import DateTimeRenderer from "components/common/renderers/DateTimeRenderer.svelte" import DateTimeRenderer from "components/common/renderers/DateTimeRenderer.svelte"
import FlowItemHeader from "components/automation/AutomationBuilder/FlowChart/FlowItemHeader.svelte" import FlowItemHeader from "components/automation/AutomationBuilder/FlowChart/FlowItemHeader.svelte"
export let history export let history
export let close export let close
$: console.log(history)
</script> </script>
{#if history} {#if history}
<div class="body"> <div class="body">
<div class="top"> <div class="top">
<div class="controls"> <div class="controls">
<Icon name="Clock" /> <StatusRenderer value={history.status} />
<Body>Run log details</Body>
<ActionButton noPadding size="S" icon="Close" quiet on:click={close} /> <ActionButton noPadding size="S" icon="Close" quiet on:click={close} />
</div> </div>
</div> </div>
<Layout paddingX="XL" gap="S"> <Layout paddingX="XL" gap="S">
<Heading>{capitalise(history.appName || "")}</Heading>
<StatusRenderer value={history.status} />
<div class="icon"> <div class="icon">
<Icon name="Clock" /> <Icon name="Clock" />
<DateTimeRenderer value={history.timestamp} /> <DateTimeRenderer value={history.timestamp} />
</div> </div>
<div class="icon"> <div class="icon">
<Icon name="JourneyVoyager" /> <Icon name="JourneyVoyager" />
<Body>{history.name}</Body> <div>{history.name}</div>
</div> </div>
<div> <div>
<ActionButton icon="Edit" fullWidth={false} <ActionButton icon="Edit" fullWidth={false}
@ -39,12 +33,12 @@
</Layout> </Layout>
<div class="bottom"> <div class="bottom">
{#each history.steps as step} {#each history.steps as step}
<FlowItemHeader useResultsModal={false} block={step} /> <FlowItemHeader block={step} />
{/each} {/each}
</div> </div>
</div> </div>
{:else} {:else}
<Body>No details found</Body> <div>No details found</div>
{/if} {/if}
<style> <style>
@ -56,13 +50,14 @@
} }
.top { .top {
padding: var(--spacing-l) 0 var(--spacing-l) 0; padding: var(--spacing-m) 0 var(--spacing-m) 0;
border-bottom: var(--border-light); border-bottom: var(--border-light);
} }
.bottom { .bottom {
margin-top: var(--spacing-m); margin-top: var(--spacing-m);
border-top: var(--border-light); border-top: var(--border-light);
height: 100%;
} }
.icon { .icon {
@ -73,7 +68,7 @@
.controls { .controls {
padding: 0 var(--spacing-l) 0 var(--spacing-l); padding: 0 var(--spacing-l) 0 var(--spacing-l);
display: grid; display: grid;
grid-template-columns: auto 1fr auto; grid-template-columns: 1fr auto;
gap: var(--spacing-s); gap: var(--spacing-s);
} }
</style> </style>

10
packages/builder/src/components/portal/overview/HistoryTab.svelte
View File

@ -15,7 +15,6 @@
const runHistorySchema = { const runHistorySchema = {
status: { displayName: "Status" }, status: { displayName: "Status" },
timestamp: { displayName: "Time" }, timestamp: { displayName: "Time" },
appName: { displayName: "App" },
name: { displayName: "Automation" }, name: { displayName: "Automation" },
} }
@ -59,7 +58,6 @@
{ {
status: "Error", status: "Error",
timestamp: "2022-05-11T16:06:14.438Z", timestamp: "2022-05-11T16:06:14.438Z",
appName: "App name",
name: "automation name", name: "automation name",
steps: [ steps: [
{ {
@ -76,7 +74,6 @@
{ {
status: "Success", status: "Success",
timestamp: "2022-05-11T16:03:14.438Z", timestamp: "2022-05-11T16:03:14.438Z",
appName: "App name",
name: "automation name", name: "automation name",
steps: [ steps: [
{ {
@ -137,7 +134,7 @@
} }
.panelOpen { .panelOpen {
grid-template-columns: 1fr 360px; grid-template-columns: auto 360px;
} }
.search { .search {
@ -161,9 +158,12 @@
.panel { .panel {
display: none; display: none;
position: absolute;
right: 0; right: 0;
height: 100%; height: 100%;
width: 100%; width: 360px;
overflow: hidden;
background-color: var(--background);
} }
.panelShow { .panelShow {

24
packages/builder/src/components/portal/overview/StatusRenderer.svelte
View File

@ -1,25 +1,31 @@
<script> <script>
import { Icon, Body } from "@budibase/bbui" import { Icon } from "@budibase/bbui"
export let value export let value
$: isError = value === "Error" $: isError = value === "Error"
$: color = isError
? "var(--spectrum-semantic-negative-color-background)"
: "var(--green)"
</script> </script>
<div class="cell"> <div class="cell">
<Icon <Icon {color} name={isError ? "Alert" : "CheckmarkCircle"} />
color={isError <div class:green={!isError} class:red={isError}>{value}</div>
? "var(--spectrum-semantic-negative-color-background)"
: "var(--green)"}
name={isError ? "Alert" : "CheckmarkCircle"}
/>
<Body>{value}</Body>
</div> </div>
<style> <style>
.cell { .cell {
color: var(--spectrum-semantic-negative-color-background);
display: flex; display: flex;
flex-direction: row; flex-direction: row;
gap: var(--spacing-m); gap: var(--spacing-m);
align-items: center;
}
.green {
color: var(--green);
}
.red {
color: var(--spectrum-semantic-negative-color-background);
} }
</style> </style>

39
packages/builder/src/pages/builder/portal/overview/[application]/index.svelte
View File

@ -26,8 +26,8 @@
import { AppStatus } from "constants" import { AppStatus } from "constants"
import AppLockModal from "components/common/AppLockModal.svelte" import AppLockModal from "components/common/AppLockModal.svelte"
import EditableIcon from "components/common/EditableIcon.svelte" import EditableIcon from "components/common/EditableIcon.svelte"
import HistoryTab from "components/portal/overview/HistoryTab.svelte"
import ConfirmDialog from "components/common/ConfirmDialog.svelte" import ConfirmDialog from "components/common/ConfirmDialog.svelte"
import HistoryTab from "components/portal/overview/HistoryTab.svelte"
import { checkIncomingDeploymentStatus } from "components/deploy/utils" import { checkIncomingDeploymentStatus } from "components/deploy/utils"
import { onDestroy, onMount } from "svelte" import { onDestroy, onMount } from "svelte"
@ -110,7 +110,7 @@
reviewPendingDeployments(deployments, newDeployments) reviewPendingDeployments(deployments, newDeployments)
return newDeployments return newDeployments
} catch (err) { } catch (err) {
notifications.error("Error fetching deployment overview") notifications.error("Error fetching deployment history")
} }
} }
@ -215,7 +215,7 @@
<ProgressCircle size="XL" /> <ProgressCircle size="XL" />
</div> </div>
{:then _} {:then _}
<Layout paddingX="XXL" paddingY="XXL" gap="XL"> <Layout paddingX="XXL" paddingY="XL" gap="L">
<span class="page-header" class:loaded> <span class="page-header" class:loaded>
<ActionButton secondary icon={"ArrowLeft"} on:click={backToAppList}> <ActionButton secondary icon={"ArrowLeft"} on:click={backToAppList}>
Back Back
@ -292,32 +292,6 @@
</ActionMenu> </ActionMenu>
</div> </div>
</div> </div>
<div class="header-right">
<AppLockModal app={selectedApp} />
<ButtonGroup gap="XS">
<Button
size="M"
secondary
icon="Globe"
disabled={!isPublished}
on:click={viewApp}
dataCy="view-app"
>
View app
</Button>
<Button
size="M"
cta
icon="Edit"
disabled={lockedBy && !lockedByYou}
on:click={() => {
editApp(selectedApp)
}}
>
<span>Edit</span>
</Button>
</ButtonGroup>
</div>
</Layout> </Layout>
<div class="tab-wrap"> <div class="tab-wrap">
<Tabs <Tabs
@ -342,13 +316,6 @@
<div class="container">Backups contents</div> <div class="container">Backups contents</div>
</Tab> </Tab>
{/if} {/if}
<Tab title="Overview">
<OverviewTab
app={selectedApp}
deployments={latestDeployments}
navigateTab={handleTabChange}
/>
</Tab>
<Tab title="Settings"> <Tab title="Settings">
<SettingsTab app={selectedApp} /> <SettingsTab app={selectedApp} />
</Tab> </Tab>

10
packages/builder/src/pages/builder/portal/overview/_components/OverviewTab.svelte
View File

@ -47,18 +47,18 @@
} }
</script> </script>
<div className="overview-tab"> <div class="overview-tab">
<Layout paddingX="XXL" paddingY="XXL" gap="XL"> <Layout paddingX="XXL" paddingY="XXL" gap="XL">
<div className="top"> <div class="top">
<DashCard title={"App Status"} dataCy={"app-status"}> <DashCard title={"App Status"} dataCy={"app-status"}>
<div className="status-content"> <div class="status-content">
<div className="status-display"> <div class="status-display">
{#if isPublished} {#if isPublished}
<Icon name="GlobeCheck" size="XL" disabled={false} /> <Icon name="GlobeCheck" size="XL" disabled={false} />
<span>Published</span> <span>Published</span>
{:else} {:else}
<Icon name="GlobeStrike" size="XL" disabled={true} /> <Icon name="GlobeStrike" size="XL" disabled={true} />
<span className="disabled"> Unpublished </span> <span class="disabled"> Unpublished </span>
{/if} {/if}
</div> </div>

18
packages/server/yarn.lock
View File

@ -1014,10 +1014,10 @@
resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39" resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39"
integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw== integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==
"@budibase/backend-core@1.0.188-alpha.0": "@budibase/backend-core@1.0.188-alpha.1":
version "1.0.188-alpha.0" version "1.0.188-alpha.1"
resolved "https://registry.yarnpkg.com/@budibase/backend-core/-/backend-core-1.0.188-alpha.0.tgz#1799eb96756a59606ab87ffc923e00af1733f00a" resolved "https://registry.yarnpkg.com/@budibase/backend-core/-/backend-core-1.0.188-alpha.1.tgz#46eaa947ca9f62d9ca75188e59039e1cad356212"
integrity sha512-0L8WRjyDEmUf7VFAUtKd5ddyyA+3JyzjMm43AiMjD3rhHbjwZQBlxxP0q3BBaeobM5FBf3xUzYQ+8qRDUJtcQQ== integrity sha512-0JB0LZTqjKyPdziiDGOxvhaVUA3YfK7SkbdHSA7wgh6XAqpWn1dHf9NnE2LIT2Mmqd0YLtkmRy0mmI6/928AGQ==
dependencies: dependencies:
"@techpass/passport-openidconnect" "^0.3.0" "@techpass/passport-openidconnect" "^0.3.0"
aws-sdk "^2.901.0" aws-sdk "^2.901.0"
@ -1092,12 +1092,12 @@
svelte-flatpickr "^3.2.3" svelte-flatpickr "^3.2.3"
svelte-portal "^1.0.0" svelte-portal "^1.0.0"
"@budibase/pro@1.0.188-alpha.0": "@budibase/pro@1.0.188-alpha.1":
version "1.0.188-alpha.0" version "1.0.188-alpha.1"
resolved "https://registry.yarnpkg.com/@budibase/pro/-/pro-1.0.188-alpha.0.tgz#30fdaf06e11b5ddff35cd484c1bf226cc2df78cd" resolved "https://registry.yarnpkg.com/@budibase/pro/-/pro-1.0.188-alpha.1.tgz#f23b9b95190cbb785aca88aa31dc593602d2288b"
integrity sha512-pWkHYTqxmMTYaLYOi3TwoI0Rdz539dR40GuhnnKN4rsX5aL+dxcKTartscTJlZGvY+rrk1Cfbq2LLbGSRWDdIA== integrity sha512-kFeQU5ePBaxN5xuPCuVpLgCZhIMxGoOyY60iYdvpldB4aVBkO5bmSeJ5Mbrdf/HwuF8K+wQoG5AA9+vd2lElMg==
dependencies: dependencies:
"@budibase/backend-core" "1.0.188-alpha.0" "@budibase/backend-core" "1.0.188-alpha.1"
node-fetch "^2.6.1" node-fetch "^2.6.1"
"@budibase/standard-components@^0.9.139": "@budibase/standard-components@^0.9.139":

18
packages/worker/yarn.lock
View File

@ -293,10 +293,10 @@
resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39" resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39"
integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw== integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==
"@budibase/backend-core@1.0.188-alpha.0": "@budibase/backend-core@1.0.188-alpha.1":
version "1.0.188-alpha.0" version "1.0.188-alpha.1"
resolved "https://registry.yarnpkg.com/@budibase/backend-core/-/backend-core-1.0.188-alpha.0.tgz#1799eb96756a59606ab87ffc923e00af1733f00a" resolved "https://registry.yarnpkg.com/@budibase/backend-core/-/backend-core-1.0.188-alpha.1.tgz#46eaa947ca9f62d9ca75188e59039e1cad356212"
integrity sha512-0L8WRjyDEmUf7VFAUtKd5ddyyA+3JyzjMm43AiMjD3rhHbjwZQBlxxP0q3BBaeobM5FBf3xUzYQ+8qRDUJtcQQ== integrity sha512-0JB0LZTqjKyPdziiDGOxvhaVUA3YfK7SkbdHSA7wgh6XAqpWn1dHf9NnE2LIT2Mmqd0YLtkmRy0mmI6/928AGQ==
dependencies: dependencies:
"@techpass/passport-openidconnect" "^0.3.0" "@techpass/passport-openidconnect" "^0.3.0"
aws-sdk "^2.901.0" aws-sdk "^2.901.0"
@ -322,12 +322,12 @@
uuid "^8.3.2" uuid "^8.3.2"
zlib "^1.0.5" zlib "^1.0.5"
"@budibase/pro@1.0.188-alpha.0": "@budibase/pro@1.0.188-alpha.1":
version "1.0.188-alpha.0" version "1.0.188-alpha.1"
resolved "https://registry.yarnpkg.com/@budibase/pro/-/pro-1.0.188-alpha.0.tgz#30fdaf06e11b5ddff35cd484c1bf226cc2df78cd" resolved "https://registry.yarnpkg.com/@budibase/pro/-/pro-1.0.188-alpha.1.tgz#f23b9b95190cbb785aca88aa31dc593602d2288b"
integrity sha512-pWkHYTqxmMTYaLYOi3TwoI0Rdz539dR40GuhnnKN4rsX5aL+dxcKTartscTJlZGvY+rrk1Cfbq2LLbGSRWDdIA== integrity sha512-kFeQU5ePBaxN5xuPCuVpLgCZhIMxGoOyY60iYdvpldB4aVBkO5bmSeJ5Mbrdf/HwuF8K+wQoG5AA9+vd2lElMg==
dependencies: dependencies:
"@budibase/backend-core" "1.0.188-alpha.0" "@budibase/backend-core" "1.0.188-alpha.1"
node-fetch "^2.6.1" node-fetch "^2.6.1"
"@cspotcode/source-map-consumer@0.8.0": "@cspotcode/source-map-consumer@0.8.0":

Write Preview
Loading…
Cancel
Save