merge, UI for managing your own app locks

5 years ago · 4a4c96f76d
5 changed files with 39 additions and 51 deletions
--- a/packages/bbui/src/Link/Link.svelte
+++ b/packages/bbui/src/Link/Link.svelte
@ -11,6 +11,7 @@
 </script>

 <a
+  on:click
  {href}
  {target}
  class:spectrum-Link--primary={primary}
--- a/packages/builder/src/components/start/AppCard.svelte
+++ b/packages/builder/src/components/start/AppCard.svelte
@ -11,27 +11,21 @@
  import { gradient } from "actions"
  import { AppStatus } from "constants"
  import { url } from "@roxi/routify"
+  import { auth } from "stores/backend"

  export let app
  export let exportApp
+  export let openApp
  export let deleteApp
-  export let appStatus
-
-  let href =
-    appStatus === AppStatus.DEV ? $url(`../../app/${app._id}`) : `/${app._id}`
-  let target = appStatus === AppStatus.DEV ? "_self" : "_target"
+  export let releaseLock
 </script>

 <div class="wrapper">
  <Layout noPadding gap="XS" alignContent="start">
    <div class="preview" use:gradient={{ seed: app.name }} />
    <div class="title">
-      <Link {href} {target}>
+      <Link on:click={() => openApp(app)}>
        <Heading size="XS">
-<<<<<<< HEAD
-          {app._id}
-=======
->>>>>>> c3e1b1d30235b8945424cf59a41e112f92942dc6
          {app.name}
        </Heading>
      </Link>
@ -43,14 +37,18 @@
        <MenuItem on:click={() => deleteApp(app)} icon="Delete">
          Delete
        </MenuItem>
-        <MenuItem on:click={() => deleteApp(app)} icon="Code">Develop</MenuItem>
+        {#if app.lockedBy && app.lockedBy?.email === $auth.user?.email}
+          <MenuItem on:click={() => releaseLock(app._id)} icon="LockOpen">
+            Release Lock
+          </MenuItem>
+        {/if}
      </ActionMenu>
    </div>
    <div class="status">
      <Body noPadding size="S">
        Edited {Math.floor(1 + Math.random() * 10)} months ago
      </Body>
-      {#if appStatus === AppStatus.DEV && app.lockedBy}
+      {#if app.lockedBy}
        <Icon name="LockClosed" />
      {/if}
    </div>
--- a/packages/builder/src/components/start/AppRow.svelte
+++ b/packages/builder/src/components/start/AppRow.svelte
@ -10,6 +10,7 @@
  } from "@budibase/bbui"
  import { AppStatus } from "constants"
  import { url } from "@roxi/routify"
+  import { auth } from "stores/backend"

  export let app
  export let openApp
@ -17,6 +18,7 @@
  export let deleteApp
  export let last
  export let appStatus
+  export let releaseLock

  let href =
    appStatus === AppStatus.DEV ? $url(`../../app/${app._id}`) : `/${app._id}`
@ -49,6 +51,11 @@
    <Icon hoverable slot="control" name="More" />
    <MenuItem on:click={() => exportApp(app)} icon="Download">Export</MenuItem>
    <MenuItem on:click={() => deleteApp(app)} icon="Delete">Delete</MenuItem>
+    {#if app.lockedBy && app.lockedBy?.email === $auth.user?.email}
+      <MenuItem on:click={() => releaseLock(app._id)} icon="LockOpen">
+        Release Lock
+      </MenuItem>
+    {/if}
  </ActionMenu>
 </div>

--- a/packages/builder/src/pages/builder/portal/apps/index.svelte
+++ b/packages/builder/src/pages/builder/portal/apps/index.svelte
@ -23,6 +23,7 @@
  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
  import AppCard from "components/start/AppCard.svelte"
  import AppRow from "components/start/AppRow.svelte"
+  import { AppStatus } from "constants"

  let layout = "grid"
  let appStatus = "deployed"
@ -60,7 +61,11 @@
  }

  const openApp = app => {
-    $goto(`../../app/${app._id}`)
+    if (appStatus === AppStatus.DEV) {
+      $goto(`../../app/${app._id}`)
+    } else {
+      window.open(`/${app._id}`, '_blank');
+    }
  }

  const exportApp = app => {
@ -91,6 +96,19 @@
    appToDelete = null
  }

+  const releaseLock = async appId => {
+    try {
+      const response = await del(`/api/dev/${appId}/lock`)
+      const json = await response.json()
+      if (json.status !== 200) throw json.message
+
+      notifications.success("Lock released")
+      await apps.load(appStatus)
+    } catch (err) {
+      notifications.error(`Error releasing lock: ${err}`)
+    }
+  }
+
  onMount(async () => {
    checkKeys()
    await apps.load(appStatus)
@ -99,41 +117,6 @@
 </script>

 <Page wide>
-<<<<<<< HEAD
-  {#if $apps.length}
-    <Layout noPadding>
-      <div class="title">
-        <Heading>Apps</Heading>
-        <ButtonGroup>
-          <Button secondary on:click={initiateAppImport}>Import app</Button>
-          <Button cta on:click={initiateAppCreation}>Create new app</Button>
-        </ButtonGroup>
-      </div>
-      <div class="filter">
-        <div class="select">
-          <Select
-            bind:value={appStatus}
-            options={[
-              { label: "Deployed", value: "deployed" },
-              { label: "In Development", value: "dev" },
-            ]}
-          />
-        </div>
-        <ActionGroup>
-          <ActionButton
-            on:click={() => (layout = "grid")}
-            selected={layout === "grid"}
-            quiet
-            icon="ClassicGridView"
-          />
-          <ActionButton
-            on:click={() => (layout = "table")}
-            selected={layout === "table"}
-            quiet
-            icon="ViewRow"
-          />
-        </ActionGroup>
-=======
  <Layout noPadding>
    <div class="title">
      <Heading>Apps</Heading>
@ -151,7 +134,6 @@
            { label: "In Development", value: "dev" },
          ]}
        />
->>>>>>> c3e1b1d30235b8945424cf59a41e112f92942dc6
      </div>
      <ActionGroup>
        <ActionButton
@ -176,7 +158,7 @@
        {#each $apps as app, idx (app._id)}
          <svelte:component
            this={layout === "grid" ? AppCard : AppRow}
-            {appStatus}
+            {releaseLock}
            {app}
            {openApp}
            {exportApp}
--- a/packages/server/src/api/controllers/dev.js
+++ b/packages/server/src/api/controllers/dev.js
@ -40,7 +40,7 @@ exports.removeLock = async ctx => {
  try {
    await clearLock(appId, ctx.user)
  } catch (err) {
-    ctx.throw(400, "Unable to remove lock.")
+    ctx.throw(400, `Unable to remove lock. ${err}`)
  }
  ctx.body = {
    message: "Lock removed successfully.",