dave/coolify
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix: update prisma

Browse Source 
feat(beta): database branching
This commit is contained in:
Andras Bacsai
2022-09-05 15:41:32 +02:00
parent c9aecd51f3
commit 5a15e64471
12 changed files with 707 additions and 687 deletions
Download Patch File Download Diff File Expand all files Collapse all files

162
apps/ui/src/routes/applications/[id]/configuration/database.svelte Normal file
View File

@@ -0,0 +1,162 @@
<script context="module" lang="ts">
import type { Load } from '@sveltejs/kit';
export const load: Load = async () => {
try {
const response = await get(`/databases`);
return {
props: {
...response
}
};
} catch (error: any) {
return {
status: 500,
error: new Error(error)
};
}
};
</script>
<script lang="ts">
export let databases: any = [];
import { get, post } from '$lib/api';
import { t } from '$lib/translations';
import { appSession } from '$lib/store';
import DatabaseIcons from '$lib/components/svg/databases/DatabaseIcons.svelte';
import { errorNotification } from '$lib/common';
import { page } from '$app/stores';
import { goto } from '$app/navigation';
const from = $page.url.searchParams.get('from');
let remoteDatabase = {
name: null,
type: null,
host: null,
port: null,
user: null,
password: null,
database: null
};
const ownDatabases = databases.filter((database: any) => {
if (database.teams[0].id === $appSession.teamId) {
return database;
}
});
const otherDatabases = databases.filter((database: any) => {
if (database.teams[0].id !== $appSession.teamId) {
return database;
}
});
async function addCoolifyDatabase(database: any) {
try {
await post(`/applications/${$page.params.id}/configuration/database`, {
databaseId: database.id,
type: database.type
});
return window.location.assign(from || `/applications/${$page.params.id}/`);
} catch (error) {
return errorNotification(error);
}
}
</script>
<div class="flex space-x-1 p-6 font-bold">
<div class="mr-4 text-2xl tracking-tight">Select a Database</div>
</div>
<div class="flex-col justify-center mt-10 pb-12 sm:pb-16">
{#if !databases || ownDatabases.length === 0}
<div class="flex-col">
<div class="text-center text-xl font-bold">{$t('database.no_databases_found')}</div>
</div>
{/if}
{#if ownDatabases.length > 0 || otherDatabases.length > 0}
<div class="flex flex-col">
<div class="flex flex-col flex-wrap justify-center px-2 md:flex-row">
{#each ownDatabases as database}
<button on:click={() => addCoolifyDatabase(database)} class="p-2 no-underline">
<div class="box-selection group relative hover:bg-purple-600">
<DatabaseIcons type={database.type} isAbsolute={true} />
<div class="truncate text-center text-xl font-bold">
{database.name}
</div>
{#if $appSession.teamId === '0' && otherDatabases.length > 0}
<div class="truncate text-center">{database.teams[0].name}</div>
{/if}
{#if database.destinationDocker?.name}
<div class="truncate text-center">{database.destinationDocker.name}</div>
{/if}
{#if !database.type}
<div class="truncate text-center font-bold text-red-500 group-hover:text-white">
{$t('application.configuration.configuration_missing')}
</div>
{/if}
</div>
</button>
{/each}
</div>
{#if otherDatabases.length > 0 && $appSession.teamId === '0'}
<div class="px-6 pb-5 pt-10 text-2xl font-bold text-center">Other Databases</div>
<div class="flex flex-col flex-wrap justify-center px-2 md:flex-row">
{#each otherDatabases as database}
<a href="/databases/{database.id}" class="p-2 no-underline">
<div class="box-selection group relative hover:bg-purple-600">
<DatabaseIcons type={database.type} isAbsolute={true} />
<div class="truncate text-center text-xl font-bold">
{database.name}
</div>
{#if $appSession.teamId === '0'}
<div class="truncate text-center">{database.teams[0].name}</div>
{/if}
{#if !database.type}
<div class="truncate text-center font-bold text-red-500 group-hover:text-white">
Configuration missing
</div>
{:else}
<div class="text-center truncate">{database.type}</div>
{/if}
</div>
</a>
{/each}
</div>
{/if}
</div>
{/if}
<div class="mx-auto max-w-4xl p-6">
<div class="grid grid-flow-row gap-2 px-10">
<div class="font-bold text-xl tracking-tight">Connect a Hosted / Remote Database</div>
<div class="mt-2 grid grid-cols-2 items-center px-4">
<label for="name" class="text-base font-bold text-stone-100">Name</label>
<input name="name" id="name" required bind:value={remoteDatabase.name} />
</div>
<div class="mt-2 grid grid-cols-2 items-center px-4">
<label for="type" class="text-base font-bold text-stone-100">Type</label>
<input name="type" id="type" required bind:value={remoteDatabase.type} />
</div>
<div class="mt-2 grid grid-cols-2 items-center px-4">
<label for="host" class="text-base font-bold text-stone-100">Host</label>
<input name="host" id="host" required bind:value={remoteDatabase.host} />
</div>
<div class="mt-2 grid grid-cols-2 items-center px-4">
<label for="port" class="text-base font-bold text-stone-100">Port</label>
<input name="port" id="port" required bind:value={remoteDatabase.port} />
</div>
<div class="mt-2 grid grid-cols-2 items-center px-4">
<label for="user" class="text-base font-bold text-stone-100">User</label>
<input name="user" id="user" required bind:value={remoteDatabase.user} />
</div>
<div class="mt-2 grid grid-cols-2 items-center px-4">
<label for="password" class="text-base font-bold text-stone-100">Password</label>
<input name="password" id="password" required bind:value={remoteDatabase.password} />
</div>
<div class="mt-2 grid grid-cols-2 items-center px-4">
<label for="database" class="text-base font-bold text-stone-100">Database Name</label>
<input name="database" id="database" required bind:value={remoteDatabase.database} />
</div>
</div>
</div>
</div>

63
apps/ui/src/routes/applications/[id]/index.svelte
View File

@@ -31,7 +31,6 @@
import { page } from '$app/stores';
import { onDestroy, onMount } from 'svelte';
import Select from 'svelte-select';
import { get, post } from '$lib/api';
import cuid from 'cuid';
import {
@@ -40,13 +39,15 @@
checkIfDeploymentEnabledApplications,
setLocation,
status,
isDeploymentEnabled
isDeploymentEnabled,
features
} from '$lib/store';
import { t } from '$lib/translations';
import { errorNotification, getDomain, notNodeDeployments, staticDeployments } from '$lib/common';
import Setting from '$lib/components/Setting.svelte';
import Tooltip from '$lib/components/Tooltip.svelte';
import Explainer from '$lib/components/Explainer.svelte';
import { goto } from '$app/navigation';
const { id } = $page.params;
@@ -73,6 +74,7 @@
let isBot = application.settings.isBot;
let isDBBranching = application.settings.isDBBranching;
let baseDatabaseBranch: any = application?.connectedDatabase?.hostedDatabaseDBName || null;
let nonWWWDomain = application.fqdn && getDomain(application.fqdn).replace(/^www\./, '');
let isNonWWWDomainOK = false;
let isWWWDomainOK = false;
@@ -172,7 +174,6 @@
}
if (name === 'isDBBranching') {
isDBBranching = !isDBBranching;
application.settings.isDBBranching = isDBBranching;
}
try {
await post(`/applications/${id}/settings`, {
@@ -181,6 +182,7 @@
dualCerts,
isBot,
autodeploy,
isDBBranching,
branch: application.branch,
projectId: application.projectId
});
@@ -204,6 +206,9 @@
if (name === 'isBot') {
isBot = !isBot;
}
if (name === 'isDBBranching') {
isDBBranching = !isDBBranching;
}
return errorNotification(error);
} finally {
$isDeploymentEnabled = checkIfDeploymentEnabledApplications($appSession.isAdmin, application);
@@ -223,7 +228,7 @@
dualCerts,
exposePort: application.exposePort
}));
await post(`/applications/${id}`, { ...application });
await post(`/applications/${id}`, { ...application, baseDatabaseBranch });
setLocation(application, settings);
$isDeploymentEnabled = checkIfDeploymentEnabledApplications($appSession.isAdmin, application);
@@ -525,6 +530,46 @@
</div>
</div>
{/if}
{#if $features.beta}
{#if !application.settings.isBot && !application.settings.isPublicRepository}
<div class="grid grid-cols-2 items-center">
<Setting
id="isDBBranching"
isCenter={false}
bind:setting={isDBBranching}
on:click={() => changeSettings('isDBBranching')}
title="Enable DB Branching"
description="Enable DB Branching"
/>
</div>
{#if isDBBranching}
<button
on:click|stopPropagation|preventDefault={() =>
goto(`/applications/${id}/configuration/database`)}
class="btn btn-sm">Configure Connected Database</button
>
{#if application.connectedDatabase}
<div class="grid grid-cols-2 items-center">
<label for="baseImage" class="text-base font-bold text-stone-100"
>Base Database
<Explainer
explanation={'The name of the database that will be used as base when branching.'}
/></label
>
<input
name="baseDatabaseBranch"
required
id="baseDatabaseBranch"
bind:value={baseDatabaseBranch}
/>
</div>
<div class="text-center bg-green-600 rounded">
Connected to {application.connectedDatabase.databaseId}
</div>
{/if}
{/if}
{/if}
{/if}
</div>
<div class="flex space-x-1 py-5 font-bold">
<div class="title">{$t('application.application')}</div>
@@ -846,16 +891,6 @@
/>
</div>
{/if}
<div class="grid grid-cols-2 items-center">
<Setting
id="isDBBranching"
isCenter={false}
bind:setting={isDBBranching}
on:click={() => changeSettings('isDBBranching')}
title="Enable DB Branching"
description="Enable DB Branching"
/>
</div>
<div class="grid grid-cols-2 items-center">
<Setting
id="debug"