mirror of
https://github.com/cupcakearmy/coolify.git
synced 2024-10-22 08:04:19 +02:00
v1.0.19 (#64)
This commit is contained in:
Andras Bacsai
GitHub
parent
dae91267e8
commit
d43cd663d2
@ -50,6 +50,8 @@ ### Services
|
||||
|
||||
- [Plausible Analytics](https://plausible.io)
|
||||
- [NocoDB](https://nocodb.com)
|
||||
- [VSCode Server](https://github.com/cdr/code-server)
|
||||
- [MinIO](https://min.io)
|
||||
|
||||
## Support
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "coolify",
|
||||
"description": "An open-source, hassle-free, self-hostable Heroku & Netlify alternative.",
|
||||
"version": "1.0.18",
|
||||
"version": "1.0.19",
|
||||
"license": "AGPL-3.0",
|
||||
"scripts": {
|
||||
"dev:docker:start": "docker-compose -f docker-compose-dev.yml up -d",
|
||||
@ -30,7 +30,7 @@
|
||||
"prettier-plugin-svelte": "^2.3.0",
|
||||
"svelte": "^3.38.2",
|
||||
"svelte-preprocess": "^4.7.3",
|
||||
"tailwindcss": "2.2.0-canary.8",
|
||||
"tailwindcss": "2.2.0",
|
||||
"tslib": "^2.2.0",
|
||||
"typescript": "^4.3.2",
|
||||
"vite": "^2.3.6"
|
||||
|
||||
2393
pnpm-lock.yaml
2393
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
@ -339,7 +339,7 @@
|
||||
>
|
||||
<span class="sr-only">Use setting</span>
|
||||
<span
|
||||
class="pointer-events-none relative inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"
|
||||
class="pointer-events-none relative inline-block h-5 w-5 rounded-full bg-white shadow transition ease-in-out duration-200"
|
||||
class:translate-x-5={$application.general.isPreviewDeploymentEnabled}
|
||||
class:translate-x-0={!$application.general.isPreviewDeploymentEnabled}
|
||||
>
|
||||
@ -588,7 +588,7 @@
|
||||
|
||||
<style lang="postcss">
|
||||
.buildpack {
|
||||
@apply px-6 py-2 mx-2 my-2 bg-warmGray-800 w-48 ease-in-out transform hover:scale-105 text-center rounded border-2 border-transparent border-dashed cursor-pointer transition duration-100;
|
||||
@apply px-6 py-2 mx-2 my-2 bg-warmGray-800 w-48 ease-in-out hover:scale-105 text-center rounded border-2 border-transparent border-dashed cursor-pointer transition duration-100;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -122,7 +122,7 @@
|
||||
}
|
||||
async function loadPermissions() {
|
||||
const config = await request(
|
||||
`https://api.github.com/apps/${import.meta.env.VITE_GITHUB_APP_NAME}`,
|
||||
`https://api.github.com/apps/${dashify(import.meta.env.VITE_GITHUB_APP_NAME)}`,
|
||||
$session
|
||||
);
|
||||
if (config.permissions['pull_requests'] && config.events.includes('pull_request')) {
|
||||
|
||||
@ -24,7 +24,7 @@
|
||||
|
||||
<div class="text-center text-white">
|
||||
<div class="text-2xl font-bold text-center pb-4">Choose your Git provider</div>
|
||||
<button on:click={login} class="hover:scale-110 transform duration-100 transition">
|
||||
<button on:click={login} class="hover:scale-110 duration-100 transition">
|
||||
<svg
|
||||
class="w-16"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
|
||||
@ -45,7 +45,7 @@
|
||||
{#if $page.path === '/database/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-green-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-green-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class:border-green-600={type === 'mongodb'}
|
||||
on:click={() => (type = 'mongodb')}
|
||||
>
|
||||
@ -55,7 +55,7 @@
|
||||
<div class="text-white">MongoDB</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-red-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-red-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class:border-red-600={type === 'couchdb'}
|
||||
on:click={() => (type = 'couchdb')}
|
||||
>
|
||||
@ -65,7 +65,7 @@
|
||||
<div class="text-white">Couchdb</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-blue-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-blue-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class:border-blue-600={type === 'postgresql'}
|
||||
on:click={() => (type = 'postgresql')}
|
||||
>
|
||||
@ -75,7 +75,7 @@
|
||||
<div class="text-white">PostgreSQL</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-orange-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-orange-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class:border-orange-600={type === 'mysql'}
|
||||
on:click={() => (type = 'mysql')}
|
||||
>
|
||||
@ -85,7 +85,7 @@
|
||||
<div class="text-white">MySQL</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-red-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-red-600 p-2 rounded bg-warmGray-800 w-32"
|
||||
class:border-red-600={type === 'redis'}
|
||||
on:click={() => (type = 'redis')}
|
||||
>
|
||||
|
||||
35
src/components/Service/CodeServer.svelte
Normal file
35
src/components/Service/CodeServer.svelte
Normal file
@ -0,0 +1,35 @@
|
||||
<script>
|
||||
import { fade } from 'svelte/transition';
|
||||
import { toast } from '@zerodevx/svelte-toast';
|
||||
import Loading from '../Loading.svelte';
|
||||
import Tooltip from '$components/Tooltip.svelte';
|
||||
import { request } from '$lib/request';
|
||||
import { page, session } from '$app/stores';
|
||||
import PasswordField from '$components/PasswordField.svelte';
|
||||
import { browser } from '$app/env';
|
||||
export let service;
|
||||
|
||||
async function getPassword() {
|
||||
try {
|
||||
const { password } = await request(`/api/v1/services/deploy/${$page.params.name}/password`, $session);
|
||||
service.config.password = password
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
browser && toast.push(`Ooops, there was an error activating users for VSCode Server?!`);
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
{#await getPassword()}
|
||||
<Loading />
|
||||
{:then}
|
||||
<div class="text-left max-w-5xl mx-auto px-6" in:fade={{ duration: 100 }}>
|
||||
<div class="pb-2 pt-5 space-y-4">
|
||||
<div class="flex items-center">
|
||||
<div class="font-bold w-64 text-warmGray-400">Password</div>
|
||||
<PasswordField value={service.config.password} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/await}
|
||||
26
src/components/Service/MinIO.svelte
Normal file
26
src/components/Service/MinIO.svelte
Normal file
@ -0,0 +1,26 @@
|
||||
<script>
|
||||
import { fade } from 'svelte/transition';
|
||||
import { toast } from '@zerodevx/svelte-toast';
|
||||
import Loading from '../Loading.svelte';
|
||||
import Tooltip from '$components/Tooltip.svelte';
|
||||
import { request } from '$lib/request';
|
||||
import { page, session } from '$app/stores';
|
||||
import PasswordField from '$components/PasswordField.svelte';
|
||||
import { browser } from '$app/env';
|
||||
export let service;
|
||||
|
||||
</script>
|
||||
|
||||
<div class="text-left max-w-5xl mx-auto px-6" in:fade={{ duration: 100 }}>
|
||||
<div class="pb-2 pt-5 space-y-4">
|
||||
<div class="flex items-center pt-4">
|
||||
<div class="font-bold w-64 text-warmGray-400">Root User</div>
|
||||
<input class="w-full" value={service.config.generateEnvsMinIO.MINIO_ROOT_USER} disabled />
|
||||
</div>
|
||||
|
||||
<div class="flex items-center">
|
||||
<div class="font-bold w-64 text-warmGray-400">Root Password</div>
|
||||
<PasswordField value={service.config.generateEnvsMinIO.MINIO_ROOT_PASSWORD} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -6,7 +6,7 @@
|
||||
import { request } from '$lib/request';
|
||||
import { page, session } from '$app/stores';
|
||||
import PasswordField from '$components/PasswordField.svelte';
|
||||
import { browser } from '$app/env';
|
||||
import { browser } from '$app/env';
|
||||
export let service;
|
||||
let loading = false;
|
||||
async function activate() {
|
||||
@ -24,6 +24,7 @@ import { browser } from '$app/env';
|
||||
loading = false;
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
{#if loading}
|
||||
|
||||
@ -101,6 +101,7 @@ export async function handle({ request, resolve }) {
|
||||
cookie: { path: '/' }
|
||||
});
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
return {
|
||||
status: 302,
|
||||
headers: {
|
||||
|
||||
@ -287,7 +287,7 @@
|
||||
</main>
|
||||
{#if upgradeAvailable && $page.path !== '/success' && $page.path !== '/'}
|
||||
<footer
|
||||
class="fixed bottom-0 right-0 p-4 px-6 w-auto rounded-tl text-white hover:scale-110 transform transition duration-100"
|
||||
class="fixed bottom-0 right-0 p-4 px-6 w-auto rounded-tl text-white hover:scale-110 transition duration-100"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
<div />
|
||||
|
||||
74
src/routes/api/v1/services/deploy/code-server/index.ts
Normal file
74
src/routes/api/v1/services/deploy/code-server/index.ts
Normal file
@ -0,0 +1,74 @@
|
||||
import type { Request } from '@sveltejs/kit';
|
||||
import yaml from 'js-yaml';
|
||||
import { promises as fs } from 'fs';
|
||||
import { docker } from '$lib/api/docker';
|
||||
import { baseServiceConfiguration } from '$lib/api/applications/common';
|
||||
import { cleanupTmp, execShellAsync } from '$lib/api/common';
|
||||
|
||||
export async function post(request: Request) {
|
||||
let { baseURL } = request.body;
|
||||
const traefikURL = baseURL;
|
||||
baseURL = `https://${baseURL}`;
|
||||
const workdir = '/tmp/code-server';
|
||||
const deployId = 'code-server';
|
||||
// const environment = [
|
||||
// { name: 'DOCKER_USER', value: 'root' }
|
||||
|
||||
// ];
|
||||
// const generateEnvsCodeServer = {};
|
||||
// for (const env of environment) generateEnvsCodeServer[env.name] = env.value;
|
||||
|
||||
const stack = {
|
||||
version: '3.8',
|
||||
services: {
|
||||
[deployId]: {
|
||||
image: 'codercom/code-server',
|
||||
command: 'code-server --disable-telemetry',
|
||||
networks: [`${docker.network}`],
|
||||
volumes: [`${deployId}-code-server-data:/home/coder`],
|
||||
// environment: generateEnvsCodeServer,
|
||||
deploy: {
|
||||
...baseServiceConfiguration,
|
||||
labels: [
|
||||
'managedBy=coolify',
|
||||
'type=service',
|
||||
'serviceName=code-server',
|
||||
'configuration=' +
|
||||
JSON.stringify({
|
||||
baseURL
|
||||
}),
|
||||
'traefik.enable=true',
|
||||
'traefik.http.services.' + deployId + '.loadbalancer.server.port=8080',
|
||||
'traefik.http.routers.' + deployId + '.entrypoints=websecure',
|
||||
'traefik.http.routers.' +
|
||||
deployId +
|
||||
'.rule=Host(`' +
|
||||
traefikURL +
|
||||
'`) && PathPrefix(`/`)',
|
||||
'traefik.http.routers.' + deployId + '.tls.certresolver=letsencrypt',
|
||||
'traefik.http.routers.' + deployId + '.middlewares=global-compress'
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
networks: {
|
||||
[`${docker.network}`]: {
|
||||
external: true
|
||||
}
|
||||
},
|
||||
volumes: {
|
||||
[`${deployId}-code-server-data`]: {
|
||||
external: true
|
||||
},
|
||||
},
|
||||
};
|
||||
await execShellAsync(`mkdir -p ${workdir}`);
|
||||
await fs.writeFile(`${workdir}/stack.yml`, yaml.dump(stack));
|
||||
await execShellAsync('docker stack rm code-server');
|
||||
await execShellAsync(`cat ${workdir}/stack.yml | docker stack deploy --prune -c - ${deployId}`);
|
||||
cleanupTmp(workdir);
|
||||
return {
|
||||
status: 200,
|
||||
body: { message: 'OK' }
|
||||
};
|
||||
}
|
||||
25
src/routes/api/v1/services/deploy/code-server/password.ts
Normal file
25
src/routes/api/v1/services/deploy/code-server/password.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { execShellAsync } from '$lib/api/common';
|
||||
import type { Request } from '@sveltejs/kit';
|
||||
import yaml from "js-yaml"
|
||||
|
||||
export async function get(request: Request) {
|
||||
// const { POSTGRESQL_USERNAME, POSTGRESQL_PASSWORD, POSTGRESQL_DATABASE } = JSON.parse(
|
||||
// JSON.parse(
|
||||
// await execShellAsync(
|
||||
// "docker service inspect code-server_code-server --format='{{json .Spec.Labels.configuration}}'"
|
||||
// )
|
||||
// )
|
||||
// ).generateEnvsPostgres;
|
||||
const containers = (await execShellAsync("docker ps -a --format='{{json .Names}}'"))
|
||||
.replace(/"/g, '')
|
||||
.trim()
|
||||
.split('\n');
|
||||
const codeServer = containers.find((container) => container.startsWith('code-server'));
|
||||
const configYaml = yaml.load(await execShellAsync(
|
||||
`docker exec ${codeServer} cat /home/coder/.config/code-server/config.yaml`
|
||||
))
|
||||
return {
|
||||
status: 200,
|
||||
body: { message: 'OK', password: configYaml.password }
|
||||
};
|
||||
}
|
||||
77
src/routes/api/v1/services/deploy/minio/index.ts
Normal file
77
src/routes/api/v1/services/deploy/minio/index.ts
Normal file
@ -0,0 +1,77 @@
|
||||
import type { Request } from '@sveltejs/kit';
|
||||
import yaml from 'js-yaml';
|
||||
import generator from 'generate-password';
|
||||
import { promises as fs } from 'fs';
|
||||
import { docker } from '$lib/api/docker';
|
||||
import { baseServiceConfiguration } from '$lib/api/applications/common';
|
||||
import { cleanupTmp, execShellAsync } from '$lib/api/common';
|
||||
|
||||
export async function post(request: Request) {
|
||||
let { baseURL } = request.body;
|
||||
const traefikURL = baseURL;
|
||||
baseURL = `https://${baseURL}`;
|
||||
const workdir = '/tmp/minio';
|
||||
const deployId = 'minio';
|
||||
const secrets = [
|
||||
{ name: 'MINIO_ROOT_USER', value: generator.generate({ length: 12, numbers: true, strict: true }) },
|
||||
{ name: 'MINIO_ROOT_PASSWORD', value: generator.generate({ length: 24, numbers: true, strict: true }) }
|
||||
|
||||
];
|
||||
const generateEnvsMinIO = {};
|
||||
for (const secret of secrets) generateEnvsMinIO[secret.name] = secret.value;
|
||||
|
||||
const stack = {
|
||||
version: '3.8',
|
||||
services: {
|
||||
[deployId]: {
|
||||
image: 'minio/minio',
|
||||
command: 'server /data',
|
||||
networks: [`${docker.network}`],
|
||||
environment: generateEnvsMinIO,
|
||||
volumes: [`${deployId}-minio-data:/data`],
|
||||
deploy: {
|
||||
...baseServiceConfiguration,
|
||||
labels: [
|
||||
'managedBy=coolify',
|
||||
'type=service',
|
||||
'serviceName=minio',
|
||||
'configuration=' +
|
||||
JSON.stringify({
|
||||
baseURL,
|
||||
generateEnvsMinIO
|
||||
}),
|
||||
'traefik.enable=true',
|
||||
'traefik.http.services.' + deployId + '.loadbalancer.server.port=9000',
|
||||
'traefik.http.routers.' + deployId + '.entrypoints=websecure',
|
||||
'traefik.http.routers.' +
|
||||
deployId +
|
||||
'.rule=Host(`' +
|
||||
traefikURL +
|
||||
'`) && PathPrefix(`/`)',
|
||||
'traefik.http.routers.' + deployId + '.tls.certresolver=letsencrypt',
|
||||
'traefik.http.routers.' + deployId + '.middlewares=global-compress'
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
networks: {
|
||||
[`${docker.network}`]: {
|
||||
external: true
|
||||
}
|
||||
},
|
||||
volumes: {
|
||||
[`${deployId}-minio-data`]: {
|
||||
external: true
|
||||
},
|
||||
},
|
||||
};
|
||||
await execShellAsync(`mkdir -p ${workdir}`);
|
||||
await fs.writeFile(`${workdir}/stack.yml`, yaml.dump(stack));
|
||||
await execShellAsync('docker stack rm minio');
|
||||
await execShellAsync(`cat ${workdir}/stack.yml | docker stack deploy --prune -c - ${deployId}`);
|
||||
cleanupTmp(workdir);
|
||||
return {
|
||||
status: 200,
|
||||
body: { message: 'OK' }
|
||||
};
|
||||
}
|
||||
@ -37,7 +37,7 @@
|
||||
{#each $dashboard.applications.deployed as application}
|
||||
<div class="px-4 pb-4">
|
||||
<div
|
||||
class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-green-500 text-white shadow-md cursor-pointer ease-in-out transform hover:scale-105 duration-100 group"
|
||||
class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-green-500 text-white shadow-md cursor-pointer ease-in-out hover:scale-105 duration-100 group"
|
||||
on:click={() => {
|
||||
goto(
|
||||
`/application/${application.configuration.repository.organization}/${application.configuration.repository.name}/${application.configuration.repository.branch}/configuration`
|
||||
|
||||
@ -45,7 +45,7 @@
|
||||
goto(`/database/${database.configuration.general.deployId}/configuration`)}
|
||||
>
|
||||
<div
|
||||
class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-purple-500 text-white shadow-md cursor-pointer ease-in-out transform hover:scale-105 duration-100 group"
|
||||
class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-purple-500 text-white shadow-md cursor-pointer ease-in-out hover:scale-105 duration-100 group"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
{#if database.configuration.general.type == 'mongodb'}
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
on:click={() => goto(`/service/${service.serviceName}/configuration`)}
|
||||
>
|
||||
<div
|
||||
class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-blue-500 text-white shadow-md cursor-pointer ease-in-out transform hover:scale-105 duration-100 group"
|
||||
class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-blue-500 text-white shadow-md cursor-pointer ease-in-out hover:scale-105 duration-100 group"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
{#if service.serviceName == 'plausible'}
|
||||
@ -58,6 +58,24 @@
|
||||
/>
|
||||
<div class="text-white font-bold">NocoDB</div>
|
||||
</div>
|
||||
{:else if service.serviceName == 'code-server'}
|
||||
<div>
|
||||
<svg class="w-10 absolute top-0 left-0 -m-6" viewBox="0 0 128 128">
|
||||
<path d="M3.656 45.043s-3.027-2.191.61-5.113l8.468-7.594s2.426-2.559 4.989-.328l78.175 59.328v28.45s-.039 4.468-5.757 3.976zm0 0" fill="#2489ca"></path><path d="M23.809 63.379L3.656 81.742s-2.07 1.543 0 4.305l9.356 8.527s2.222 2.395 5.508-.328l21.359-16.238zm0 0" fill="#1070b3"></path><path d="M59.184 63.531l36.953-28.285-.239-28.297S94.32.773 89.055 3.99L39.879 48.851zm0 0" fill="#0877b9"></path><path d="M90.14 123.797c2.145 2.203 4.747 1.48 4.747 1.48l28.797-14.222c3.687-2.52 3.171-5.645 3.171-5.645V20.465c0-3.735-3.812-5.024-3.812-5.024L98.082 3.38c-5.453-3.379-9.027.61-9.027.61s4.593-3.317 6.843 2.96v112.317c0 .773-.164 1.53-.492 2.214-.656 1.332-2.086 2.57-5.504 2.051zm0 0" fill="#3c99d4"></path>
|
||||
</svg>
|
||||
|
||||
<div class="text-white font-bold">VSCode Server</div>
|
||||
</div>
|
||||
{:else if service.serviceName == 'minio'}
|
||||
<div>
|
||||
<img
|
||||
alt="minio"
|
||||
class="w-7 absolute top-0 left-0 -my-7 -mx-3"
|
||||
src="https://cdn.coollabs.io/assets/coolify/services/minio/MINIO_Bird.png"
|
||||
/>
|
||||
|
||||
<div class="text-white font-bold">MinIO</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -8,6 +8,8 @@
|
||||
import Loading from '$components/Loading.svelte';
|
||||
import Plausible from '$components/Service/Plausible.svelte';
|
||||
import { browser } from '$app/env';
|
||||
import CodeServer from '$components/Service/CodeServer.svelte';
|
||||
import MinIo from '$components/Service/MinIO.svelte';
|
||||
let service = {};
|
||||
async function loadServiceConfig() {
|
||||
if ($page.params.name) {
|
||||
@ -33,6 +35,10 @@
|
||||
<div>Plausible Analytics</div>
|
||||
{:else if $page.params.name === 'nocodb'}
|
||||
<div>NocoDB</div>
|
||||
{:else if $page.params.name === 'code-server'}
|
||||
<div>VSCode Server</div>
|
||||
{:else if $page.params.name === 'minio'}
|
||||
<div>MinIO</div>
|
||||
{/if}
|
||||
|
||||
<div class="px-4">
|
||||
@ -48,6 +54,28 @@
|
||||
class="w-8 mx-auto"
|
||||
src="https://cdn.coollabs.io/assets/coolify/services/nocodb/nocodb.png"
|
||||
/>
|
||||
{:else if $page.params.name === 'code-server'}
|
||||
<svg class="w-8 mx-auto" viewBox="0 0 128 128">
|
||||
<path
|
||||
d="M3.656 45.043s-3.027-2.191.61-5.113l8.468-7.594s2.426-2.559 4.989-.328l78.175 59.328v28.45s-.039 4.468-5.757 3.976zm0 0"
|
||||
fill="#2489ca"
|
||||
/><path
|
||||
d="M23.809 63.379L3.656 81.742s-2.07 1.543 0 4.305l9.356 8.527s2.222 2.395 5.508-.328l21.359-16.238zm0 0"
|
||||
fill="#1070b3"
|
||||
/><path
|
||||
d="M59.184 63.531l36.953-28.285-.239-28.297S94.32.773 89.055 3.99L39.879 48.851zm0 0"
|
||||
fill="#0877b9"
|
||||
/><path
|
||||
d="M90.14 123.797c2.145 2.203 4.747 1.48 4.747 1.48l28.797-14.222c3.687-2.52 3.171-5.645 3.171-5.645V20.465c0-3.735-3.812-5.024-3.812-5.024L98.082 3.38c-5.453-3.379-9.027.61-9.027.61s4.593-3.317 6.843 2.96v112.317c0 .773-.164 1.53-.492 2.214-.656 1.332-2.086 2.57-5.504 2.051zm0 0"
|
||||
fill="#3c99d4"
|
||||
/>
|
||||
</svg>
|
||||
{:else if $page.params.name === 'minio'}
|
||||
<img
|
||||
alt="minio logo"
|
||||
class="w-7 mx-auto"
|
||||
src="https://cdn.coollabs.io/assets/coolify/services/minio/MINIO_Bird.png"
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
<a target="_blank" class="icon mx-2" href={service.config.baseURL}>
|
||||
@ -74,6 +102,10 @@
|
||||
<Plausible {service} />
|
||||
{:else if $page.params.name === 'nocodb'}
|
||||
<div class="font-bold">Nothing to show here. Enjoy using NocoDB!</div>
|
||||
{:else if $page.params.name === 'code-server'}
|
||||
<CodeServer {service} />
|
||||
{:else if $page.params.name === 'minio'}
|
||||
<MinIo {service} />
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,8 +1,6 @@
|
||||
<script>
|
||||
import { browser } from '$app/env';
|
||||
|
||||
import { goto } from '$app/navigation';
|
||||
|
||||
import { page, session } from '$app/stores';
|
||||
import Loading from '$components/Loading.svelte';
|
||||
import { request } from '$lib/request';
|
||||
|
||||
@ -21,6 +21,11 @@
|
||||
$newService.userPassword === null ||
|
||||
$newService.userPassword.length <= 6 ||
|
||||
$newService.userPassword !== $newService.userPasswordAgain;
|
||||
|
||||
$: deployableNocoDB = $newService.baseURL === '' || $newService.baseURL === null;
|
||||
$: deployableCodeServer = $newService.baseURL === '' || $newService.baseURL === null;
|
||||
$: deployableMinIO = $newService.baseURL === '' || $newService.baseURL === null;
|
||||
|
||||
let loading = false;
|
||||
async function deployPlausible() {
|
||||
try {
|
||||
@ -45,7 +50,50 @@
|
||||
}
|
||||
}
|
||||
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;
|
||||
}
|
||||
}
|
||||
async function deployCodeServer() {
|
||||
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;
|
||||
}
|
||||
}
|
||||
async function deployMinIO() {
|
||||
try {
|
||||
loading = true;
|
||||
await request(`/api/v1/services/deploy/${$page.params.type}`, $session, {
|
||||
@ -77,6 +125,10 @@
|
||||
<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>
|
||||
{:else if $page.params.type === 'code-server'}
|
||||
<span class="text-blue-500 px-2 capitalize">VSCode Server</span>
|
||||
{:else if $page.params.type === 'minio'}
|
||||
<span class="text-blue-500 px-2 capitalize">MinIO</span>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
@ -171,10 +223,79 @@
|
||||
</div>
|
||||
|
||||
<button
|
||||
disabled={deployableNocoDB}
|
||||
class:cursor-not-allowed={deployableNocoDB}
|
||||
class:bg-blue-500={!deployableNocoDB}
|
||||
class:hover:bg-blue-400={!deployableNocoDB}
|
||||
class:hover:bg-transparent={deployableNocoDB}
|
||||
class:text-warmGray-700={deployableNocoDB}
|
||||
class:text-white={!deployableNocoDB}
|
||||
class="button p-2 w-64 bg-blue-500 hover:bg-blue-400 text-white"
|
||||
on:click={deployNocodb}
|
||||
>
|
||||
Deploy
|
||||
</button>
|
||||
</div>
|
||||
{:else if $page.params.type === 'code-server'}
|
||||
<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 Code Server instance here.`}
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
id="Domain"
|
||||
class:border-red-500={$newService.baseURL == null || $newService.baseURL == ''}
|
||||
bind:value={$newService.baseURL}
|
||||
placeholder="code.coollabs.io"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
disabled={deployableCodeServer}
|
||||
class:cursor-not-allowed={deployableCodeServer}
|
||||
class:bg-blue-500={!deployableCodeServer}
|
||||
class:hover:bg-blue-400={!deployableCodeServer}
|
||||
class:hover:bg-transparent={deployableCodeServer}
|
||||
class:text-warmGray-700={deployableCodeServer}
|
||||
class:text-white={!deployableCodeServer}
|
||||
class="button p-2 w-64 bg-blue-500 hover:bg-blue-400 text-white"
|
||||
on:click={deployCodeServer}
|
||||
>
|
||||
Deploy
|
||||
</button>
|
||||
</div>
|
||||
{:else if $page.params.type === 'minio'}
|
||||
<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 MinIO instance here.`}
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
id="Domain"
|
||||
class:border-red-500={$newService.baseURL == null || $newService.baseURL == ''}
|
||||
bind:value={$newService.baseURL}
|
||||
placeholder="minio.coollabs.io"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
disabled={deployableMinIO}
|
||||
class:cursor-not-allowed={deployableMinIO}
|
||||
class:bg-blue-500={!deployableMinIO}
|
||||
class:hover:bg-blue-400={!deployableMinIO}
|
||||
class:hover:bg-transparent={deployableMinIO}
|
||||
class:text-warmGray-700={deployableMinIO}
|
||||
class:text-white={!deployableMinIO}
|
||||
class="button p-2 w-64 bg-blue-500 hover:bg-blue-400 text-white"
|
||||
on:click={deployMinIO}
|
||||
>
|
||||
Deploy
|
||||
</button>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
import { goto } from '$app/navigation';
|
||||
import { page } from '$app/stores';
|
||||
import { fade } from 'svelte/transition';
|
||||
|
||||
</script>
|
||||
|
||||
<div class="min-h-full text-white">
|
||||
@ -13,7 +14,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 w-48"
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out 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,7 +25,7 @@
|
||||
<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"
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out 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
|
||||
@ -35,6 +36,40 @@
|
||||
<div class="flex-1" />
|
||||
<div class="text-white">NocoDB</div>
|
||||
</div>
|
||||
<div
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-green-500 p-2 rounded bg-warmGray-800 w-48"
|
||||
on:click={() => goto('/service/new/code-server')}
|
||||
>
|
||||
<svg class="w-14 mx-auto pb-2" viewBox="0 0 128 128">
|
||||
<path
|
||||
d="M3.656 45.043s-3.027-2.191.61-5.113l8.468-7.594s2.426-2.559 4.989-.328l78.175 59.328v28.45s-.039 4.468-5.757 3.976zm0 0"
|
||||
fill="#2489ca"
|
||||
/><path
|
||||
d="M23.809 63.379L3.656 81.742s-2.07 1.543 0 4.305l9.356 8.527s2.222 2.395 5.508-.328l21.359-16.238zm0 0"
|
||||
fill="#1070b3"
|
||||
/><path
|
||||
d="M59.184 63.531l36.953-28.285-.239-28.297S94.32.773 89.055 3.99L39.879 48.851zm0 0"
|
||||
fill="#0877b9"
|
||||
/><path
|
||||
d="M90.14 123.797c2.145 2.203 4.747 1.48 4.747 1.48l28.797-14.222c3.687-2.52 3.171-5.645 3.171-5.645V20.465c0-3.735-3.812-5.024-3.812-5.024L98.082 3.38c-5.453-3.379-9.027.61-9.027.61s4.593-3.317 6.843 2.96v112.317c0 .773-.164 1.53-.492 2.214-.656 1.332-2.086 2.57-5.504 2.051zm0 0"
|
||||
fill="#3c99d4"
|
||||
/>
|
||||
</svg>
|
||||
<div class="flex-1" />
|
||||
<div class="text-white">VSCode Server</div>
|
||||
</div>
|
||||
<div
|
||||
class="text-center flex-col items-center cursor-pointer ease-in-out hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-red-500 p-2 rounded bg-warmGray-800 w-48"
|
||||
on:click={() => goto('/service/new/minio')}
|
||||
>
|
||||
<img
|
||||
alt="minio logo"
|
||||
class="w-7 mx-auto pb-2"
|
||||
src="https://cdn.coollabs.io/assets/coolify/services/minio/MINIO_Bird.png"
|
||||
/>
|
||||
<div class="flex-1" />
|
||||
<div class="text-white">MinIO</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
@ -83,7 +83,7 @@
|
||||
>
|
||||
<span class="sr-only">Use setting</span>
|
||||
<span
|
||||
class="pointer-events-none relative inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"
|
||||
class="pointer-events-none relative inline-block h-5 w-5 rounded-full bg-white shadow transition ease-in-out duration-200"
|
||||
class:translate-x-5={settings?.allowRegistration}
|
||||
class:translate-x-0={!settings?.allowRegistration}
|
||||
>
|
||||
@ -143,7 +143,7 @@
|
||||
>
|
||||
<span class="sr-only">Use setting</span>
|
||||
<span
|
||||
class="pointer-events-none relative inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"
|
||||
class="pointer-events-none relative inline-block h-5 w-5 rounded-full bg-white shadow transition ease-in-out duration-200"
|
||||
class:translate-x-5={settings?.sendErrors}
|
||||
class:translate-x-0={!settings?.sendErrors}
|
||||
>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user