Merge remote-tracking branch 'upstream/next' into buildpack-deno

# Conflicts:
#	src/routes/applications/[id]/index.svelte

prisma/migrations/20220418214843_persistent_storage_services/migration.sql

@@ -0,0 +1,12 @@
+-- CreateTable
+CREATE TABLE "ServicePersistentStorage" (
+    "id" TEXT NOT NULL PRIMARY KEY,
+    "serviceId" TEXT NOT NULL,
+    "path" TEXT NOT NULL,
+    "createdAt" DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" DATETIME NOT NULL,
+    CONSTRAINT "ServicePersistentStorage_serviceId_fkey" FOREIGN KEY ("serviceId") REFERENCES "Service" ("id") ON DELETE RESTRICT ON UPDATE CASCADE
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "ServicePersistentStorage_serviceId_path_key" ON "ServicePersistentStorage"("serviceId", "path");

prisma/migrations/20220419203408_multiply_dockerfile_locations/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "Application" ADD COLUMN "dockerFileLocation" TEXT;

prisma/schema.prisma

@@ -1,6 +1,6 @@
 generator client {
-  provider = "prisma-client-js"
+  provider      = "prisma-client-js"
-  binaryTargets = ["linux-musl"]
+  binaryTargets = ["native", "linux-musl"]
 }
 
 datasource db {
@@ -91,6 +91,7 @@ model Application {
   pythonWSGI          String?
   pythonModule        String?
   pythonVariable      String?
+  dockerFileLocation  String?                         
   createdAt           DateTime                       @default(now())
   updatedAt           DateTime                       @updatedAt
   settings            ApplicationSettings?
@@ -118,14 +119,25 @@ model ApplicationSettings {
 model ApplicationPersistentStorage {
   id            String      @id @default(cuid())
   application   Application @relation(fields: [applicationId], references: [id])
-  applicationId String      
+  applicationId String
-  path          String      
+  path          String
   createdAt     DateTime    @default(now())
   updatedAt     DateTime    @updatedAt
 
   @@unique([applicationId, path])
 }
 
+model ServicePersistentStorage {
+  id        String   @id @default(cuid())
+  service   Service  @relation(fields: [serviceId], references: [id])
+  serviceId String
+  path      String
+  createdAt DateTime @default(now())
+  updatedAt DateTime @updatedAt
+
+  @@unique([serviceId, path])
+}
+
 model Secret {
   id            String      @id @default(cuid())
   name          String
@@ -267,17 +279,17 @@ model DatabaseSettings {
 }
 
 model Service {
-  id                  String              @id @default(cuid())
+  id                  String                     @id @default(cuid())
   name                String
   fqdn                String?
-  dualCerts           Boolean             @default(false)
+  dualCerts           Boolean                    @default(false)
   type                String?
   version             String?
   teams               Team[]
   destinationDockerId String?
-  destinationDocker   DestinationDocker?  @relation(fields: [destinationDockerId], references: [id])
+  destinationDocker   DestinationDocker?         @relation(fields: [destinationDockerId], references: [id])
-  createdAt           DateTime            @default(now())
+  createdAt           DateTime                   @default(now())
-  updatedAt           DateTime            @updatedAt
+  updatedAt           DateTime                   @updatedAt
   plausibleAnalytics  PlausibleAnalytics?
   minio               Minio?
   vscodeserver        Vscodeserver?
@@ -285,6 +297,7 @@ model Service {
   ghost               Ghost?
   serviceSecret       ServiceSecret[]
   meiliSearch         MeiliSearch?
+  persistentStorage   ServicePersistentStorage[]
 }
 
 model PlausibleAnalytics {

src/app.d.ts

@@ -6,7 +6,11 @@ declare namespace App {
 		cookies: Record<string, string>;
 	}
 	interface Platform {}
-	interface Session extends SessionData {}
+	interface Session extends SessionData {
+		whiteLabelDetails: {
+			icon: string | null;
+		};
+	}
 	interface Stuff {
 		service: any;
 		application: any;

src/hooks.ts

@@ -8,6 +8,9 @@ import cookie from 'cookie';
 import { dev } from '$app/env';
 
 const whiteLabeled = process.env['COOLIFY_WHITE_LABELED'] === 'true';
+const whiteLabelDetails = {
+	icon: (whiteLabeled && process.env['COOLIFY_WHITE_LABELED_ICON']) || null
+};
 
 export const handle = handleSession(
 	{
@@ -74,6 +77,7 @@ export const getSession: GetSession = function ({ locals }) {
 	return {
 		version,
 		whiteLabeled,
+		whiteLabelDetails,
 		...locals.session.data
 	};
 };

src/lib/buildPacks/common.ts

@@ -91,7 +91,8 @@ export const setDefaultConfiguration = async (data) => {
 		startCommand,
 		buildCommand,
 		publishDirectory,
-		baseDirectory
+		baseDirectory,
+		dockerFileLocation
 	} = data;
 	const template = scanningTemplates[buildPack];
 	if (!port) {
@@ -110,6 +111,12 @@ export const setDefaultConfiguration = async (data) => {
 		if (!baseDirectory.startsWith('/')) baseDirectory = `/${baseDirectory}`;
 		if (!baseDirectory.endsWith('/')) baseDirectory = `${baseDirectory}/`;
 	}
+	if (dockerFileLocation) {
+		if (!dockerFileLocation.startsWith('/')) dockerFileLocation = `/${dockerFileLocation}`;
+		if (dockerFileLocation.endsWith('/')) dockerFileLocation = dockerFileLocation.slice(0, -1);
+	} else {
+		dockerFileLocation = '/Dockerfile';
+	}
 
 	return {
 		buildPack,
@@ -118,7 +125,8 @@ export const setDefaultConfiguration = async (data) => {
 		startCommand,
 		buildCommand,
 		publishDirectory,
-		baseDirectory
+		baseDirectory,
+		dockerFileLocation
 	};
 };
 

src/lib/buildPacks/docker.ts

@@ -10,15 +10,16 @@ export default async function ({
 	buildId,
 	baseDirectory,
 	secrets,
-	pullmergeRequestId
+	pullmergeRequestId,
+	dockerFileLocation
 }) {
 	try {
-		let file = `${workdir}/Dockerfile`;
+		const file = `${workdir}${dockerFileLocation}`;
+		let dockerFileOut = `${workdir}`;
 		if (baseDirectory) {
-			file = `${workdir}/${baseDirectory}/Dockerfile`;
+			dockerFileOut = `${workdir}${baseDirectory}`;
-			workdir = `${workdir}/${baseDirectory}`;
+			workdir = `${workdir}${baseDirectory}`;
 		}
-
 		const Dockerfile: Array<string> = (await fs.readFile(`${file}`, 'utf8'))
 			.toString()
 			.trim()
@@ -41,8 +42,8 @@ export default async function ({
 				}
 			});
 		}
-		await fs.writeFile(`${file}`, Dockerfile.join('\n'));
+		await fs.writeFile(`${dockerFileOut}${dockerFileLocation}`, Dockerfile.join('\n'));
-		await buildImage({ applicationId, tag, workdir, docker, buildId, debug });
+		await buildImage({ applicationId, tag, workdir, docker, buildId, debug, dockerFileLocation });
 	} catch (error) {
 		throw error;
 	}

src/lib/database/applications.ts

@@ -263,7 +263,8 @@ export async function configureApplication({
 	publishDirectory,
 	pythonWSGI,
 	pythonModule,
-	pythonVariable
+	pythonVariable,
+	dockerFileLocation
 }: {
 	id: string;
 	buildPack: string;
@@ -278,6 +279,7 @@ export async function configureApplication({
 	pythonWSGI: string;
 	pythonModule: string;
 	pythonVariable: string;
+	dockerFileLocation: string;
 }): Promise<Application> {
 	return await prisma.application.update({
 		where: { id },
@@ -293,7 +295,8 @@ export async function configureApplication({
 			publishDirectory,
 			pythonWSGI,
 			pythonModule,
-			pythonVariable
+			pythonVariable,
+			dockerFileLocation
 		}
 	});
 }

src/lib/database/services.ts

@@ -27,25 +27,35 @@ export async function newService({
 
 export async function getService({ id, teamId }: { id: string; teamId: string }): Promise<Service> {
 	let body;
-	const include = {
-		destinationDocker: true,
-		plausibleAnalytics: true,
-		minio: true,
-		vscodeserver: true,
-		wordpress: true,
-		ghost: true,
-		serviceSecret: true,
-		meiliSearch: true
-	};
 	if (teamId === '0') {
 		body = await prisma.service.findFirst({
 			where: { id },
-			include
+			include: {
+				destinationDocker: true,
+				plausibleAnalytics: true,
+				minio: true,
+				vscodeserver: true,
+				wordpress: true,
+				ghost: true,
+				serviceSecret: true,
+				meiliSearch: true,
+				persistentStorage: true
+			}
 		});
 	} else {
 		body = await prisma.service.findFirst({
 			where: { id, teams: { some: { id: teamId } } },
-			include
+			include: {
+				destinationDocker: true,
+				plausibleAnalytics: true,
+				minio: true,
+				vscodeserver: true,
+				wordpress: true,
+				ghost: true,
+				serviceSecret: true,
+				meiliSearch: true,
+				persistentStorage: true
+			}
 		});
 	}
 
@@ -362,6 +372,7 @@ export async function updateGhostService({
 }
 
 export async function removeService({ id }: { id: string }): Promise<void> {
+	await prisma.servicePersistentStorage.deleteMany({ where: { serviceId: id } });
 	await prisma.meiliSearch.deleteMany({ where: { serviceId: id } });
 	await prisma.ghost.deleteMany({ where: { serviceId: id } });
 	await prisma.plausibleAnalytics.deleteMany({ where: { serviceId: id } });

src/lib/docker.ts

@@ -85,7 +85,8 @@ export async function buildImage({
 	docker,
 	buildId,
 	isCache = false,
-	debug = false
+	debug = false,
+	dockerFileLocation = '/Dockerfile'
 }) {
 	if (isCache) {
 		await saveBuildLog({ line: `Building cache image started.`, buildId, applicationId });
@@ -103,7 +104,7 @@ export async function buildImage({
 	const stream = await docker.engine.buildImage(
 		{ src: ['.'], context: workdir },
 		{
-			dockerfile: isCache ? 'Dockerfile-cache' : 'Dockerfile',
+			dockerfile: isCache ? `${dockerFileLocation}-cache` : dockerFileLocation,
 			t: `${applicationId}:${tag}${isCache ? '-cache' : ''}`
 		}
 	);

src/lib/queues/builder.ts

@@ -56,7 +56,8 @@ export default async function (job: Job<BuilderJob, void, string>): Promise<void
 		buildCommand,
 		startCommand,
 		baseDirectory,
-		publishDirectory
+		publishDirectory,
+		dockerFileLocation
 	} = job.data;
 	const { debug } = settings;
 
@@ -107,6 +108,7 @@ export default async function (job: Job<BuilderJob, void, string>): Promise<void
 		buildCommand = configuration.buildCommand;
 		publishDirectory = configuration.publishDirectory;
 		baseDirectory = configuration.baseDirectory;
+		dockerFileLocation = configuration.dockerFileLocation;
 
 		const commit = await importers[gitSource.type]({
 			applicationId,
@@ -209,7 +211,8 @@ export default async function (job: Job<BuilderJob, void, string>): Promise<void
 					phpModules,
 					pythonWSGI,
 					pythonModule,
-					pythonVariable
+					pythonVariable,
+					dockerFileLocation
 				});
 			else {
 				await saveBuildLog({ line: `Build pack ${buildPack} not found`, buildId, applicationId });

src/lib/types/builderJob.ts

@@ -21,6 +21,7 @@ export type BuilderJob = {
 	pythonWSGI: string;
 	pythonModule: string;
 	pythonVariable: string;
+	dockerFileLocation: string;
 	createdAt: string;
 	updatedAt: string;
 	destinationDockerId: string;

src/routes/applications/[id]/index.json.ts

@@ -56,7 +56,8 @@ export const post: RequestHandler = async (event) => {
 		publishDirectory,
 		pythonWSGI,
 		pythonModule,
-		pythonVariable
+		pythonVariable,
+		dockerFileLocation
 	} = await event.request.json();
 	if (port) port = Number(port);
 
@@ -68,7 +69,8 @@ export const post: RequestHandler = async (event) => {
 			startCommand,
 			buildCommand,
 			publishDirectory,
-			baseDirectory
+			baseDirectory,
+			dockerFileLocation
 		});
 		await db.configureApplication({
 			id,
@@ -84,6 +86,7 @@ export const post: RequestHandler = async (event) => {
 			pythonWSGI,
 			pythonModule,
 			pythonVariable,
+			dockerFileLocation,
 			...defaultConfiguration
 		});
 		return { status: 201 };

src/routes/applications/[id]/index.svelte

@@ -68,11 +68,6 @@
 			value: 'Gunicorn',
 			label: 'Gunicorn'
 		}
-		// },
-		// {
-		// 	value: 'uWSGI',
-		// 	label: 'uWSGI'
-		// }
 	];
 
 	if (browser && window.location.hostname === 'demo.coolify.io' && !application.fqdn) {
@@ -420,6 +415,23 @@
 					/>
 				</div>
 			{/if}
+			{#if application.buildPack === 'docker'}
+				<div class="grid grid-cols-2 items-center">
+					<label for="dockerFileLocation" class="text-base font-bold text-stone-100"
+						>Dockerfile Location</label
+					>
+					<input
+						readonly={!$session.isAdmin}
+						name="dockerFileLocation"
+						id="dockerFileLocation"
+						bind:value={application.dockerFileLocation}
+						placeholder="default: /Dockerfile"
+					/>
+					<Explainer
+						text="Does not rely on Base Directory. <br>Should be absolute path, like <span class='text-green-500 font-bold'>/data/Dockerfile</span> or <span class='text-green-500 font-bold'>/Dockerfile.</span>"
+					/>
+				</div>
+			{/if}
 			{#if application.buildPack === 'deno'}
 				<div class="grid grid-cols-2 items-center">
 					<label for="startCommand" class="text-base font-bold text-stone-100">Start Command</label>

src/routes/applications/[id]/logs/index.json.ts

@@ -27,6 +27,7 @@ export const get: RequestHandler = async (event) => {
 								.split('\n')
 								.map((l) => l.slice(8))
 								.filter((a) => a)
+								.reverse()
 						}
 					};
 				}

src/routes/applications/[id]/logs/index.svelte

@@ -24,19 +24,21 @@
 	export let application;
 	import { page } from '$app/stores';
 	import LoadingLogs from './_Loading.svelte';
-	import { getDomain } from '$lib/components/common';
 	import { get } from '$lib/api';
 	import { errorNotification } from '$lib/form';
 
 	let loadLogsInterval = null;
+	let allLogs = [];
 	let logs = [];
-	let followingBuild;
+	let currentPage = 1;
+	let endOfLogs = false;
+	let startOfLogs = true;
 	let followingInterval;
 	let logsEl;
 
 	const { id } = $page.params;
 	onMount(async () => {
-		loadLogs();
+		loadAllLogs();
 		loadLogsInterval = setInterval(() => {
 			loadLogs();
 		}, 1000);
@@ -45,25 +47,52 @@
 		clearInterval(loadLogsInterval);
 		clearInterval(followingInterval);
 	});
-	async function loadLogs() {
+	async function loadAllLogs() {
 		try {
-			const newLogs = await get(`/applications/${id}/logs.json`);
+			const data = await get(`/applications/${id}/logs.json`);
-			logs = newLogs.logs;
+			allLogs = data.logs;
+			logs = data.logs.slice(0, 100);
 			return;
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
 	}
-
+	async function loadLogs() {
-	function followBuild() {
+		try {
-		followingBuild = !followingBuild;
+			const newLogs = await get(`/applications/${id}/logs.json`);
-		if (followingBuild) {
+			logs = newLogs.logs.slice(0, 100);
-			followingInterval = setInterval(() => {
+			return;
-				logsEl.scrollTop = logsEl.scrollHeight;
+		} catch ({ error }) {
-				window.scrollTo(0, document.body.scrollHeight);
+			return errorNotification(error);
-			}, 100);
+		}
+	}
+	async function loadOlderLogs() {
+		clearInterval(loadLogsInterval);
+		loadLogsInterval = null;
+		logsEl.scrollTop = 0;
+		if (logs.length < 100) {
+			endOfLogs = true;
+			return;
+		}
+		startOfLogs = false;
+		endOfLogs = false;
+		currentPage += 1;
+		logs = allLogs.slice(currentPage * 100 - 100, currentPage * 100);
+	}
+	async function loadNewerLogs() {
+		currentPage -= 1;
+		logsEl.scrollTop = 0;
+		if (currentPage !== 1) {
+			clearInterval(loadLogsInterval);
+			endOfLogs = false;
+			loadLogsInterval = null;
+			logs = allLogs.slice(currentPage * 100 - 100, currentPage * 100);
 		} else {
-			window.clearInterval(followingInterval);
+			startOfLogs = true;
+			loadLogs();
+			loadLogsInterval = setInterval(() => {
+				loadLogs();
+			}, 1000);
 		}
 	}
 </script>
@@ -145,13 +174,17 @@
 		<div class="text-xl font-bold tracking-tighter">Waiting for the logs...</div>
 	{:else}
 		<div class="relative w-full">
-			<LoadingLogs />
+			<div class="text-right " />
-			<div class="flex justify-end sticky top-0 p-2">
+			{#if loadLogsInterval}
+				<LoadingLogs />
+			{/if}
+			<div class="flex justify-end sticky top-0 p-2 mx-1">
 				<button
-					on:click={followBuild}
+					on:click={loadOlderLogs}
+					class:text-coolgray-100={endOfLogs}
+					class:hover:bg-coolgray-400={!endOfLogs}
 					class="bg-transparent"
-					data-tooltip="Follow logs"
+					disabled={endOfLogs}
-					class:text-green-500={followingBuild}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -164,10 +197,32 @@
 						stroke-linejoin="round"
 					>
 						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
-						<circle cx="12" cy="12" r="9" />
+						<path
-						<line x1="8" y1="12" x2="12" y2="16" />
+							d="M20 15h-8v3.586a1 1 0 0 1 -1.707 .707l-6.586 -6.586a1 1 0 0 1 0 -1.414l6.586 -6.586a1 1 0 0 1 1.707 .707v3.586h8a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1z"
-						<line x1="12" y1="8" x2="12" y2="16" />
+						/>
-						<line x1="16" y1="12" x2="12" y2="16" />
+					</svg>
+				</button>
+				<button
+					on:click={loadNewerLogs}
+					class:text-coolgray-100={startOfLogs}
+					class:hover:bg-coolgray-400={!startOfLogs}
+					class="bg-transparent"
+					disabled={startOfLogs}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="w-6 h-6"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
+					>
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<path
+							d="M4 9h8v-3.586a1 1 0 0 1 1.707 -.707l6.586 6.586a1 1 0 0 1 0 1.414l-6.586 6.586a1 1 0 0 1 -1.707 -.707v-3.586h-8a1 1 0 0 1 -1 -1v-4a1 1 0 0 1 1 -1z"
+						/>
 					</svg>
 				</button>
 			</div>
@@ -175,7 +230,7 @@
 				class="font-mono w-full leading-6 text-left text-md tracking-tighter rounded bg-coolgray-200 py-5 px-6 whitespace-pre-wrap break-words overflow-auto max-h-[80vh] -mt-12 overflow-y-scroll scrollbar-w-1 scrollbar-thumb-coollabs scrollbar-track-coolgray-200"
 				bind:this={logsEl}
 			>
-				<div class="px-2">
+				<div class="px-2 pr-14">
 					{#each logs as log}
 						{log + '\n'}
 					{/each}

src/routes/login/index.svelte

@@ -43,8 +43,15 @@
 	{:else}
 		<div class="flex justify-center px-4">
 			<form on:submit|preventDefault={handleSubmit} class="flex flex-col py-4 space-y-2">
-				<div class="text-6xl font-bold border-gradient w-48 mx-auto border-b-4">Coolify</div>
+				{#if $session.whiteLabelDetails.icon}
-				<div class="text-xs text-center font-bold pb-10">v{$session.version}</div>
+					<img
+						class="w-32 mx-auto pb-8"
+						src={$session.whiteLabelDetails.icon}
+						alt="Icon for white labeled version of Coolify"
+					/>
+				{:else}
+					<div class="text-6xl font-bold border-gradient w-48 mx-auto border-b-4 mb-8">Coolify</div>
+				{/if}
 				<input
 					type="email"
 					name="email"

src/routes/register/index.svelte

@@ -64,8 +64,15 @@
 	{:else}
 		<div class="flex justify-center px-4">
 			<form on:submit|preventDefault={handleSubmit} class="flex flex-col py-4 space-y-2">
-				<div class="text-6xl font-bold border-gradient w-48 mx-auto border-b-4">Coolify</div>
+				{#if $session.whiteLabelDetails.icon}
-				<div class="text-xs text-center font-bold pb-10">v{$session.version}</div>
+					<img
+						class="w-32 mx-auto pb-8"
+						src={$session.whiteLabelDetails.icon}
+						alt="Icon for white labeled version of Coolify"
+					/>
+				{:else}
+					<div class="text-6xl font-bold border-gradient w-48 mx-auto border-b-4 mb-8">Coolify</div>
+				{/if}
 				<input
 					type="email"
 					name="email"

src/routes/services/[id]/__layout.svelte

@@ -239,6 +239,35 @@
 					</svg></button
 				></a
 			>
+			<a
+				href="/services/{id}/storage"
+				sveltekit:prefetch
+				class="hover:text-pink-500 rounded"
+				class:text-pink-500={$page.url.pathname === `/services/${id}/storage`}
+				class:bg-coolgray-500={$page.url.pathname === `/services/${id}/storage`}
+			>
+				<button
+					title="Persistent Storage"
+					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500"
+					data-tooltip="Persistent Storage"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="w-6 h-6"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
+					>
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<ellipse cx="12" cy="6" rx="8" ry="3" />
+						<path d="M4 6v6a8 3 0 0 0 16 0v-6" />
+						<path d="M4 12v6a8 3 0 0 0 16 0v-6" />
+					</svg>
+				</button></a
+			>
 			<div class="border border-stone-700 h-8" />
 		{/if}
 		<button

src/routes/services/[id]/ghost/start.json.ts

@@ -135,11 +135,7 @@ export const post: RequestHandler = async (event) => {
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 
 		try {
-			if (version === 'latest') {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-				await asyncExecShell(
-					`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`
-				);
-			}
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			return {
 				status: 200

src/routes/services/[id]/languagetool/start.json.ts

@@ -69,11 +69,7 @@ export const post: RequestHandler = async (event) => {
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 
 		try {
-			if (version === 'latest') {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-				await asyncExecShell(
-					`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`
-				);
-			}
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			return {
 				status: 200

src/routes/services/[id]/meilisearch/start.json.ts

@@ -74,11 +74,7 @@ export const post: RequestHandler = async (event) => {
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 
 		try {
-			if (version === 'latest') {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-				await asyncExecShell(
-					`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`
-				);
-			}
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			return {
 				status: 200

src/routes/services/[id]/minio/start.json.ts

@@ -88,6 +88,7 @@ export const post: RequestHandler = async (event) => {
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 
 		try {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			await db.updateMinioService({ id, publicPort });
 			await startHttpProxy(destinationDocker, id, publicPort, apiPort);

src/routes/services/[id]/n8n/start.json.ts

@@ -70,11 +70,7 @@ export const post: RequestHandler = async (event) => {
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 
 		try {
-			if (version === 'latest') {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-				await asyncExecShell(
-					`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`
-				);
-			}
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			return {
 				status: 200

src/routes/services/[id]/nocodb/start.json.ts

@@ -61,11 +61,7 @@ export const post: RequestHandler = async (event) => {
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 
 		try {
-			if (version === 'latest') {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-				await asyncExecShell(
-					`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`
-				);
-			}
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			return {
 				status: 200

src/routes/services/[id]/plausibleanalytics/start.json.ts

@@ -192,9 +192,7 @@ COPY ./init-db.sh /docker-entrypoint-initdb.d/init-db.sh`;
 		};
 		const composeFileDestination = `${workdir}/docker-compose.yaml`;
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
-		if (version === 'latest') {
+		await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-		}
 		await asyncExecShell(
 			`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up --build -d`
 		);

src/routes/services/[id]/storage/_Storage.svelte

@@ -0,0 +1,73 @@
+<script lang="ts">
+	export let isNew = false;
+	export let storage = {
+		id: null,
+		path: null
+	};
+	import { del, post } from '$lib/api';
+	import { page } from '$app/stores';
+	import { createEventDispatcher } from 'svelte';
+
+	import { errorNotification } from '$lib/form';
+	import { toast } from '@zerodevx/svelte-toast';
+	const { id } = $page.params;
+
+	const dispatch = createEventDispatcher();
+	async function saveStorage(newStorage = false) {
+		try {
+			if (!storage.path) return errorNotification('Path is required.');
+			storage.path = storage.path.startsWith('/') ? storage.path : `/${storage.path}`;
+			storage.path = storage.path.endsWith('/') ? storage.path.slice(0, -1) : storage.path;
+			storage.path.replace(/\/\//g, '/');
+			await post(`/services/${id}/storage.json`, {
+				path: storage.path,
+				storageId: storage.id,
+				newStorage
+			});
+			dispatch('refresh');
+			if (isNew) {
+				storage.path = null;
+				storage.id = null;
+			}
+			if (newStorage) toast.push('Storage saved.');
+			else toast.push('Storage updated.');
+		} catch ({ error }) {
+			return errorNotification(error);
+		}
+	}
+	async function removeStorage() {
+		try {
+			await del(`/services/${id}/storage.json`, { path: storage.path });
+			dispatch('refresh');
+			toast.push('Storage deleted.');
+		} catch ({ error }) {
+			return errorNotification(error);
+		}
+	}
+</script>
+
+<td>
+	<input
+		bind:value={storage.path}
+		required
+		placeholder="eg: /data"
+		class=" border border-dashed border-coolgray-300"
+	/>
+</td>
+<td>
+	{#if isNew}
+		<div class="flex items-center justify-center">
+			<button class="bg-green-600 hover:bg-green-500" on:click={() => saveStorage(true)}>Add</button
+			>
+		</div>
+	{:else}
+		<div class="flex flex-row justify-center space-x-2">
+			<div class="flex items-center justify-center">
+				<button class="" on:click={() => saveStorage(false)}>Set</button>
+			</div>
+			<div class="flex justify-center items-end">
+				<button class="bg-red-600 hover:bg-red-500" on:click={removeStorage}>Remove</button>
+			</div>
+		</div>
+	{/if}
+</td>

src/routes/services/[id]/storage/index.json.ts

@@ -0,0 +1,65 @@
+import { getUserDetails } from '$lib/common';
+import * as db from '$lib/database';
+import { ErrorHandler } from '$lib/database';
+import type { RequestHandler } from '@sveltejs/kit';
+
+export const get: RequestHandler = async (event) => {
+	const { status, body, teamId } = await getUserDetails(event, false);
+	if (status === 401) return { status, body };
+
+	const { id } = event.params;
+	try {
+		const persistentStorages = await db.prisma.servicePersistentStorage.findMany({
+			where: { serviceId: id }
+		});
+		return {
+			body: {
+				persistentStorages
+			}
+		};
+	} catch (error) {
+		return ErrorHandler(error);
+	}
+};
+
+export const post: RequestHandler = async (event) => {
+	const { teamId, status, body } = await getUserDetails(event);
+	if (status === 401) return { status, body };
+
+	const { id } = event.params;
+	const { path, newStorage, storageId } = await event.request.json();
+	try {
+		if (newStorage) {
+			await db.prisma.servicePersistentStorage.create({
+				data: { path, service: { connect: { id } } }
+			});
+		} else {
+			await db.prisma.servicePersistentStorage.update({
+				where: { id: storageId },
+				data: { path }
+			});
+		}
+		return {
+			status: 201
+		};
+	} catch (error) {
+		return ErrorHandler(error);
+	}
+};
+
+export const del: RequestHandler = async (event) => {
+	const { teamId, status, body } = await getUserDetails(event);
+	if (status === 401) return { status, body };
+
+	const { id } = event.params;
+	const { path } = await event.request.json();
+
+	try {
+		await db.prisma.servicePersistentStorage.deleteMany({ where: { serviceId: id, path } });
+		return {
+			status: 200
+		};
+	} catch (error) {
+		return ErrorHandler(error);
+	}
+};

src/routes/services/[id]/storage/index.svelte

@@ -0,0 +1,102 @@
+<script context="module" lang="ts">
+	import type { Load } from '@sveltejs/kit';
+	export const load: Load = async ({ fetch, params, stuff }) => {
+		let endpoint = `/services/${params.id}/storage.json`;
+		const res = await fetch(endpoint);
+		if (res.ok) {
+			return {
+				props: {
+					service: stuff.service,
+					...(await res.json())
+				}
+			};
+		}
+
+		return {
+			status: res.status,
+			error: new Error(`Could not load ${endpoint}`)
+		};
+	};
+</script>
+
+<script lang="ts">
+	export let service;
+
+	export let persistentStorages;
+	import { page } from '$app/stores';
+	import Storage from './_Storage.svelte';
+	import { get } from '$lib/api';
+	import Explainer from '$lib/components/Explainer.svelte';
+	import ServiceLinks from '$lib/components/ServiceLinks.svelte';
+
+	const { id } = $page.params;
+	async function refreshStorage() {
+		const data = await get(`/services/${id}/storage.json`);
+		persistentStorages = [...data.persistentStorages];
+	}
+</script>
+
+<div
+	class="flex items-center space-x-2 p-5 px-6 font-bold"
+	class:p-5={service.fqdn}
+	class:p-6={!service.fqdn}
+>
+	<div class="-mb-5 flex-col">
+		<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
+			Persistent Storage
+		</div>
+		<span class="text-xs">{service.name}</span>
+	</div>
+	{#if service.fqdn}
+		<a
+			href={service.fqdn}
+			target="_blank"
+			class="icons tooltip-bottom flex items-center bg-transparent text-sm"
+			><svg
+				xmlns="http://www.w3.org/2000/svg"
+				class="h-6 w-6"
+				viewBox="0 0 24 24"
+				stroke-width="1.5"
+				stroke="currentColor"
+				fill="none"
+				stroke-linecap="round"
+				stroke-linejoin="round"
+			>
+				<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+				<path d="M11 7h-5a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-5" />
+				<line x1="10" y1="14" x2="20" y2="4" />
+				<polyline points="15 4 20 4 20 9" />
+			</svg></a
+		>
+	{/if}
+
+	<ServiceLinks {service} />
+</div>
+
+<div class="mx-auto max-w-6xl rounded-xl px-6 pt-4">
+	<div class="flex justify-center py-4 text-center">
+		<Explainer
+			customClass="w-full"
+			text={'You can specify any folder that you want to be persistent across restarts. <br>This is useful for storing data for VSCode server or WordPress.'}
+		/>
+	</div>
+	<table class="mx-auto border-separate text-left">
+		<thead>
+			<tr class="h-12">
+				<th scope="col">Path</th>
+			</tr>
+		</thead>
+		<tbody>
+			{#each persistentStorages as storage}
+				{#key storage.id}
+					<tr>
+						<Storage on:refresh={refreshStorage} {storage} />
+					</tr>
+				{/key}
+			{/each}
+			<tr>
+				<Storage on:refresh={refreshStorage} isNew />
+			</tr>
+		</tbody>
+	</table>
+</div>

src/routes/services/[id]/uptimekuma/start.json.ts

@@ -68,11 +68,7 @@ export const post: RequestHandler = async (event) => {
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 
 		try {
-			if (version === 'latest') {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-				await asyncExecShell(
-					`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`
-				);
-			}
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			return {
 				status: 200

src/routes/services/[id]/vaultwarden/start.json.ts

@@ -68,11 +68,7 @@ export const post: RequestHandler = async (event) => {
 		const composeFileDestination = `${workdir}/docker-compose.yaml`;
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 		try {
-			if (version === 'latest') {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-				await asyncExecShell(
-					`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`
-				);
-			}
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			return {
 				status: 200

src/routes/services/[id]/vscodeserver/start.json.ts

@@ -21,6 +21,7 @@ export const post: RequestHandler = async (event) => {
 			destinationDockerId,
 			destinationDocker,
 			serviceSecret,
+			persistentStorage,
 			vscodeserver: { password }
 		} = service;
 
@@ -42,6 +43,28 @@ export const post: RequestHandler = async (event) => {
 				config.environmentVariables[secret.name] = secret.value;
 			});
 		}
+
+		const volumes =
+			persistentStorage?.map((storage) => {
+				return `${id}${storage.path.replace(/\//gi, '-')}:${storage.path}`;
+			}) || [];
+
+		const composeVolumes = volumes.map((volume) => {
+			return {
+				[`${volume.split(':')[0]}`]: {
+					name: volume.split(':')[0]
+				}
+			};
+		});
+		const volumeMounts = Object.assign(
+			{},
+			{
+				[config.volume.split(':')[0]]: {
+					name: config.volume.split(':')[0]
+				}
+			},
+			...composeVolumes
+		);
 		const composeFile: ComposeFile = {
 			version: '3.8',
 			services: {
@@ -50,7 +73,7 @@ export const post: RequestHandler = async (event) => {
 					image: config.image,
 					environment: config.environmentVariables,
 					networks: [network],
-					volumes: [config.volume],
+					volumes: [config.volume, ...volumes],
 					restart: 'always',
 					labels: makeLabelForServices('vscodeServer'),
 					deploy: {
@@ -68,19 +91,21 @@ export const post: RequestHandler = async (event) => {
 					external: true
 				}
 			},
-			volumes: {
+			volumes: volumeMounts
-				[config.volume.split(':')[0]]: {
-					name: config.volume.split(':')[0]
-				}
-			}
 		};
 		const composeFileDestination = `${workdir}/docker-compose.yaml`;
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 
-		if (version === 'latest') {
+		await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-		}
 		await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
+
+		const changePermissionOn = persistentStorage.map((p) => p.path);
+
+		await asyncExecShell(
+			`DOCKER_HOST=${host} docker exec -u root ${id} chown -R 1000:1000 ${changePermissionOn.join(
+				' '
+			)}`
+		);
 		return {
 			status: 200
 		};

src/routes/services/[id]/wordpress/start.json.ts

@@ -121,11 +121,7 @@ export const post: RequestHandler = async (event) => {
 		const composeFileDestination = `${workdir}/docker-compose.yaml`;
 		await fs.writeFile(composeFileDestination, yaml.dump(composeFile));
 		try {
-			if (version === 'latest') {
+			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`);
-				await asyncExecShell(
-					`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} pull`
-				);
-			}
 			await asyncExecShell(`DOCKER_HOST=${host} docker compose -f ${composeFileDestination} up -d`);
 			return {
 				status: 200