fixes

apps/api/src/index.ts

@@ -186,7 +186,6 @@ async function getIPAddress() {
 	} catch (error) { }
 }
 async function initServer() {
-	await asyncExecShell(`env | grep '^COOLIFY' > /app/.env`);
 	try {
 		console.log(`Initializing server...`);
 		await asyncExecShell(`docker network create --attachable coolify`);
@@ -246,6 +245,7 @@ async function autoUpdater() {
 					const { isAutoUpdateEnabled } = await prisma.setting.findFirst();
 					if (isAutoUpdateEnabled) {
 						await asyncExecShell(`docker pull coollabsio/coolify:${latestVersion}`);
+						await asyncExecShell(`env | grep '^COOLIFY' > .env`);
 						await asyncExecShell(
 							`sed -i '/COOLIFY_AUTO_UPDATE=/cCOOLIFY_AUTO_UPDATE=${isAutoUpdateEnabled}' .env`
 						);
@@ -263,13 +263,14 @@ async function autoUpdater() {
 
 async function checkFluentBit() {
 	try {
-		if (!isDev || process.env.COOLIFY_CONTAINER_DEV === 'true') {
+		if (!isDev) {
 			const engine = '/var/run/docker.sock';
 			const { id } = await prisma.destinationDocker.findFirst({
 				where: { engine, network: 'coolify' }
 			});
-			const { found } = await checkContainer({ dockerId: id, container: 'coolify-fluentbit' });
+			const { found } = await checkContainer({ dockerId: id, container: 'coolify-fluentbit', remove: true });
 			if (!found) {
+				await asyncExecShell(`env | grep '^COOLIFY' > .env`);
 				await asyncExecShell(`docker compose up -d fluent-bit`);
 			}
 		}

apps/api/src/lib/buildPacks/compose.ts

@@ -63,8 +63,6 @@ export default async function (data) {
     } catch (error) {
         //
     }
-    console.log('envFound', envFound)
-    console.log(envs)
     const composeVolumes = volumes.map((volume) => {
         return {
             [`${volume.split(':')[0]}`]: {

apps/api/src/routes/api/v1/handlers.ts

@@ -146,7 +146,7 @@ export async function showDashboard(request: FastifyRequest) {
 
 		let foundUnconfiguredApplication = false;
 		for (const application of applications) {
-			if (!application.buildPack || !application.destinationDockerId || !application.branch || (!application.settings?.isBot && !application?.fqdn)) {
+			if (!application.buildPack || !application.destinationDockerId || !application.branch || (!application.settings?.isBot && !application?.fqdn) && application.buildPack !== "compose") {
 				foundUnconfiguredApplication = true
 			}
 		}

apps/ui/src/lib/components/Explainer.svelte

@@ -12,6 +12,7 @@
 </script>
 
 <div class={`dropdown dropdown-end ${position}`}>
+	<!-- svelte-ignore a11y-label-has-associated-control -->
 	<label tabindex="0" class="btn btn-circle btn-ghost btn-xs text-sky-500">
 	  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="w-4 h-4 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
 	</label>

apps/ui/src/lib/components/svg/applications/ApplicationIcons.svelte

@@ -40,4 +40,6 @@
 	<Icons.Laravel {isAbsolute} />
 {:else if application.buildPack?.toLowerCase() === 'heroku'}
 	<Icons.Heroku {isAbsolute} />
+{:else if application.buildPack?.toLowerCase() === 'compose'}
+	<Icons.Compose {isAbsolute} />
 {/if}

apps/ui/src/lib/components/svg/applications/Compose.svelte

@@ -0,0 +1,9 @@
+<script lang="ts">
+	export let isAbsolute = false;
+</script>
+
+<img
+	alt="docker compose logo"
+	class={isAbsolute ? 'w-16 h-16 absolute top-0 left-0 -m-8' : 'w-8 h-8 mx-auto'}
+	src="/docker-compose.png"
+/>

apps/ui/src/lib/components/svg/applications/index.ts

@@ -17,3 +17,4 @@ export { default as Eleventy } from './Eleventy.svelte';
 export { default as Deno } from './Deno.svelte';
 export { default as Laravel } from './Laravel.svelte';
 export { default as Heroku } from './Heroku.svelte';
+export { default as Compose } from './Compose.svelte';

apps/ui/src/routes/applications/[id]/__layout.svelte

@@ -227,7 +227,7 @@
 				<div class="flex justify-center items-center space-x-2">
 					<div>Configurations</div>
 					<div
-						class="badge rounded uppercase"
+						class="badge badge-lg rounded uppercase"
 						class:text-green-500={$status.application.overallStatus === 'healthy'}
 						class:text-yellow-400={$status.application.overallStatus === 'degraded'}
 						class:text-red-500={$status.application.overallStatus === 'stopped'}
@@ -274,7 +274,7 @@
 			<a
 				id="applicationerror"
 				href={$isDeploymentEnabled ? `/applications/${id}/logs` : null}
-				class="icons bg-transparent text-sm text-error"
+				class="btn btn-error gap-2"
 				sveltekit:prefetch
 			>
 				<svg
@@ -294,14 +294,15 @@
 					<line x1="12" y1="8" x2="12" y2="12" />
 					<line x1="12" y1="16" x2="12.01" y2="16" />
 				</svg>
+				Application Error
 			</a>
 			<Tooltip triggeredBy="#applicationerror">Application exited with an error!</Tooltip>
 		{/if}
 		{#if $status.application.initialLoading}
-			<button class="icons animate-spin bg-transparent duration-500 ease-in-out">
+			<button class="btn btn-ghost btn-sm gap-2">
 				<svg
 					xmlns="http://www.w3.org/2000/svg"
-					class="h-6 w-6"
+					class="h-6 w-6 animate-spin duration-500 ease-in-out"
 					viewBox="0 0 24 24"
 					stroke-width="1.5"
 					stroke="currentColor"
@@ -317,60 +318,12 @@
 					<line x1="7.16" y1="18.37" x2="7.16" y2="18.38" />
 					<line x1="11" y1="19.94" x2="11" y2="19.95" />
 				</svg>
+				Loading...
 			</button>
 		{:else if $status.application.overallStatus === 'healthy'}
 			<button
-				id="stop"
-				on:click={stopApplication}
-				type="submit"
 				disabled={!$isDeploymentEnabled}
-				class="icons bg-transparent text-error"
+				class="btn btn-sm gap-2"
-			>
-				<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" />
-					<rect x="6" y="5" width="4" height="14" rx="1" />
-					<rect x="14" y="5" width="4" height="14" rx="1" />
-				</svg>
-			</button>
-			<Tooltip triggeredBy="#stop">Stop</Tooltip>
-
-			<button
-				id="restart"
-				on:click={restartApplication}
-				type="submit"
-				disabled={!$isDeploymentEnabled}
-				class="icons bg-transparent"
-			>
-				<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="M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4" />
-					<path d="M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4" />
-				</svg>
-			</button>
-			<Tooltip triggeredBy="#restart">Restart (useful to change secrets)</Tooltip>
-
-			<button
-				id="forceredeploy"
-				disabled={!$isDeploymentEnabled}
-				class="icons bg-transparent "
 				on:click={() => handleDeploySubmit(true)}
 			>
 				<svg
@@ -389,17 +342,63 @@
 						transform="rotate(-45 12 12)"
 					/>
 				</svg>
+
+				Force Redeploy
 			</button>
-			<Tooltip triggeredBy="#forceredeploy">Force Redeploy (without cache)</Tooltip>
+			<button
+				on:click={stopApplication}
+				type="submit"
+				disabled={!$isDeploymentEnabled}
+				class="btn btn-sm btn-error gap-2"
+			>
+				<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" />
+					<rect x="6" y="5" width="4" height="14" rx="1" />
+					<rect x="14" y="5" width="4" height="14" rx="1" />
+				</svg> Stop
+			</button>
+
+			{#if application.buildPack !== 'compose'}
+				<button
+					on:click={restartApplication}
+					type="submit"
+					disabled={!$isDeploymentEnabled}
+					class="btn btn-sm gap-2"
+				>
+					<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="M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4" />
+						<path d="M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4" />
+					</svg> Restart
+				</button>
+			{/if}
 		{:else if $isDeploymentEnabled && !$page.url.pathname.startsWith(`/applications/${id}/configuration/`)}
 			<button
-				class="icons flex items-center font-bold"
+				class="btn btn-sm gap-2 btn-primary"
 				disabled={!$isDeploymentEnabled}
 				on:click={() => handleDeploySubmit(false)}
 			>
 				<svg
 					xmlns="http://www.w3.org/2000/svg"
-					class="w-6 h-6 mr-2 text-green-500"
+					class="w-6 h-6"
 					viewBox="0 0 24 24"
 					stroke-width="1.5"
 					stroke="currentColor"

apps/ui/src/routes/index.svelte

@@ -146,9 +146,29 @@
 		try {
 			numberOfGetStatus++;
 			let isRunning = false;
+			let isDegraded = false;
 			if (buildPack) {
 				const response = await get(`/applications/${id}/status`);
-				isRunning = response.isRunning;
+				if (response.length === 0) {
+					isRunning = false;
+				} else if (response.length === 1) {
+					isRunning = response[0].status.isRunning;
+				} else {
+					let overallStatus = false;
+					for (const oneStatus of response) {
+						if (oneStatus.status.isRunning) {
+							overallStatus = true;
+						} else {
+							isDegraded = true;
+							break;
+						}
+					}
+					if (overallStatus) {
+						isRunning = true;
+					} else {
+						isRunning = false;
+					}
+				}
 			} else if (typeof dualCerts !== 'undefined') {
 				const response = await get(`/services/${id}/status`);
 				isRunning = response.isRunning;
@@ -156,9 +176,13 @@
 				const response = await get(`/databases/${id}/status`);
 				isRunning = response.isRunning;
 			}
+
 			if (isRunning) {
 				status[id] = 'running';
 				return 'running';
+			} else if (isDegraded) {
+				status[id] = 'degraded';
+				return 'degraded';
 			} else {
 				status[id] = 'stopped';
 				return 'stopped';
@@ -594,6 +618,11 @@
 										<span class="indicator-item badge bg-yellow-300 badge-sm" />
 									{:else if status[application.id] === 'running'}
 										<span class="indicator-item badge bg-success badge-sm" />
+									{:else if status[application.id] === 'degraded'}
+										<span
+											class="indicator-item indicator-middle indicator-center badge bg-warning  text-black font-bold badge-xl"
+											>Degraded</span
+										>
 									{:else}
 										<span class="indicator-item badge bg-error badge-sm" />
 									{/if}
@@ -613,7 +642,7 @@
 									<div class="h-10 text-xs">
 										{#if application?.fqdn}
 											<h2>{application?.fqdn.replace('https://', '').replace('http://', '')}</h2>
-										{:else if !application.settings?.isBot && !application?.fqdn}
+										{:else if (!application.settings?.isBot && !application?.fqdn) && application.buildPack !== 'compose'}
 											<h2 class="text-red-500">Not configured</h2>
 										{/if}
 										{#if application.destinationDocker?.name}

apps/ui/tailwind.config.cjs

@@ -10,7 +10,7 @@ module.exports = {
 					"base-100": "#323232",
 					"base-200": "#242424",
 					"base-300": "#181818",
-					"primary": "#6d28d9",
+					"primary": "#6B16ED",
 					"primary-content": "#fff",
 					"secondary": "#343232",
 					"accent": "#343232",