2021-07-27 17:34:18 +02:00
|
|
|
<script>
|
|
|
|
|
import { writable, get as svelteGet } from "svelte/store"
|
2022-01-20 17:01:09 +01:00
|
|
|
import { notifications, Input, ModalContent, Body } from "@budibase/bbui"
|
2021-07-27 17:34:18 +02:00
|
|
|
import { apps } from "stores/portal"
|
|
|
|
|
import { onMount } from "svelte"
|
2022-01-20 17:01:09 +01:00
|
|
|
import { createValidationStore } from "helpers/validation/yup"
|
|
|
|
|
import * as appValidation from "helpers/validation/yup/app"
|
2021-07-27 17:34:18 +02:00
|
|
|
|
2021-07-28 00:09:15 +02:00
|
|
|
export let app
|
2021-07-27 17:34:18 +02:00
|
|
|
|
2022-01-20 17:01:09 +01:00
|
|
|
const values = writable({ name: "", url: null })
|
|
|
|
|
const validation = createValidationStore()
|
|
|
|
|
$: validation.check($values)
|
2021-07-27 17:34:18 +02:00
|
|
|
|
|
|
|
|
onMount(async () => {
|
2022-01-20 17:01:09 +01:00
|
|
|
$values.name = app.name
|
|
|
|
|
$values.url = app.url
|
|
|
|
|
setupValidation()
|
2021-07-27 17:34:18 +02:00
|
|
|
})
|
|
|
|
|
|
2022-01-20 17:01:09 +01:00
|
|
|
const setupValidation = async () => {
|
2022-01-21 18:31:18 +01:00
|
|
|
const applications = svelteGet(apps)
|
|
|
|
|
appValidation.name(validation, { apps: applications, currentApp: app })
|
|
|
|
|
appValidation.url(validation, { apps: applications, currentApp: app })
|
2022-01-20 17:01:09 +01:00
|
|
|
// init validation
|
|
|
|
|
validation.check($values)
|
2021-07-27 17:34:18 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function updateApp() {
|
|
|
|
|
try {
|
|
|
|
|
// Update App
|
2022-01-20 18:27:56 +01:00
|
|
|
const body = {
|
|
|
|
|
name: $values.name.trim(),
|
|
|
|
|
}
|
|
|
|
|
if ($values.url) {
|
|
|
|
|
body.url = $values.url.trim()
|
|
|
|
|
}
|
|
|
|
|
await apps.update(app.instance._id, body)
|
2021-07-27 17:34:18 +02:00
|
|
|
} catch (error) {
|
|
|
|
|
console.error(error)
|
2022-01-24 15:32:27 +01:00
|
|
|
notifications.error("Error updating app")
|
2021-07-27 17:34:18 +02:00
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2022-01-20 17:01:09 +01:00
|
|
|
// auto add slash to url
|
|
|
|
|
$: {
|
|
|
|
|
if ($values.url && !$values.url.startsWith("/")) {
|
|
|
|
|
$values.url = `/${$values.url}`
|
|
|
|
|
}
|
2021-07-27 17:34:18 +02:00
|
|
|
}
|
|
|
|
|
</script>
|
2021-07-28 00:09:15 +02:00
|
|
|
|
2022-01-20 17:01:09 +01:00
|
|
|
<ModalContent
|
|
|
|
|
title={"Edit app"}
|
|
|
|
|
confirmText={"Save"}
|
|
|
|
|
onConfirm={updateApp}
|
|
|
|
|
disabled={!$validation.valid}
|
|
|
|
|
>
|
|
|
|
|
<Body size="S">Update the name of your app.</Body>
|
|
|
|
|
<Input
|
|
|
|
|
bind:value={$values.name}
|
|
|
|
|
error={$validation.touched.name && $validation.errors.name}
|
|
|
|
|
on:blur={() => ($validation.touched.name = true)}
|
|
|
|
|
label="Name"
|
|
|
|
|
/>
|
|
|
|
|
<Input
|
|
|
|
|
bind:value={$values.url}
|
|
|
|
|
error={$validation.touched.url && $validation.errors.url}
|
|
|
|
|
on:blur={() => ($validation.touched.url = true)}
|
|
|
|
|
label="URL"
|
|
|
|
|
placeholder={$values.name
|
|
|
|
|
? "/" + encodeURIComponent($values.name).toLowerCase()
|
|
|
|
|
: "/"}
|
|
|
|
|
/>
|
|
|
|
|
</ModalContent>
|
