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

feat: remote docker engine

Browse Source
This commit is contained in:
Andras Bacsai
2022-07-21 12:43:53 +00:00
parent 4df32a9bc0
commit 890ea2e2d4
29 changed files with 598 additions and 503 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
apps/ui/src/routes/destinations/[id]/_LocalDocker.svelte
View File

@@ -14,23 +14,25 @@
const { id } = $page.params;
let cannotDisable = settings.fqdn && destination.engine === '/var/run/docker.sock';
let loading = false;
let loadingProxy = false;
let restarting = false;
let loading = {
restart: false,
proxy: false,
save: false
};
async function handleSubmit() {
loading = true;
loading.save = true;
try {
return await post(`/destinations/${id}`, { ...destination });
await post(`/destinations/${id}`, { ...destination });
toast.push('Configuration saved.');
} catch (error) {
return errorNotification(error);
} finally {
loading = false;
loading.save = false;
}
}
onMount(async () => {
loadingProxy = true;
loading.proxy = true;
const { isRunning } = await get(`/destinations/${id}/status`);
let proxyUsed = !destination.isCoolifyProxyUsed;
if (isRunning === false && destination.isCoolifyProxyUsed === true) {
@@ -54,9 +56,10 @@
} catch (error) {
return errorNotification(error);
} finally {
loadingProxy = false;
loading.proxy = false;
}
}
loading.proxy = false;
});
async function changeProxySetting() {
if (!cannotDisable) {
@@ -73,7 +76,7 @@
}
destination.isCoolifyProxyUsed = !destination.isCoolifyProxyUsed;
try {
loadingProxy = true;
loading.proxy = true;
await post(`/destinations/${id}/settings`, {
isCoolifyProxyUsed: destination.isCoolifyProxyUsed,
engine: destination.engine
@@ -86,7 +89,7 @@
} catch (error) {
return errorNotification(error);
} finally {
loadingProxy = false;
loading.proxy = false;
}
}
}
@@ -110,7 +113,7 @@
const sure = confirm($t('destination.confirm_restart_proxy'));
if (sure) {
try {
restarting = true;
loading.restart = true;
toast.push($t('destination.coolify_proxy_restarting'));
await post(`/destinations/${id}/restart`, {
engine: destination.engine,
@@ -121,7 +124,7 @@
window.location.reload();
}, 5000);
} finally {
restarting = false;
loading.restart = false;
}
}
}
@@ -134,16 +137,16 @@
<button
type="submit"
class="bg-sky-600 hover:bg-sky-500"
class:bg-sky-600={!loading}
class:hover:bg-sky-500={!loading}
disabled={loading}
>{loading ? $t('forms.saving') : $t('forms.save')}
class:bg-sky-600={!loading.save}
class:hover:bg-sky-500={!loading.save}
disabled={loading.save}
>{loading.save ? $t('forms.saving') : $t('forms.save')}
</button>
<button
class={restarting ? '' : 'bg-red-600 hover:bg-red-500'}
disabled={restarting}
class={loading.restart ? '' : 'bg-red-600 hover:bg-red-500'}
disabled={loading.restart}
on:click|preventDefault={forceRestartProxy}
>{restarting
>{loading.restart
? $t('destination.restarting_please_wait')
: $t('destination.force_restart_proxy')}</button
>
@@ -185,7 +188,7 @@
{#if $appSession.teamId === '0'}
<div class="grid grid-cols-2 items-center">
<Setting
loading={loadingProxy}
loading={loading.proxy}
disabled={cannotDisable}
bind:setting={destination.isCoolifyProxyUsed}
on:click={changeProxySetting}

7
apps/ui/src/routes/destinations/[id]/_New.svelte
View File

@@ -21,10 +21,9 @@
payload = {
name: $t('sources.remote_docker'),
remoteEngine: true,
ipAddress: null,
user: 'root',
port: 22,
sshPrivateKey: null,
remoteIpAddress: null,
remoteUser: 'root',
remotePort: 22,
network: cuid(),
isCoolifyProxyUsed: true
};

17
apps/ui/src/routes/destinations/[id]/_NewRemoteDocker.svelte
View File

@@ -18,8 +18,7 @@
const { id } = await post(`/destinations/new`, {
...payload
});
await goto(`/destinations/${id}`);
window.location.reload();
return await goto(`/destinations/${id}`);
} catch (error) {
return errorNotification(error);
} finally {
@@ -50,25 +49,25 @@
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="ipAddress" class="text-base font-bold text-stone-100"
<label for="remoteIpAddress" class="text-base font-bold text-stone-100"
>{$t('forms.ip_address')}</label
>
<input
required
name="ipAddress"
name="remoteIpAddress"
placeholder="{$t('forms.eg')}: 192.168..."
bind:value={payload.ipAddress}
bind:value={payload.remoteIpAddress}
/>
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="user" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
<input required name="user" placeholder="{$t('forms.eg')}: root" bind:value={payload.user} />
<label for="remoteUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
<input required name="remoteUser" placeholder="{$t('forms.eg')}: root" bind:value={payload.remoteUser} />
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="port" class="text-base font-bold text-stone-100">{$t('forms.port')}</label>
<input required name="port" placeholder="{$t('forms.eg')}: 22" bind:value={payload.port} />
<label for="remotePort" class="text-base font-bold text-stone-100">{$t('forms.port')}</label>
<input required name="remotePort" placeholder="{$t('forms.eg')}: 22" bind:value={payload.remotePort} />
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="network" class="text-base font-bold text-stone-100">{$t('forms.network')}</label>

123
apps/ui/src/routes/destinations/[id]/_RemoteDocker.svelte
View File

@@ -9,56 +9,65 @@
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import { onMount } from 'svelte';
import { t } from '$lib/translations';
import { errorNotification, generateRemoteEngine } from '$lib/common';
import { errorNotification } from '$lib/common';
import { appSession } from '$lib/store';
const { id } = $page.params;
let cannotDisable = settings.fqdn && destination.engine === '/var/run/docker.sock';
let loading = false;
let loadingProxy = true;
let restarting = false;
let loading = {
restart: false,
proxy: true,
save: false,
verify: false
};
$: isDisabled = !$appSession.isAdmin;
async function handleSubmit() {
loading = true;
loading.save = true;
try {
return await post(`/destinations/${id}`, { ...destination });
await post(`/destinations/${id}`, { ...destination });
toast.push('Configuration saved.');
} catch (error) {
return errorNotification(error);
} finally {
loading = false;
loading.save = false;
}
}
onMount(async () => {
loadingProxy = true;
const { isRunning } = await get(`/destinations/${id}/status`);
if (isRunning === false && destination.isCoolifyProxyUsed === true) {
destination.isCoolifyProxyUsed = !destination.isCoolifyProxyUsed;
try {
await post(`/destinations/${id}/settings`, {
isCoolifyProxyUsed: destination.isCoolifyProxyUsed,
engine: destination.engine
});
await stopProxy();
} catch (error) {
return errorNotification(error);
}
} else if (isRunning === true && destination.isCoolifyProxyUsed === false) {
destination.isCoolifyProxyUsed = !destination.isCoolifyProxyUsed;
try {
await post(`/destinations/${id}/settings`, {
isCoolifyProxyUsed: destination.isCoolifyProxyUsed,
engine: destination.engine
});
await startProxy();
} catch (error) {
return errorNotification(error);
loading.proxy = true;
if (destination.remoteEngine && destination.remoteVerified) {
const { isRunning } = await get(`/destinations/${id}/status`);
if (isRunning === false && destination.isCoolifyProxyUsed === true) {
destination.isCoolifyProxyUsed = !destination.isCoolifyProxyUsed;
try {
await post(`/destinations/${id}/settings`, {
isCoolifyProxyUsed: destination.isCoolifyProxyUsed,
engine: destination.engine
});
await stopProxy();
} catch (error) {
return errorNotification(error);
}
} else if (isRunning === true && destination.isCoolifyProxyUsed === false) {
destination.isCoolifyProxyUsed = !destination.isCoolifyProxyUsed;
try {
await post(`/destinations/${id}/settings`, {
isCoolifyProxyUsed: destination.isCoolifyProxyUsed,
engine: destination.engine
});
await startProxy();
} catch (error) {
return errorNotification(error);
}
}
}
loadingProxy = false;
loading.proxy = false;
});
async function changeProxySetting() {
loadingProxy = true;
loading.proxy = true;
if (!cannotDisable) {
const isProxyActivated = destination.isCoolifyProxyUsed;
if (isProxyActivated) {
@@ -68,7 +77,7 @@
} Coolify proxy? It will remove the proxy for all configured networks and all deployments! Nothing will be reachable if you do it!`
);
if (!sure) {
loadingProxy = false;
loading.proxy = false;
return;
}
}
@@ -87,7 +96,7 @@
} catch (error) {
return errorNotification(error);
} finally {
loadingProxy = false;
loading.proxy = false;
}
}
}
@@ -111,7 +120,7 @@
const sure = confirm($t('destination.confirm_restart_proxy'));
if (sure) {
try {
restarting = true;
loading.restart = true;
toast.push($t('destination.coolify_proxy_restarting'));
await post(`/destinations/${id}/restart`, {
engine: destination.engine,
@@ -122,18 +131,21 @@
window.location.reload();
}, 5000);
} finally {
restarting = false;
loading.restart = false;
}
}
}
async function verifyRemoteDocker() {
try {
loading = true;
return await post(`/destinations/${id}/verify`, {});
loading.verify = true;
await post(`/destinations/${id}/verify`, {});
destination.remoteVerified = true;
toast.push('Remote Docker Engine verified!');
return;
} catch (error) {
return errorNotification(error);
} finally {
loading = false;
loading.verify = false;
}
}
</script>
@@ -145,24 +157,27 @@
<button
type="submit"
class="bg-sky-600 hover:bg-sky-500"
class:bg-sky-600={!loading}
class:hover:bg-sky-500={!loading}
disabled={loading}
>{loading ? $t('forms.saving') : $t('forms.save')}
class:bg-sky-600={!loading.save}
class:hover:bg-sky-500={!loading.save}
disabled={loading.save}
>{loading.save ? $t('forms.saving') : $t('forms.save')}
</button>
{#if !destination.remoteVerified}
<button on:click|preventDefault|stopPropagation={verifyRemoteDocker}
>Verify Remote Docker Engine</button
<button
disabled={loading.verify}
on:click|preventDefault|stopPropagation={verifyRemoteDocker}
>{loading.verify ? 'Verifying...' : 'Verify Remote Docker Engine'}</button
>
{:else}
<button
class={loading.restart ? '' : 'bg-red-600 hover:bg-red-500'}
disabled={loading.restart}
on:click|preventDefault={forceRestartProxy}
>{loading.restart
? $t('destination.restarting_please_wait')
: $t('destination.force_restart_proxy')}</button
>
{/if}
<button
class={restarting ? '' : 'bg-red-600 hover:bg-red-500'}
disabled={restarting}
on:click|preventDefault={forceRestartProxy}
>{restarting
? $t('destination.restarting_please_wait')
: $t('destination.force_restart_proxy')}</button
>
{/if}
</div>
<div class="grid grid-cols-2 items-center px-10 ">
@@ -232,7 +247,7 @@
<div class="grid grid-cols-2 items-center">
<Setting
disabled={cannotDisable}
loading={loadingProxy}
loading={loading.proxy}
bind:setting={destination.isCoolifyProxyUsed}
on:click={changeProxySetting}
title={$t('destination.use_coolify_proxy')}