From 68ed6b635981ad8b5b392d6fadfbfacad2b97604 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:16:54 +0100 Subject: [PATCH 01/12] Update avatar to take initials prop and render text as uppercase --- packages/bbui/src/Avatar/Avatar.svelte | 13 +++---------- 1 file changed, 3 insertions(+), 10 deletions(-) diff --git a/packages/bbui/src/Avatar/Avatar.svelte b/packages/bbui/src/Avatar/Avatar.svelte index f4e42b28a3..e23c2fc360 100644 --- a/packages/bbui/src/Avatar/Avatar.svelte +++ b/packages/bbui/src/Avatar/Avatar.svelte @@ -12,15 +12,7 @@ export let size = "M" export let url = "" export let disabled = false - export let name = "John Doe" - - function getInitials(name) { - let parts = name.split(" ") - if (parts.length > 0) { - return parts.map(name => name[0]).join("") - } - return name - } + export let initials = "JD" {#if url} @@ -38,7 +30,7 @@ size )}); font-size: calc(var({sizes.get(size)}) / 2)" > - {getInitials(name)} + {initials || ""} {/if} @@ -52,5 +44,6 @@ border-radius: 50%; overflow: hidden; user-select: none; + text-transform: uppercase; } From bc8be04a321501dc8303a44fcb69abd79bf5a71a Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:17:09 +0100 Subject: [PATCH 02/12] Derive initials from user names and email address --- packages/builder/src/stores/portal/auth.js | 37 ++++++++++++++++------ 1 file changed, 27 insertions(+), 10 deletions(-) diff --git a/packages/builder/src/stores/portal/auth.js b/packages/builder/src/stores/portal/auth.js index c642a5708d..b6f7413a10 100644 --- a/packages/builder/src/stores/portal/auth.js +++ b/packages/builder/src/stores/portal/auth.js @@ -1,25 +1,42 @@ -import { writable } from "svelte/store" +import { derived, writable } from "svelte/store" import api from "../../builderStore/api" export function createAuthStore() { - const store = writable({ user: null }) + const user = writable(null) + const store = derived(user, $user => { + let initials = null + if ($user) { + if ($user.firstName) { + initials = $user.firstName[0] + if ($user.lastName) { + initials += $user.lastName[0] + } + } else { + initials = $user.email[0] + } + } + return { + user: $user, + initials, + } + }) return { subscribe: store.subscribe, checkAuth: async () => { const response = await api.get("/api/admin/users/self") if (response.status !== 200) { - store.update(state => ({ ...state, user: null })) + user.set(null) } else { - const user = await response.json() - store.update(state => ({ ...state, user })) + const json = await response.json() + user.set(json) } }, login: async creds => { const response = await api.post(`/api/admin/auth`, creds) const json = await response.json() if (response.status === 200) { - store.update(state => ({ ...state, user: json.user })) + user.set(json.user) } else { throw "Invalid credentials" } @@ -31,12 +48,12 @@ export function createAuthStore() { throw "Unable to create logout" } await response.json() - store.update(state => ({ ...state, user: null })) + user.set(null) }, - updateSelf: async user => { - const response = await api.post("/api/admin/users/self", user) + updateSelf: async newUser => { + const response = await api.post("/api/admin/users/self", newUser) if (response.status === 200) { - store.update(state => ({ ...state, user: { ...state.user, ...user } })) + user.update(state => ({ ...state, ...newUser })) } else { throw "Unable to update user details" } From 01b6c443ead915b1d5965109ed4e57c90d0abe52 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:17:35 +0100 Subject: [PATCH 03/12] Fix issue on hot reload when user object was null --- packages/builder/src/pages/builder/portal/apps/index.svelte | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/builder/src/pages/builder/portal/apps/index.svelte b/packages/builder/src/pages/builder/portal/apps/index.svelte index 1729efe101..7857cd658f 100644 --- a/packages/builder/src/pages/builder/portal/apps/index.svelte +++ b/packages/builder/src/pages/builder/portal/apps/index.svelte @@ -41,8 +41,8 @@ const enrichedApps = apps.map(app => ({ ...app, deployed: app.status === AppStatus.DEPLOYED, - lockedYou: app.lockedBy?.email === user.email, - lockedOther: app.lockedBy && app.lockedBy.email !== user.email, + lockedYou: app.lockedBy && app.lockedBy.email === user?.email, + lockedOther: app.lockedBy && app.lockedBy.email !== user?.email, })) if (sortBy === "status") { return enrichedApps.sort((a, b) => { From 4deedfc27c5db5a23ccfeecd6d037f8d4ad6a3c8 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:17:45 +0100 Subject: [PATCH 04/12] Update user avatar to use correct initials --- packages/builder/src/pages/builder/apps/index.svelte | 2 +- packages/builder/src/pages/builder/portal/_layout.svelte | 3 +-- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/builder/src/pages/builder/apps/index.svelte b/packages/builder/src/pages/builder/apps/index.svelte index ef7c54a8da..7311c112b8 100644 --- a/packages/builder/src/pages/builder/apps/index.svelte +++ b/packages/builder/src/pages/builder/apps/index.svelte @@ -51,7 +51,7 @@
- +
userInfoModal.show()}> diff --git a/packages/builder/src/pages/builder/portal/_layout.svelte b/packages/builder/src/pages/builder/portal/_layout.svelte index 50901fa36c..fb488c58d7 100644 --- a/packages/builder/src/pages/builder/portal/_layout.svelte +++ b/packages/builder/src/pages/builder/portal/_layout.svelte @@ -3,7 +3,6 @@ import { Icon, Avatar, - Search, Layout, SideNavigation as Navigation, SideNavigationItem as Item, @@ -77,7 +76,7 @@
- +
userInfoModal.show()}> From 7ed13d2b4cc2c8383d8a63bb9e891f7cf84d4e34 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:27:27 +0100 Subject: [PATCH 05/12] Allow enter keypress to submit login form --- packages/bbui/src/Form/Core/TextField.svelte | 1 + packages/bbui/src/Form/Input.svelte | 1 + packages/builder/src/components/login/LoginForm.svelte | 9 ++++++++- 3 files changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/bbui/src/Form/Core/TextField.svelte b/packages/bbui/src/Form/Core/TextField.svelte index e1793c74a6..650aee4f82 100644 --- a/packages/bbui/src/Form/Core/TextField.svelte +++ b/packages/bbui/src/Form/Core/TextField.svelte @@ -82,6 +82,7 @@ on:blur on:focus on:input + on:keyup on:blur={onBlur} on:focus={onFocus} on:input={onInput} diff --git a/packages/bbui/src/Form/Input.svelte b/packages/bbui/src/Form/Input.svelte index fcab178182..1d98982b4f 100644 --- a/packages/bbui/src/Form/Input.svelte +++ b/packages/bbui/src/Form/Input.svelte @@ -34,5 +34,6 @@ on:input on:blur on:focus + on:keyup /> diff --git a/packages/builder/src/components/login/LoginForm.svelte b/packages/builder/src/components/login/LoginForm.svelte index f3ecf5397b..b5ec67da8c 100644 --- a/packages/builder/src/components/login/LoginForm.svelte +++ b/packages/builder/src/components/login/LoginForm.svelte @@ -33,6 +33,12 @@ notifications.error("Invalid credentials") } } + + const submitOnEnter = e => { + if (e.key === "Enter") { + login() + } + } From ba45481cd7aea89a2e02138c9d2e0f3b8ceb34e6 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:46:13 +0100 Subject: [PATCH 07/12] Add readable labels to Google oauth fields --- .../src/pages/builder/portal/manage/auth/index.svelte | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/packages/builder/src/pages/builder/portal/manage/auth/index.svelte b/packages/builder/src/pages/builder/portal/manage/auth/index.svelte index 9718e14681..86137fddf8 100644 --- a/packages/builder/src/pages/builder/portal/manage/auth/index.svelte +++ b/packages/builder/src/pages/builder/portal/manage/auth/index.svelte @@ -4,7 +4,6 @@ Button, Heading, Divider, - Page, Label, notifications, Layout, @@ -23,6 +22,13 @@ const ConfigFields = { Google: ["clientID", "clientSecret", "callbackURL"], } + const ConfigLabels = { + Google: { + clientID: "Client ID", + clientSecret: "Client secret", + callbackURL: "Callback URL", + }, + } let google @@ -85,7 +91,7 @@ {#each ConfigFields.Google as field}
- +
{/each} From 2c1c407e812022ffe739f9b80c4ad9cbce075605 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:49:25 +0100 Subject: [PATCH 08/12] Fix small typo in user details page --- .../src/pages/builder/portal/manage/users/[userId].svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte b/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte index bbd2e079e0..8895aa73a9 100644 --- a/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte +++ b/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte @@ -84,7 +84,7 @@ User: {$userFetch?.data?.email} Change user settings and update their app roles. Also contains the ability - to delete the user as well as force reset their password.. + to delete the user as well as force reset their password. From 1d9ef7f3bf29abbe3bf7137a1803bd1ecfc24dfe Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:55:17 +0100 Subject: [PATCH 09/12] Fix styles of tag renderer to make it readable but remove hover state --- .../_components/TagsTableRenderer.svelte | 33 +++++++++++++------ 1 file changed, 23 insertions(+), 10 deletions(-) diff --git a/packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte b/packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte index b83a46fe2e..eab0ccd19c 100644 --- a/packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte +++ b/packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte @@ -9,13 +9,26 @@ $: leftover = roles.length - tags.length - - {#each tags as tag} - - {tag} - - {/each} - {#if leftover} - +{leftover} more - {/if} - +
+ + {#each tags as tag} + + {tag} + + {/each} + {#if leftover} + +{leftover} more + {/if} + +
+ + From 152a2d921b663b78af6efaf961d31f6ba98b4911 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 13:56:18 +0100 Subject: [PATCH 10/12] Remove question mark from field label --- .../src/pages/builder/portal/manage/users/[userId].svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte b/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte index 8895aa73a9..0fa89bad52 100644 --- a/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte +++ b/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte @@ -108,7 +108,7 @@
- + Date: Fri, 21 May 2021 15:23:39 +0100 Subject: [PATCH 11/12] Change update self method to automatically merge new fields with existing user object --- .../src/components/settings/ChangePasswordModal.svelte | 2 +- .../src/components/settings/UpdateUserInfoModal.svelte | 2 +- packages/builder/src/pages/builder/auth/reset.svelte | 1 - packages/builder/src/stores/portal/auth.js | 7 ++++--- 4 files changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/builder/src/components/settings/ChangePasswordModal.svelte b/packages/builder/src/components/settings/ChangePasswordModal.svelte index d78c4c7efd..358e238092 100644 --- a/packages/builder/src/components/settings/ChangePasswordModal.svelte +++ b/packages/builder/src/components/settings/ChangePasswordModal.svelte @@ -8,7 +8,7 @@ const updatePassword = async () => { try { - await auth.updateSelf({ ...$auth.user, password }) + await auth.updateSelf({ password }) notifications.success("Password changed successfully") } catch (error) { notifications.error("Failed to update password") diff --git a/packages/builder/src/components/settings/UpdateUserInfoModal.svelte b/packages/builder/src/components/settings/UpdateUserInfoModal.svelte index 61446f0c00..96e2aa3743 100644 --- a/packages/builder/src/components/settings/UpdateUserInfoModal.svelte +++ b/packages/builder/src/components/settings/UpdateUserInfoModal.svelte @@ -10,7 +10,7 @@ const updateInfo = async () => { try { - await auth.updateSelf({ ...$auth.user, ...$values }) + await auth.updateSelf($values) notifications.success("Information updated successfully") } catch (error) { notifications.error("Failed to update information") diff --git a/packages/builder/src/pages/builder/auth/reset.svelte b/packages/builder/src/pages/builder/auth/reset.svelte index da7e2a7073..2287ee5ca0 100644 --- a/packages/builder/src/pages/builder/auth/reset.svelte +++ b/packages/builder/src/pages/builder/auth/reset.svelte @@ -13,7 +13,6 @@ try { if (forceResetPassword) { await auth.updateSelf({ - ...$auth.user, password, forceResetPassword: false, }) diff --git a/packages/builder/src/stores/portal/auth.js b/packages/builder/src/stores/portal/auth.js index b6f7413a10..517aad9fc4 100644 --- a/packages/builder/src/stores/portal/auth.js +++ b/packages/builder/src/stores/portal/auth.js @@ -1,4 +1,4 @@ -import { derived, writable } from "svelte/store" +import { derived, writable, get } from "svelte/store" import api from "../../builderStore/api" export function createAuthStore() { @@ -50,10 +50,11 @@ export function createAuthStore() { await response.json() user.set(null) }, - updateSelf: async newUser => { + updateSelf: async fields => { + const newUser = { ...get(user), ...fields } const response = await api.post("/api/admin/users/self", newUser) if (response.status === 200) { - user.update(state => ({ ...state, ...newUser })) + user.set(newUser) } else { throw "Unable to update user details" } From 9f990584522993dcd1dae14a8439bc1f8722dd68 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 21 May 2021 15:44:27 +0100 Subject: [PATCH 12/12] Revert login on enter --- packages/builder/src/pages/builder/auth/login.svelte | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/packages/builder/src/pages/builder/auth/login.svelte b/packages/builder/src/pages/builder/auth/login.svelte index 043bbd6f04..076813b6e9 100644 --- a/packages/builder/src/pages/builder/auth/login.svelte +++ b/packages/builder/src/pages/builder/auth/login.svelte @@ -38,12 +38,6 @@ notifications.error("Invalid credentials") } } - - const submitOnEnter = e => { - if (e.key === "Enter") { - login() - } - }