Implement new admin get self endpoint, move auth store to the portal, and implement working password changing and name changing

5 years ago · 66fd0d0016
17 changed files with 76 additions and 58 deletions
--- a/packages/builder/src/components/login/ForgotForm.svelte
+++ b/packages/builder/src/components/login/ForgotForm.svelte
@ -7,8 +7,7 @@
    Body,
    Heading,
  } from "@budibase/bbui"
-  import { organisation } from "stores/portal"
-  import { auth } from "stores/backend"
+  import { organisation, auth } from "stores/portal"

  let email = ""

--- a/packages/builder/src/components/login/LoginForm.svelte
+++ b/packages/builder/src/components/login/LoginForm.svelte
@ -11,8 +11,7 @@
    Heading,
  } from "@budibase/bbui"
  import GoogleButton from "./GoogleButton.svelte"
-  import { auth } from "stores/backend"
-  import { organisation } from "stores/portal"
+  import { organisation, auth } from "stores/portal"

  let username = ""
  let password = ""
--- a/packages/builder/src/components/login/ResetForm.svelte
+++ b/packages/builder/src/components/login/ResetForm.svelte
@ -1,9 +1,8 @@
 <script>
  import { notifications, Button, Layout, Body, Heading } from "@budibase/bbui"
-  import { organisation } from "stores/portal"
+  import { organisation, auth } from "stores/portal"
  import PasswordRepeatInput from "components/common/users/PasswordRepeatInput.svelte"
  import { params, goto } from "@roxi/routify"
-  import { auth } from "stores/backend"

  const resetCode = $params["?code"]
  let password, error
--- a/packages/builder/src/components/start/AppCard.svelte
+++ b/packages/builder/src/components/start/AppCard.svelte
@ -6,12 +6,9 @@
    Layout,
    ActionMenu,
    MenuItem,
-    Link,
  } from "@budibase/bbui"
  import { gradient } from "actions"
-  import { AppStatus } from "constants"
-  import { url } from "@roxi/routify"
-  import { auth } from "stores/backend"
+  import { auth } from "stores/portal"

  export let app
  export let exportApp
--- a/packages/builder/src/components/start/AppRow.svelte
+++ b/packages/builder/src/components/start/AppRow.svelte
@ -1,7 +1,7 @@
 <script>
  import { gradient } from "actions"
  import { Heading, Button, Icon, ActionMenu, MenuItem } from "@budibase/bbui"
-  import { auth } from "stores/backend"
+  import { auth } from "stores/portal"

  export let app
  export let openApp
--- a/packages/builder/src/pages/builder/_layout.svelte
+++ b/packages/builder/src/pages/builder/_layout.svelte
@ -1,8 +1,7 @@
 <script>
  import { onMount } from "svelte"
  import { isActive, redirect } from "@roxi/routify"
-  import { auth } from "stores/backend"
-  import { admin } from "stores/portal"
+  import { admin, auth } from "stores/portal"

  let loaded = false
  $: hasAdminUser = !!$admin?.checklist?.adminUser
--- a/packages/builder/src/pages/builder/app/_layout.svelte
+++ b/packages/builder/src/pages/builder/app/_layout.svelte
@ -1,5 +1,5 @@
 <script>
-  import { auth } from "stores/backend"
+  import { auth } from "stores/portal"
 </script>

 {#if $auth.user}
--- a/packages/builder/src/pages/builder/apps/_components/ChangePasswordModal.svelte
+++ b/packages/builder/src/pages/builder/apps/_components/ChangePasswordModal.svelte
@ -1,12 +1,18 @@
 <script>
  import { ModalContent, Body, notifications } from "@budibase/bbui"
  import PasswordRepeatInput from "components/common/users/PasswordRepeatInput.svelte"
+  import { auth } from "stores/portal"

  let password
  let error

  const updatePassword = async () => {
-    // Update password
+    try {
+      await auth.updateSelf({ ...$auth.user, password })
+      notifications.success("Information updated successfully")
+    } catch (error) {
+      notifications.error("Failed to update password")
+    }
  }
 </script>

@ -14,7 +20,7 @@
  title="Change password"
  confirmText="Update password"
  onConfirm={updatePassword}
-  disabled={error}
+  disabled={error || !password}
 >
  <Body size="S">Enter your new password below.</Body>
  <PasswordRepeatInput bind:password bind:error />
--- a/packages/builder/src/pages/builder/apps/_components/UpdateUserInfoModal.svelte
+++ b/packages/builder/src/pages/builder/apps/_components/UpdateUserInfoModal.svelte
@ -1,7 +1,7 @@
 <script>
-  import { ModalContent, Body, Input } from "@budibase/bbui"
+  import { ModalContent, Body, Input, notifications } from "@budibase/bbui"
  import { writable } from "svelte/store"
-  import { auth } from "stores/backend"
+  import { auth } from "stores/portal"

  const values = writable({
    firstName: $auth.user.firstName,
@ -9,7 +9,12 @@
  })

  const updateInfo = async () => {
-    // Update name
+    try {
+      await auth.updateSelf({ ...$auth.user, ...$values })
+      notifications.success("Information updated successfully")
+    } catch (error) {
+      notifications.error("Failed to update information")
+    }
  }
 </script>

--- a/packages/builder/src/pages/builder/apps/_layout.svelte
+++ b/packages/builder/src/pages/builder/apps/_layout.svelte
@ -1,5 +1,5 @@
 <script>
-  import { auth } from "stores/backend"
+  import { auth } from "stores/portal"
 </script>

 {#if $auth.user}
--- a/packages/builder/src/pages/builder/apps/index.svelte
+++ b/packages/builder/src/pages/builder/apps/index.svelte
@ -13,8 +13,7 @@
    Modal,
  } from "@budibase/bbui"
  import { onMount } from "svelte"
-  import { apps, organisation } from "stores/portal"
-  import { auth } from "stores/backend"
+  import { apps, organisation, auth } from "stores/portal"
  import { goto } from "@roxi/routify"
  import { AppStatus } from "constants"
  import { gradient } from "actions"
@ -73,36 +72,45 @@
            </ActionMenu>
          </div>
          <Divider />
-          <div class="apps-title">
-            <Heading>Apps</Heading>
-            <Select placeholder="Filter by groups" />
-          </div>
-          <div class="group">
-            <Layout gap="S" noPadding>
-              <div class="group-title">
-                <Body weight="500" size="XS">GROUP</Body>
-                {#if $auth.user?.builder?.global}
-                  <Icon
-                    name="Settings"
-                    hoverable
-                    on:click={() => alert("Navigate to portal group page.")}
-                  />
-                {/if}
-              </div>
-              {#each $apps as app, idx (app.appId)}
-                <a class="app" target="_blank" href={`/${app.appId}`}>
-                  <div class="preview" use:gradient={{ seed: app.name }} />
-                  <div class="app-info">
-                    <Heading size="XS">{app.name}</Heading>
-                    <Body size="S">
-                      Edited {Math.round(Math.random() * 10 + 1)} months ago
-                    </Body>
-                  </div>
-                  <Icon name="ChevronRight" />
-                </a>
-              {/each}
+          {#if $apps.length}
+            <div class="apps-title">
+              <Heading>Apps</Heading>
+              <Select placeholder="Filter by groups" />
+            </div>
+            <div class="group">
+              <Layout gap="S" noPadding>
+                <div class="group-title">
+                  <Body weight="500" size="XS">GROUP</Body>
+                  {#if $auth.user?.builder?.global}
+                    <Icon
+                      name="Settings"
+                      hoverable
+                      on:click={() => alert("Navigate to portal group page.")}
+                    />
+                  {/if}
+                </div>
+                {#each $apps as app, idx (app.appId)}
+                  <a class="app" target="_blank" href={`/${app.appId}`}>
+                    <div class="preview" use:gradient={{ seed: app.name }} />
+                    <div class="app-info">
+                      <Heading size="XS">{app.name}</Heading>
+                      <Body size="S">
+                        Edited {Math.round(Math.random() * 10 + 1)} months ago
+                      </Body>
+                    </div>
+                    <Icon name="ChevronRight" />
+                  </a>
+                {/each}
+              </Layout>
+            </div>
+          {:else}
+            <Layout gap="XS" noPadding>
+              <Heading size="S">You don't have access to any apps yet.</Heading>
+              <Body size="S"
+                >The apps you have access to will be listed here.</Body
+              >
            </Layout>
-          </div>
+          {/if}
        </Layout>
      </div>
    </Page>
--- a/packages/builder/src/pages/builder/index.svelte
+++ b/packages/builder/src/pages/builder/index.svelte
@ -1,6 +1,6 @@
 <script>
  import { redirect } from "@roxi/routify"
-  import { auth } from "stores/backend"
+  import { auth } from "stores/portal"

  $: {
    if (!$auth.user) {
--- a/packages/builder/src/pages/builder/portal/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/_layout.svelte
@ -12,8 +12,7 @@
    Modal,
  } from "@budibase/bbui"
  import ConfigChecklist from "components/common/ConfigChecklist.svelte"
-  import { organisation } from "stores/portal"
-  import { auth } from "stores/backend"
+  import { organisation, auth } from "stores/portal"
  import BuilderSettingsModal from "components/start/BuilderSettingsModal.svelte"
  import { onMount } from "svelte"

--- a/packages/builder/src/pages/builder/portal/apps/index.svelte
+++ b/packages/builder/src/pages/builder/portal/apps/index.svelte
@ -17,8 +17,7 @@
  import api, { del } from "builderStore/api"
  import analytics from "analytics"
  import { onMount } from "svelte"
-  import { apps } from "stores/portal"
-  import { auth } from "stores/backend"
+  import { apps, auth } from "stores/portal"
  import download from "downloadjs"
  import { goto } from "@roxi/routify"
  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
--- a/packages/builder/src/stores/backend/index.js
+++ b/packages/builder/src/stores/backend/index.js
@ -7,4 +7,3 @@ export { roles } from "./roles"
 export { datasources } from "./datasources"
 export { integrations } from "./integrations"
 export { queries } from "./queries"
-export { auth } from "./auth"
--- a/packages/builder/src/stores/backend/auth.js
+++ b/packages/builder/src/stores/backend/auth.js
@ -7,7 +7,7 @@ export function createAuthStore() {
  return {
    subscribe: store.subscribe,
    checkAuth: async () => {
-      const response = await api.get("/api/self")
+      const response = await api.get("/api/admin/users/self")
      const user = await response.json()
      if (response.status === 200) {
        store.update(state => ({ ...state, user }))
@ -33,6 +33,14 @@ export function createAuthStore() {
      await response.json()
      store.update(state => ({ ...state, user: null }))
    },
+    updateSelf: async user => {
+      const response = await api.post("/api/admin/users/self", user)
+      if (response.status === 200) {
+        store.update(state => ({ ...state, user: { ...state.user, ...user } }))
+      } else {
+        throw "Unable to update user details"
+      }
+    },
    forgotPassword: async email => {
      const response = await api.post(`/api/admin/auth/reset`, {
        email,
--- a/packages/builder/src/stores/portal/index.js
+++ b/packages/builder/src/stores/portal/index.js
@ -3,3 +3,4 @@ export { users } from "./users"
 export { admin } from "./admin"
 export { apps } from "./apps"
 export { email } from "./email"
+export { auth } from "./auth"