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

Rename general settings to organisation and add builder theme to Theming page, add password changing and user info changing to avatar dropdown

master
Andrew Kingston 5 years ago
parent
cc21ed354b
commit
e1c37752db
9 changed files with 66 additions and 107 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      packages/builder/src/components/settings/ChangePasswordModal.svelte
  2. 12
      packages/builder/src/components/settings/ThemeEditor.svelte
  3. 35
      packages/builder/src/components/settings/ThemeEditorDropdown.svelte
  4. 0
      packages/builder/src/components/settings/UpdateUserInfoModal.svelte
  5. 42
      packages/builder/src/components/start/BuilderSettingsModal.svelte
  6. 7
      packages/builder/src/pages/builder/apps/index.svelte
  7. 32
      packages/builder/src/pages/builder/portal/_layout.svelte
  8. 7
      packages/builder/src/pages/builder/portal/settings/organisation.svelte
  9. 36
      packages/builder/src/pages/builder/portal/settings/theming.svelte

2
packages/builder/src/pages/builder/apps/_components/ChangePasswordModal.svelte → packages/builder/src/components/settings/ChangePasswordModal.svelte
View File

@ -9,7 +9,7 @@
const updatePassword = async () => {
try {
await auth.updateSelf({ ...$auth.user, password })
notifications.success("Information updated successfully")
notifications.success("Password changed successfully")
} catch (error) {
notifications.error("Failed to update password")
}

12
packages/builder/src/components/settings/ThemeEditor.svelte
View File

@ -1,12 +0,0 @@
<script>
import { themeStore } from "builderStore"
import { Select } from "@budibase/bbui"
import { capitalise } from "../../helpers"
</script>
<Select
options={$themeStore.options}
bind:value={$themeStore.theme}
placeholder={null}
getOptionLabel={capitalise}
/>

35
packages/builder/src/components/settings/ThemeEditorDropdown.svelte
View File

@ -1,35 +0,0 @@
<script>
import { Icon, Label, Modal, ModalContent } from "@budibase/bbui"
import ThemeEditor from "./ThemeEditor.svelte"
let modal
</script>
<div class="topnavitemright" on:click={modal.show}>
<Icon hoverable name="ColorFill" />
</div>
<Modal bind:this={modal}>
<ModalContent
title="Builder Theme"
confirmText="Done"
showCancelButton={false}
>
<ThemeEditor />
</ModalContent>
</Modal>
<style>
.topnavitemright {
cursor: pointer;
color: var(--grey-7);
margin: 0 12px 0 0;
font-weight: 500;
font-size: 1rem;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
height: 24px;
width: 24px;
}
</style>

0
packages/builder/src/pages/builder/apps/_components/UpdateUserInfoModal.svelte → packages/builder/src/components/settings/UpdateUserInfoModal.svelte
View File

42
packages/builder/src/components/start/BuilderSettingsModal.svelte
View File

@ -1,42 +0,0 @@
<script>
import {
Heading,
Divider,
notifications,
ModalContent,
Toggle,
Body,
} from "@budibase/bbui"
import ThemeEditor from "components/settings/ThemeEditor.svelte"
import analytics from "analytics"
$: analyticsDisabled = analytics.disabled()
async function save() {
notifications.success(`Settings saved.`)
}
function toggleAnalytics() {
if (analyticsDisabled) {
analytics.optIn()
} else {
analytics.optOut()
}
}
</script>
<ModalContent title="Builder settings" confirmText="Save" onConfirm={save}>
<Heading size="XS">Theme</Heading>
<ThemeEditor />
<Divider noMargin noGrid />
<Heading size="XS">Analytics</Heading>
<Body size="S">
If you would like to send analytics that help us make budibase better,
please let us know below.
</Body>
<Toggle
text="Send Analytics To Budibase"
value={!analyticsDisabled}
on:change={toggleAnalytics}
/>
</ModalContent>

7
packages/builder/src/pages/builder/apps/index.svelte
View File

@ -17,8 +17,8 @@
import { goto } from "@roxi/routify"
import { AppStatus } from "constants"
import { gradient } from "actions"
import UpdateUserInfoModal from "./_components/UpdateUserInfoModal.svelte"
import ChangePasswordModal from "./_components/ChangePasswordModal.svelte"
import UpdateUserInfoModal from "components/settings/UpdateUserInfoModal.svelte"
import ChangePasswordModal from "components/settings/ChangePasswordModal.svelte"
let loaded = false
let userInfoModal
@ -31,10 +31,11 @@
})
</script>
{#if loaded}
{#if $auth.user && loaded}
<div class="container">
<Page>
<div class="content">
asdas
<Layout noPadding>
<img src={$organisation.logoUrl} />
<div class="info-title">

32
packages/builder/src/pages/builder/portal/_layout.svelte
View File

@ -13,11 +13,13 @@
} from "@budibase/bbui"
import ConfigChecklist from "components/common/ConfigChecklist.svelte"
import { organisation, auth } from "stores/portal"
import BuilderSettingsModal from "components/start/BuilderSettingsModal.svelte"
import { onMount } from "svelte"
import UpdateUserInfoModal from "components/settings/UpdateUserInfoModal.svelte"
import ChangePasswordModal from "components/settings/ChangePasswordModal.svelte"
let oldSettingsModal
let loaded = false
let userInfoModal
let changePasswordModal
const menu = [
{ title: "Apps", href: "/builder/portal/apps" },
@ -25,12 +27,11 @@
{ title: "Auth", href: "/builder/portal/manage/auth" },
{ title: "Email", href: "/builder/portal/manage/email" },
{
title: "General",
href: "/builder/portal/settings/general",
title: "Organisation",
href: "/builder/portal/settings/organisation",
heading: "Settings",
},
{ title: "Theming", href: "/builder/portal/theming" },
{ title: "Account", href: "/builder/portal/account" },
{ title: "Theming", href: "/builder/portal/settings/theming" },
]
onMount(async () => {
@ -44,7 +45,7 @@
})
</script>
{#if loaded}
{#if $auth.user && loaded}
<div class="container">
<div class="nav">
<Layout paddingX="L" paddingY="L">
@ -77,8 +78,14 @@
<Avatar size="M" name="John Doe" />
<Icon size="XL" name="ChevronDown" />
</div>
<MenuItem icon="Settings" on:click={oldSettingsModal.show}>
Old settings
<MenuItem icon="UserEdit" on:click={() => userInfoModal.show()}>
Update user information
</MenuItem>
<MenuItem
icon="LockClosed"
on:click={() => changePasswordModal.show()}
>
Update password
</MenuItem>
<MenuItem icon="UserDeveloper" on:click={() => $goto("../apps")}>
Close developer mode
@ -91,8 +98,11 @@
</div>
</div>
</div>
<Modal bind:this={oldSettingsModal} width="30%">
<BuilderSettingsModal />
<Modal bind:this={userInfoModal}>
<UpdateUserInfoModal />
</Modal>
<Modal bind:this={changePasswordModal}>
<ChangePasswordModal />
</Modal>
{/if}

7
packages/builder/src/pages/builder/portal/settings/general.svelte → packages/builder/src/pages/builder/portal/settings/organisation.svelte
View File

@ -66,10 +66,11 @@
<Layout>
<Layout gap="XS" noPadding>
<Heading size="M">General</Heading>
<Heading size="M">Organisation</Heading>
<Body>
General is the place where you edit your organisation name, logo. You can
also configure your platform URL as well as turn on or off analytics.
Organisation settings is where you can edit your organisation name and
logo. You can also configure your platform URL and enable or disable
analytics.
</Body>
</Layout>
<Divider size="S" />

36
packages/builder/src/pages/builder/portal/settings/theming.svelte
View File

@ -0,0 +1,36 @@
<script>
import { Layout, Heading, Body, Divider, Label, Select } from "@budibase/bbui"
import { themeStore } from "builderStore"
import { capitalise } from "helpers"
</script>
<Layout>
<Layout gap="XS" noPadding>
<Heading size="M">Theming</Heading>
<Body>Customize how Budibase looks and feels.</Body>
</Layout>
<Divider size="S" />
<div class="fields">
<div class="field">
<Label size="L">Builder theme</Label>
<Select
options={$themeStore.options}
bind:value={$themeStore.theme}
placeholder={null}
getOptionLabel={capitalise}
/>
</div>
</div>
</Layout>
<style>
.fields {
display: grid;
grid-gap: var(--spacing-m);
}
.field {
display: grid;
grid-template-columns: 33% 1fr;
align-items: center;
}
</style>
Write Preview
Loading…
Cancel
Save