Merge pull request #13116 from Budibase/feature/app-list-actions

App list actions

packages/backend-core/src/events/publishers/app.ts

@@ -13,6 +13,7 @@ import {
   AppVersionRevertedEvent,
   AppRevertedEvent,
   AppExportedEvent,
+  AppDuplicatedEvent,
 } from "@budibase/types"
 
 const created = async (app: App, timestamp?: string | number) => {
@@ -77,6 +78,17 @@ async function fileImported(app: App) {
   await publishEvent(Event.APP_FILE_IMPORTED, properties)
 }
 
+async function duplicated(app: App, duplicateAppId: string) {
+  const properties: AppDuplicatedEvent = {
+    duplicateAppId,
+    appId: app.appId,
+    audited: {
+      name: app.name,
+    },
+  }
+  await publishEvent(Event.APP_DUPLICATED, properties)
+}
+
 async function templateImported(app: App, templateKey: string) {
   const properties: AppTemplateImportedEvent = {
     appId: app.appId,
@@ -147,6 +159,7 @@ export default {
   published,
   unpublished,
   fileImported,
+  duplicated,
   templateImported,
   versionUpdated,
   versionReverted,

packages/backend-core/tests/core/utilities/mocks/events.ts

@@ -15,6 +15,7 @@ beforeAll(async () => {
 
   jest.spyOn(events.app, "created")
   jest.spyOn(events.app, "updated")
+  jest.spyOn(events.app, "duplicated")
   jest.spyOn(events.app, "deleted")
   jest.spyOn(events.app, "published")
   jest.spyOn(events.app, "unpublished")

packages/bbui/src/ActionMenu/ActionMenu.svelte

@@ -38,7 +38,7 @@
 <div use:getAnchor on:click={openMenu}>
   <slot name="control" />
 </div>
-<Popover bind:this={dropdown} {anchor} {align} {portalTarget}>
+<Popover bind:this={dropdown} {anchor} {align} {portalTarget} on:open on:close>
   <Menu>
     <slot />
   </Menu>

packages/builder/src/components/common/NavItem.svelte

@@ -71,6 +71,7 @@
   class:scrollable
   class:highlighted
   class:selectedBy
+  class:actionsOpen={highlighted && withActions}
   on:dragend
   on:dragstart
   on:dragover
@@ -168,8 +169,9 @@
     --avatars-background: var(--spectrum-global-color-gray-300);
   }
   .nav-item:hover .actions,
-  .hovering .actions {
-    visibility: visible;
+  .hovering .actions,
+  .nav-item.withActions.actionsOpen .actions {
+    opacity: 1;
   }
   .nav-item-content {
     flex: 1 1 auto;
@@ -272,7 +274,6 @@
     position: relative;
     display: grid;
     place-items: center;
-    visibility: hidden;
     order: 3;
     opacity: 0;
     width: 20px;

packages/builder/src/components/deploy/DeleteModal.svelte

@@ -3,9 +3,16 @@
   import { goto } from "@roxi/routify"
   import ConfirmDialog from "components/common/ConfirmDialog.svelte"
   import { apps } from "stores/portal"
-  import { appStore } from "stores/builder"
   import { API } from "api"
 
+  export let appId
+  export let appName
+  export let onDeleteSuccess = () => {
+    $goto("/builder")
+  }
+
+  let deleting = false
+
   export const show = () => {
     deletionModal.show()
   }
@@ -17,32 +24,52 @@
   let deletionModal
   let deletionConfirmationAppName
 
+  const copyName = () => {
+    deletionConfirmationAppName = appName
+  }
+
   const deleteApp = async () => {
+    if (!appId) {
+      console.error("No app id provided")
+      return
+    }
+    deleting = true
     try {
-      await API.deleteApp($appStore.appId)
+      await API.deleteApp(appId)
       apps.load()
       notifications.success("App deleted successfully")
-      $goto("/builder")
+      onDeleteSuccess()
     } catch (err) {
       notifications.error("Error deleting app")
+      deleting = false
     }
   }
 </script>
 
+<!-- svelte-ignore a11y-click-events-have-key-events -->
 <ConfirmDialog
   bind:this={deletionModal}
   title="Delete app"
   okText="Delete"
   onOk={deleteApp}
   onCancel={() => (deletionConfirmationAppName = null)}
-  disabled={deletionConfirmationAppName !== $appStore.name}
+  disabled={deletionConfirmationAppName !== appName || deleting}
 >
-  Are you sure you want to delete <b>{$appStore.name}</b>?
+  Are you sure you want to delete
+  <span class="app-name" role="button" tabindex={-1} on:click={copyName}>
+    {appName}
+  </span>?
+
   <br />
   Please enter the app name below to confirm.
   <br /><br />
-  <Input
-    bind:value={deletionConfirmationAppName}
-    placeholder={$appStore.name}
-  />
+  <Input bind:value={deletionConfirmationAppName} placeholder={appName} />
 </ConfirmDialog>
+
+<style>
+  .app-name {
+    cursor: pointer;
+    font-weight: bold;
+    display: inline-block;
+  }
+</style>

packages/builder/src/components/portal/licensing/AppLimitModal.svelte

@@ -31,17 +31,11 @@
       : null}
   >
     <Body>
-      You are currently on our <span class="free-plan">Free plan</span>. Upgrade
-      to our Pro plan to get unlimited apps and additional features.
+      You have exceeded the app limit for your current plan. Upgrade to get
+      unlimited apps and additional features!
     </Body>
     {#if !$auth.user.accountPortalAccess}
       <Body>Please contact the account holder to upgrade.</Body>
     {/if}
   </ModalContent>
 </Modal>
-
-<style>
-  .free-plan {
-    font-weight: 600;
-  }
-</style>

packages/builder/src/components/start/AppRow.svelte

@@ -5,6 +5,7 @@
   import { goto } from "@roxi/routify"
   import { UserAvatars } from "@budibase/frontend-core"
   import { sdk } from "@budibase/shared-core"
+  import AppRowContext from "./AppRowContext.svelte"
 
   export let app
   export let lockedAction
@@ -76,12 +77,10 @@
 
   {#if isBuilder}
     <div class="app-row-actions">
-      <Button size="S" secondary on:click={lockedAction || goToOverview}>
-        Manage
-      </Button>
-      <Button size="S" primary on:click={lockedAction || goToBuilder}>
+      <Button size="S" secondary on:click={lockedAction || goToBuilder}>
         Edit
       </Button>
+      <AppRowContext {app} />
     </div>
   {:else if app.deployed}
     <!-- this can happen if an app builder has app user access to an app -->

packages/builder/src/components/start/AppRowContext.svelte

@@ -0,0 +1,88 @@
+<script>
+  import { ActionMenu, MenuItem, Icon, Modal } from "@budibase/bbui"
+  import DeleteModal from "components/deploy/DeleteModal.svelte"
+  import AppLimitModal from "components/portal/licensing/AppLimitModal.svelte"
+  import ExportAppModal from "./ExportAppModal.svelte"
+  import DuplicateAppModal from "./DuplicateAppModal.svelte"
+  import { licensing } from "stores/portal"
+
+  export let app
+  export let align = "right"
+
+  let deleteModal
+  let exportModal
+  let duplicateModal
+  let exportPublishedVersion = false
+  let appLimitModal
+</script>
+
+<DeleteModal
+  bind:this={deleteModal}
+  appId={app.devId}
+  appName={app.name}
+  onDeleteSuccess={async () => {
+    await licensing.init()
+  }}
+/>
+
+<AppLimitModal bind:this={appLimitModal} />
+
+<Modal bind:this={exportModal} padding={false}>
+  <ExportAppModal {app} published={exportPublishedVersion} />
+</Modal>
+
+<Modal bind:this={duplicateModal} padding={false}>
+  <DuplicateAppModal
+    appId={app.devId}
+    appName={app.name}
+    onDuplicateSuccess={async () => {
+      await licensing.init()
+    }}
+  />
+</Modal>
+
+<ActionMenu {align} on:open on:close>
+  <div slot="control" class="icon">
+    <Icon size="S" hoverable name="MoreSmallList" />
+  </div>
+  <MenuItem
+    icon="Copy"
+    on:click={() => {
+      if ($licensing?.usageMetrics?.apps < 100) {
+        duplicateModal.show()
+      } else {
+        appLimitModal.show()
+      }
+    }}
+  >
+    Duplicate
+  </MenuItem>
+  <MenuItem
+    icon="Export"
+    on:click={() => {
+      exportPublishedVersion = false
+      exportModal.show()
+    }}
+  >
+    Export latest edited app
+  </MenuItem>
+  {#if app.deployed}
+    <MenuItem
+      icon="Export"
+      on:click={() => {
+        exportPublishedVersion = true
+        exportModal.show()
+      }}
+    >
+      Export latest published app
+    </MenuItem>
+  {/if}
+  <MenuItem
+    icon="Delete"
+    on:click={() => {
+      deleteModal.show()
+    }}
+  >
+    Delete
+  </MenuItem>
+</ActionMenu>

packages/builder/src/components/start/DuplicateAppModal.svelte

@@ -0,0 +1,158 @@
+<script>
+  import {
+    ModalContent,
+    Input,
+    notifications,
+    Layout,
+    keepOpen,
+  } from "@budibase/bbui"
+  import { createValidationStore } from "helpers/validation/yup"
+  import { writable, get } from "svelte/store"
+  import * as appValidation from "helpers/validation/yup/app"
+  import { apps } from "stores/portal"
+  import { onMount } from "svelte"
+  import { API } from "api"
+
+  export let appId
+  export let appName
+  export let onDuplicateSuccess = () => {}
+
+  const validation = createValidationStore()
+  const values = writable({ name: appName + " copy", url: null })
+  const appPrefix = "/app"
+
+  let defaultAppName = appName + " copy"
+  let duplicating = false
+
+  $: {
+    const { url } = $values
+
+    validation.check({
+      ...$values,
+      url: url?.[0] === "/" ? url.substring(1, url.length) : url,
+    })
+  }
+
+  const resolveAppName = name => {
+    return name ? name.trim() : null
+  }
+
+  const resolveAppUrl = name => {
+    let parsedName
+    const resolvedName = resolveAppName(name)
+    parsedName = resolvedName ? resolvedName.toLowerCase() : ""
+    const parsedUrl = parsedName ? parsedName.replace(/\s+/g, "-") : ""
+    return encodeURI(parsedUrl)
+  }
+
+  const nameToUrl = appName => {
+    let resolvedUrl = resolveAppUrl(appName)
+    tidyUrl(resolvedUrl)
+  }
+
+  const tidyUrl = url => {
+    if (url && !url.startsWith("/")) {
+      url = `/${url}`
+    }
+    $values.url = url === "" ? null : url
+  }
+
+  const duplicateApp = async () => {
+    duplicating = true
+
+    let data = new FormData()
+    data.append("name", $values.name.trim())
+    if ($values.url) {
+      data.append("url", $values.url.trim())
+    }
+
+    try {
+      await API.duplicateApp(data, appId)
+      apps.load()
+      onDuplicateSuccess()
+      notifications.success("App duplicated successfully")
+    } catch (err) {
+      notifications.error("Error duplicating app")
+      duplicating = false
+    }
+  }
+
+  const setupValidation = async () => {
+    const applications = get(apps)
+    appValidation.name(validation, { apps: applications })
+    appValidation.url(validation, { apps: applications })
+
+    const { url } = $values
+    validation.check({
+      ...$values,
+      url: url?.[0] === "/" ? url.substring(1, url.length) : url,
+    })
+  }
+
+  $: appUrl = `${window.location.origin}${
+    $values.url
+      ? `${appPrefix}${$values.url}`
+      : `${appPrefix}${resolveAppUrl($values.name)}`
+  }`
+
+  onMount(async () => {
+    nameToUrl($values.name)
+    await setupValidation()
+  })
+</script>
+
+<ModalContent
+  title={"Duplicate App"}
+  onConfirm={async () => {
+    validation.check({
+      ...$values,
+    })
+    if ($validation.valid) {
+      await duplicateApp()
+    } else {
+      return keepOpen
+    }
+  }}
+>
+  <Layout gap="S" noPadding>
+    <Input
+      autofocus={true}
+      bind:value={$values.name}
+      disabled={duplicating}
+      error={$validation.touched.name && $validation.errors.name}
+      on:blur={() => ($validation.touched.name = true)}
+      on:change={nameToUrl($values.name)}
+      label="Name"
+      placeholder={defaultAppName}
+    />
+    <span>
+      <Input
+        bind:value={$values.url}
+        disabled={duplicating}
+        error={$validation.touched.url && $validation.errors.url}
+        on:blur={() => ($validation.touched.url = true)}
+        on:change={tidyUrl($values.url)}
+        label="URL"
+        placeholder={$values.url
+          ? $values.url
+          : `/${resolveAppUrl($values.name)}`}
+      />
+      {#if $values.url && $values.url !== "" && !$validation.errors.url}
+        <div class="app-server" title={appUrl}>
+          {appUrl}
+        </div>
+      {/if}
+    </span>
+  </Layout>
+</ModalContent>
+
+<style>
+  .app-server {
+    color: var(--spectrum-global-color-gray-600);
+    margin-top: 10px;
+    width: 320px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+</style>

packages/builder/src/components/start/ExportAppModal.svelte

@@ -121,6 +121,7 @@
     <Input
       type="password"
       label="Password"
+      autocomplete="new-password"
       placeholder="Type here..."
       bind:value={password}
       error={$validation.errors.password}

packages/builder/src/pages/builder/app/[application]/settings/_layout.svelte

@@ -3,7 +3,7 @@
   import { Page, Layout, AbsTooltip, TooltipPosition } from "@budibase/bbui"
   import { url, isActive } from "@roxi/routify"
   import DeleteModal from "components/deploy/DeleteModal.svelte"
-  import { isOnlyUser } from "stores/builder"
+  import { isOnlyUser, appStore } from "stores/builder"
 
   let deleteModal
 </script>
@@ -67,7 +67,11 @@
   </Page>
 </div>
 
-<DeleteModal bind:this={deleteModal} />
+<DeleteModal
+  bind:this={deleteModal}
+  appId={$appStore.appId}
+  appName={$appStore.name}
+/>
 
 <style>
   .delete-action :global(.text) {

packages/builder/src/pages/builder/portal/apps/_components/PortalSideBar.svelte

@@ -1,10 +1,14 @@
 <script>
-  import { apps, sideBarCollapsed } from "stores/portal"
+  import { apps, sideBarCollapsed, auth } from "stores/portal"
   import { params, goto } from "@roxi/routify"
   import NavItem from "components/common/NavItem.svelte"
   import NavHeader from "components/common/NavHeader.svelte"
+  import AppRowContext from "components/start/AppRowContext.svelte"
+  import { AppStatus } from "constants"
+  import { sdk } from "@budibase/shared-core"
 
   let searchString
+  let opened
 
   $: filteredApps = $apps
     .filter(app => {
@@ -13,6 +17,12 @@
         app.name.toLowerCase().includes(searchString.toLowerCase())
       )
     })
+    .map(app => {
+      return {
+        ...app,
+        deployed: app.status === AppStatus.DEPLOYED,
+      }
+    })
     .sort((a, b) => {
       const lowerA = a.name.toLowerCase()
       const lowerB = b.name.toLowerCase()
@@ -42,8 +52,22 @@
         icon={app.icon?.name || "Apps"}
         iconColor={app.icon?.color}
         selected={$params.appId === app.appId}
+        highlighted={opened == app.appId}
         on:click={() => $goto(`./${app.appId}`)}
-      />
+      >
+        {#if sdk.users.isBuilder($auth.user, app?.devId)}
+          <AppRowContext
+            {app}
+            align="left"
+            on:open={() => {
+              opened = app.appId
+            }}
+            on:close={() => {
+              opened = null
+            }}
+          />
+        {/if}
+      </NavItem>
     {/each}
   </div>
 </div>

packages/frontend-core/src/api/app.js

@@ -83,6 +83,18 @@ export const buildAppEndpoints = API => ({
     })
   },
 
+  /**
+   * Duplicate an existing app
+   * @param app the app to dupe
+   */
+  duplicateApp: async (app, appId) => {
+    return await API.post({
+      url: `/api/applications/${appId}/duplicate`,
+      body: app,
+      json: false,
+    })
+  },
+
   /**
    * Update an application using an export - the body
    * should be of type FormData, with a "file" and a "password" if encrypted.

packages/server/src/api/controllers/application.ts

@@ -26,6 +26,7 @@ import {
   env as envCore,
   ErrorCode,
   events,
+  HTTPError,
   migrations,
   objectStore,
   roles,
@@ -50,6 +51,8 @@ import {
   CreateAppRequest,
   FetchAppDefinitionResponse,
   FetchAppPackageResponse,
+  DuplicateAppRequest,
+  DuplicateAppResponse,
 } from "@budibase/types"
 import { BASE_LAYOUT_PROP_IDS } from "../../constants/layouts"
 import sdk from "../../sdk"
@@ -122,7 +125,7 @@ interface AppTemplate {
   templateString?: string
   useTemplate?: string
   file?: {
-    type: string
+    type?: string
     path: string
     password?: string
   }
@@ -263,6 +266,10 @@ async function performAppCreate(ctx: UserCtx<CreateAppRequest, App>) {
       ...(ctx.request.files.templateFile as any),
       password: encryptionPassword,
     }
+  } else if (typeof ctx.request.body.file?.path === "string") {
+    instanceConfig.file = {
+      path: ctx.request.body.file?.path,
+    }
   }
   const tenantId = tenancy.isMultiTenant() ? tenancy.getTenantId() : null
   const appId = generateDevAppID(generateAppID(tenantId))
@@ -372,12 +379,20 @@ async function creationEvents(request: any, app: App) {
     else if (request.files?.templateFile) {
       creationFns.push(a => events.app.fileImported(a))
     }
+    // from server file path
+    else if (request.body.file) {
+      // explicitly pass in the newly created app id
+      creationFns.push(a => events.app.duplicated(a, app.appId))
+    }
     // unknown
     else {
       console.error("Could not determine template creation event")
     }
   }
-  creationFns.push(a => events.app.created(a))
+
+  if (!request.duplicate) {
+    creationFns.push(a => events.app.created(a))
+  }
 
   for (let fn of creationFns) {
     await fn(app)
@@ -391,8 +406,10 @@ async function appPostCreate(ctx: UserCtx, app: App) {
     tenantId,
     appId: app.appId,
   })
+
   await creationEvents(ctx.request, app)
-  // app import & template creation
+
+  // app import, template creation and duplication
   if (ctx.request.body.useTemplate === "true") {
     const { rows } = await getUniqueRows([app.appId])
     const rowCount = rows ? rows.length : 0
@@ -421,7 +438,7 @@ async function appPostCreate(ctx: UserCtx, app: App) {
   }
 }
 
-export async function create(ctx: UserCtx) {
+export async function create(ctx: UserCtx<CreateAppRequest, App>) {
   const newApplication = await quotas.addApp(() => performAppCreate(ctx))
   await appPostCreate(ctx, newApplication)
   await cache.bustCache(cache.CacheKey.CHECKLIST)
@@ -626,6 +643,66 @@ export async function importToApp(ctx: UserCtx) {
   ctx.body = { message: "app updated" }
 }
 
+/**
+ * Create a copy of the latest dev application.
+ * Performs an export of the app, then imports from the export dir path
+ */
+export async function duplicateApp(
+  ctx: UserCtx<DuplicateAppRequest, DuplicateAppResponse>
+) {
+  const { name: appName, url: possibleUrl } = ctx.request.body
+  const { appId: sourceAppId } = ctx.params
+  const [app] = await dbCore.getAppsByIDs([sourceAppId])
+
+  if (!app) {
+    ctx.throw(404, "Source app not found")
+  }
+
+  const apps = (await dbCore.getAllApps({ dev: true })) as App[]
+
+  checkAppName(ctx, apps, appName)
+  const url = sdk.applications.getAppUrl({ name: appName, url: possibleUrl })
+  checkAppUrl(ctx, apps, url)
+
+  const tmpPath = await sdk.backups.exportApp(sourceAppId, {
+    excludeRows: false,
+    tar: false,
+  })
+
+  const createRequestBody: CreateAppRequest = {
+    name: appName,
+    url: possibleUrl,
+    useTemplate: "true",
+    // The app export path
+    file: {
+      path: tmpPath,
+    },
+  }
+
+  // Build a new request
+  const createRequest = {
+    roleId: ctx.roleId,
+    user: ctx.user,
+    request: {
+      body: createRequestBody,
+    },
+  } as UserCtx<CreateAppRequest, App>
+
+  // Build the new application
+  await create(createRequest)
+  const { body: newApplication } = createRequest
+
+  if (!newApplication) {
+    ctx.throw(500, "There was a problem duplicating the application")
+  }
+
+  ctx.body = {
+    duplicateAppId: newApplication?.appId,
+    sourceAppId,
+  }
+  ctx.status = 200
+}
+
 export async function updateAppPackage(
   appPackage: Partial<App>,
   appId: string

packages/server/src/api/routes/application.ts

@@ -55,9 +55,14 @@ router
   )
   .delete(
     "/api/applications/:appId",
-    authorized(permissions.GLOBAL_BUILDER),
+    authorized(permissions.BUILDER),
     controller.destroy
   )
+  .post(
+    "/api/applications/:appId/duplicate",
+    authorized(permissions.BUILDER),
+    controller.duplicateApp
+  )
   .post(
     "/api/applications/:appId/import",
     authorized(permissions.BUILDER),

packages/server/src/api/routes/tests/application.spec.ts

@@ -34,6 +34,96 @@ describe("/applications", () => {
     jest.clearAllMocks()
   })
 
+  // These need to go first for the app totals to make sense
+  describe("permissions", () => {
+    it("should only return apps a user has access to", async () => {
+      let user = await config.createUser({
+        builder: { global: false },
+        admin: { global: false },
+      })
+
+      await config.withUser(user, async () => {
+        const apps = await config.api.application.fetch()
+        expect(apps).toHaveLength(0)
+      })
+
+      user = await config.globalUser({
+        ...user,
+        builder: {
+          apps: [config.getProdAppId()],
+        },
+      })
+
+      await config.withUser(user, async () => {
+        const apps = await config.api.application.fetch()
+        expect(apps).toHaveLength(1)
+      })
+    })
+
+    it("should only return apps a user has access to through a custom role", async () => {
+      let user = await config.createUser({
+        builder: { global: false },
+        admin: { global: false },
+      })
+
+      await config.withUser(user, async () => {
+        const apps = await config.api.application.fetch()
+        expect(apps).toHaveLength(0)
+      })
+
+      const role = await config.api.roles.save({
+        name: "Test",
+        inherits: "PUBLIC",
+        permissionId: "read_only",
+        version: "name",
+      })
+
+      user = await config.globalUser({
+        ...user,
+        roles: {
+          [config.getProdAppId()]: role.name,
+        },
+      })
+
+      await config.withUser(user, async () => {
+        const apps = await config.api.application.fetch()
+        expect(apps).toHaveLength(1)
+      })
+    })
+
+    it("should only return apps a user has access to through a custom role on a group", async () => {
+      let user = await config.createUser({
+        builder: { global: false },
+        admin: { global: false },
+      })
+
+      await config.withUser(user, async () => {
+        const apps = await config.api.application.fetch()
+        expect(apps).toHaveLength(0)
+      })
+
+      const roleName = uuid.v4().replace(/-/g, "")
+      const role = await config.api.roles.save({
+        name: roleName,
+        inherits: "PUBLIC",
+        permissionId: "read_only",
+        version: "name",
+      })
+
+      const group = await config.createGroup(role._id!)
+
+      user = await config.globalUser({
+        ...user,
+        userGroups: [group._id!],
+      })
+
+      await config.withUser(user, async () => {
+        const apps = await config.api.application.fetch()
+        expect(apps).toHaveLength(1)
+      })
+    })
+  })
+
   describe("create", () => {
     it("creates empty app", async () => {
       const app = await config.api.application.create({ name: utils.newid() })
@@ -94,6 +184,20 @@ describe("/applications", () => {
       expect(events.app.created).toBeCalledTimes(1)
       expect(events.app.fileImported).toBeCalledTimes(1)
     })
+
+    it("should reject with a known name", async () => {
+      await config.api.application.create(
+        { name: app.name },
+        { body: { message: "App name is already in use." }, status: 400 }
+      )
+    })
+
+    it("should reject with a known url", async () => {
+      await config.api.application.create(
+        { name: "made up", url: app?.url! },
+        { body: { message: "App URL is already in use." }, status: 400 }
+      )
+    })
   })
 
   describe("fetch", () => {
@@ -229,6 +333,63 @@ describe("/applications", () => {
     })
   })
 
+  describe("POST /api/applications/:appId/duplicate", () => {
+    it("should duplicate an existing app", async () => {
+      const resp = await config.api.application.duplicateApp(
+        app.appId,
+        {
+          name: "to-dupe copy",
+          url: "/to-dupe-copy",
+        },
+        {
+          status: 200,
+        }
+      )
+
+      expect(events.app.duplicated).toBeCalled()
+      expect(resp.duplicateAppId).toBeDefined()
+      expect(resp.sourceAppId).toEqual(app.appId)
+      expect(resp.duplicateAppId).not.toEqual(app.appId)
+    })
+
+    it("should reject an unknown app id with a 404", async () => {
+      await config.api.application.duplicateApp(
+        app.appId.slice(0, -1) + "a",
+        {
+          name: "to-dupe 123",
+          url: "/to-dupe-123",
+        },
+        {
+          status: 404,
+        }
+      )
+    })
+
+    it("should reject with a known name", async () => {
+      const resp = await config.api.application.duplicateApp(
+        app.appId,
+        {
+          name: app.name,
+          url: "/known-name",
+        },
+        { body: { message: "App name is already in use." }, status: 400 }
+      )
+      expect(events.app.duplicated).not.toBeCalled()
+    })
+
+    it("should reject with a known url", async () => {
+      const resp = await config.api.application.duplicateApp(
+        app.appId,
+        {
+          name: "this is fine",
+          url: app.url,
+        },
+        { body: { message: "App URL is already in use." }, status: 400 }
+      )
+      expect(events.app.duplicated).not.toBeCalled()
+    })
+  })
+
   describe("POST /api/applications/:appId/sync", () => {
     it("should not sync automation logs", async () => {
       const automation = await config.createAutomation()
@@ -249,93 +410,4 @@ describe("/applications", () => {
       expect(devLogs.data.length).toBe(0)
     })
   })
-
-  describe("permissions", () => {
-    it("should only return apps a user has access to", async () => {
-      let user = await config.createUser({
-        builder: { global: false },
-        admin: { global: false },
-      })
-
-      await config.withUser(user, async () => {
-        const apps = await config.api.application.fetch()
-        expect(apps).toHaveLength(0)
-      })
-
-      user = await config.globalUser({
-        ...user,
-        builder: {
-          apps: [config.getProdAppId()],
-        },
-      })
-
-      await config.withUser(user, async () => {
-        const apps = await config.api.application.fetch()
-        expect(apps).toHaveLength(1)
-      })
-    })
-
-    it("should only return apps a user has access to through a custom role", async () => {
-      let user = await config.createUser({
-        builder: { global: false },
-        admin: { global: false },
-      })
-
-      await config.withUser(user, async () => {
-        const apps = await config.api.application.fetch()
-        expect(apps).toHaveLength(0)
-      })
-
-      const role = await config.api.roles.save({
-        name: "Test",
-        inherits: "PUBLIC",
-        permissionId: "read_only",
-        version: "name",
-      })
-
-      user = await config.globalUser({
-        ...user,
-        roles: {
-          [config.getProdAppId()]: role.name,
-        },
-      })
-
-      await config.withUser(user, async () => {
-        const apps = await config.api.application.fetch()
-        expect(apps).toHaveLength(1)
-      })
-    })
-
-    it.only("should only return apps a user has access to through a custom role on a group", async () => {
-      let user = await config.createUser({
-        builder: { global: false },
-        admin: { global: false },
-      })
-
-      await config.withUser(user, async () => {
-        const apps = await config.api.application.fetch()
-        expect(apps).toHaveLength(0)
-      })
-
-      const roleName = uuid.v4().replace(/-/g, "")
-      const role = await config.api.roles.save({
-        name: roleName,
-        inherits: "PUBLIC",
-        permissionId: "read_only",
-        version: "name",
-      })
-
-      const group = await config.createGroup(role._id!)
-
-      user = await config.globalUser({
-        ...user,
-        userGroups: [group._id!],
-      })
-
-      await config.withUser(user, async () => {
-        const apps = await config.api.application.fetch()
-        expect(apps).toHaveLength(1)
-      })
-    })
-  })
 })

packages/server/src/sdk/app/backups/imports.ts

@@ -24,7 +24,7 @@ import tar from "tar"
 
 type TemplateType = {
   file?: {
-    type: string
+    type?: string
     path: string
     password?: string
   }

packages/server/src/tests/utilities/TestConfiguration.ts

@@ -580,7 +580,7 @@ export default class TestConfiguration {
   }
 
   // APP
-  async createApp(appName: string): Promise<App> {
+  async createApp(appName: string, url?: string): Promise<App> {
     // create dev app
     // clear any old app
     this.appId = undefined
@@ -589,6 +589,7 @@ export default class TestConfiguration {
       async () =>
         (await this._req(appController.create, {
           name: appName,
+          url,
         })) as App
     )
     this.appId = this.app.appId

packages/server/src/tests/utilities/api/application.ts

@@ -4,6 +4,7 @@ import {
   type CreateAppRequest,
   type FetchAppDefinitionResponse,
   type FetchAppPackageResponse,
+  DuplicateAppResponse,
 } from "@budibase/types"
 import { Expectations, TestAPI } from "./base"
 import { AppStatus } from "../../../db/utils"
@@ -70,6 +71,22 @@ export class ApplicationAPI extends TestAPI {
     })
   }
 
+  duplicateApp = async (
+    appId: string,
+    fields: object,
+    expectations?: Expectations
+  ): Promise<DuplicateAppResponse> => {
+    let headers = {
+      ...this.config.defaultHeaders(),
+      [constants.Header.APP_ID]: appId,
+    }
+    return this._post(`/api/applications/${appId}/duplicate`, {
+      headers,
+      fields,
+      expectations,
+    })
+  }
+
   getDefinition = async (
     appId: string,
     expectations?: Expectations

packages/types/src/api/web/application.ts

@@ -11,6 +11,17 @@ export interface CreateAppRequest {
   includeSampleData?: boolean
   encryptionPassword?: string
   templateString?: string
+  file?: { path: string }
+}
+
+export interface DuplicateAppRequest {
+  name: string
+  url?: string
+}
+
+export interface DuplicateAppResponse {
+  duplicateAppId: string
+  sourceAppId: string
 }
 
 export interface FetchAppDefinitionResponse {

packages/types/src/sdk/events/app.ts

@@ -44,6 +44,14 @@ export interface AppFileImportedEvent extends BaseEvent {
   }
 }
 
+export interface AppDuplicatedEvent extends BaseEvent {
+  duplicateAppId: string
+  appId: string
+  audited: {
+    name: string
+  }
+}
+
 export interface AppTemplateImportedEvent extends BaseEvent {
   appId: string
   templateKey: string

packages/types/src/sdk/events/event.ts

@@ -60,6 +60,7 @@ export enum Event {
   APP_CREATED = "app:created",
   APP_UPDATED = "app:updated",
   APP_DELETED = "app:deleted",
+  APP_DUPLICATED = "app:duplicated",
   APP_PUBLISHED = "app:published",
   APP_UNPUBLISHED = "app:unpublished",
   APP_TEMPLATE_IMPORTED = "app:template:imported",
@@ -259,6 +260,7 @@ export const AuditedEventFriendlyName: Record<Event, string | undefined> = {
   [Event.APP_CREATED]: `App "{{ name }}" created`,
   [Event.APP_UPDATED]: `App "{{ name }}" updated`,
   [Event.APP_DELETED]: `App "{{ name }}" deleted`,
+  [Event.APP_DUPLICATED]: `App "{{ name }}" duplicated`,
   [Event.APP_PUBLISHED]: `App "{{ name }}" published`,
   [Event.APP_UNPUBLISHED]: `App "{{ name }}" unpublished`,
   [Event.APP_TEMPLATE_IMPORTED]: `App "{{ name }}" template imported`,