This commit is contained in:
Andras Bacsai
2021-06-07 23:44:36 +02:00
committed by GitHub
parent 04a5b1bd4f
commit 9d14b03eb1
36 changed files with 2341 additions and 1169 deletions

View File

@@ -14,23 +14,14 @@
try {
service = await request(`/api/v1/services/${$page.params.name}`, $session);
} catch (error) {
browser && toast.push(`Cannot find service ${$page.params.name}?!`);
goto(`/dashboard/services`, { replaceState: true });
if (browser) {
toast.push(`Cannot find service ${$page.params.name}?!`);
goto(`/dashboard/services`, { replaceState: true });
}
}
}
}
async function activate() {
try {
await request(`/api/v1/services/deploy/${$page.params.name}/activate`, $session, {
method: 'PATCH',
body: {}
});
browser && toast.push(`All users are activated for Plausible.`);
} catch (error) {
console.log(error);
browser && toast.push(`Ooops, there was an error activating users for Plausible?!`);
}
}
</script>
{#await loadServiceConfig()}
@@ -38,7 +29,12 @@
{:then}
<div class="min-h-full text-white">
<div class="py-5 text-left px-6 text-3xl tracking-tight font-bold flex items-center">
<div>{$page.params.name === 'plausible' ? 'Plausible Analytics' : $page.params.name}</div>
{#if $page.params.name === 'plausible'}
<div>Plausible Analytics</div>
{:else if $page.params.name === 'nocodb'}
<div>NocoDB</div>
{/if}
<div class="px-4">
{#if $page.params.name === 'plausible'}
<img
@@ -46,37 +42,38 @@
class="w-6 mx-auto"
src="https://cdn.coollabs.io/assets/coolify/services/plausible/logo_sm.png"
/>
{:else if $page.params.name === 'nocodb'}
<img
alt="nocodb logo"
class="w-8 mx-auto"
src="https://cdn.coollabs.io/assets/coolify/services/nocodb/nocodb.png"
/>
{/if}
</div>
<a
target="_blank"
class="icon mx-2"
href={service.config.baseURL}
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
<a target="_blank" class="icon mx-2" href={service.config.baseURL}>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
/>
</svg></a
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
/>
</svg></a
>
</div>
</div>
<div class="space-y-2 max-w-4xl mx-auto px-6" in:fade={{ duration: 100 }}>
<div class="block text-center py-4">
{#if $page.params.name === 'plausible'}
<Plausible {service} />
{:else if $page.params.name === 'nocodb'}
<div class="font-bold">Nothing to show here. Enjoy using NocoDB!</div>
{/if}
</div>
</div>

View File

@@ -14,13 +14,11 @@
async function checkService() {
try {
const data = await request(`/api/v1/services/${$page.params.type}`, $session);
if (!data?.success) {
if (data?.success) {
if (browser) {
goto(`/dashboard/services`, { replaceState: true });
goto(`/service/${$page.params.type}/configuration`, { replaceState: true });
toast.push(
`${
$page.params.type === 'plausible' ? 'Plausible Analytics' : $page.params.type
} already deployed.`
`Service already deployed.`
);
}
}

View File

@@ -10,7 +10,7 @@
import TooltipInfo from '$components/TooltipInfo.svelte';
import { browser } from '$app/env';
$: deployable =
$: deployablePlausible =
$newService.baseURL === '' ||
$newService.baseURL === null ||
$newService.email === '' ||
@@ -22,7 +22,7 @@
$newService.userPassword.length <= 6 ||
$newService.userPassword !== $newService.userPasswordAgain;
let loading = false;
async function deploy() {
async function deployPlausible() {
try {
loading = true;
const payload = $newService;
@@ -44,6 +44,30 @@
loading = false;
}
}
async function deployNocodb() {
try {
loading = true;
await request(`/api/v1/services/deploy/${$page.params.type}`, $session, {
body: {
baseURL: $newService.baseURL
}
});
if (browser) {
toast.push(
'Service deployment queued.<br><br><br>It could take 2-5 minutes to be ready, be patient and grab a coffee/tea!',
{ duration: 4000 }
);
goto(`/dashboard/services`, { replaceState: true });
}
} catch (error) {
console.log(error);
browser && toast.push('Oops something went wrong. See console.log.');
} finally {
loading = false;
}
}
</script>
<div class="min-h-full text-white">
@@ -51,18 +75,20 @@
Deploy new
{#if $page.params.type === 'plausible'}
<span class="text-blue-500 px-2 capitalize">Plausible Analytics</span>
{:else if $page.params.type === 'nocodb'}
<span class="text-blue-500 px-2 capitalize">NocoDB</span>
{/if}
</div>
</div>
{#if loading}
<Loading />
{:else}
{:else if $page.params.type === 'plausible'}
<div class="space-y-2 max-w-4xl mx-auto px-6 flex-col text-center" in:fade={{ duration: 100 }}>
<div class="grid grid-flow-row">
<label for="Domain"
>Domain <TooltipInfo
position="right"
label={`You will have your Plausible instance at here.`}
label={`You could reach your Plausible Analytics instance here.`}
/></label
>
<input
@@ -114,15 +140,39 @@
/>
</div>
<button
disabled={deployable}
class:cursor-not-allowed={deployable}
class:bg-blue-500={!deployable}
class:hover:bg-blue-400={!deployable}
class:hover:bg-transparent={deployable}
class:text-warmGray-700={deployable}
class:text-white={!deployable}
disabled={deployablePlausible}
class:cursor-not-allowed={deployablePlausible}
class:bg-blue-500={!deployablePlausible}
class:hover:bg-blue-400={!deployablePlausible}
class:hover:bg-transparent={deployablePlausible}
class:text-warmGray-700={deployablePlausible}
class:text-white={!deployablePlausible}
class="button p-2"
on:click={deploy}
on:click={deployPlausible}
>
Deploy
</button>
</div>
{:else if $page.params.type === 'nocodb'}
<div class="space-y-2 max-w-xl mx-auto px-6 flex-col text-center" in:fade={{ duration: 100 }}>
<div class="grid grid-flow-row pb-5">
<label for="Domain"
>Domain <TooltipInfo
position="right"
label={`You could reach your NocoDB instance here.`}
/></label
>
<input
id="Domain"
class:border-red-500={$newService.baseURL == null || $newService.baseURL == ''}
bind:value={$newService.baseURL}
placeholder="nocodb.coollabs.io"
/>
</div>
<button
class="button p-2 w-64 bg-blue-500 hover:bg-blue-400 text-white"
on:click={deployNocodb}
>
Deploy
</button>

View File

@@ -1,7 +1,6 @@
<script>
import { goto } from '$app/navigation';
import { page } from '$app/stores';
import { fade } from 'svelte/transition';
</script>
@@ -14,7 +13,7 @@
{#if $page.path === '/service/new'}
<div class="flex justify-center space-x-4 font-bold pb-6">
<div
class="text-center flex-col items-center cursor-pointer ease-in-out transform hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-blue-500 p-2 rounded bg-warmGray-800"
class="text-center flex-col items-center cursor-pointer ease-in-out transform hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-blue-500 p-2 rounded bg-warmGray-800 w-48"
on:click={() => goto('/service/new/plausible')}
>
<img
@@ -24,6 +23,18 @@
/>
<div class="text-white">Plausible Analytics</div>
</div>
<div
class="text-center flex-col items-center cursor-pointer ease-in-out transform hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-white p-2 rounded bg-warmGray-800 w-48"
on:click={() => goto('/service/new/nocodb')}
>
<img
alt="nocodb logo"
class="w-14 mx-auto pb-2"
src="https://cdn.coollabs.io/assets/coolify/services/nocodb/nocodb.png"
/>
<div class="flex-1" />
<div class="text-white">NocoDB</div>
</div>
</div>
{/if}
</div>