CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-09-14 00:08:25 +12:00
Code Issues Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/cheeks-lab-day-portal-redesign' into feature/user-onboarding-overlays

Browse source
This commit is contained in:
Dean 2023-01-16 10:26:52 +00:00
commit 980a6d1e8f
14 changed files with 52 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
hosting/docker-compose.dev.yaml
View file

@ -6,7 +6,7 @@ services:
minio-service: minio-service:
container_name: budi-minio-dev container_name: budi-minio-dev
restart: on-failure restart: on-failure
image: minio/minio image: minio/minio:RELEASE.2022-10-24T18-35-07Z
volumes: volumes:
- minio_data:/data - minio_data:/data
ports: ports:

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

@ -33,6 +33,7 @@
export let allowSelectRows export let allowSelectRows
export let allowEditRows = true export let allowEditRows = true
export let allowEditColumns = true export let allowEditColumns = true
export let allowClickRows = true
export let selectedRows = [] export let selectedRows = []
export let customRenderers = [] export let customRenderers = []
export let disableSorting = false export let disableSorting = false
@ -373,7 +374,7 @@
{/if} {/if}
{#if sortedRows?.length} {#if sortedRows?.length}
{#each sortedRows as row, idx} {#each sortedRows as row, idx}
<div class="spectrum-Table-row"> <div class="spectrum-Table-row" class:clickable={allowClickRows}>
{#if showEditColumn} {#if showEditColumn}
<div <div
class:noBorderCheckbox={!showHeaderBorder} class:noBorderCheckbox={!showHeaderBorder}
@ -566,8 +567,12 @@
/* Table rows */ /* Table rows */
.spectrum-Table-row { .spectrum-Table-row {
display: contents; display: contents;
cursor: auto;
} }
.spectrum-Table-row:hover .spectrum-Table-cell { .spectrum-Table-row.clickable {
cursor: pointer;
}
.spectrum-Table-row.clickable:hover .spectrum-Table-cell {
background-color: var(--spectrum-global-color-gray-100); background-color: var(--spectrum-global-color-gray-100);
} }
.wrapper--quiet .spectrum-Table-row { .wrapper--quiet .spectrum-Table-row {

29
packages/builder/src/components/usage/Usage.svelte
View file

@ -39,15 +39,21 @@
{#if showWarning} {#if showWarning}
<Icon name="Alert" /> <Icon name="Alert" />
{/if} {/if}
<div class="heading header-item"> <Heading size="XS" weight="light">
<Heading size="XS" weight="light">{usage.name}</Heading> <span class="nowrap">
</div> {usage.name}
</span>
</Heading>
</div> </div>
{#if unlimited} <Body size="S">
<Body size="S">{usage.used} / Unlimited</Body> <span class="nowrap">
{:else} {#if unlimited}
<Body size="S">{usage.used} / {usage.total}</Body> {usage.used} / Unlimited
{/if} {:else}
{usage.used} / {usage.total}
{/if}
</span>
</Body>
</div> </div>
<div> <div>
{#if unlimited} {#if unlimited}
@ -89,13 +95,14 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
align-items: flex-end;
margin-bottom: 12px; margin-bottom: 12px;
gap: var(--spacing-m);
} }
.header-container { .header-container {
display: flex; display: flex;
} }
.heading { .nowrap {
margin-top: 3px; white-space: nowrap;
margin-left: 5px;
} }
</style> </style>

7
packages/builder/src/pages/builder/portal/_components/Logo.svelte
View file

@ -1,9 +1,14 @@
<script> <script>
import Logo from "assets/bb-emblem.svg" import Logo from "assets/bb-emblem.svg"
import { goto } from "@roxi/routify" import { goto } from "@roxi/routify"
import { organisation } from "stores/portal"
</script> </script>
<img src={Logo} alt="Budibase Logo" on:click={() => $goto("./apps")} /> <img
src={$organisation.logoUrl || Logo}
alt="Budibase Logo"
on:click={() => $goto("./apps")}
/>
<style> <style>
img { img {

1
packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
View file

@ -17,6 +17,7 @@
{:else if !$admin.cloud && $auth.isAdmin} {:else if !$admin.cloud && $auth.isAdmin}
<Button <Button
cta cta
size="S"
on:click={() => $goto("/builder/portal/account/upgrade")} on:click={() => $goto("/builder/portal/account/upgrade")}
on:click on:click
> >

2
packages/builder/src/pages/builder/portal/_components/UserDropdown.svelte
View file

@ -23,7 +23,7 @@
<ActionMenu align="right" dataCy="user-menu"> <ActionMenu align="right" dataCy="user-menu">
<div slot="control" class="user-dropdown"> <div slot="control" class="user-dropdown">
<Avatar size="L" initials={$auth.initials} url={$auth.user.pictureUrl} /> <Avatar size="M" initials={$auth.initials} url={$auth.user.pictureUrl} />
<Icon size="XL" name="ChevronDown" /> <Icon size="XL" name="ChevronDown" />
</div> </div>
<MenuItem icon="Moon" on:click={() => themeModal.show()} dataCy="theme"> <MenuItem icon="Moon" on:click={() => themeModal.show()} dataCy="theme">

5
packages/builder/src/pages/builder/portal/account/usage.svelte
View file

@ -32,6 +32,8 @@
$: license = $auth.user?.license $: license = $auth.user?.license
$: accountPortalAccess = $auth?.user?.accountPortalAccess $: accountPortalAccess = $auth?.user?.accountPortalAccess
$: quotaReset = quotaUsage?.quotaReset $: quotaReset = quotaUsage?.quotaReset
$: canManagePlan =
($admin.cloud && accountPortalAccess) || (!$admin.cloud && $auth.isAdmin)
const setMonthlyUsage = () => { const setMonthlyUsage = () => {
monthlyUsage = [] monthlyUsage = []
@ -184,7 +186,7 @@
</Body> </Body>
</Layout> </Layout>
<Divider /> <Divider />
{#if $auth?.user?.accountPortalAccess} {#if canManagePlan}
<Body> <Body>
To upgrade your plan and usage limits visit your To upgrade your plan and usage limits visit your
<Link size="L" on:click={goToAccountPortal}>account</Link>. <Link size="L" on:click={goToAccountPortal}>account</Link>.
@ -247,6 +249,7 @@
justify-content: flex-start; justify-content: flex-start;
align-items: flex-start; align-items: flex-start;
gap: 40px; gap: 40px;
flex-wrap: wrap;
} }
.column { .column {
flex: 1 1 0; flex: 1 1 0;

6
packages/builder/src/pages/builder/portal/overview/[appId]/_layout.svelte
View file

@ -260,10 +260,16 @@
.desktop { .desktop {
display: contents; display: contents;
} }
.mobile {
display: none;
}
@media (max-width: 640px) { @media (max-width: 640px) {
.desktop { .desktop {
display: none; display: none;
} }
.mobile {
display: contents;
}
} }
</style> </style>

2
packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte
View file

@ -144,7 +144,7 @@
<ModalContent <ModalContent
size="M" size="M"
title="Assign users to your app" title="Assign access to your app"
confirmText="Done" confirmText="Done"
cancelText="Cancel" cancelText="Cancel"
onConfirm={() => addData(data)} onConfirm={() => addData(data)}

6
packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
View file

@ -192,7 +192,7 @@
<Layout noPadding gap="S"> <Layout noPadding gap="S">
<div class="title"> <div class="title">
<Heading size="S">Users</Heading> <Heading size="S">Users</Heading>
<Button secondary on:click={showUsersModal}>Assign user</Button> <Button cta on:click={showUsersModal}>Assign user</Button>
</div> </div>
<Table <Table
customPlaceholder customPlaceholder
@ -217,11 +217,11 @@
</Layout> </Layout>
{/if} {/if}
{#if $usersFetch.loaded && $licensing.groupsEnabled && appGroups.length} {#if $usersFetch.loaded && $licensing.groupsEnabled}
<Layout noPadding gap="S"> <Layout noPadding gap="S">
<div class="title"> <div class="title">
<Heading size="S">Groups</Heading> <Heading size="S">Groups</Heading>
<Button secondary on:click={showGroupsModal}>Assign group</Button> <Button cta on:click={showGroupsModal}>Assign group</Button>
</div> </div>
<Table <Table
customPlaceholder customPlaceholder

5
packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte
View file

@ -1,6 +1,5 @@
<script> <script>
import { import {
ActionButton,
Button, Button,
DatePicker, DatePicker,
Divider, Divider,
@ -246,9 +245,7 @@
/> />
</div> </div>
<div> <div>
<ActionButton on:click={modal.show} icon="SaveAsFloppy"> <Button cta on:click={modal.show}>Create new backup</Button>
Create new backup
</ActionButton>
</div> </div>
</div> </div>
<div class="table"> <div class="table">

1
packages/builder/src/pages/builder/portal/plugins/index.svelte
View file

@ -103,6 +103,7 @@
allowEditColumns={false} allowEditColumns={false}
allowEditRows={false} allowEditRows={false}
allowSelectRows={false} allowSelectRows={false}
allowClickRows={false}
{customRenderers} {customRenderers}
/> />
</Layout> </Layout>

2
packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
View file

@ -250,7 +250,7 @@
flex-direction: row; flex-direction: row;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
gap: var(--spacing-m); gap: var(--spacing-l);
} }
.header :global(.spectrum-Heading) { .header :global(.spectrum-Heading) {
flex: 1 1 auto; flex: 1 1 auto;

2
packages/builder/src/pages/builder/portal/users/users/[userId].svelte
View file

@ -389,6 +389,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
gap: var(--spacing-l);
} }
.tableTitle { .tableTitle {
display: flex; display: flex;
@ -396,7 +397,6 @@
align-items: flex-end; align-items: flex-end;
} }
.subtitle { .subtitle {
padding: 0 0 0 var(--spacing-m);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;