From 741db1778be57164260dd67c33fa83dd2445192e Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Fri, 1 Apr 2022 22:50:55 +0200
Subject: [PATCH 01/23] feat: install svelte-18n and init setup

---
 .vscode/settings.json      |   7 +
 package.json               |   4 +-
 pnpm-lock.yaml             | 102 +++++
 src/routes/__error.svelte  |   4 +-
 src/routes/__layout.svelte | 764 +++++++++++++++++++------------------
 static/locales/en.json     |  13 +
 svelte.config.js           |   6 +
 7 files changed, 525 insertions(+), 375 deletions(-)
 create mode 100644 .vscode/settings.json
 create mode 100644 static/locales/en.json

diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 000000000..1cc7be6e1
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,7 @@
+{
+	"i18n-ally.localesPaths": ["locales"],
+	"i18n-ally.keystyle": "nested",
+	"i18n-ally.extract.ignoredByFiles": {
+		"src\\routes\\__layout.svelte": ["Coolify", "coolLabs logo"]
+	}
+}
diff --git a/package.json b/package.json
index 6c7237198..7a0a8e4bf 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
 	"version": "2.2.7",
 	"license": "AGPL-3.0",
 	"scripts": {
-		"dev": "docker-compose -f docker-compose-dev.yaml up -d && NODE_ENV=development svelte-kit dev",
+		"dev": "docker-compose -f docker-compose-dev.yaml up -d && cross-env NODE_ENV=development & svelte-kit dev",
 		"dev:stop": "docker-compose -f docker-compose-dev.yaml down",
 		"dev:logs": "docker-compose -f docker-compose-dev.yaml logs -f --tail 10",
 		"studio": "npx prisma studio",
@@ -37,6 +37,7 @@
 		"@typescript-eslint/parser": "4.31.1",
 		"@zerodevx/svelte-toast": "0.7.1",
 		"autoprefixer": "10.4.4",
+		"cross-env": "^7.0.3",
 		"cross-var": "1.1.0",
 		"eslint": "7.32.0",
 		"eslint-config-prettier": "8.5.0",
@@ -50,6 +51,7 @@
 		"prisma": "3.11.1",
 		"svelte": "3.46.4",
 		"svelte-check": "2.4.6",
+		"svelte-i18n": "^3.3.13",
 		"svelte-preprocess": "4.10.4",
 		"svelte-select": "^4.4.7",
 		"tailwindcss": "3.0.23",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a89edbf25..e7594b347 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -20,6 +20,7 @@ specifiers:
   compare-versions: 4.1.3
   cookie: 0.4.2
   cooltipz-css: ^2.1.0
+  cross-env: ^7.0.3
   cross-var: 1.1.0
   cuid: 2.1.8
   dayjs: 1.11.0
@@ -45,6 +46,7 @@ specifiers:
   prisma: 3.11.1
   svelte: 3.46.4
   svelte-check: 2.4.6
+  svelte-i18n: ^3.3.13
   svelte-kit-cookie-session: 2.1.2
   svelte-preprocess: 4.10.4
   svelte-select: ^4.4.7
@@ -92,6 +94,7 @@ devDependencies:
   '@typescript-eslint/parser': 4.31.1_eslint@7.32.0+typescript@4.6.3
   '@zerodevx/svelte-toast': 0.7.1
   autoprefixer: 10.4.4_postcss@8.4.12
+  cross-env: 7.0.3
   cross-var: 1.1.0
   eslint: 7.32.0
   eslint-config-prettier: 8.5.0_eslint@7.32.0
@@ -105,6 +108,7 @@ devDependencies:
   prisma: 3.11.1
   svelte: 3.46.4
   svelte-check: 2.4.6_postcss@8.4.12+svelte@3.46.4
+  svelte-i18n: 3.3.13_svelte@3.46.4
   svelte-preprocess: 4.10.4_296873641a0ad9f42fe92172d27bcedd
   svelte-select: 4.4.7
   tailwindcss: 3.0.23_b89136460714832cdda11d1e9d57d1ff
@@ -180,6 +184,55 @@ packages:
       - supports-color
     dev: true
 
+  /@formatjs/ecma402-abstract/1.11.4:
+    resolution:
+      {
+        integrity: sha512-EBikYFp2JCdIfGEb5G9dyCkTGDmC57KSHhRQOC3aYxoPWVZvfWCDjZwkGYHN7Lis/fmuWl906bnNTJifDQ3sXw==
+      }
+    dependencies:
+      '@formatjs/intl-localematcher': 0.2.25
+      tslib: 2.3.1
+    dev: true
+
+  /@formatjs/fast-memoize/1.2.1:
+    resolution:
+      {
+        integrity: sha512-Rg0e76nomkz3vF9IPlKeV+Qynok0r7YZjL6syLz4/urSg0IbjPZCB/iYUMNsYA643gh4mgrX3T7KEIFIxJBQeg==
+      }
+    dependencies:
+      tslib: 2.3.1
+    dev: true
+
+  /@formatjs/icu-messageformat-parser/2.0.19:
+    resolution:
+      {
+        integrity: sha512-8HsLm9YLyVVIDMyBJb7wmve2wGd461cUwJ470eUog5YH5ZsF4p5lgvaJ+oGKxz1mrSMNNdDHU9v/NDsS+z+ilg==
+      }
+    dependencies:
+      '@formatjs/ecma402-abstract': 1.11.4
+      '@formatjs/icu-skeleton-parser': 1.3.6
+      tslib: 2.3.1
+    dev: true
+
+  /@formatjs/icu-skeleton-parser/1.3.6:
+    resolution:
+      {
+        integrity: sha512-I96mOxvml/YLrwU2Txnd4klA7V8fRhb6JG/4hm3VMNmeJo1F03IpV2L3wWt7EweqNLES59SZ4d6hVOPCSf80Bg==
+      }
+    dependencies:
+      '@formatjs/ecma402-abstract': 1.11.4
+      tslib: 2.3.1
+    dev: true
+
+  /@formatjs/intl-localematcher/0.2.25:
+    resolution:
+      {
+        integrity: sha512-YmLcX70BxoSopLFdLr1Ds99NdlTI2oWoLbaUW2M406lxOIPzE1KQhRz2fPUkq34xVZQaihCoU29h0KK7An3bhA==
+      }
+    dependencies:
+      tslib: 2.3.1
+    dev: true
+
   /@humanwhocodes/config-array/0.5.0:
     resolution:
       {
@@ -2081,6 +2134,17 @@ packages:
       luxon: 1.28.0
     dev: false
 
+  /cross-env/7.0.3:
+    resolution:
+      {
+        integrity: sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==
+      }
+    engines: { node: '>=10.14', npm: '>=6', yarn: '>=1' }
+    hasBin: true
+    dependencies:
+      cross-spawn: 7.0.3
+    dev: true
+
   /cross-spawn/5.1.0:
     resolution: { integrity: sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk= }
     dependencies:
@@ -2190,6 +2254,14 @@ packages:
       }
     dev: true
 
+  /deepmerge/4.2.2:
+    resolution:
+      {
+        integrity: sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==
+      }
+    engines: { node: '>=0.10.0' }
+    dev: true
+
   /defer-to-connect/2.0.1:
     resolution:
       {
@@ -3390,6 +3462,18 @@ packages:
         integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
       }
 
+  /intl-messageformat/9.12.0:
+    resolution:
+      {
+        integrity: sha512-5Q9j21JreB1G27/CqMYsA+pvJ19JjHyhiTSeUuvZK9BCDJGHtOLgpUUcGM+GLHiUuoVMKVeeX1smamiVHQrSKQ==
+      }
+    dependencies:
+      '@formatjs/ecma402-abstract': 1.11.4
+      '@formatjs/fast-memoize': 1.2.1
+      '@formatjs/icu-messageformat-parser': 2.0.19
+      tslib: 2.3.1
+    dev: true
+
   /invariant/2.2.4:
     resolution:
       {
@@ -5159,6 +5243,24 @@ packages:
       svelte: 3.46.4
     dev: true
 
+  /svelte-i18n/3.3.13_svelte@3.46.4:
+    resolution:
+      {
+        integrity: sha512-RQM+ys4+Y9ztH//tX22H1UL2cniLNmIR+N4xmYygV6QpQ6EyQvloZiENRew8XrVzfvJ8HaE8NU6/yurLkl7z3g==
+      }
+    engines: { node: '>= 11.15.0' }
+    hasBin: true
+    peerDependencies:
+      svelte: ^3.25.1
+    dependencies:
+      deepmerge: 4.2.2
+      estree-walker: 2.0.2
+      intl-messageformat: 9.12.0
+      sade: 1.7.4
+      svelte: 3.46.4
+      tiny-glob: 0.2.9
+    dev: true
+
   /svelte-kit-cookie-session/2.1.2:
     resolution:
       {
diff --git a/src/routes/__error.svelte b/src/routes/__error.svelte
index 6e9d9f184..67693e70a 100644
--- a/src/routes/__error.svelte
+++ b/src/routes/__error.svelte
@@ -12,6 +12,7 @@
 </script>
 
 <script>
+	import { _ } from 'svelte-i18n';
 	export let status;
 	export let error;
 </script>
@@ -20,7 +21,8 @@
 	<div class="pb-10 text-7xl font-bold">{status}</div>
 	<div class="text-3xl font-bold">Ooops you are lost! But don't be afraid!</div>
 	<div class="text-xl">
-		You can find your way back <a href="/" class="font-bold uppercase text-sky-400">here</a>
+		{$_('error.you_can_find_your_way_back')}
+		<a href="/" class="font-bold uppercase text-sky-400">{$_('error.here')}</a>
 	</div>
 	<div class="py-10 text-xs font-bold">
 		<pre
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index ce9cd7c0f..bb2665238 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -38,7 +38,18 @@
 	import { errorNotification } from '$lib/form';
 	import { asyncSleep } from '$lib/components/common';
 	import { del, get, post } from '$lib/api';
-	import { browser, dev } from '$app/env';
+	import { register, init, _, getLocaleFromNavigator } from 'svelte-i18n';
+
+	async function setup() {
+		register('en', () => import('../../static/locales/en.json'));
+
+		return await Promise.allSettled([
+			// TODO: add some more stuff you want to init ...
+			init({ initialLocale: getLocaleFromNavigator(), fallbackLocale: 'en' })
+		]);
+	}
+
+	const setupResult = setup();
 
 	let isUpdateAvailable = false;
 
@@ -104,7 +115,7 @@
 				return window.location.reload();
 			} else {
 				await post(`/update.json`, { type: 'update', latestVersion });
-				toast.push('Update completed.<br><br>Waiting for the new version to start...');
+				toast.push(`${$_('layout.update_done')}<br><br>${$_('layout.wait_new_version_startup')}`);
 				let reachable = false;
 				let tries = 0;
 				do {
@@ -118,7 +129,7 @@
 					if (reachable) break;
 					tries++;
 				} while (!reachable || tries < 120);
-				toast.push('New version reachable. Reloading...');
+				toast.push($_('layout.new_version'));
 				updateStatus.loading = false;
 				updateStatus.success = true;
 				await asyncSleep(3000);
@@ -135,332 +146,23 @@
 <svelte:head>
 	<title>Coolify</title>
 </svelte:head>
-<SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
-{#if $session.userId}
-	<nav class="nav-main">
-		<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
-			<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
-			<div class="flex flex-col space-y-4 py-2">
-				<a
-					sveltekit:prefetch
-					href="/"
-					class="icons tooltip-right bg-coolgray-200 hover:text-white"
-					class:text-white={$page.url.pathname === '/'}
-					class:bg-coolgray-500={$page.url.pathname === '/'}
-					data-tooltip="Dashboard"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
-						/>
-						<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
 
-				<a
-					sveltekit:prefetch
-					href="/applications"
-					class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
-					class:text-green-500={$page.url.pathname.startsWith('/applications') ||
-						$page.url.pathname.startsWith('/new/application')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
-						$page.url.pathname.startsWith('/new/application')}
-					data-tooltip="Applications"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="4" y="4" width="6" height="6" rx="1" />
-						<rect x="4" y="14" width="6" height="6" rx="1" />
-						<rect x="14" y="14" width="6" height="6" rx="1" />
-						<line x1="14" y1="7" x2="20" y2="7" />
-						<line x1="17" y1="4" x2="17" y2="10" />
-					</svg>
-				</a>
-				<a
-					sveltekit:prefetch
-					href="/sources"
-					class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
-					class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
-						$page.url.pathname.startsWith('/new/source')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
-						$page.url.pathname.startsWith('/new/source')}
-					data-tooltip="Git Sources"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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" />
-						<circle cx="6" cy="6" r="2" />
-						<circle cx="18" cy="18" r="2" />
-						<path d="M11 6h5a2 2 0 0 1 2 2v8" />
-						<polyline points="14 9 11 6 14 3" />
-						<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
-						<polyline points="10 15 13 18 10 21" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/destinations"
-					class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
-					class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
-						$page.url.pathname.startsWith('/new/destination')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
-						$page.url.pathname.startsWith('/new/destination')}
-					data-tooltip="Destinations"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
-						/>
-						<path d="M5 10h3v3h-3z" />
-						<path d="M8 10h3v3h-3z" />
-						<path d="M11 10h3v3h-3z" />
-						<path d="M8 7h3v3h-3z" />
-						<path d="M11 7h3v3h-3z" />
-						<path d="M11 4h3v3h-3z" />
-						<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
-						<line x1="10" y1="16" x2="10" y2="16.01" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/databases"
-					class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
-					class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
-						$page.url.pathname.startsWith('/new/database')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
-						$page.url.pathname.startsWith('/new/database')}
-					data-tooltip="Databases"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/services"
-					class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
-					class:text-pink-500={$page.url.pathname.startsWith('/services') ||
-						$page.url.pathname.startsWith('/new/service')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
-						$page.url.pathname.startsWith('/new/service')}
-					data-tooltip="Services"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-			</div>
-			<div class="flex-1" />
-
-			<div class="flex flex-col space-y-4 py-2">
-				{#if $session.teamId === '0'}
-					{#if isUpdateAvailable}
-						<button
-							disabled={updateStatus.success === false}
-							title="Update available"
-							on:click={update}
-							class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
-						>
-							{#if updateStatus.loading}
-								<svg
-									xmlns="http://www.w3.org/2000/svg"
-									class="lds-heart h-9 w-8"
-									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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
-									/>
-								</svg>
-							{:else if updateStatus.success === null}
-								<svg
-									xmlns="http://www.w3.org/2000/svg"
-									class="w-8 h-9"
-									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" />
-									<circle cx="12" cy="12" r="9" />
-									<line x1="12" y1="8" x2="8" y2="12" />
-									<line x1="12" y1="8" x2="12" y2="16" />
-									<line x1="16" y1="12" x2="12" y2="8" />
-								</svg>
-							{:else if updateStatus.success}
-								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-									><path
-										fill="#DD2E44"
-										d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
-									/><path
-										fill="#EA596E"
-										d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
-									/><path
-										fill="#A0041E"
-										d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
-									/><path
-										fill="#AA8DD8"
-										d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
-									/><path
-										fill="#77B255"
-										d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
-									/><path
-										fill="#AA8DD8"
-										d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
-									/><path
-										fill="#77B255"
-										d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
-									/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
-										fill="#9266CC"
-										cx="2"
-										cy="18"
-										r="2"
-									/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
-										fill="#5C913B"
-										cx="23.5"
-										cy="31.5"
-										r="1.5"
-									/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
-										fill="#FFCC4D"
-										cx="32.5"
-										cy="8.5"
-										r="1.5"
-									/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
-										fill="#FFCC4D"
-										cx="7.5"
-										cy="23.5"
-										r="1.5"
-									/></svg
-								>
-							{:else}
-								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-									><path
-										fill="#FFCC4D"
-										d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
-									/><path
-										fill="#664500"
-										d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
-									/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
-										fill="#664500"
-										d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
-									/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
-										fill="#E75A70"
-										cx="18"
-										cy="27"
-										rx="3"
-										ry="2"
-									/></svg
-								>
-							{/if}
-						</button>
-					{/if}
-				{/if}
-			</div>
-			<div class="flex flex-col space-y-4 py-2">
-				<a
-					sveltekit:prefetch
-					href="/teams"
-					class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
-					class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
-					data-tooltip="Teams"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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" />
-						<circle cx="9" cy="7" r="4" />
-						<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
-						<path d="M16 3.13a4 4 0 0 1 0 7.75" />
-						<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
-					</svg>
-				</a>
-				{#if $session.teamId === '0'}
+{#await setupResult}
+	Please wait...
+{:then}
+	<SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
+	{#if $session.userId}
+		<nav class="nav-main">
+			<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
+				<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
+				<div class="flex flex-col space-y-4 py-2">
 					<a
 						sveltekit:prefetch
-						href="/settings"
-						class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
-						class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
-						data-tooltip="Settings"
+						href="/"
+						class="icons tooltip-right bg-coolgray-200 hover:text-white"
+						class:text-white={$page.url.pathname === '/'}
+						class:bg-coolgray-500={$page.url.pathname === '/'}
+						data-tooltip="Dashboard"
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -474,57 +176,373 @@
 						>
 							<path stroke="none" d="M0 0h24v24H0z" fill="none" />
 							<path
-								d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+								d="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
 							/>
-							<circle cx="12" cy="12" r="3" />
+							<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
 						</svg>
 					</a>
-				{/if}
-				<div
-					class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
-					data-tooltip="Logout"
-					on:click={logout}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="ml-1 h-7 w-7"
-						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="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
-						/>
-						<path d="M7 12h14l-3 -3m0 6l3 -3" />
-					</svg>
-				</div>
-				<div
-					class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
-				>
+					<div class="border-t border-stone-700" />
+
 					<a
-						class="text-[10px] no-underline"
-						href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
-						target="_blank">v{$session.version}</a
+						sveltekit:prefetch
+						href="/applications"
+						class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
+						class:text-green-500={$page.url.pathname.startsWith('/applications') ||
+							$page.url.pathname.startsWith('/new/application')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
+							$page.url.pathname.startsWith('/new/application')}
+						data-tooltip="Applications"
 					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="4" y="4" width="6" height="6" rx="1" />
+							<rect x="4" y="14" width="6" height="6" rx="1" />
+							<rect x="14" y="14" width="6" height="6" rx="1" />
+							<line x1="14" y1="7" x2="20" y2="7" />
+							<line x1="17" y1="4" x2="17" y2="10" />
+						</svg>
+					</a>
+					<a
+						sveltekit:prefetch
+						href="/sources"
+						class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
+						class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
+							$page.url.pathname.startsWith('/new/source')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
+							$page.url.pathname.startsWith('/new/source')}
+						data-tooltip="Git Sources"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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" />
+							<circle cx="6" cy="6" r="2" />
+							<circle cx="18" cy="18" r="2" />
+							<path d="M11 6h5a2 2 0 0 1 2 2v8" />
+							<polyline points="14 9 11 6 14 3" />
+							<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
+							<polyline points="10 15 13 18 10 21" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/destinations"
+						class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
+						class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
+							$page.url.pathname.startsWith('/new/destination')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
+							$page.url.pathname.startsWith('/new/destination')}
+						data-tooltip="Destinations"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
+							/>
+							<path d="M5 10h3v3h-3z" />
+							<path d="M8 10h3v3h-3z" />
+							<path d="M11 10h3v3h-3z" />
+							<path d="M8 7h3v3h-3z" />
+							<path d="M11 7h3v3h-3z" />
+							<path d="M11 4h3v3h-3z" />
+							<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
+							<line x1="10" y1="16" x2="10" y2="16.01" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/databases"
+						class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
+						class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
+							$page.url.pathname.startsWith('/new/database')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
+							$page.url.pathname.startsWith('/new/database')}
+						data-tooltip="Databases"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/services"
+						class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
+						class:text-pink-500={$page.url.pathname.startsWith('/services') ||
+							$page.url.pathname.startsWith('/new/service')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
+							$page.url.pathname.startsWith('/new/service')}
+						data-tooltip="Services"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+				</div>
+				<div class="flex-1" />
+
+				<div class="flex flex-col space-y-4 py-2">
+					{#if $session.teamId === '0'}
+						{#if isUpdateAvailable}
+							<button
+								disabled={updateStatus.success === false}
+								title={$_('layout.update_available')}
+								on:click={update}
+								class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
+							>
+								{#if updateStatus.loading}
+									<svg
+										xmlns="http://www.w3.org/2000/svg"
+										class="lds-heart h-9 w-8"
+										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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
+										/>
+									</svg>
+								{:else if updateStatus.success === null}
+									<svg
+										xmlns="http://www.w3.org/2000/svg"
+										class="w-8 h-9"
+										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" />
+										<circle cx="12" cy="12" r="9" />
+										<line x1="12" y1="8" x2="8" y2="12" />
+										<line x1="12" y1="8" x2="12" y2="16" />
+										<line x1="16" y1="12" x2="12" y2="8" />
+									</svg>
+								{:else if updateStatus.success}
+									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+										><path
+											fill="#DD2E44"
+											d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
+										/><path
+											fill="#EA596E"
+											d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
+										/><path
+											fill="#A0041E"
+											d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
+										/><path
+											fill="#AA8DD8"
+											d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
+										/><path
+											fill="#77B255"
+											d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
+										/><path
+											fill="#AA8DD8"
+											d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
+										/><path
+											fill="#77B255"
+											d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
+										/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
+											fill="#9266CC"
+											cx="2"
+											cy="18"
+											r="2"
+										/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
+											fill="#5C913B"
+											cx="23.5"
+											cy="31.5"
+											r="1.5"
+										/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
+											fill="#FFCC4D"
+											cx="32.5"
+											cy="8.5"
+											r="1.5"
+										/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
+											fill="#FFCC4D"
+											cx="7.5"
+											cy="23.5"
+											r="1.5"
+										/></svg
+									>
+								{:else}
+									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+										><path
+											fill="#FFCC4D"
+											d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
+										/><path
+											fill="#664500"
+											d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
+										/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
+											fill="#664500"
+											d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
+										/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
+											fill="#E75A70"
+											cx="18"
+											cy="27"
+											rx="3"
+											ry="2"
+										/></svg
+									>
+								{/if}
+							</button>
+						{/if}
+					{/if}
+				</div>
+				<div class="flex flex-col space-y-4 py-2">
+					<a
+						sveltekit:prefetch
+						href="/teams"
+						class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
+						class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
+						data-tooltip="Teams"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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" />
+							<circle cx="9" cy="7" r="4" />
+							<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
+							<path d="M16 3.13a4 4 0 0 1 0 7.75" />
+							<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
+						</svg>
+					</a>
+					{#if $session.teamId === '0'}
+						<a
+							sveltekit:prefetch
+							href="/settings"
+							class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
+							class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
+							class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
+							data-tooltip="Settings"
+						>
+							<svg
+								xmlns="http://www.w3.org/2000/svg"
+								class="h-8 w-8"
+								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="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+								/>
+								<circle cx="12" cy="12" r="3" />
+							</svg>
+						</a>
+					{/if}
+					<div
+						class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
+						data-tooltip="Logout"
+						on:click={logout}
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="ml-1 h-7 w-7"
+							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="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
+							/>
+							<path d="M7 12h14l-3 -3m0 6l3 -3" />
+						</svg>
+					</div>
+					<div
+						class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
+					>
+						<a
+							class="text-[10px] no-underline"
+							href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
+							target="_blank">v{$session.version}</a
+						>
+					</div>
 				</div>
 			</div>
-		</div>
-	</nav>
-	<select
-		class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
-		bind:value={selectedTeamId}
-		on:change={switchTeam}
-	>
-		<option value="" disabled selected>Switch to a different team...</option>
-		{#each teams as team}
-			<option value={team.teamId}>{team.team.name} - {team.permission}</option>
-		{/each}
-	</select>
-{/if}
-<main>
-	<slot />
-</main>
+		</nav>
+		<select
+			class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
+			bind:value={selectedTeamId}
+			on:change={switchTeam}
+		>
+			<option value="" disabled selected>{$_('layout.switch_to_a_different_team')}</option>
+			{#each teams as team}
+				<option value={team.teamId}>{team.team.name} - {team.permission}</option>
+			{/each}
+		</select>
+	{/if}
+	<main>
+		<slot />
+	</main>
+{:catch error}
+	<p style="color: red">{error.message}</p>
+{/await}
diff --git a/static/locales/en.json b/static/locales/en.json
new file mode 100644
index 000000000..aa64ad4e5
--- /dev/null
+++ b/static/locales/en.json
@@ -0,0 +1,13 @@
+{
+	"layout": {
+		"update_done": "Update completed.",
+		"wait_new_version_startup": "Waiting for the new version to start...",
+		"new_version": "New version reachable. Reloading...",
+		"switch_to_a_different_team": "Switch to a different team...",
+		"update_available": "Update available"
+	},
+	"error": {
+		"you_can_find_your_way_back": "You can find your way back",
+		"here": "here"
+	}
+}
diff --git a/svelte.config.js b/svelte.config.js
index 4e8bc8966..9d711910b 100644
--- a/svelte.config.js
+++ b/svelte.config.js
@@ -12,6 +12,12 @@ const config = {
 		vite: {
 			optimizeDeps: {
 				exclude: ['svelte-kit-cookie-session']
+			},
+			server: {
+				fs: {
+					// Allow serving files from one level up to the project root
+					allow: ['../locales']
+				}
 			}
 		}
 	}

From d910b21185783a8cb194d03b25cd4803ce1fec41 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 16:15:00 +0200
Subject: [PATCH 02/23] Add Locale URL

---
 .vscode/settings.json                         |   6 +-
 package.json                                  |   2 +-
 pnpm-lock.yaml                                | 124 +--
 src/hooks.ts                                  |  43 +-
 src/lib/form.ts                               |  11 +-
 src/lib/lang.json                             |   4 +
 src/lib/settings.ts                           |   6 +-
 src/lib/translations.ts                       |  26 +
 .../applications/[id]/__layout.svelte         |   0
 .../applications/[id]/check.json.ts           |   0
 .../[id]/configuration/_BuildPack.svelte      |   0
 .../configuration/_GithubRepositories.svelte  |   0
 .../configuration/_GitlabRepositories.svelte  |   0
 .../[id]/configuration/buildpack.json.ts      |   0
 .../[id]/configuration/buildpack.svelte       |   0
 .../[id]/configuration/deploykey.json.ts      |   0
 .../[id]/configuration/destination.json.ts    |   0
 .../[id]/configuration/destination.svelte     |   0
 .../[id]/configuration/githubToken.json.ts    |   0
 .../[id]/configuration/repository.json.ts     |   0
 .../[id]/configuration/repository.svelte      |   0
 .../[id]/configuration/source.json.ts         |   0
 .../[id]/configuration/source.svelte          |   0
 .../[id]/configuration/sshkey.json.ts         |   0
 .../applications/[id]/delete.json.ts          |   0
 .../applications/[id]/deploy.json.ts          |   0
 .../applications/[id]/index.json.ts           |   0
 .../applications/[id]/index.svelte            |   0
 .../applications/[id]/logs/_Loading.svelte    |   0
 .../[id]/logs/build/_BuildLog.svelte          |   0
 .../[id]/logs/build/build.json.ts             |   0
 .../[id]/logs/build/index.json.ts             |   0
 .../applications/[id]/logs/build/index.svelte |   0
 .../applications/[id]/logs/index.json.ts      |   0
 .../applications/[id]/logs/index.svelte       |   0
 .../applications/[id]/previews/index.json.ts  |   0
 .../applications/[id]/previews/index.svelte   |   0
 .../applications/[id]/secrets/_Secret.svelte  |   0
 .../applications/[id]/secrets/index.json.ts   |   0
 .../applications/[id]/secrets/index.svelte    |   0
 .../applications/[id]/settings.json.ts        |   4 +-
 .../applications/[id]/stop.json.ts            |   0
 .../applications/[id]/storage/_Storage.svelte |   0
 .../applications/[id]/storage/index.json.ts   |   0
 .../applications/[id]/storage/index.svelte    |   0
 .../applications/_Application.svelte          |   3 +-
 .../{ => [lang]}/applications/index.svelte    |   5 +-
 src/routes/{ => [lang]}/applications/index.ts |   0
 src/routes/{ => [lang]}/applications/new.ts   |   0
 .../{ => [lang]}/common/getUniqueName.json.ts |   0
 .../databases/[id]/_Databases/_CouchDb.svelte |   0
 .../[id]/_Databases/_Databases.svelte         |   0
 .../databases/[id]/_Databases/_MongoDB.svelte |   0
 .../databases/[id]/_Databases/_MySQL.svelte   |   0
 .../[id]/_Databases/_PostgreSQL.svelte        |   0
 .../databases/[id]/_Databases/_Redis.svelte   |   0
 .../databases/[id]/__layout.svelte            |   0
 .../[id]/configuration/destination.json.ts    |   0
 .../[id]/configuration/destination.svelte     |   0
 .../databases/[id]/configuration/type.json.ts |   0
 .../databases/[id]/configuration/type.svelte  |   0
 .../[id]/configuration/version.json.ts        |   0
 .../[id]/configuration/version.svelte         |   0
 .../databases/[id]/delete.json.ts             |   0
 .../{ => [lang]}/databases/[id]/index.json.ts |   0
 .../{ => [lang]}/databases/[id]/index.svelte  |   0
 .../databases/[id]/settings.json.ts           |   0
 .../{ => [lang]}/databases/[id]/start.json.ts |   0
 .../{ => [lang]}/databases/[id]/stop.json.ts  |   0
 .../{ => [lang]}/databases/index.svelte       |   0
 src/routes/{ => [lang]}/databases/index.ts    |   0
 src/routes/{ => [lang]}/databases/new.ts      |   0
 .../destinations/[id]/_FoundApp.svelte        |   0
 .../destinations/[id]/_LocalDocker.svelte     |   0
 .../destinations/[id]/_RemoteDocker.svelte    |   0
 .../destinations/[id]/__layout.svelte         |   0
 .../destinations/[id]/index.json.ts           |   0
 .../destinations/[id]/index.svelte            |   0
 .../destinations/[id]/restart.json.ts         |   0
 .../destinations/[id]/scan.json.ts            |   0
 .../destinations/[id]/settings.json.ts        |   0
 .../destinations/[id]/start.json.ts           |   0
 .../destinations/[id]/stop.json.ts            |   0
 .../{ => [lang]}/destinations/index.json.ts   |   0
 .../{ => [lang]}/destinations/index.svelte    |   0
 src/routes/{ => [lang]}/login/index.json.ts   |   0
 src/routes/{ => [lang]}/login/index.svelte    |  17 +-
 src/routes/{ => [lang]}/logout/index.json.ts  |   0
 .../new/destination/_LocalDocker.svelte       |   0
 .../new/destination/_RemoteDocker.svelte      |   0
 .../new/destination/check.json.ts             |   0
 .../new/destination/docker.json.ts            |   0
 .../{ => [lang]}/new/destination/index.svelte |   0
 .../{ => [lang]}/new/source/_Github.svelte    |   0
 .../{ => [lang]}/new/source/_Gitlab.svelte    |   0
 .../{ => [lang]}/new/source/index.json.ts     |   0
 .../{ => [lang]}/new/source/index.svelte      |   0
 .../{ => [lang]}/new/team/index.json.ts       |   0
 src/routes/{ => [lang]}/new/team/index.svelte |   0
 src/routes/{ => [lang]}/register/index.svelte |  15 +-
 src/routes/{ => [lang]}/register/index.ts     |   0
 src/routes/{ => [lang]}/reset/index.json.ts   |   2 +-
 src/routes/{ => [lang]}/reset/index.svelte    |   0
 .../{ => [lang]}/reset/password.json.ts       |   2 +-
 .../services/[id]/_Services/_Ghost.svelte     |   0
 .../services/[id]/_Services/_MinIO.svelte     |   0
 .../[id]/_Services/_PlausibleAnalytics.svelte |   0
 .../services/[id]/_Services/_Services.svelte  |   0
 .../[id]/_Services/_VSCodeServer.svelte       |   0
 .../services/[id]/_Services/_Wordpress.svelte |   0
 .../services/[id]/__layout.svelte             |   0
 .../{ => [lang]}/services/[id]/check.json.ts  |   0
 .../[id]/configuration/destination.json.ts    |   0
 .../[id]/configuration/destination.svelte     |   0
 .../services/[id]/configuration/type.json.ts  |   0
 .../services/[id]/configuration/type.svelte   |   0
 .../[id]/configuration/version.json.ts        |   0
 .../[id]/configuration/version.svelte         |   0
 .../{ => [lang]}/services/[id]/delete.json.ts |   0
 .../services/[id]/ghost/index.json.ts         |   0
 .../services/[id]/ghost/start.json.ts         |   0
 .../services/[id]/ghost/stop.json.ts          |   0
 .../{ => [lang]}/services/[id]/index.json.ts  |   0
 .../{ => [lang]}/services/[id]/index.svelte   |   0
 .../services/[id]/languagetool/index.json.ts  |   0
 .../services/[id]/languagetool/start.json.ts  |   0
 .../services/[id]/languagetool/stop.json.ts   |   0
 .../services/[id]/minio/index.json.ts         |   0
 .../services/[id]/minio/start.json.ts         |   0
 .../services/[id]/minio/stop.json.ts          |   0
 .../services/[id]/n8n/index.json.ts           |   0
 .../services/[id]/n8n/start.json.ts           |   0
 .../services/[id]/n8n/stop.json.ts            |   0
 .../services/[id]/nocodb/index.json.ts        |   0
 .../services/[id]/nocodb/start.json.ts        |   0
 .../services/[id]/nocodb/stop.json.ts         |   0
 .../[id]/plausibleanalytics/activate.json.ts  |   0
 .../[id]/plausibleanalytics/index.json.ts     |   0
 .../[id]/plausibleanalytics/start.json.ts     |   0
 .../[id]/plausibleanalytics/stop.json.ts      |   0
 .../services/[id]/secrets/_Secret.svelte      |   0
 .../services/[id]/secrets/index.json.ts       |   0
 .../services/[id]/secrets/index.svelte        |   0
 .../services/[id]/settings.json.ts            |   0
 .../services/[id]/uptimekuma/index.json.ts    |   0
 .../services/[id]/uptimekuma/start.json.ts    |   0
 .../services/[id]/uptimekuma/stop.json.ts     |   0
 .../services/[id]/vaultwarden/index.json.ts   |   0
 .../services/[id]/vaultwarden/start.json.ts   |   0
 .../services/[id]/vaultwarden/stop.json.ts    |   0
 .../services/[id]/vscodeserver/index.json.ts  |   0
 .../services/[id]/vscodeserver/start.json.ts  |   0
 .../services/[id]/vscodeserver/stop.json.ts   |   0
 .../services/[id]/wordpress/index.json.ts     |   0
 .../services/[id]/wordpress/start.json.ts     |   0
 .../services/[id]/wordpress/stop.json.ts      |   0
 src/routes/{ => [lang]}/services/index.svelte |   0
 src/routes/{ => [lang]}/services/index.ts     |   0
 src/routes/{ => [lang]}/services/new.ts       |   0
 .../{ => [lang]}/settings/check.json.ts       |   0
 .../{ => [lang]}/settings/index.json.ts       |   0
 src/routes/{ => [lang]}/settings/index.svelte |   0
 .../{ => [lang]}/sources/[id]/_Github.svelte  |  17 +-
 .../{ => [lang]}/sources/[id]/_Gitlab.svelte  |   0
 .../{ => [lang]}/sources/[id]/__layout.svelte |   9 +-
 .../{ => [lang]}/sources/[id]/check.json.ts   |   0
 .../{ => [lang]}/sources/[id]/gitlab.json.ts  |   0
 .../{ => [lang]}/sources/[id]/index.json.ts   |   0
 .../{ => [lang]}/sources/[id]/index.svelte    |   0
 .../sources/[id]/newGithubApp.svelte          |   0
 src/routes/{ => [lang]}/sources/index.json.ts |   0
 src/routes/{ => [lang]}/sources/index.svelte  |   7 +-
 .../{ => [lang]}/teams/[id]/__layout.svelte   |   0
 .../{ => [lang]}/teams/[id]/index.json.ts     |   0
 .../{ => [lang]}/teams/[id]/index.svelte      |   0
 .../teams/[id]/invitation/accept.json.ts      |   0
 .../teams/[id]/invitation/invite.json.ts      |   0
 .../teams/[id]/invitation/revoke.json.ts      |   0
 .../teams/[id]/permission/change.json.ts      |   0
 .../teams/[id]/remove/user.json.ts            |   0
 src/routes/{ => [lang]}/teams/index.json.ts   |   0
 src/routes/{ => [lang]}/teams/index.svelte    |   0
 src/routes/__error.svelte                     |   8 +-
 src/routes/__layout.svelte                    | 762 +++++++++---------
 src/routes/index.svelte                       |  21 +-
 static/locales/en.json                        |  55 +-
 static/locales/fr.json                        |  66 ++
 187 files changed, 683 insertions(+), 532 deletions(-)
 create mode 100644 src/lib/lang.json
 create mode 100644 src/lib/translations.ts
 rename src/routes/{ => [lang]}/applications/[id]/__layout.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/check.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/_BuildPack.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/_GithubRepositories.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/_GitlabRepositories.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/buildpack.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/buildpack.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/deploykey.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/destination.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/destination.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/githubToken.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/repository.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/repository.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/source.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/source.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/configuration/sshkey.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/delete.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/deploy.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/index.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/index.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/logs/_Loading.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/logs/build/_BuildLog.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/logs/build/build.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/logs/build/index.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/logs/build/index.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/logs/index.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/logs/index.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/previews/index.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/previews/index.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/secrets/_Secret.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/secrets/index.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/secrets/index.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/settings.json.ts (85%)
 rename src/routes/{ => [lang]}/applications/[id]/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/storage/_Storage.svelte (100%)
 rename src/routes/{ => [lang]}/applications/[id]/storage/index.json.ts (100%)
 rename src/routes/{ => [lang]}/applications/[id]/storage/index.svelte (100%)
 rename src/routes/{ => [lang]}/applications/_Application.svelte (96%)
 rename src/routes/{ => [lang]}/applications/index.svelte (84%)
 rename src/routes/{ => [lang]}/applications/index.ts (100%)
 rename src/routes/{ => [lang]}/applications/new.ts (100%)
 rename src/routes/{ => [lang]}/common/getUniqueName.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/[id]/_Databases/_CouchDb.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/_Databases/_Databases.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/_Databases/_MongoDB.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/_Databases/_MySQL.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/_Databases/_PostgreSQL.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/_Databases/_Redis.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/__layout.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/configuration/destination.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/[id]/configuration/destination.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/configuration/type.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/[id]/configuration/type.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/configuration/version.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/[id]/configuration/version.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/delete.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/[id]/index.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/[id]/index.svelte (100%)
 rename src/routes/{ => [lang]}/databases/[id]/settings.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/[id]/start.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/[id]/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/databases/index.svelte (100%)
 rename src/routes/{ => [lang]}/databases/index.ts (100%)
 rename src/routes/{ => [lang]}/databases/new.ts (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/_FoundApp.svelte (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/_LocalDocker.svelte (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/_RemoteDocker.svelte (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/__layout.svelte (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/index.json.ts (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/index.svelte (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/restart.json.ts (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/scan.json.ts (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/settings.json.ts (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/start.json.ts (100%)
 rename src/routes/{ => [lang]}/destinations/[id]/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/destinations/index.json.ts (100%)
 rename src/routes/{ => [lang]}/destinations/index.svelte (100%)
 rename src/routes/{ => [lang]}/login/index.json.ts (100%)
 rename src/routes/{ => [lang]}/login/index.svelte (81%)
 rename src/routes/{ => [lang]}/logout/index.json.ts (100%)
 rename src/routes/{ => [lang]}/new/destination/_LocalDocker.svelte (100%)
 rename src/routes/{ => [lang]}/new/destination/_RemoteDocker.svelte (100%)
 rename src/routes/{ => [lang]}/new/destination/check.json.ts (100%)
 rename src/routes/{ => [lang]}/new/destination/docker.json.ts (100%)
 rename src/routes/{ => [lang]}/new/destination/index.svelte (100%)
 rename src/routes/{ => [lang]}/new/source/_Github.svelte (100%)
 rename src/routes/{ => [lang]}/new/source/_Gitlab.svelte (100%)
 rename src/routes/{ => [lang]}/new/source/index.json.ts (100%)
 rename src/routes/{ => [lang]}/new/source/index.svelte (100%)
 rename src/routes/{ => [lang]}/new/team/index.json.ts (100%)
 rename src/routes/{ => [lang]}/new/team/index.svelte (100%)
 rename src/routes/{ => [lang]}/register/index.svelte (84%)
 rename src/routes/{ => [lang]}/register/index.ts (100%)
 rename src/routes/{ => [lang]}/reset/index.json.ts (91%)
 rename src/routes/{ => [lang]}/reset/index.svelte (100%)
 rename src/routes/{ => [lang]}/reset/password.json.ts (93%)
 rename src/routes/{ => [lang]}/services/[id]/_Services/_Ghost.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/_Services/_MinIO.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/_Services/_PlausibleAnalytics.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/_Services/_Services.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/_Services/_VSCodeServer.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/_Services/_Wordpress.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/__layout.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/check.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/configuration/destination.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/configuration/destination.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/configuration/type.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/configuration/type.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/configuration/version.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/configuration/version.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/delete.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/ghost/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/ghost/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/ghost/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/index.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/languagetool/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/languagetool/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/languagetool/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/minio/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/minio/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/minio/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/n8n/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/n8n/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/n8n/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/nocodb/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/nocodb/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/nocodb/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/plausibleanalytics/activate.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/plausibleanalytics/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/plausibleanalytics/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/plausibleanalytics/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/secrets/_Secret.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/secrets/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/secrets/index.svelte (100%)
 rename src/routes/{ => [lang]}/services/[id]/settings.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/uptimekuma/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/uptimekuma/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/uptimekuma/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/vaultwarden/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/vaultwarden/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/vaultwarden/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/vscodeserver/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/vscodeserver/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/vscodeserver/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/wordpress/index.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/wordpress/start.json.ts (100%)
 rename src/routes/{ => [lang]}/services/[id]/wordpress/stop.json.ts (100%)
 rename src/routes/{ => [lang]}/services/index.svelte (100%)
 rename src/routes/{ => [lang]}/services/index.ts (100%)
 rename src/routes/{ => [lang]}/services/new.ts (100%)
 rename src/routes/{ => [lang]}/settings/check.json.ts (100%)
 rename src/routes/{ => [lang]}/settings/index.json.ts (100%)
 rename src/routes/{ => [lang]}/settings/index.svelte (100%)
 rename src/routes/{ => [lang]}/sources/[id]/_Github.svelte (81%)
 rename src/routes/{ => [lang]}/sources/[id]/_Gitlab.svelte (100%)
 rename src/routes/{ => [lang]}/sources/[id]/__layout.svelte (82%)
 rename src/routes/{ => [lang]}/sources/[id]/check.json.ts (100%)
 rename src/routes/{ => [lang]}/sources/[id]/gitlab.json.ts (100%)
 rename src/routes/{ => [lang]}/sources/[id]/index.json.ts (100%)
 rename src/routes/{ => [lang]}/sources/[id]/index.svelte (100%)
 rename src/routes/{ => [lang]}/sources/[id]/newGithubApp.svelte (100%)
 rename src/routes/{ => [lang]}/sources/index.json.ts (100%)
 rename src/routes/{ => [lang]}/sources/index.svelte (88%)
 rename src/routes/{ => [lang]}/teams/[id]/__layout.svelte (100%)
 rename src/routes/{ => [lang]}/teams/[id]/index.json.ts (100%)
 rename src/routes/{ => [lang]}/teams/[id]/index.svelte (100%)
 rename src/routes/{ => [lang]}/teams/[id]/invitation/accept.json.ts (100%)
 rename src/routes/{ => [lang]}/teams/[id]/invitation/invite.json.ts (100%)
 rename src/routes/{ => [lang]}/teams/[id]/invitation/revoke.json.ts (100%)
 rename src/routes/{ => [lang]}/teams/[id]/permission/change.json.ts (100%)
 rename src/routes/{ => [lang]}/teams/[id]/remove/user.json.ts (100%)
 rename src/routes/{ => [lang]}/teams/index.json.ts (100%)
 rename src/routes/{ => [lang]}/teams/index.svelte (100%)
 create mode 100644 static/locales/fr.json

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 1cc7be6e1..9a291b28c 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,7 +1,5 @@
 {
-	"i18n-ally.localesPaths": ["locales"],
+	"i18n-ally.localesPaths": ["static/locales"],
 	"i18n-ally.keystyle": "nested",
-	"i18n-ally.extract.ignoredByFiles": {
-		"src\\routes\\__layout.svelte": ["Coolify", "coolLabs logo"]
-	}
+	"i18n-ally.extract.ignored": ["Coolify", "coolLabs logo"]
 }
diff --git a/package.json b/package.json
index 7a0a8e4bf..39696ce59 100644
--- a/package.json
+++ b/package.json
@@ -51,7 +51,6 @@
 		"prisma": "3.11.1",
 		"svelte": "3.46.4",
 		"svelte-check": "2.4.6",
-		"svelte-i18n": "^3.3.13",
 		"svelte-preprocess": "4.10.4",
 		"svelte-select": "^4.4.7",
 		"tailwindcss": "3.0.23",
@@ -82,6 +81,7 @@
 		"mustache": "^4.2.0",
 		"node-forge": "1.3.0",
 		"svelte-kit-cookie-session": "2.1.2",
+		"sveltekit-i18n": "^2.1.2",
 		"tailwindcss-scrollbar": "^0.1.0",
 		"unique-names-generator": "4.7.1"
 	},
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e7594b347..2b7677e8d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -46,10 +46,10 @@ specifiers:
   prisma: 3.11.1
   svelte: 3.46.4
   svelte-check: 2.4.6
-  svelte-i18n: ^3.3.13
   svelte-kit-cookie-session: 2.1.2
   svelte-preprocess: 4.10.4
   svelte-select: ^4.4.7
+  sveltekit-i18n: ^2.1.2
   tailwindcss: 3.0.23
   tailwindcss-scrollbar: ^0.1.0
   ts-node: 10.7.0
@@ -79,6 +79,7 @@ dependencies:
   mustache: 4.2.0
   node-forge: 1.3.0
   svelte-kit-cookie-session: 2.1.2
+  sveltekit-i18n: 2.1.2_svelte@3.46.4
   tailwindcss-scrollbar: 0.1.0_tailwindcss@3.0.23
   unique-names-generator: 4.7.1
 
@@ -108,7 +109,6 @@ devDependencies:
   prisma: 3.11.1
   svelte: 3.46.4
   svelte-check: 2.4.6_postcss@8.4.12+svelte@3.46.4
-  svelte-i18n: 3.3.13_svelte@3.46.4
   svelte-preprocess: 4.10.4_296873641a0ad9f42fe92172d27bcedd
   svelte-select: 4.4.7
   tailwindcss: 3.0.23_b89136460714832cdda11d1e9d57d1ff
@@ -184,55 +184,6 @@ packages:
       - supports-color
     dev: true
 
-  /@formatjs/ecma402-abstract/1.11.4:
-    resolution:
-      {
-        integrity: sha512-EBikYFp2JCdIfGEb5G9dyCkTGDmC57KSHhRQOC3aYxoPWVZvfWCDjZwkGYHN7Lis/fmuWl906bnNTJifDQ3sXw==
-      }
-    dependencies:
-      '@formatjs/intl-localematcher': 0.2.25
-      tslib: 2.3.1
-    dev: true
-
-  /@formatjs/fast-memoize/1.2.1:
-    resolution:
-      {
-        integrity: sha512-Rg0e76nomkz3vF9IPlKeV+Qynok0r7YZjL6syLz4/urSg0IbjPZCB/iYUMNsYA643gh4mgrX3T7KEIFIxJBQeg==
-      }
-    dependencies:
-      tslib: 2.3.1
-    dev: true
-
-  /@formatjs/icu-messageformat-parser/2.0.19:
-    resolution:
-      {
-        integrity: sha512-8HsLm9YLyVVIDMyBJb7wmve2wGd461cUwJ470eUog5YH5ZsF4p5lgvaJ+oGKxz1mrSMNNdDHU9v/NDsS+z+ilg==
-      }
-    dependencies:
-      '@formatjs/ecma402-abstract': 1.11.4
-      '@formatjs/icu-skeleton-parser': 1.3.6
-      tslib: 2.3.1
-    dev: true
-
-  /@formatjs/icu-skeleton-parser/1.3.6:
-    resolution:
-      {
-        integrity: sha512-I96mOxvml/YLrwU2Txnd4klA7V8fRhb6JG/4hm3VMNmeJo1F03IpV2L3wWt7EweqNLES59SZ4d6hVOPCSf80Bg==
-      }
-    dependencies:
-      '@formatjs/ecma402-abstract': 1.11.4
-      tslib: 2.3.1
-    dev: true
-
-  /@formatjs/intl-localematcher/0.2.25:
-    resolution:
-      {
-        integrity: sha512-YmLcX70BxoSopLFdLr1Ds99NdlTI2oWoLbaUW2M406lxOIPzE1KQhRz2fPUkq34xVZQaihCoU29h0KK7An3bhA==
-      }
-    dependencies:
-      tslib: 2.3.1
-    dev: true
-
   /@humanwhocodes/config-array/0.5.0:
     resolution:
       {
@@ -495,6 +446,26 @@ packages:
       - supports-color
     dev: true
 
+  /@sveltekit-i18n/base/1.1.1_svelte@3.46.4:
+    resolution:
+      {
+        integrity: sha512-J/sMU0OwS3dCLOuilHMBqu8vZHuuXiNV9vFJx8Nb4/b5BlR/KCZ4bCXI8wZR02GHeCOYKZxWus07CM1scxa/jw==
+      }
+    peerDependencies:
+      svelte: ^3.x
+    dependencies:
+      svelte: 3.46.4
+    optionalDependencies:
+      '@sveltekit-i18n/parser-default': 1.0.3
+    dev: false
+
+  /@sveltekit-i18n/parser-default/1.0.3:
+    resolution:
+      {
+        integrity: sha512-HheveklTjp3hxpYQhoHfyA6B4bQaUeSV5MQf2usIv/58UF2jY/YqhCAWj9bDBjufbuZc5pSz4BXvdX3WVT+viA==
+      }
+    dev: false
+
   /@szmarczak/http-timer/5.0.1:
     resolution:
       {
@@ -2254,14 +2225,6 @@ packages:
       }
     dev: true
 
-  /deepmerge/4.2.2:
-    resolution:
-      {
-        integrity: sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==
-      }
-    engines: { node: '>=0.10.0' }
-    dev: true
-
   /defer-to-connect/2.0.1:
     resolution:
       {
@@ -3462,18 +3425,6 @@ packages:
         integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
       }
 
-  /intl-messageformat/9.12.0:
-    resolution:
-      {
-        integrity: sha512-5Q9j21JreB1G27/CqMYsA+pvJ19JjHyhiTSeUuvZK9BCDJGHtOLgpUUcGM+GLHiUuoVMKVeeX1smamiVHQrSKQ==
-      }
-    dependencies:
-      '@formatjs/ecma402-abstract': 1.11.4
-      '@formatjs/fast-memoize': 1.2.1
-      '@formatjs/icu-messageformat-parser': 2.0.19
-      tslib: 2.3.1
-    dev: true
-
   /invariant/2.2.4:
     resolution:
       {
@@ -5243,24 +5194,6 @@ packages:
       svelte: 3.46.4
     dev: true
 
-  /svelte-i18n/3.3.13_svelte@3.46.4:
-    resolution:
-      {
-        integrity: sha512-RQM+ys4+Y9ztH//tX22H1UL2cniLNmIR+N4xmYygV6QpQ6EyQvloZiENRew8XrVzfvJ8HaE8NU6/yurLkl7z3g==
-      }
-    engines: { node: '>= 11.15.0' }
-    hasBin: true
-    peerDependencies:
-      svelte: ^3.25.1
-    dependencies:
-      deepmerge: 4.2.2
-      estree-walker: 2.0.2
-      intl-messageformat: 9.12.0
-      sade: 1.7.4
-      svelte: 3.46.4
-      tiny-glob: 0.2.9
-    dev: true
-
   /svelte-kit-cookie-session/2.1.2:
     resolution:
       {
@@ -5338,6 +5271,19 @@ packages:
     engines: { node: '>= 8' }
     dev: true
 
+  /sveltekit-i18n/2.1.2_svelte@3.46.4:
+    resolution:
+      {
+        integrity: sha512-s5YxcbNd2EWNZaZR1A4Drt8s53E4fpUkN4XIWd3VRpw1pihZVWssqmBW1qkjQ6AB0kiu1Qwule+vt1HkbQOjrg==
+      }
+    peerDependencies:
+      svelte: ^3.x
+    dependencies:
+      '@sveltekit-i18n/base': 1.1.1_svelte@3.46.4
+      '@sveltekit-i18n/parser-default': 1.0.3
+      svelte: 3.46.4
+    dev: false
+
   /table/6.7.2:
     resolution:
       {
diff --git a/src/hooks.ts b/src/hooks.ts
index d6c6eca6d..4a0fa2e87 100644
--- a/src/hooks.ts
+++ b/src/hooks.ts
@@ -6,6 +6,9 @@ import { getUserDetails, sentry } from '$lib/common';
 import { version } from '$lib/common';
 import cookie from 'cookie';
 import { dev } from '$app/env';
+import { locales } from '$lib/translations';
+
+const routeRegex = new RegExp(/^\/[^.]*([?#].*)?$/);
 
 export const handle = handleSession(
 	{
@@ -62,9 +65,45 @@ export const handle = handleSession(
 					expires: new Date('Thu, 01 Jan 1970 00:00:01 GMT')
 				})
 			);
-		} finally {
-			return response;
 		}
+
+		const { url, request } = event;
+		const { pathname } = url;
+
+		// If this request is a route request
+		if (routeRegex.test(pathname)) {
+			// Get defined locales
+			const supportedLocales = locales.get();
+
+			// Try to get locale from `pathname`.
+			let locale = supportedLocales.find(
+				(l) => `${l}`.toLowerCase() === `${pathname.match(/[^/]+?(?=\/|$)/)}`.toLowerCase()
+			);
+
+			// If route locale is not supported
+			if (!locale) {
+				// Get user preferred locale
+				locale = `${`${request.headers['accept-language']}`.match(
+					/[a-zA-Z]+?(?=-|_|,|;)/
+				)}`.toLowerCase();
+
+				// Set default locale if user preferred locale does not match
+				if (!supportedLocales.includes(locale)) locale = 'en';
+
+				// 301 redirect
+				return new Response(undefined, {
+					headers: { location: `/${locale}${pathname}` },
+					status: 301
+				});
+			}
+
+			// Add html `lang` attribute
+			const body = await response.text();
+
+			return new Response(`${body}`.replace(/<html.*>/, `<html lang="${locale}">`), response);
+		}
+
+		return response;
 	}
 );
 
diff --git a/src/lib/form.ts b/src/lib/form.ts
index 08099576d..94871a66e 100644
--- a/src/lib/form.ts
+++ b/src/lib/form.ts
@@ -1,10 +1,15 @@
 import { toast } from '@zerodevx/svelte-toast';
-export function errorNotification(message: string) {
+import { t } from '$lib/translations';
+
+let formatMessage;
+t.subscribe((storeFormat) => (formatMessage = storeFormat));
+
+export function errorNotification(message: string): void {
 	console.error(message);
 	if (typeof message !== 'string') {
-		toast.push('Ooops, something is not okay, are you okay?');
+		toast.push(formatMessage('error.generic_message'));
 	} else {
-		toast.push(message);
+		toast.push(formatMessage(message));
 	}
 }
 export function enhance(
diff --git a/src/lib/lang.json b/src/lib/lang.json
new file mode 100644
index 000000000..b01c522bb
--- /dev/null
+++ b/src/lib/lang.json
@@ -0,0 +1,4 @@
+{
+	"en": "English",
+	"fr": "Français"
+}
diff --git a/src/lib/settings.ts b/src/lib/settings.ts
index 211852c06..437f1e415 100644
--- a/src/lib/settings.ts
+++ b/src/lib/settings.ts
@@ -1,4 +1,4 @@
-export const publicPaths = [
+const publicPaths = [
 	'/login',
 	'/register',
 	'/reset',
@@ -8,3 +8,7 @@ export const publicPaths = [
 	'/webhooks/github/install',
 	'/webhooks/gitlab'
 ];
+
+export function isPublicPath(path: string): boolean {
+	return publicPaths.includes(path);
+}
diff --git a/src/lib/translations.ts b/src/lib/translations.ts
new file mode 100644
index 000000000..299c8a75b
--- /dev/null
+++ b/src/lib/translations.ts
@@ -0,0 +1,26 @@
+import i18n from 'sveltekit-i18n';
+import lang from './lang.json';
+
+/** @type {import('sveltekit-i18n').Config} */
+export const config = {
+	fallbackLocale: 'en',
+	translations: {
+		en: { lang },
+		fr: { lang }
+	},
+	loaders: [
+		{
+			locale: 'en',
+			key: '',
+			loader: async () => (await import('../../static/locales/en.json')).default
+		},
+		{
+			locale: 'fr',
+			key: '',
+			loader: async () => (await import('../../static/locales/fr.json')).default
+		}
+	]
+};
+
+export const { t, loading, locales, locale, loadTranslations } = new i18n(config);
+loading.subscribe(($loading) => $loading && console.log('Loading translations...'));
diff --git a/src/routes/applications/[id]/__layout.svelte b/src/routes/[lang]/applications/[id]/__layout.svelte
similarity index 100%
rename from src/routes/applications/[id]/__layout.svelte
rename to src/routes/[lang]/applications/[id]/__layout.svelte
diff --git a/src/routes/applications/[id]/check.json.ts b/src/routes/[lang]/applications/[id]/check.json.ts
similarity index 100%
rename from src/routes/applications/[id]/check.json.ts
rename to src/routes/[lang]/applications/[id]/check.json.ts
diff --git a/src/routes/applications/[id]/configuration/_BuildPack.svelte b/src/routes/[lang]/applications/[id]/configuration/_BuildPack.svelte
similarity index 100%
rename from src/routes/applications/[id]/configuration/_BuildPack.svelte
rename to src/routes/[lang]/applications/[id]/configuration/_BuildPack.svelte
diff --git a/src/routes/applications/[id]/configuration/_GithubRepositories.svelte b/src/routes/[lang]/applications/[id]/configuration/_GithubRepositories.svelte
similarity index 100%
rename from src/routes/applications/[id]/configuration/_GithubRepositories.svelte
rename to src/routes/[lang]/applications/[id]/configuration/_GithubRepositories.svelte
diff --git a/src/routes/applications/[id]/configuration/_GitlabRepositories.svelte b/src/routes/[lang]/applications/[id]/configuration/_GitlabRepositories.svelte
similarity index 100%
rename from src/routes/applications/[id]/configuration/_GitlabRepositories.svelte
rename to src/routes/[lang]/applications/[id]/configuration/_GitlabRepositories.svelte
diff --git a/src/routes/applications/[id]/configuration/buildpack.json.ts b/src/routes/[lang]/applications/[id]/configuration/buildpack.json.ts
similarity index 100%
rename from src/routes/applications/[id]/configuration/buildpack.json.ts
rename to src/routes/[lang]/applications/[id]/configuration/buildpack.json.ts
diff --git a/src/routes/applications/[id]/configuration/buildpack.svelte b/src/routes/[lang]/applications/[id]/configuration/buildpack.svelte
similarity index 100%
rename from src/routes/applications/[id]/configuration/buildpack.svelte
rename to src/routes/[lang]/applications/[id]/configuration/buildpack.svelte
diff --git a/src/routes/applications/[id]/configuration/deploykey.json.ts b/src/routes/[lang]/applications/[id]/configuration/deploykey.json.ts
similarity index 100%
rename from src/routes/applications/[id]/configuration/deploykey.json.ts
rename to src/routes/[lang]/applications/[id]/configuration/deploykey.json.ts
diff --git a/src/routes/applications/[id]/configuration/destination.json.ts b/src/routes/[lang]/applications/[id]/configuration/destination.json.ts
similarity index 100%
rename from src/routes/applications/[id]/configuration/destination.json.ts
rename to src/routes/[lang]/applications/[id]/configuration/destination.json.ts
diff --git a/src/routes/applications/[id]/configuration/destination.svelte b/src/routes/[lang]/applications/[id]/configuration/destination.svelte
similarity index 100%
rename from src/routes/applications/[id]/configuration/destination.svelte
rename to src/routes/[lang]/applications/[id]/configuration/destination.svelte
diff --git a/src/routes/applications/[id]/configuration/githubToken.json.ts b/src/routes/[lang]/applications/[id]/configuration/githubToken.json.ts
similarity index 100%
rename from src/routes/applications/[id]/configuration/githubToken.json.ts
rename to src/routes/[lang]/applications/[id]/configuration/githubToken.json.ts
diff --git a/src/routes/applications/[id]/configuration/repository.json.ts b/src/routes/[lang]/applications/[id]/configuration/repository.json.ts
similarity index 100%
rename from src/routes/applications/[id]/configuration/repository.json.ts
rename to src/routes/[lang]/applications/[id]/configuration/repository.json.ts
diff --git a/src/routes/applications/[id]/configuration/repository.svelte b/src/routes/[lang]/applications/[id]/configuration/repository.svelte
similarity index 100%
rename from src/routes/applications/[id]/configuration/repository.svelte
rename to src/routes/[lang]/applications/[id]/configuration/repository.svelte
diff --git a/src/routes/applications/[id]/configuration/source.json.ts b/src/routes/[lang]/applications/[id]/configuration/source.json.ts
similarity index 100%
rename from src/routes/applications/[id]/configuration/source.json.ts
rename to src/routes/[lang]/applications/[id]/configuration/source.json.ts
diff --git a/src/routes/applications/[id]/configuration/source.svelte b/src/routes/[lang]/applications/[id]/configuration/source.svelte
similarity index 100%
rename from src/routes/applications/[id]/configuration/source.svelte
rename to src/routes/[lang]/applications/[id]/configuration/source.svelte
diff --git a/src/routes/applications/[id]/configuration/sshkey.json.ts b/src/routes/[lang]/applications/[id]/configuration/sshkey.json.ts
similarity index 100%
rename from src/routes/applications/[id]/configuration/sshkey.json.ts
rename to src/routes/[lang]/applications/[id]/configuration/sshkey.json.ts
diff --git a/src/routes/applications/[id]/delete.json.ts b/src/routes/[lang]/applications/[id]/delete.json.ts
similarity index 100%
rename from src/routes/applications/[id]/delete.json.ts
rename to src/routes/[lang]/applications/[id]/delete.json.ts
diff --git a/src/routes/applications/[id]/deploy.json.ts b/src/routes/[lang]/applications/[id]/deploy.json.ts
similarity index 100%
rename from src/routes/applications/[id]/deploy.json.ts
rename to src/routes/[lang]/applications/[id]/deploy.json.ts
diff --git a/src/routes/applications/[id]/index.json.ts b/src/routes/[lang]/applications/[id]/index.json.ts
similarity index 100%
rename from src/routes/applications/[id]/index.json.ts
rename to src/routes/[lang]/applications/[id]/index.json.ts
diff --git a/src/routes/applications/[id]/index.svelte b/src/routes/[lang]/applications/[id]/index.svelte
similarity index 100%
rename from src/routes/applications/[id]/index.svelte
rename to src/routes/[lang]/applications/[id]/index.svelte
diff --git a/src/routes/applications/[id]/logs/_Loading.svelte b/src/routes/[lang]/applications/[id]/logs/_Loading.svelte
similarity index 100%
rename from src/routes/applications/[id]/logs/_Loading.svelte
rename to src/routes/[lang]/applications/[id]/logs/_Loading.svelte
diff --git a/src/routes/applications/[id]/logs/build/_BuildLog.svelte b/src/routes/[lang]/applications/[id]/logs/build/_BuildLog.svelte
similarity index 100%
rename from src/routes/applications/[id]/logs/build/_BuildLog.svelte
rename to src/routes/[lang]/applications/[id]/logs/build/_BuildLog.svelte
diff --git a/src/routes/applications/[id]/logs/build/build.json.ts b/src/routes/[lang]/applications/[id]/logs/build/build.json.ts
similarity index 100%
rename from src/routes/applications/[id]/logs/build/build.json.ts
rename to src/routes/[lang]/applications/[id]/logs/build/build.json.ts
diff --git a/src/routes/applications/[id]/logs/build/index.json.ts b/src/routes/[lang]/applications/[id]/logs/build/index.json.ts
similarity index 100%
rename from src/routes/applications/[id]/logs/build/index.json.ts
rename to src/routes/[lang]/applications/[id]/logs/build/index.json.ts
diff --git a/src/routes/applications/[id]/logs/build/index.svelte b/src/routes/[lang]/applications/[id]/logs/build/index.svelte
similarity index 100%
rename from src/routes/applications/[id]/logs/build/index.svelte
rename to src/routes/[lang]/applications/[id]/logs/build/index.svelte
diff --git a/src/routes/applications/[id]/logs/index.json.ts b/src/routes/[lang]/applications/[id]/logs/index.json.ts
similarity index 100%
rename from src/routes/applications/[id]/logs/index.json.ts
rename to src/routes/[lang]/applications/[id]/logs/index.json.ts
diff --git a/src/routes/applications/[id]/logs/index.svelte b/src/routes/[lang]/applications/[id]/logs/index.svelte
similarity index 100%
rename from src/routes/applications/[id]/logs/index.svelte
rename to src/routes/[lang]/applications/[id]/logs/index.svelte
diff --git a/src/routes/applications/[id]/previews/index.json.ts b/src/routes/[lang]/applications/[id]/previews/index.json.ts
similarity index 100%
rename from src/routes/applications/[id]/previews/index.json.ts
rename to src/routes/[lang]/applications/[id]/previews/index.json.ts
diff --git a/src/routes/applications/[id]/previews/index.svelte b/src/routes/[lang]/applications/[id]/previews/index.svelte
similarity index 100%
rename from src/routes/applications/[id]/previews/index.svelte
rename to src/routes/[lang]/applications/[id]/previews/index.svelte
diff --git a/src/routes/applications/[id]/secrets/_Secret.svelte b/src/routes/[lang]/applications/[id]/secrets/_Secret.svelte
similarity index 100%
rename from src/routes/applications/[id]/secrets/_Secret.svelte
rename to src/routes/[lang]/applications/[id]/secrets/_Secret.svelte
diff --git a/src/routes/applications/[id]/secrets/index.json.ts b/src/routes/[lang]/applications/[id]/secrets/index.json.ts
similarity index 100%
rename from src/routes/applications/[id]/secrets/index.json.ts
rename to src/routes/[lang]/applications/[id]/secrets/index.json.ts
diff --git a/src/routes/applications/[id]/secrets/index.svelte b/src/routes/[lang]/applications/[id]/secrets/index.svelte
similarity index 100%
rename from src/routes/applications/[id]/secrets/index.svelte
rename to src/routes/[lang]/applications/[id]/secrets/index.svelte
diff --git a/src/routes/applications/[id]/settings.json.ts b/src/routes/[lang]/applications/[id]/settings.json.ts
similarity index 85%
rename from src/routes/applications/[id]/settings.json.ts
rename to src/routes/[lang]/applications/[id]/settings.json.ts
index aea78ff96..222eff807 100644
--- a/src/routes/applications/[id]/settings.json.ts
+++ b/src/routes/[lang]/applications/[id]/settings.json.ts
@@ -2,6 +2,7 @@ import { getUserDetails } from '$lib/common';
 import * as db from '$lib/database';
 import { ErrorHandler } from '$lib/database';
 import type { RequestHandler } from '@sveltejs/kit';
+import { _ } from 'svelte-i18n';
 
 export const post: RequestHandler = async (event) => {
 	const { teamId, status, body } = await getUserDetails(event);
@@ -14,8 +15,7 @@ export const post: RequestHandler = async (event) => {
 		const isDouble = await db.checkDoubleBranch(branch, projectId);
 		if (isDouble && autodeploy) {
 			throw {
-				message:
-					'Cannot activate automatic deployments until only one application is defined for this repository / branch.'
+				message: $_('application.app.error_double_app_for_one_branch')
 			};
 		}
 		await db.setApplicationSettings({ id, debug, previews, dualCerts, autodeploy });
diff --git a/src/routes/applications/[id]/stop.json.ts b/src/routes/[lang]/applications/[id]/stop.json.ts
similarity index 100%
rename from src/routes/applications/[id]/stop.json.ts
rename to src/routes/[lang]/applications/[id]/stop.json.ts
diff --git a/src/routes/applications/[id]/storage/_Storage.svelte b/src/routes/[lang]/applications/[id]/storage/_Storage.svelte
similarity index 100%
rename from src/routes/applications/[id]/storage/_Storage.svelte
rename to src/routes/[lang]/applications/[id]/storage/_Storage.svelte
diff --git a/src/routes/applications/[id]/storage/index.json.ts b/src/routes/[lang]/applications/[id]/storage/index.json.ts
similarity index 100%
rename from src/routes/applications/[id]/storage/index.json.ts
rename to src/routes/[lang]/applications/[id]/storage/index.json.ts
diff --git a/src/routes/applications/[id]/storage/index.svelte b/src/routes/[lang]/applications/[id]/storage/index.svelte
similarity index 100%
rename from src/routes/applications/[id]/storage/index.svelte
rename to src/routes/[lang]/applications/[id]/storage/index.svelte
diff --git a/src/routes/applications/_Application.svelte b/src/routes/[lang]/applications/_Application.svelte
similarity index 96%
rename from src/routes/applications/_Application.svelte
rename to src/routes/[lang]/applications/_Application.svelte
index 16d19a42f..910c8e0c4 100644
--- a/src/routes/applications/_Application.svelte
+++ b/src/routes/[lang]/applications/_Application.svelte
@@ -15,6 +15,7 @@
 	import Docker from '$lib/components/svg/applications/Docker.svelte';
 	import Astro from '$lib/components/svg/applications/Astro.svelte';
 	import Eleventy from '$lib/components/svg/applications/Eleventy.svelte';
+	import { t } from '$lib/translations';
 
 	const buildPack = application?.buildPack?.toLowerCase();
 </script>
@@ -59,7 +60,7 @@
 		{/if}
 		{#if !application.gitSourceId || !application.destinationDockerId}
 			<div class="truncate text-center font-bold text-red-500 group-hover:text-white">
-				Configuration missing
+				{$t('application.configuration_missing')}
 			</div>
 		{/if}
 	</div>
diff --git a/src/routes/applications/index.svelte b/src/routes/[lang]/applications/index.svelte
similarity index 84%
rename from src/routes/applications/index.svelte
rename to src/routes/[lang]/applications/index.svelte
index 5f6056ac5..d559fd7b9 100644
--- a/src/routes/applications/index.svelte
+++ b/src/routes/[lang]/applications/index.svelte
@@ -4,6 +4,7 @@
 	import Application from './_Application.svelte';
 	import { post } from '$lib/api';
 	import { goto } from '$app/navigation';
+	import { t } from '$lib/translations';
 	async function newApplication() {
 		const { id } = await post('/applications/new', {});
 		return await goto(`/applications/${id}`, { replaceState: true });
@@ -11,7 +12,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl ">Applications</div>
+	<div class="mr-4 text-2xl ">{$t('index.applications')}</div>
 	{#if $session.isAdmin}
 		<div on:click={newApplication} class="add-icon cursor-pointer bg-green-600 hover:bg-green-500">
 			<svg
@@ -33,7 +34,7 @@
 <div class="flex flex-wrap justify-center">
 	{#if !applications || applications.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">No applications found</div>
+			<div class="text-center text-xl font-bold">{$t('application.no_applications_found')}</div>
 		</div>
 	{:else}
 		{#each applications as application}
diff --git a/src/routes/applications/index.ts b/src/routes/[lang]/applications/index.ts
similarity index 100%
rename from src/routes/applications/index.ts
rename to src/routes/[lang]/applications/index.ts
diff --git a/src/routes/applications/new.ts b/src/routes/[lang]/applications/new.ts
similarity index 100%
rename from src/routes/applications/new.ts
rename to src/routes/[lang]/applications/new.ts
diff --git a/src/routes/common/getUniqueName.json.ts b/src/routes/[lang]/common/getUniqueName.json.ts
similarity index 100%
rename from src/routes/common/getUniqueName.json.ts
rename to src/routes/[lang]/common/getUniqueName.json.ts
diff --git a/src/routes/databases/[id]/_Databases/_CouchDb.svelte b/src/routes/[lang]/databases/[id]/_Databases/_CouchDb.svelte
similarity index 100%
rename from src/routes/databases/[id]/_Databases/_CouchDb.svelte
rename to src/routes/[lang]/databases/[id]/_Databases/_CouchDb.svelte
diff --git a/src/routes/databases/[id]/_Databases/_Databases.svelte b/src/routes/[lang]/databases/[id]/_Databases/_Databases.svelte
similarity index 100%
rename from src/routes/databases/[id]/_Databases/_Databases.svelte
rename to src/routes/[lang]/databases/[id]/_Databases/_Databases.svelte
diff --git a/src/routes/databases/[id]/_Databases/_MongoDB.svelte b/src/routes/[lang]/databases/[id]/_Databases/_MongoDB.svelte
similarity index 100%
rename from src/routes/databases/[id]/_Databases/_MongoDB.svelte
rename to src/routes/[lang]/databases/[id]/_Databases/_MongoDB.svelte
diff --git a/src/routes/databases/[id]/_Databases/_MySQL.svelte b/src/routes/[lang]/databases/[id]/_Databases/_MySQL.svelte
similarity index 100%
rename from src/routes/databases/[id]/_Databases/_MySQL.svelte
rename to src/routes/[lang]/databases/[id]/_Databases/_MySQL.svelte
diff --git a/src/routes/databases/[id]/_Databases/_PostgreSQL.svelte b/src/routes/[lang]/databases/[id]/_Databases/_PostgreSQL.svelte
similarity index 100%
rename from src/routes/databases/[id]/_Databases/_PostgreSQL.svelte
rename to src/routes/[lang]/databases/[id]/_Databases/_PostgreSQL.svelte
diff --git a/src/routes/databases/[id]/_Databases/_Redis.svelte b/src/routes/[lang]/databases/[id]/_Databases/_Redis.svelte
similarity index 100%
rename from src/routes/databases/[id]/_Databases/_Redis.svelte
rename to src/routes/[lang]/databases/[id]/_Databases/_Redis.svelte
diff --git a/src/routes/databases/[id]/__layout.svelte b/src/routes/[lang]/databases/[id]/__layout.svelte
similarity index 100%
rename from src/routes/databases/[id]/__layout.svelte
rename to src/routes/[lang]/databases/[id]/__layout.svelte
diff --git a/src/routes/databases/[id]/configuration/destination.json.ts b/src/routes/[lang]/databases/[id]/configuration/destination.json.ts
similarity index 100%
rename from src/routes/databases/[id]/configuration/destination.json.ts
rename to src/routes/[lang]/databases/[id]/configuration/destination.json.ts
diff --git a/src/routes/databases/[id]/configuration/destination.svelte b/src/routes/[lang]/databases/[id]/configuration/destination.svelte
similarity index 100%
rename from src/routes/databases/[id]/configuration/destination.svelte
rename to src/routes/[lang]/databases/[id]/configuration/destination.svelte
diff --git a/src/routes/databases/[id]/configuration/type.json.ts b/src/routes/[lang]/databases/[id]/configuration/type.json.ts
similarity index 100%
rename from src/routes/databases/[id]/configuration/type.json.ts
rename to src/routes/[lang]/databases/[id]/configuration/type.json.ts
diff --git a/src/routes/databases/[id]/configuration/type.svelte b/src/routes/[lang]/databases/[id]/configuration/type.svelte
similarity index 100%
rename from src/routes/databases/[id]/configuration/type.svelte
rename to src/routes/[lang]/databases/[id]/configuration/type.svelte
diff --git a/src/routes/databases/[id]/configuration/version.json.ts b/src/routes/[lang]/databases/[id]/configuration/version.json.ts
similarity index 100%
rename from src/routes/databases/[id]/configuration/version.json.ts
rename to src/routes/[lang]/databases/[id]/configuration/version.json.ts
diff --git a/src/routes/databases/[id]/configuration/version.svelte b/src/routes/[lang]/databases/[id]/configuration/version.svelte
similarity index 100%
rename from src/routes/databases/[id]/configuration/version.svelte
rename to src/routes/[lang]/databases/[id]/configuration/version.svelte
diff --git a/src/routes/databases/[id]/delete.json.ts b/src/routes/[lang]/databases/[id]/delete.json.ts
similarity index 100%
rename from src/routes/databases/[id]/delete.json.ts
rename to src/routes/[lang]/databases/[id]/delete.json.ts
diff --git a/src/routes/databases/[id]/index.json.ts b/src/routes/[lang]/databases/[id]/index.json.ts
similarity index 100%
rename from src/routes/databases/[id]/index.json.ts
rename to src/routes/[lang]/databases/[id]/index.json.ts
diff --git a/src/routes/databases/[id]/index.svelte b/src/routes/[lang]/databases/[id]/index.svelte
similarity index 100%
rename from src/routes/databases/[id]/index.svelte
rename to src/routes/[lang]/databases/[id]/index.svelte
diff --git a/src/routes/databases/[id]/settings.json.ts b/src/routes/[lang]/databases/[id]/settings.json.ts
similarity index 100%
rename from src/routes/databases/[id]/settings.json.ts
rename to src/routes/[lang]/databases/[id]/settings.json.ts
diff --git a/src/routes/databases/[id]/start.json.ts b/src/routes/[lang]/databases/[id]/start.json.ts
similarity index 100%
rename from src/routes/databases/[id]/start.json.ts
rename to src/routes/[lang]/databases/[id]/start.json.ts
diff --git a/src/routes/databases/[id]/stop.json.ts b/src/routes/[lang]/databases/[id]/stop.json.ts
similarity index 100%
rename from src/routes/databases/[id]/stop.json.ts
rename to src/routes/[lang]/databases/[id]/stop.json.ts
diff --git a/src/routes/databases/index.svelte b/src/routes/[lang]/databases/index.svelte
similarity index 100%
rename from src/routes/databases/index.svelte
rename to src/routes/[lang]/databases/index.svelte
diff --git a/src/routes/databases/index.ts b/src/routes/[lang]/databases/index.ts
similarity index 100%
rename from src/routes/databases/index.ts
rename to src/routes/[lang]/databases/index.ts
diff --git a/src/routes/databases/new.ts b/src/routes/[lang]/databases/new.ts
similarity index 100%
rename from src/routes/databases/new.ts
rename to src/routes/[lang]/databases/new.ts
diff --git a/src/routes/destinations/[id]/_FoundApp.svelte b/src/routes/[lang]/destinations/[id]/_FoundApp.svelte
similarity index 100%
rename from src/routes/destinations/[id]/_FoundApp.svelte
rename to src/routes/[lang]/destinations/[id]/_FoundApp.svelte
diff --git a/src/routes/destinations/[id]/_LocalDocker.svelte b/src/routes/[lang]/destinations/[id]/_LocalDocker.svelte
similarity index 100%
rename from src/routes/destinations/[id]/_LocalDocker.svelte
rename to src/routes/[lang]/destinations/[id]/_LocalDocker.svelte
diff --git a/src/routes/destinations/[id]/_RemoteDocker.svelte b/src/routes/[lang]/destinations/[id]/_RemoteDocker.svelte
similarity index 100%
rename from src/routes/destinations/[id]/_RemoteDocker.svelte
rename to src/routes/[lang]/destinations/[id]/_RemoteDocker.svelte
diff --git a/src/routes/destinations/[id]/__layout.svelte b/src/routes/[lang]/destinations/[id]/__layout.svelte
similarity index 100%
rename from src/routes/destinations/[id]/__layout.svelte
rename to src/routes/[lang]/destinations/[id]/__layout.svelte
diff --git a/src/routes/destinations/[id]/index.json.ts b/src/routes/[lang]/destinations/[id]/index.json.ts
similarity index 100%
rename from src/routes/destinations/[id]/index.json.ts
rename to src/routes/[lang]/destinations/[id]/index.json.ts
diff --git a/src/routes/destinations/[id]/index.svelte b/src/routes/[lang]/destinations/[id]/index.svelte
similarity index 100%
rename from src/routes/destinations/[id]/index.svelte
rename to src/routes/[lang]/destinations/[id]/index.svelte
diff --git a/src/routes/destinations/[id]/restart.json.ts b/src/routes/[lang]/destinations/[id]/restart.json.ts
similarity index 100%
rename from src/routes/destinations/[id]/restart.json.ts
rename to src/routes/[lang]/destinations/[id]/restart.json.ts
diff --git a/src/routes/destinations/[id]/scan.json.ts b/src/routes/[lang]/destinations/[id]/scan.json.ts
similarity index 100%
rename from src/routes/destinations/[id]/scan.json.ts
rename to src/routes/[lang]/destinations/[id]/scan.json.ts
diff --git a/src/routes/destinations/[id]/settings.json.ts b/src/routes/[lang]/destinations/[id]/settings.json.ts
similarity index 100%
rename from src/routes/destinations/[id]/settings.json.ts
rename to src/routes/[lang]/destinations/[id]/settings.json.ts
diff --git a/src/routes/destinations/[id]/start.json.ts b/src/routes/[lang]/destinations/[id]/start.json.ts
similarity index 100%
rename from src/routes/destinations/[id]/start.json.ts
rename to src/routes/[lang]/destinations/[id]/start.json.ts
diff --git a/src/routes/destinations/[id]/stop.json.ts b/src/routes/[lang]/destinations/[id]/stop.json.ts
similarity index 100%
rename from src/routes/destinations/[id]/stop.json.ts
rename to src/routes/[lang]/destinations/[id]/stop.json.ts
diff --git a/src/routes/destinations/index.json.ts b/src/routes/[lang]/destinations/index.json.ts
similarity index 100%
rename from src/routes/destinations/index.json.ts
rename to src/routes/[lang]/destinations/index.json.ts
diff --git a/src/routes/destinations/index.svelte b/src/routes/[lang]/destinations/index.svelte
similarity index 100%
rename from src/routes/destinations/index.svelte
rename to src/routes/[lang]/destinations/index.svelte
diff --git a/src/routes/login/index.json.ts b/src/routes/[lang]/login/index.json.ts
similarity index 100%
rename from src/routes/login/index.json.ts
rename to src/routes/[lang]/login/index.json.ts
diff --git a/src/routes/login/index.svelte b/src/routes/[lang]/login/index.svelte
similarity index 81%
rename from src/routes/login/index.svelte
rename to src/routes/[lang]/login/index.svelte
index b321bc086..dccbc90c9 100644
--- a/src/routes/login/index.svelte
+++ b/src/routes/[lang]/login/index.svelte
@@ -5,6 +5,8 @@
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
 	import { onMount } from 'svelte';
+	import { t } from '$lib/translations';
+
 	let loading = false;
 	let emailEl;
 	let email, password;
@@ -39,7 +41,7 @@
 
 <div class="flex h-screen flex-col items-center justify-center">
 	{#if $session.userId}
-		<div class="flex justify-center px-4 text-xl font-bold">Already logged in...</div>
+		<div class="flex justify-center px-4 text-xl font-bold">{$t('login.already_logged_in')}</div>
 	{:else}
 		<div class="flex justify-center px-4">
 			<form on:submit|preventDefault={handleSubmit} class="flex flex-col py-4 space-y-2">
@@ -48,7 +50,7 @@
 				<input
 					type="email"
 					name="email"
-					placeholder="Email"
+					placeholder={$t('forms.email')}
 					autocomplete="off"
 					required
 					bind:this={emailEl}
@@ -57,7 +59,7 @@
 				<input
 					type="password"
 					name="password"
-					placeholder="Password"
+					placeholder={$t('forms.password')}
 					bind:value={password}
 					required
 				/>
@@ -69,16 +71,19 @@
 						class="hover:opacity-90 text-white"
 						class:bg-transparent={loading}
 						class:text-stone-600={loading}
-						class:bg-coollabs={!loading}>{loading ? 'Authenticating...' : 'Login'}</button
+						class:bg-coollabs={!loading}
+						>{loading ? $t('login.authenticating') : $t('login.login')}</button
 					>
 
 					<button
 						on:click|preventDefault={() => goto('/register')}
-						class="bg-transparent hover:bg-coolgray-300	text-white ">Register</button
+						class="bg-transparent hover:bg-coolgray-300	text-white "
+						>{$t('register.register')}</button
 					>
 					<button
 						class="bg-transparent hover:bg-coolgray-300"
-						on:click|preventDefault={() => goto('/reset')}>Reset password</button
+						on:click|preventDefault={() => goto('/reset')}
+						>{$t('reset_password.reset_password')}</button
 					>
 				</div>
 			</form>
diff --git a/src/routes/logout/index.json.ts b/src/routes/[lang]/logout/index.json.ts
similarity index 100%
rename from src/routes/logout/index.json.ts
rename to src/routes/[lang]/logout/index.json.ts
diff --git a/src/routes/new/destination/_LocalDocker.svelte b/src/routes/[lang]/new/destination/_LocalDocker.svelte
similarity index 100%
rename from src/routes/new/destination/_LocalDocker.svelte
rename to src/routes/[lang]/new/destination/_LocalDocker.svelte
diff --git a/src/routes/new/destination/_RemoteDocker.svelte b/src/routes/[lang]/new/destination/_RemoteDocker.svelte
similarity index 100%
rename from src/routes/new/destination/_RemoteDocker.svelte
rename to src/routes/[lang]/new/destination/_RemoteDocker.svelte
diff --git a/src/routes/new/destination/check.json.ts b/src/routes/[lang]/new/destination/check.json.ts
similarity index 100%
rename from src/routes/new/destination/check.json.ts
rename to src/routes/[lang]/new/destination/check.json.ts
diff --git a/src/routes/new/destination/docker.json.ts b/src/routes/[lang]/new/destination/docker.json.ts
similarity index 100%
rename from src/routes/new/destination/docker.json.ts
rename to src/routes/[lang]/new/destination/docker.json.ts
diff --git a/src/routes/new/destination/index.svelte b/src/routes/[lang]/new/destination/index.svelte
similarity index 100%
rename from src/routes/new/destination/index.svelte
rename to src/routes/[lang]/new/destination/index.svelte
diff --git a/src/routes/new/source/_Github.svelte b/src/routes/[lang]/new/source/_Github.svelte
similarity index 100%
rename from src/routes/new/source/_Github.svelte
rename to src/routes/[lang]/new/source/_Github.svelte
diff --git a/src/routes/new/source/_Gitlab.svelte b/src/routes/[lang]/new/source/_Gitlab.svelte
similarity index 100%
rename from src/routes/new/source/_Gitlab.svelte
rename to src/routes/[lang]/new/source/_Gitlab.svelte
diff --git a/src/routes/new/source/index.json.ts b/src/routes/[lang]/new/source/index.json.ts
similarity index 100%
rename from src/routes/new/source/index.json.ts
rename to src/routes/[lang]/new/source/index.json.ts
diff --git a/src/routes/new/source/index.svelte b/src/routes/[lang]/new/source/index.svelte
similarity index 100%
rename from src/routes/new/source/index.svelte
rename to src/routes/[lang]/new/source/index.svelte
diff --git a/src/routes/new/team/index.json.ts b/src/routes/[lang]/new/team/index.json.ts
similarity index 100%
rename from src/routes/new/team/index.json.ts
rename to src/routes/[lang]/new/team/index.json.ts
diff --git a/src/routes/new/team/index.svelte b/src/routes/[lang]/new/team/index.svelte
similarity index 100%
rename from src/routes/new/team/index.svelte
rename to src/routes/[lang]/new/team/index.svelte
diff --git a/src/routes/register/index.svelte b/src/routes/[lang]/register/index.svelte
similarity index 84%
rename from src/routes/register/index.svelte
rename to src/routes/[lang]/register/index.svelte
index 35501fce2..ee4e0a61e 100644
--- a/src/routes/register/index.svelte
+++ b/src/routes/[lang]/register/index.svelte
@@ -7,6 +7,7 @@
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
 	import { onMount } from 'svelte';
+	import { t } from '$lib/translations';
 
 	let loading = false;
 	let emailEl;
@@ -20,7 +21,7 @@
 	});
 	async function handleSubmit() {
 		if (password !== passwordCheck) {
-			return errorNotification('Passwords do not match.');
+			return errorNotification($t('register.passwords_do_not_match'));
 		}
 		loading = true;
 		try {
@@ -57,7 +58,7 @@
 </div>
 <div class="flex h-screen flex-col items-center justify-center">
 	{#if $session.userId}
-		<div class="flex justify-center px-4 text-xl font-bold">Already logged in...</div>
+		<div class="flex justify-center px-4 text-xl font-bold">{$t('login.already_logged_in')}</div>
 	{:else}
 		<div class="flex justify-center px-4">
 			<form on:submit|preventDefault={handleSubmit} class="flex flex-col py-4 space-y-2">
@@ -66,7 +67,7 @@
 				<input
 					type="email"
 					name="email"
-					placeholder="Email"
+					placeholder={$t('forms.email')}
 					autocomplete="off"
 					required
 					bind:this={emailEl}
@@ -75,28 +76,28 @@
 				<input
 					type="password"
 					name="password"
-					placeholder="Password"
+					placeholder={$t('forms.password')}
 					bind:value={password}
 					required
 				/>
 				<input
 					type="password"
 					name="passwordCheck"
-					placeholder="Password again"
+					placeholder={$t('forms.password_again')}
 					bind:value={passwordCheck}
 					required
 				/>
 
 				<div class="flex space-x-2 h-8 items-center justify-center pt-8">
 					<button type="submit" class="hover:bg-coollabs-100 text-white bg-coollabs"
-						>Register</button
+						>{$t('register.register')}</button
 					>
 				</div>
 			</form>
 		</div>
 		{#if userCount === 0}
 			<div class="pt-5">
-				You are registering the first user. It will be the administrator of your Coolify instance.
+				{$t('register.register_first_user')}
 			</div>
 		{/if}
 	{/if}
diff --git a/src/routes/register/index.ts b/src/routes/[lang]/register/index.ts
similarity index 100%
rename from src/routes/register/index.ts
rename to src/routes/[lang]/register/index.ts
diff --git a/src/routes/reset/index.json.ts b/src/routes/[lang]/reset/index.json.ts
similarity index 91%
rename from src/routes/reset/index.json.ts
rename to src/routes/[lang]/reset/index.json.ts
index a75ea4766..21e403509 100644
--- a/src/routes/reset/index.json.ts
+++ b/src/routes/[lang]/reset/index.json.ts
@@ -16,7 +16,7 @@ export const post: RequestHandler = async (event) => {
 		return {
 			status: 500,
 			body: {
-				error: 'Invalid secret key.'
+				error: 'reset_password.invalid_secret_key'
 			}
 		};
 	}
diff --git a/src/routes/reset/index.svelte b/src/routes/[lang]/reset/index.svelte
similarity index 100%
rename from src/routes/reset/index.svelte
rename to src/routes/[lang]/reset/index.svelte
diff --git a/src/routes/reset/password.json.ts b/src/routes/[lang]/reset/password.json.ts
similarity index 93%
rename from src/routes/reset/password.json.ts
rename to src/routes/[lang]/reset/password.json.ts
index 28e9d56e3..9856349b3 100644
--- a/src/routes/reset/password.json.ts
+++ b/src/routes/[lang]/reset/password.json.ts
@@ -8,7 +8,7 @@ export const post: RequestHandler = async (event) => {
 		return {
 			status: 500,
 			body: {
-				error: 'Invalid secret key.'
+				error: 'reset_password.invalid_secret_key'
 			}
 		};
 	}
diff --git a/src/routes/services/[id]/_Services/_Ghost.svelte b/src/routes/[lang]/services/[id]/_Services/_Ghost.svelte
similarity index 100%
rename from src/routes/services/[id]/_Services/_Ghost.svelte
rename to src/routes/[lang]/services/[id]/_Services/_Ghost.svelte
diff --git a/src/routes/services/[id]/_Services/_MinIO.svelte b/src/routes/[lang]/services/[id]/_Services/_MinIO.svelte
similarity index 100%
rename from src/routes/services/[id]/_Services/_MinIO.svelte
rename to src/routes/[lang]/services/[id]/_Services/_MinIO.svelte
diff --git a/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte b/src/routes/[lang]/services/[id]/_Services/_PlausibleAnalytics.svelte
similarity index 100%
rename from src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
rename to src/routes/[lang]/services/[id]/_Services/_PlausibleAnalytics.svelte
diff --git a/src/routes/services/[id]/_Services/_Services.svelte b/src/routes/[lang]/services/[id]/_Services/_Services.svelte
similarity index 100%
rename from src/routes/services/[id]/_Services/_Services.svelte
rename to src/routes/[lang]/services/[id]/_Services/_Services.svelte
diff --git a/src/routes/services/[id]/_Services/_VSCodeServer.svelte b/src/routes/[lang]/services/[id]/_Services/_VSCodeServer.svelte
similarity index 100%
rename from src/routes/services/[id]/_Services/_VSCodeServer.svelte
rename to src/routes/[lang]/services/[id]/_Services/_VSCodeServer.svelte
diff --git a/src/routes/services/[id]/_Services/_Wordpress.svelte b/src/routes/[lang]/services/[id]/_Services/_Wordpress.svelte
similarity index 100%
rename from src/routes/services/[id]/_Services/_Wordpress.svelte
rename to src/routes/[lang]/services/[id]/_Services/_Wordpress.svelte
diff --git a/src/routes/services/[id]/__layout.svelte b/src/routes/[lang]/services/[id]/__layout.svelte
similarity index 100%
rename from src/routes/services/[id]/__layout.svelte
rename to src/routes/[lang]/services/[id]/__layout.svelte
diff --git a/src/routes/services/[id]/check.json.ts b/src/routes/[lang]/services/[id]/check.json.ts
similarity index 100%
rename from src/routes/services/[id]/check.json.ts
rename to src/routes/[lang]/services/[id]/check.json.ts
diff --git a/src/routes/services/[id]/configuration/destination.json.ts b/src/routes/[lang]/services/[id]/configuration/destination.json.ts
similarity index 100%
rename from src/routes/services/[id]/configuration/destination.json.ts
rename to src/routes/[lang]/services/[id]/configuration/destination.json.ts
diff --git a/src/routes/services/[id]/configuration/destination.svelte b/src/routes/[lang]/services/[id]/configuration/destination.svelte
similarity index 100%
rename from src/routes/services/[id]/configuration/destination.svelte
rename to src/routes/[lang]/services/[id]/configuration/destination.svelte
diff --git a/src/routes/services/[id]/configuration/type.json.ts b/src/routes/[lang]/services/[id]/configuration/type.json.ts
similarity index 100%
rename from src/routes/services/[id]/configuration/type.json.ts
rename to src/routes/[lang]/services/[id]/configuration/type.json.ts
diff --git a/src/routes/services/[id]/configuration/type.svelte b/src/routes/[lang]/services/[id]/configuration/type.svelte
similarity index 100%
rename from src/routes/services/[id]/configuration/type.svelte
rename to src/routes/[lang]/services/[id]/configuration/type.svelte
diff --git a/src/routes/services/[id]/configuration/version.json.ts b/src/routes/[lang]/services/[id]/configuration/version.json.ts
similarity index 100%
rename from src/routes/services/[id]/configuration/version.json.ts
rename to src/routes/[lang]/services/[id]/configuration/version.json.ts
diff --git a/src/routes/services/[id]/configuration/version.svelte b/src/routes/[lang]/services/[id]/configuration/version.svelte
similarity index 100%
rename from src/routes/services/[id]/configuration/version.svelte
rename to src/routes/[lang]/services/[id]/configuration/version.svelte
diff --git a/src/routes/services/[id]/delete.json.ts b/src/routes/[lang]/services/[id]/delete.json.ts
similarity index 100%
rename from src/routes/services/[id]/delete.json.ts
rename to src/routes/[lang]/services/[id]/delete.json.ts
diff --git a/src/routes/services/[id]/ghost/index.json.ts b/src/routes/[lang]/services/[id]/ghost/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/ghost/index.json.ts
rename to src/routes/[lang]/services/[id]/ghost/index.json.ts
diff --git a/src/routes/services/[id]/ghost/start.json.ts b/src/routes/[lang]/services/[id]/ghost/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/ghost/start.json.ts
rename to src/routes/[lang]/services/[id]/ghost/start.json.ts
diff --git a/src/routes/services/[id]/ghost/stop.json.ts b/src/routes/[lang]/services/[id]/ghost/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/ghost/stop.json.ts
rename to src/routes/[lang]/services/[id]/ghost/stop.json.ts
diff --git a/src/routes/services/[id]/index.json.ts b/src/routes/[lang]/services/[id]/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/index.json.ts
rename to src/routes/[lang]/services/[id]/index.json.ts
diff --git a/src/routes/services/[id]/index.svelte b/src/routes/[lang]/services/[id]/index.svelte
similarity index 100%
rename from src/routes/services/[id]/index.svelte
rename to src/routes/[lang]/services/[id]/index.svelte
diff --git a/src/routes/services/[id]/languagetool/index.json.ts b/src/routes/[lang]/services/[id]/languagetool/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/languagetool/index.json.ts
rename to src/routes/[lang]/services/[id]/languagetool/index.json.ts
diff --git a/src/routes/services/[id]/languagetool/start.json.ts b/src/routes/[lang]/services/[id]/languagetool/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/languagetool/start.json.ts
rename to src/routes/[lang]/services/[id]/languagetool/start.json.ts
diff --git a/src/routes/services/[id]/languagetool/stop.json.ts b/src/routes/[lang]/services/[id]/languagetool/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/languagetool/stop.json.ts
rename to src/routes/[lang]/services/[id]/languagetool/stop.json.ts
diff --git a/src/routes/services/[id]/minio/index.json.ts b/src/routes/[lang]/services/[id]/minio/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/minio/index.json.ts
rename to src/routes/[lang]/services/[id]/minio/index.json.ts
diff --git a/src/routes/services/[id]/minio/start.json.ts b/src/routes/[lang]/services/[id]/minio/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/minio/start.json.ts
rename to src/routes/[lang]/services/[id]/minio/start.json.ts
diff --git a/src/routes/services/[id]/minio/stop.json.ts b/src/routes/[lang]/services/[id]/minio/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/minio/stop.json.ts
rename to src/routes/[lang]/services/[id]/minio/stop.json.ts
diff --git a/src/routes/services/[id]/n8n/index.json.ts b/src/routes/[lang]/services/[id]/n8n/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/n8n/index.json.ts
rename to src/routes/[lang]/services/[id]/n8n/index.json.ts
diff --git a/src/routes/services/[id]/n8n/start.json.ts b/src/routes/[lang]/services/[id]/n8n/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/n8n/start.json.ts
rename to src/routes/[lang]/services/[id]/n8n/start.json.ts
diff --git a/src/routes/services/[id]/n8n/stop.json.ts b/src/routes/[lang]/services/[id]/n8n/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/n8n/stop.json.ts
rename to src/routes/[lang]/services/[id]/n8n/stop.json.ts
diff --git a/src/routes/services/[id]/nocodb/index.json.ts b/src/routes/[lang]/services/[id]/nocodb/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/nocodb/index.json.ts
rename to src/routes/[lang]/services/[id]/nocodb/index.json.ts
diff --git a/src/routes/services/[id]/nocodb/start.json.ts b/src/routes/[lang]/services/[id]/nocodb/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/nocodb/start.json.ts
rename to src/routes/[lang]/services/[id]/nocodb/start.json.ts
diff --git a/src/routes/services/[id]/nocodb/stop.json.ts b/src/routes/[lang]/services/[id]/nocodb/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/nocodb/stop.json.ts
rename to src/routes/[lang]/services/[id]/nocodb/stop.json.ts
diff --git a/src/routes/services/[id]/plausibleanalytics/activate.json.ts b/src/routes/[lang]/services/[id]/plausibleanalytics/activate.json.ts
similarity index 100%
rename from src/routes/services/[id]/plausibleanalytics/activate.json.ts
rename to src/routes/[lang]/services/[id]/plausibleanalytics/activate.json.ts
diff --git a/src/routes/services/[id]/plausibleanalytics/index.json.ts b/src/routes/[lang]/services/[id]/plausibleanalytics/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/plausibleanalytics/index.json.ts
rename to src/routes/[lang]/services/[id]/plausibleanalytics/index.json.ts
diff --git a/src/routes/services/[id]/plausibleanalytics/start.json.ts b/src/routes/[lang]/services/[id]/plausibleanalytics/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/plausibleanalytics/start.json.ts
rename to src/routes/[lang]/services/[id]/plausibleanalytics/start.json.ts
diff --git a/src/routes/services/[id]/plausibleanalytics/stop.json.ts b/src/routes/[lang]/services/[id]/plausibleanalytics/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/plausibleanalytics/stop.json.ts
rename to src/routes/[lang]/services/[id]/plausibleanalytics/stop.json.ts
diff --git a/src/routes/services/[id]/secrets/_Secret.svelte b/src/routes/[lang]/services/[id]/secrets/_Secret.svelte
similarity index 100%
rename from src/routes/services/[id]/secrets/_Secret.svelte
rename to src/routes/[lang]/services/[id]/secrets/_Secret.svelte
diff --git a/src/routes/services/[id]/secrets/index.json.ts b/src/routes/[lang]/services/[id]/secrets/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/secrets/index.json.ts
rename to src/routes/[lang]/services/[id]/secrets/index.json.ts
diff --git a/src/routes/services/[id]/secrets/index.svelte b/src/routes/[lang]/services/[id]/secrets/index.svelte
similarity index 100%
rename from src/routes/services/[id]/secrets/index.svelte
rename to src/routes/[lang]/services/[id]/secrets/index.svelte
diff --git a/src/routes/services/[id]/settings.json.ts b/src/routes/[lang]/services/[id]/settings.json.ts
similarity index 100%
rename from src/routes/services/[id]/settings.json.ts
rename to src/routes/[lang]/services/[id]/settings.json.ts
diff --git a/src/routes/services/[id]/uptimekuma/index.json.ts b/src/routes/[lang]/services/[id]/uptimekuma/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/uptimekuma/index.json.ts
rename to src/routes/[lang]/services/[id]/uptimekuma/index.json.ts
diff --git a/src/routes/services/[id]/uptimekuma/start.json.ts b/src/routes/[lang]/services/[id]/uptimekuma/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/uptimekuma/start.json.ts
rename to src/routes/[lang]/services/[id]/uptimekuma/start.json.ts
diff --git a/src/routes/services/[id]/uptimekuma/stop.json.ts b/src/routes/[lang]/services/[id]/uptimekuma/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/uptimekuma/stop.json.ts
rename to src/routes/[lang]/services/[id]/uptimekuma/stop.json.ts
diff --git a/src/routes/services/[id]/vaultwarden/index.json.ts b/src/routes/[lang]/services/[id]/vaultwarden/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/vaultwarden/index.json.ts
rename to src/routes/[lang]/services/[id]/vaultwarden/index.json.ts
diff --git a/src/routes/services/[id]/vaultwarden/start.json.ts b/src/routes/[lang]/services/[id]/vaultwarden/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/vaultwarden/start.json.ts
rename to src/routes/[lang]/services/[id]/vaultwarden/start.json.ts
diff --git a/src/routes/services/[id]/vaultwarden/stop.json.ts b/src/routes/[lang]/services/[id]/vaultwarden/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/vaultwarden/stop.json.ts
rename to src/routes/[lang]/services/[id]/vaultwarden/stop.json.ts
diff --git a/src/routes/services/[id]/vscodeserver/index.json.ts b/src/routes/[lang]/services/[id]/vscodeserver/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/vscodeserver/index.json.ts
rename to src/routes/[lang]/services/[id]/vscodeserver/index.json.ts
diff --git a/src/routes/services/[id]/vscodeserver/start.json.ts b/src/routes/[lang]/services/[id]/vscodeserver/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/vscodeserver/start.json.ts
rename to src/routes/[lang]/services/[id]/vscodeserver/start.json.ts
diff --git a/src/routes/services/[id]/vscodeserver/stop.json.ts b/src/routes/[lang]/services/[id]/vscodeserver/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/vscodeserver/stop.json.ts
rename to src/routes/[lang]/services/[id]/vscodeserver/stop.json.ts
diff --git a/src/routes/services/[id]/wordpress/index.json.ts b/src/routes/[lang]/services/[id]/wordpress/index.json.ts
similarity index 100%
rename from src/routes/services/[id]/wordpress/index.json.ts
rename to src/routes/[lang]/services/[id]/wordpress/index.json.ts
diff --git a/src/routes/services/[id]/wordpress/start.json.ts b/src/routes/[lang]/services/[id]/wordpress/start.json.ts
similarity index 100%
rename from src/routes/services/[id]/wordpress/start.json.ts
rename to src/routes/[lang]/services/[id]/wordpress/start.json.ts
diff --git a/src/routes/services/[id]/wordpress/stop.json.ts b/src/routes/[lang]/services/[id]/wordpress/stop.json.ts
similarity index 100%
rename from src/routes/services/[id]/wordpress/stop.json.ts
rename to src/routes/[lang]/services/[id]/wordpress/stop.json.ts
diff --git a/src/routes/services/index.svelte b/src/routes/[lang]/services/index.svelte
similarity index 100%
rename from src/routes/services/index.svelte
rename to src/routes/[lang]/services/index.svelte
diff --git a/src/routes/services/index.ts b/src/routes/[lang]/services/index.ts
similarity index 100%
rename from src/routes/services/index.ts
rename to src/routes/[lang]/services/index.ts
diff --git a/src/routes/services/new.ts b/src/routes/[lang]/services/new.ts
similarity index 100%
rename from src/routes/services/new.ts
rename to src/routes/[lang]/services/new.ts
diff --git a/src/routes/settings/check.json.ts b/src/routes/[lang]/settings/check.json.ts
similarity index 100%
rename from src/routes/settings/check.json.ts
rename to src/routes/[lang]/settings/check.json.ts
diff --git a/src/routes/settings/index.json.ts b/src/routes/[lang]/settings/index.json.ts
similarity index 100%
rename from src/routes/settings/index.json.ts
rename to src/routes/[lang]/settings/index.json.ts
diff --git a/src/routes/settings/index.svelte b/src/routes/[lang]/settings/index.svelte
similarity index 100%
rename from src/routes/settings/index.svelte
rename to src/routes/[lang]/settings/index.svelte
diff --git a/src/routes/sources/[id]/_Github.svelte b/src/routes/[lang]/sources/[id]/_Github.svelte
similarity index 81%
rename from src/routes/sources/[id]/_Github.svelte
rename to src/routes/[lang]/sources/[id]/_Github.svelte
index 102971353..e3243fc76 100644
--- a/src/routes/sources/[id]/_Github.svelte
+++ b/src/routes/[lang]/sources/[id]/_Github.svelte
@@ -3,6 +3,7 @@
 	import { page, session } from '$app/stores';
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	let loading = false;
@@ -43,7 +44,7 @@
 		const top = screen.height / 2 - 618 / 2;
 		const newWindow = open(
 			`/sources/${id}/newGithubApp`,
-			'New Github App',
+			$t('sources.source.new_github_app'),
 			'resizable=1, scrollbars=1, fullscreen=0, height=618, width=1020,top=' +
 				top +
 				', left=' +
@@ -60,30 +61,32 @@
 </script>
 
 {#if !source.githubAppId}
-	<button on:click={newGithubApp}>Create new GitHub App</button>
+	<button on:click={newGithubApp}>{$t('sources.source.create_new_github_app')}</button>
 {:else if source.githubApp?.installationId}
 	<form on:submit|preventDefault={handleSubmit} class="py-4">
 		<div class="flex space-x-1 pb-5 font-bold">
-			<div class="title">General</div>
+			<div class="title">{$t('general')}</div>
 			{#if $session.isAdmin}
 				<button
 					type="submit"
 					class:bg-orange-600={!loading}
 					class:hover:bg-orange-500={!loading}
-					disabled={loading}>{loading ? 'Saving...' : 'Save'}</button
+					disabled={loading}>{loading ? $t('saving') : $t('save')}</button
 				>
 				<button on:click|preventDefault={() => installRepositories(source)}
-					>Change GitHub App Settings</button
+					>{$t('sources.source.change_app_settings', { values: { name: 'Github' } })}</button
 				>
 			{/if}
 		</div>
 		<div class="grid grid-flow-row gap-2 px-10">
 			<div class="grid grid-cols-2 items-center mt-2">
-				<label for="name" class="text-base font-bold text-stone-100">Name</label>
+				<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 				<input name="name" id="name" required bind:value={source.name} />
 			</div>
 		</div>
 	</form>
 {:else}
-	<button on:click={() => installRepositories(source)}>Install Repositories</button>
+	<button on:click={() => installRepositories(source)}
+		>{$t('sources.source.install_repositories')}</button
+	>
 {/if}
diff --git a/src/routes/sources/[id]/_Gitlab.svelte b/src/routes/[lang]/sources/[id]/_Gitlab.svelte
similarity index 100%
rename from src/routes/sources/[id]/_Gitlab.svelte
rename to src/routes/[lang]/sources/[id]/_Gitlab.svelte
diff --git a/src/routes/sources/[id]/__layout.svelte b/src/routes/[lang]/sources/[id]/__layout.svelte
similarity index 82%
rename from src/routes/sources/[id]/__layout.svelte
rename to src/routes/[lang]/sources/[id]/__layout.svelte
index 0f5139558..accaa7c06 100644
--- a/src/routes/sources/[id]/__layout.svelte
+++ b/src/routes/[lang]/sources/[id]/__layout.svelte
@@ -34,10 +34,11 @@
 	import { page, session } from '$app/stores';
 	import { errorNotification } from '$lib/form';
 	import DeleteIcon from '$lib/components/DeleteIcon.svelte';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	async function deleteSource(name) {
-		const sure = confirm(`Are you sure you would like to delete '${name}'?`);
+		const sure = confirm(`${$t('sources.source.sure_to_delete')} '${name}'?`);
 		if (sure) {
 			const response = await fetch(`/sources/${id}.json`, {
 				method: 'delete'
@@ -55,14 +56,14 @@
 <nav class="nav-side">
 	<button
 		on:click={() => deleteSource(source.name)}
-		title="Delete Git Source"
+		title={$t('sources.source.delete_git_source')}
 		type="submit"
 		disabled={!$session.isAdmin}
 		class:hover:text-red-500={$session.isAdmin}
 		class="icons tooltip-bottom bg-transparent text-sm"
 		data-tooltip={$session.isAdmin
-			? 'Delete Git Source'
-			: 'You do not have permission to delete a Git Source'}><DeleteIcon /></button
+			? $t('sources.source.delete_git_source')
+			: $t('sources.source.permission_denied_delete_git_source')}><DeleteIcon /></button
 	>
 </nav>
 <slot />
diff --git a/src/routes/sources/[id]/check.json.ts b/src/routes/[lang]/sources/[id]/check.json.ts
similarity index 100%
rename from src/routes/sources/[id]/check.json.ts
rename to src/routes/[lang]/sources/[id]/check.json.ts
diff --git a/src/routes/sources/[id]/gitlab.json.ts b/src/routes/[lang]/sources/[id]/gitlab.json.ts
similarity index 100%
rename from src/routes/sources/[id]/gitlab.json.ts
rename to src/routes/[lang]/sources/[id]/gitlab.json.ts
diff --git a/src/routes/sources/[id]/index.json.ts b/src/routes/[lang]/sources/[id]/index.json.ts
similarity index 100%
rename from src/routes/sources/[id]/index.json.ts
rename to src/routes/[lang]/sources/[id]/index.json.ts
diff --git a/src/routes/sources/[id]/index.svelte b/src/routes/[lang]/sources/[id]/index.svelte
similarity index 100%
rename from src/routes/sources/[id]/index.svelte
rename to src/routes/[lang]/sources/[id]/index.svelte
diff --git a/src/routes/sources/[id]/newGithubApp.svelte b/src/routes/[lang]/sources/[id]/newGithubApp.svelte
similarity index 100%
rename from src/routes/sources/[id]/newGithubApp.svelte
rename to src/routes/[lang]/sources/[id]/newGithubApp.svelte
diff --git a/src/routes/sources/index.json.ts b/src/routes/[lang]/sources/index.json.ts
similarity index 100%
rename from src/routes/sources/index.json.ts
rename to src/routes/[lang]/sources/index.json.ts
diff --git a/src/routes/sources/index.svelte b/src/routes/[lang]/sources/index.svelte
similarity index 88%
rename from src/routes/sources/index.svelte
rename to src/routes/[lang]/sources/index.svelte
index bd9039514..4823c1e64 100644
--- a/src/routes/sources/index.svelte
+++ b/src/routes/[lang]/sources/index.svelte
@@ -22,10 +22,11 @@
 <script lang="ts">
 	export let sources;
 	import { session } from '$app/stores';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Git Sources</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('index.git_sources')}</div>
 	{#if $session.isAdmin}
 		<a href="/new/source" sveltekit:prefetch class="add-icon bg-orange-600 hover:bg-orange-500">
 			<svg
@@ -47,7 +48,7 @@
 <div class="flex justify-center">
 	{#if !sources || sources.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">No git sources found</div>
+			<div class="text-center text-xl font-bold">{$t('sources.no_git_sources_found')}</div>
 		</div>
 	{:else}
 		<div class="flex flex-wrap justify-center">
@@ -62,7 +63,7 @@
 						<div class="font-bold text-xl text-center truncate">{source.name}</div>
 						{#if (source.type === 'gitlab' && !source.gitlabAppId) || (source.type === 'github' && !source.githubAppId && !source.githubApp?.installationId)}
 							<div class="font-bold text-center truncate text-red-500 group-hover:text-white">
-								Configuration missing
+								{$t('application.configuration_missing')}
 							</div>
 						{:else}
 							<div class="truncate text-center">{source.htmlUrl}</div>
diff --git a/src/routes/teams/[id]/__layout.svelte b/src/routes/[lang]/teams/[id]/__layout.svelte
similarity index 100%
rename from src/routes/teams/[id]/__layout.svelte
rename to src/routes/[lang]/teams/[id]/__layout.svelte
diff --git a/src/routes/teams/[id]/index.json.ts b/src/routes/[lang]/teams/[id]/index.json.ts
similarity index 100%
rename from src/routes/teams/[id]/index.json.ts
rename to src/routes/[lang]/teams/[id]/index.json.ts
diff --git a/src/routes/teams/[id]/index.svelte b/src/routes/[lang]/teams/[id]/index.svelte
similarity index 100%
rename from src/routes/teams/[id]/index.svelte
rename to src/routes/[lang]/teams/[id]/index.svelte
diff --git a/src/routes/teams/[id]/invitation/accept.json.ts b/src/routes/[lang]/teams/[id]/invitation/accept.json.ts
similarity index 100%
rename from src/routes/teams/[id]/invitation/accept.json.ts
rename to src/routes/[lang]/teams/[id]/invitation/accept.json.ts
diff --git a/src/routes/teams/[id]/invitation/invite.json.ts b/src/routes/[lang]/teams/[id]/invitation/invite.json.ts
similarity index 100%
rename from src/routes/teams/[id]/invitation/invite.json.ts
rename to src/routes/[lang]/teams/[id]/invitation/invite.json.ts
diff --git a/src/routes/teams/[id]/invitation/revoke.json.ts b/src/routes/[lang]/teams/[id]/invitation/revoke.json.ts
similarity index 100%
rename from src/routes/teams/[id]/invitation/revoke.json.ts
rename to src/routes/[lang]/teams/[id]/invitation/revoke.json.ts
diff --git a/src/routes/teams/[id]/permission/change.json.ts b/src/routes/[lang]/teams/[id]/permission/change.json.ts
similarity index 100%
rename from src/routes/teams/[id]/permission/change.json.ts
rename to src/routes/[lang]/teams/[id]/permission/change.json.ts
diff --git a/src/routes/teams/[id]/remove/user.json.ts b/src/routes/[lang]/teams/[id]/remove/user.json.ts
similarity index 100%
rename from src/routes/teams/[id]/remove/user.json.ts
rename to src/routes/[lang]/teams/[id]/remove/user.json.ts
diff --git a/src/routes/teams/index.json.ts b/src/routes/[lang]/teams/index.json.ts
similarity index 100%
rename from src/routes/teams/index.json.ts
rename to src/routes/[lang]/teams/index.json.ts
diff --git a/src/routes/teams/index.svelte b/src/routes/[lang]/teams/index.svelte
similarity index 100%
rename from src/routes/teams/index.svelte
rename to src/routes/[lang]/teams/index.svelte
diff --git a/src/routes/__error.svelte b/src/routes/__error.svelte
index 67693e70a..97ee15b01 100644
--- a/src/routes/__error.svelte
+++ b/src/routes/__error.svelte
@@ -12,17 +12,17 @@
 </script>
 
 <script>
-	import { _ } from 'svelte-i18n';
+	import { t } from '$lib/translations';
 	export let status;
 	export let error;
 </script>
 
 <div class="mx-auto flex h-screen flex-col items-center justify-center px-4">
 	<div class="pb-10 text-7xl font-bold">{status}</div>
-	<div class="text-3xl font-bold">Ooops you are lost! But don't be afraid!</div>
+	<div class="text-3xl font-bold">{$t('error.oops_your_lost')}</div>
 	<div class="text-xl">
-		{$_('error.you_can_find_your_way_back')}
-		<a href="/" class="font-bold uppercase text-sky-400">{$_('error.here')}</a>
+		{$t('error.you_can_find_your_way_back')}
+		<a href="/" class="font-bold uppercase text-sky-400">{$t('error.here')}</a>
 	</div>
 	<div class="py-10 text-xs font-bold">
 		<pre
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index bb2665238..1cc8f8198 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -1,9 +1,15 @@
 <script context="module" lang="ts">
 	import type { Load } from '@sveltejs/kit';
-	import { publicPaths } from '$lib/settings';
+	import { isPublicPath } from '$lib/settings';
+	import { locale, loadTranslations } from '$lib/translations';
 
 	export const load: Load = async ({ fetch, url, session }) => {
-		if (!session.userId && !publicPaths.includes(url.pathname)) {
+		const { pathname } = url;
+		const lang = `${pathname.match(/[^/]+?(?=\/|$)/) || ''}`;
+		const route = pathname.replace(new RegExp(`^/${lang}`), '');
+		await loadTranslations(lang, route);
+
+		if (!session.userId && !isPublicPath(route)) {
 			return {
 				status: 302,
 				redirect: '/login'
@@ -38,18 +44,7 @@
 	import { errorNotification } from '$lib/form';
 	import { asyncSleep } from '$lib/components/common';
 	import { del, get, post } from '$lib/api';
-	import { register, init, _, getLocaleFromNavigator } from 'svelte-i18n';
-
-	async function setup() {
-		register('en', () => import('../../static/locales/en.json'));
-
-		return await Promise.allSettled([
-			// TODO: add some more stuff you want to init ...
-			init({ initialLocale: getLocaleFromNavigator(), fallbackLocale: 'en' })
-		]);
-	}
-
-	const setupResult = setup();
+	import { t } from '$lib/translations';
 
 	let isUpdateAvailable = false;
 
@@ -59,6 +54,7 @@
 		success: null
 	};
 	let latestVersion = 'latest';
+
 	onMount(async () => {
 		if ($session.userId) {
 			const overrideVersion = browser && window.localStorage.getItem('latestVersion');
@@ -115,7 +111,7 @@
 				return window.location.reload();
 			} else {
 				await post(`/update.json`, { type: 'update', latestVersion });
-				toast.push(`${$_('layout.update_done')}<br><br>${$_('layout.wait_new_version_startup')}`);
+				toast.push(`${$t('layout.update_done')}<br><br>${$t('layout.wait_new_version_startup')}`);
 				let reachable = false;
 				let tries = 0;
 				do {
@@ -129,7 +125,7 @@
 					if (reachable) break;
 					tries++;
 				} while (!reachable || tries < 120);
-				toast.push($_('layout.new_version'));
+				toast.push($t('layout.new_version'));
 				updateStatus.loading = false;
 				updateStatus.success = true;
 				await asyncSleep(3000);
@@ -147,309 +143,332 @@
 	<title>Coolify</title>
 </svelte:head>
 
-{#await setupResult}
-	Please wait...
-{:then}
-	<SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
-	{#if $session.userId}
-		<nav class="nav-main">
-			<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
-				<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
-				<div class="flex flex-col space-y-4 py-2">
-					<a
-						sveltekit:prefetch
-						href="/"
-						class="icons tooltip-right bg-coolgray-200 hover:text-white"
-						class:text-white={$page.url.pathname === '/'}
-						class:bg-coolgray-500={$page.url.pathname === '/'}
-						data-tooltip="Dashboard"
+<SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
+{#if $session.userId}
+	<nav class="nav-main">
+		<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
+			<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
+			<div class="flex flex-col space-y-4 py-2">
+				<a
+					sveltekit:prefetch
+					href="/"
+					class="icons tooltip-right bg-coolgray-200 hover:text-white"
+					class:text-white={$page.url.pathname === '/'}
+					class:bg-coolgray-500={$page.url.pathname === '/'}
+					data-tooltip={$t('dashboard')}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
-							/>
-							<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
-						</svg>
-					</a>
-					<div class="border-t border-stone-700" />
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<path
+							d="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
+						/>
+						<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
+					</svg>
+				</a>
+				<div class="border-t border-stone-700" />
 
-					<a
-						sveltekit:prefetch
-						href="/applications"
-						class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
-						class:text-green-500={$page.url.pathname.startsWith('/applications') ||
-							$page.url.pathname.startsWith('/new/application')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
-							$page.url.pathname.startsWith('/new/application')}
-						data-tooltip="Applications"
+				<a
+					sveltekit:prefetch
+					href="/applications"
+					class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
+					class:text-green-500={$page.url.pathname.startsWith('/applications') ||
+						$page.url.pathname.startsWith('/new/application')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
+						$page.url.pathname.startsWith('/new/application')}
+					data-tooltip={$t('index.applications')}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentcolor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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="4" y="4" width="6" height="6" rx="1" />
-							<rect x="4" y="14" width="6" height="6" rx="1" />
-							<rect x="14" y="14" width="6" height="6" rx="1" />
-							<line x1="14" y1="7" x2="20" y2="7" />
-							<line x1="17" y1="4" x2="17" y2="10" />
-						</svg>
-					</a>
-					<a
-						sveltekit:prefetch
-						href="/sources"
-						class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
-						class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
-							$page.url.pathname.startsWith('/new/source')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
-							$page.url.pathname.startsWith('/new/source')}
-						data-tooltip="Git Sources"
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<rect x="4" y="4" width="6" height="6" rx="1" />
+						<rect x="4" y="14" width="6" height="6" rx="1" />
+						<rect x="14" y="14" width="6" height="6" rx="1" />
+						<line x1="14" y1="7" x2="20" y2="7" />
+						<line x1="17" y1="4" x2="17" y2="10" />
+					</svg>
+				</a>
+				<a
+					sveltekit:prefetch
+					href="/sources"
+					class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
+					class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
+						$page.url.pathname.startsWith('/new/source')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
+						$page.url.pathname.startsWith('/new/source')}
+					data-tooltip="Git Sources"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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" />
-							<circle cx="6" cy="6" r="2" />
-							<circle cx="18" cy="18" r="2" />
-							<path d="M11 6h5a2 2 0 0 1 2 2v8" />
-							<polyline points="14 9 11 6 14 3" />
-							<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
-							<polyline points="10 15 13 18 10 21" />
-						</svg>
-					</a>
-					<div class="border-t border-stone-700" />
-					<a
-						sveltekit:prefetch
-						href="/destinations"
-						class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
-						class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
-							$page.url.pathname.startsWith('/new/destination')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
-							$page.url.pathname.startsWith('/new/destination')}
-						data-tooltip="Destinations"
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<circle cx="6" cy="6" r="2" />
+						<circle cx="18" cy="18" r="2" />
+						<path d="M11 6h5a2 2 0 0 1 2 2v8" />
+						<polyline points="14 9 11 6 14 3" />
+						<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
+						<polyline points="10 15 13 18 10 21" />
+					</svg>
+				</a>
+				<div class="border-t border-stone-700" />
+				<a
+					sveltekit:prefetch
+					href="/destinations"
+					class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
+					class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
+						$page.url.pathname.startsWith('/new/destination')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
+						$page.url.pathname.startsWith('/new/destination')}
+					data-tooltip="Destinations"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
-							/>
-							<path d="M5 10h3v3h-3z" />
-							<path d="M8 10h3v3h-3z" />
-							<path d="M11 10h3v3h-3z" />
-							<path d="M8 7h3v3h-3z" />
-							<path d="M11 7h3v3h-3z" />
-							<path d="M11 4h3v3h-3z" />
-							<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
-							<line x1="10" y1="16" x2="10" y2="16.01" />
-						</svg>
-					</a>
-					<div class="border-t border-stone-700" />
-					<a
-						sveltekit:prefetch
-						href="/databases"
-						class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
-						class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
-							$page.url.pathname.startsWith('/new/database')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
-							$page.url.pathname.startsWith('/new/database')}
-						data-tooltip="Databases"
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<path
+							d="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
+						/>
+						<path d="M5 10h3v3h-3z" />
+						<path d="M8 10h3v3h-3z" />
+						<path d="M11 10h3v3h-3z" />
+						<path d="M8 7h3v3h-3z" />
+						<path d="M11 7h3v3h-3z" />
+						<path d="M11 4h3v3h-3z" />
+						<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
+						<line x1="10" y1="16" x2="10" y2="16.01" />
+					</svg>
+				</a>
+				<div class="border-t border-stone-700" />
+				<a
+					sveltekit:prefetch
+					href="/databases"
+					class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
+					class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
+						$page.url.pathname.startsWith('/new/database')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
+						$page.url.pathname.startsWith('/new/database')}
+					data-tooltip="Databases"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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>
-					</a>
-					<div class="border-t border-stone-700" />
-					<a
-						sveltekit:prefetch
-						href="/services"
-						class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
-						class:text-pink-500={$page.url.pathname.startsWith('/services') ||
-							$page.url.pathname.startsWith('/new/service')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
-							$page.url.pathname.startsWith('/new/service')}
-						data-tooltip="Services"
+						<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>
+				</a>
+				<div class="border-t border-stone-700" />
+				<a
+					sveltekit:prefetch
+					href="/services"
+					class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
+					class:text-pink-500={$page.url.pathname.startsWith('/services') ||
+						$page.url.pathname.startsWith('/new/service')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
+						$page.url.pathname.startsWith('/new/service')}
+					data-tooltip="Services"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
-						</svg>
-					</a>
-					<div class="border-t border-stone-700" />
-				</div>
-				<div class="flex-1" />
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<path d="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
+					</svg>
+				</a>
+				<div class="border-t border-stone-700" />
+			</div>
+			<div class="flex-1" />
 
-				<div class="flex flex-col space-y-4 py-2">
-					{#if $session.teamId === '0'}
-						{#if isUpdateAvailable}
-							<button
-								disabled={updateStatus.success === false}
-								title={$_('layout.update_available')}
-								on:click={update}
-								class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
-							>
-								{#if updateStatus.loading}
-									<svg
-										xmlns="http://www.w3.org/2000/svg"
-										class="lds-heart h-9 w-8"
-										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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
-										/>
-									</svg>
-								{:else if updateStatus.success === null}
-									<svg
-										xmlns="http://www.w3.org/2000/svg"
-										class="w-8 h-9"
-										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" />
-										<circle cx="12" cy="12" r="9" />
-										<line x1="12" y1="8" x2="8" y2="12" />
-										<line x1="12" y1="8" x2="12" y2="16" />
-										<line x1="16" y1="12" x2="12" y2="8" />
-									</svg>
-								{:else if updateStatus.success}
-									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-										><path
-											fill="#DD2E44"
-											d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
-										/><path
-											fill="#EA596E"
-											d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
-										/><path
-											fill="#A0041E"
-											d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
-										/><path
-											fill="#AA8DD8"
-											d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
-										/><path
-											fill="#77B255"
-											d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
-										/><path
-											fill="#AA8DD8"
-											d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
-										/><path
-											fill="#77B255"
-											d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
-										/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
-											fill="#9266CC"
-											cx="2"
-											cy="18"
-											r="2"
-										/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
-											fill="#5C913B"
-											cx="23.5"
-											cy="31.5"
-											r="1.5"
-										/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
-											fill="#FFCC4D"
-											cx="32.5"
-											cy="8.5"
-											r="1.5"
-										/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
-											fill="#FFCC4D"
-											cx="7.5"
-											cy="23.5"
-											r="1.5"
-										/></svg
-									>
-								{:else}
-									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-										><path
-											fill="#FFCC4D"
-											d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
-										/><path
-											fill="#664500"
-											d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
-										/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
-											fill="#664500"
-											d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
-										/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
-											fill="#E75A70"
-											cx="18"
-											cy="27"
-											rx="3"
-											ry="2"
-										/></svg
-									>
-								{/if}
-							</button>
-						{/if}
+			<div class="flex flex-col space-y-4 py-2">
+				{#if $session.teamId === '0'}
+					{#if isUpdateAvailable}
+						<button
+							disabled={updateStatus.success === false}
+							title={$t('layout.update_available')}
+							on:click={update}
+							class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
+						>
+							{#if updateStatus.loading}
+								<svg
+									xmlns="http://www.w3.org/2000/svg"
+									class="lds-heart h-9 w-8"
+									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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
+									/>
+								</svg>
+							{:else if updateStatus.success === null}
+								<svg
+									xmlns="http://www.w3.org/2000/svg"
+									class="w-8 h-9"
+									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" />
+									<circle cx="12" cy="12" r="9" />
+									<line x1="12" y1="8" x2="8" y2="12" />
+									<line x1="12" y1="8" x2="12" y2="16" />
+									<line x1="16" y1="12" x2="12" y2="8" />
+								</svg>
+							{:else if updateStatus.success}
+								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+									><path
+										fill="#DD2E44"
+										d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
+									/><path
+										fill="#EA596E"
+										d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
+									/><path
+										fill="#A0041E"
+										d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
+									/><path
+										fill="#AA8DD8"
+										d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
+									/><path
+										fill="#77B255"
+										d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
+									/><path
+										fill="#AA8DD8"
+										d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
+									/><path
+										fill="#77B255"
+										d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
+									/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
+										fill="#9266CC"
+										cx="2"
+										cy="18"
+										r="2"
+									/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
+										fill="#5C913B"
+										cx="23.5"
+										cy="31.5"
+										r="1.5"
+									/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
+										fill="#FFCC4D"
+										cx="32.5"
+										cy="8.5"
+										r="1.5"
+									/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
+										fill="#FFCC4D"
+										cx="7.5"
+										cy="23.5"
+										r="1.5"
+									/></svg
+								>
+							{:else}
+								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+									><path
+										fill="#FFCC4D"
+										d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
+									/><path
+										fill="#664500"
+										d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
+									/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
+										fill="#664500"
+										d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
+									/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
+										fill="#E75A70"
+										cx="18"
+										cy="27"
+										rx="3"
+										ry="2"
+									/></svg
+								>
+							{/if}
+						</button>
 					{/if}
-				</div>
-				<div class="flex flex-col space-y-4 py-2">
+				{/if}
+			</div>
+			<div class="flex flex-col space-y-4 py-2">
+				<a
+					sveltekit:prefetch
+					href="/teams"
+					class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
+					class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
+					data-tooltip="Teams"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						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" />
+						<circle cx="9" cy="7" r="4" />
+						<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
+						<path d="M16 3.13a4 4 0 0 1 0 7.75" />
+						<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
+					</svg>
+				</a>
+				{#if $session.teamId === '0'}
 					<a
 						sveltekit:prefetch
-						href="/teams"
-						class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
-						class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
-						data-tooltip="Teams"
+						href="/settings"
+						class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
+						class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
+						data-tooltip="Settings"
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -462,87 +481,58 @@
 							stroke-linejoin="round"
 						>
 							<path stroke="none" d="M0 0h24v24H0z" fill="none" />
-							<circle cx="9" cy="7" r="4" />
-							<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
-							<path d="M16 3.13a4 4 0 0 1 0 7.75" />
-							<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
+							<path
+								d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+							/>
+							<circle cx="12" cy="12" r="3" />
 						</svg>
 					</a>
-					{#if $session.teamId === '0'}
-						<a
-							sveltekit:prefetch
-							href="/settings"
-							class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
-							class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
-							class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
-							data-tooltip="Settings"
-						>
-							<svg
-								xmlns="http://www.w3.org/2000/svg"
-								class="h-8 w-8"
-								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="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
-								/>
-								<circle cx="12" cy="12" r="3" />
-							</svg>
-						</a>
-					{/if}
-					<div
-						class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
-						data-tooltip="Logout"
-						on:click={logout}
+				{/if}
+				<div
+					class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
+					data-tooltip="Logout"
+					on:click={logout}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="ml-1 h-7 w-7"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="ml-1 h-7 w-7"
-							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="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
-							/>
-							<path d="M7 12h14l-3 -3m0 6l3 -3" />
-						</svg>
-					</div>
-					<div
-						class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<path
+							d="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
+						/>
+						<path d="M7 12h14l-3 -3m0 6l3 -3" />
+					</svg>
+				</div>
+				<div
+					class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
+				>
+					<a
+						class="text-[10px] no-underline"
+						href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
+						target="_blank">v{$session.version}</a
 					>
-						<a
-							class="text-[10px] no-underline"
-							href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
-							target="_blank">v{$session.version}</a
-						>
-					</div>
 				</div>
 			</div>
-		</nav>
-		<select
-			class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
-			bind:value={selectedTeamId}
-			on:change={switchTeam}
-		>
-			<option value="" disabled selected>{$_('layout.switch_to_a_different_team')}</option>
-			{#each teams as team}
-				<option value={team.teamId}>{team.team.name} - {team.permission}</option>
-			{/each}
-		</select>
-	{/if}
-	<main>
-		<slot />
-	</main>
-{:catch error}
-	<p style="color: red">{error.message}</p>
-{/await}
+		</div>
+	</nav>
+	<select
+		class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
+		bind:value={selectedTeamId}
+		on:change={switchTeam}
+	>
+		<option value="" disabled selected>{$t('layout.switch_to_a_different_team')}</option>
+		{#each teams as team}
+			<option value={team.teamId}>{team.team.name} - {team.permission}</option>
+		{/each}
+	</select>
+{/if}
+<main>
+	<slot />
+</main>
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 1a5f61b4b..e67e7d64d 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -1,5 +1,6 @@
 <script context="module" lang="ts">
 	import type { Load } from '@sveltejs/kit';
+	import { t } from '$lib/translations';
 	export const load: Load = async ({ fetch, session }) => {
 		const url = `/dashboard.json`;
 		const res = await fetch(url);
@@ -29,7 +30,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Dashboard</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('dashboard')}</div>
 </div>
 
 <div class="mt-10 pb-12 tracking-tight sm:pb-16">
@@ -44,7 +45,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-green-500 no-underline transition duration-150 hover:bg-green-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							Applications
+							{$t('index.applications')}
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{applicationsCount}
@@ -56,7 +57,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-sky-500 no-underline transition duration-150 hover:bg-sky-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							Destinations
+							{$t('index.destinations')}
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{destinationsCount}
@@ -68,7 +69,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-orange-500 no-underline transition duration-150 hover:bg-orange-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							Git Sources
+							{$t('index.git_sources')}
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{sourcesCount}
@@ -79,7 +80,9 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-purple-500 no-underline transition duration-150 hover:bg-purple-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Databases</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
+							{$t('index.databases')}
+						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">{databasesCount}</dd>
 					</a>
 					<a
@@ -87,7 +90,9 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-pink-500 no-underline transition duration-150 hover:bg-pink-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Services</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
+							{$t('index.services')}
+						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">{servicesCount}</dd>
 					</a>
 
@@ -96,7 +101,9 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-cyan-500 no-underline transition duration-150 hover:bg-cyan-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Teams</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
+							{$t('index.teams')}
+						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{teamsCount}
 						</dd>
diff --git a/static/locales/en.json b/static/locales/en.json
index aa64ad4e5..897d6158c 100644
--- a/static/locales/en.json
+++ b/static/locales/en.json
@@ -8,6 +8,59 @@
 	},
 	"error": {
 		"you_can_find_your_way_back": "You can find your way back",
-		"here": "here"
+		"here": "here",
+		"oops_your_lost": "Ooops you are lost! But don't be afraid!",
+		"generic_message": "Ooops, something is not okay, are you okay?"
+	},
+	"index": {
+		"applications": "Applications",
+		"destinations": "Destinations",
+		"git_sources": "Git Sources",
+		"databases": "Databases",
+		"services": "Services",
+		"teams": "Teams"
+	},
+	"dashboard": "Dashboard",
+	"application": {
+		"configuration_missing": "Configuration missing",
+		"no_applications_found": "No applications found",
+		"app": {
+			"error_double_app_for_one_branch": "Cannot activate automatic deployments until only one application is defined for this repository / branch."
+		}
+	},
+	"sources": {
+		"no_git_sources_found": "No git sources found",
+		"source": {
+			"delete_git_source": "Delete Git Source",
+			"permission_denied_delete_git_source": "You do not have permission to delete a Git Source",
+			"sure_to_delete": "Are you sure you would like to delete",
+			"create_new_github_app": "Create new GitHub App",
+			"install_repositories": "Install Repositories",
+			"change_app_settings": "Change {name} App Settings",
+			"new_github_app": "New Github App"
+		}
+	},
+	"general": "General",
+	"saving": "Saving...",
+	"save": "Save",
+	"forms": {
+		"name": "Name",
+		"email": "Email",
+		"password": "Password",
+		"password_again": "Password again"
+	},
+	"login": {
+		"already_logged_in": "Already logged in...",
+		"authenticating": "Authenticating...",
+		"login": "Login"
+	},
+	"register": {
+		"register": "Register",
+		"passwords_do_not_match": "Passwords do not match.",
+		"register_first_user": "You are registering the first user. It will be the administrator of your Coolify instance."
+	},
+	"reset_password": {
+		"reset_password": "Reset password",
+		"invalid_secret_key": "Invalid secret key."
 	}
 }
diff --git a/static/locales/fr.json b/static/locales/fr.json
new file mode 100644
index 000000000..2cce1d2fb
--- /dev/null
+++ b/static/locales/fr.json
@@ -0,0 +1,66 @@
+{
+	"layout": {
+		"update_done": "Mise à jour réalisée.",
+		"wait_new_version_startup": "En attente du démarrage de la nouvelle version...",
+		"new_version": "Nouvel version accessible. Rafraichissement de la page...",
+		"switch_to_a_different_team": "Changer d'équipe...",
+		"update_available": "Mise à jour disponible"
+	},
+	"error": {
+		"you_can_find_your_way_back": "Vous ne trouvez pas votre chemin ?",
+		"here": "Ici",
+		"oops_your_lost": "Oups vous êtes perdu ! \nMais n'ayez pas peur !",
+		"generic_message": "Oups, quelque chose ne va pas, ça va ?"
+	},
+	"dashboard": "Tableau de bord",
+	"index": {
+		"applications": "Applications",
+		"databases": "Bases de données",
+		"destinations": "Destinations",
+		"git_sources": "Sources Git",
+		"services": "Services",
+		"teams": "Équipes"
+	},
+	"application": {
+		"no_applications_found": "Aucune application trouvée",
+		"app": {
+			"error_double_app_for_one_branch": "Impossible d'activer les déploiements automatiques tant qu'une seule application n'est pas définie pour ce référentiel/branche."
+		},
+		"configuration_missing": "Configuration manquante"
+	},
+	"forms": {
+		"email": "E-mail",
+		"name": "Nom",
+		"password": "Mot de passe",
+		"password_again": "Retaper le mot de passe"
+	},
+	"general": "Général",
+	"login": {
+		"already_logged_in": "Déjà connecté...",
+		"authenticating": "Authentification...",
+		"login": "Connexion"
+	},
+	"register": {
+		"passwords_do_not_match": "Les mots de passe ne correspondent pas.",
+		"register": "S'inscrire",
+		"register_first_user": "Vous enregistrez le premier utilisateur. \nCe sera l'administrateur de votre instance Coolify."
+	},
+	"reset_password": {
+		"invalid_secret_key": "Clé secrète invalide.",
+		"reset_password": "Réinitialiser le mot de passe"
+	},
+	"save": "Enregistrer",
+	"saving": "Enregistrement...",
+	"sources": {
+		"no_git_sources_found": "Aucune source git trouvée",
+		"source": {
+			"change_app_settings": "Modifier les paramètres de l'application {name}",
+			"create_new_github_app": "Créer une nouvelle application GitHub",
+			"delete_git_source": "Supprimer la source Git",
+			"install_repositories": "Installer les référentiels",
+			"new_github_app": "Nouvelle application Github",
+			"permission_denied_delete_git_source": "Vous n'êtes pas autorisé à supprimer une source Git",
+			"sure_to_delete": "Êtes-vous sûr de vouloir supprimer"
+		}
+	}
+}

From 614eb923d84a5c3bee4008bec2291b5d4e9ff5c1 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 17:33:50 +0200
Subject: [PATCH 03/23] Patch bugs on locale redirections

---
 src/hooks.ts               |  66 ++--
 src/lib/lang.json          |   4 +-
 src/lib/translations.ts    |  10 +-
 src/routes/__layout.svelte | 745 +++++++++++++++++++------------------
 4 files changed, 414 insertions(+), 411 deletions(-)

diff --git a/src/hooks.ts b/src/hooks.ts
index 4a0fa2e87..53b6d07f2 100644
--- a/src/hooks.ts
+++ b/src/hooks.ts
@@ -18,6 +18,36 @@ export const handle = handleSession(
 	},
 	async function ({ event, resolve }) {
 		let response;
+		let locale;
+
+		const { url, request } = event;
+		const { pathname } = url;
+
+		// If this request is a route request
+		if (routeRegex.test(pathname)) {
+			// Get defined locales
+			const supportedLocales = locales.get();
+
+			// Try to get locale from `pathname`.
+			locale = supportedLocales.find(
+				(l) => `${l}`.toLowerCase() === `${pathname.match(/[^/]+?(?=\/|$)/)}`.toLowerCase()
+			);
+
+			if (!locale) {
+				// Get user preferred locale
+				locale = `${`${request.headers.get('accept-language')}`.match(/[a-zA-Z-]+?(?=_|,|;)/)}`;
+
+				// Set default locale if user preferred locale does not match
+				if (!supportedLocales.includes(locale)) locale = 'en-US';
+
+				// 302 redirect
+				return new Response(undefined, {
+					headers: { location: `/${locale}${pathname}` },
+					status: 302
+				});
+			}
+		}
+
 		try {
 			if (event.locals.cookies) {
 				if (event.locals.cookies['kit.session']) {
@@ -40,7 +70,6 @@ export const handle = handleSession(
 				ssr: !event.url.pathname.startsWith('/webhooks/success')
 			});
 		} catch (error) {
-			console.log(error);
 			response = await resolve(event, {
 				ssr: !event.url.pathname.startsWith('/webhooks/success')
 			});
@@ -67,40 +96,9 @@ export const handle = handleSession(
 			);
 		}
 
-		const { url, request } = event;
-		const { pathname } = url;
-
-		// If this request is a route request
-		if (routeRegex.test(pathname)) {
-			// Get defined locales
-			const supportedLocales = locales.get();
-
-			// Try to get locale from `pathname`.
-			let locale = supportedLocales.find(
-				(l) => `${l}`.toLowerCase() === `${pathname.match(/[^/]+?(?=\/|$)/)}`.toLowerCase()
-			);
-
-			// If route locale is not supported
-			if (!locale) {
-				// Get user preferred locale
-				locale = `${`${request.headers['accept-language']}`.match(
-					/[a-zA-Z]+?(?=-|_|,|;)/
-				)}`.toLowerCase();
-
-				// Set default locale if user preferred locale does not match
-				if (!supportedLocales.includes(locale)) locale = 'en';
-
-				// 301 redirect
-				return new Response(undefined, {
-					headers: { location: `/${locale}${pathname}` },
-					status: 301
-				});
-			}
-
-			// Add html `lang` attribute
+		if (locale && response.headers.get('content-type') === 'text/html') {
 			const body = await response.text();
-
-			return new Response(`${body}`.replace(/<html.*>/, `<html lang="${locale}">`), response);
+			return new Response(body.replace(/<html.*>/, `<html lang="${locale}">`), response);
 		}
 
 		return response;
diff --git a/src/lib/lang.json b/src/lib/lang.json
index b01c522bb..082405899 100644
--- a/src/lib/lang.json
+++ b/src/lib/lang.json
@@ -1,4 +1,4 @@
 {
-	"en": "English",
-	"fr": "Français"
+	"en-US": "English",
+	"fr-FR": "Français"
 }
diff --git a/src/lib/translations.ts b/src/lib/translations.ts
index 299c8a75b..cfa5398ab 100644
--- a/src/lib/translations.ts
+++ b/src/lib/translations.ts
@@ -3,19 +3,19 @@ import lang from './lang.json';
 
 /** @type {import('sveltekit-i18n').Config} */
 export const config = {
-	fallbackLocale: 'en',
+	fallbackLocale: 'en-US',
 	translations: {
-		en: { lang },
-		fr: { lang }
+		'en-US': { lang },
+		'fr-FR': { lang }
 	},
 	loaders: [
 		{
-			locale: 'en',
+			locale: 'en-US',
 			key: '',
 			loader: async () => (await import('../../static/locales/en.json')).default
 		},
 		{
-			locale: 'fr',
+			locale: 'fr-FR',
 			key: '',
 			loader: async () => (await import('../../static/locales/fr.json')).default
 		}
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 1cc8f8198..abb230389 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -1,7 +1,7 @@
 <script context="module" lang="ts">
 	import type { Load } from '@sveltejs/kit';
 	import { isPublicPath } from '$lib/settings';
-	import { locale, loadTranslations } from '$lib/translations';
+	import { loadTranslations } from '$lib/translations';
 
 	export const load: Load = async ({ fetch, url, session }) => {
 		const { pathname } = url;
@@ -44,7 +44,7 @@
 	import { errorNotification } from '$lib/form';
 	import { asyncSleep } from '$lib/components/common';
 	import { del, get, post } from '$lib/api';
-	import { t } from '$lib/translations';
+	import { t, loading } from '$lib/translations';
 
 	let isUpdateAvailable = false;
 
@@ -144,331 +144,20 @@
 </svelte:head>
 
 <SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
-{#if $session.userId}
-	<nav class="nav-main">
-		<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
-			<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
-			<div class="flex flex-col space-y-4 py-2">
-				<a
-					sveltekit:prefetch
-					href="/"
-					class="icons tooltip-right bg-coolgray-200 hover:text-white"
-					class:text-white={$page.url.pathname === '/'}
-					class:bg-coolgray-500={$page.url.pathname === '/'}
-					data-tooltip={$t('dashboard')}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
-						/>
-						<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
 
-				<a
-					sveltekit:prefetch
-					href="/applications"
-					class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
-					class:text-green-500={$page.url.pathname.startsWith('/applications') ||
-						$page.url.pathname.startsWith('/new/application')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
-						$page.url.pathname.startsWith('/new/application')}
-					data-tooltip={$t('index.applications')}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="4" y="4" width="6" height="6" rx="1" />
-						<rect x="4" y="14" width="6" height="6" rx="1" />
-						<rect x="14" y="14" width="6" height="6" rx="1" />
-						<line x1="14" y1="7" x2="20" y2="7" />
-						<line x1="17" y1="4" x2="17" y2="10" />
-					</svg>
-				</a>
-				<a
-					sveltekit:prefetch
-					href="/sources"
-					class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
-					class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
-						$page.url.pathname.startsWith('/new/source')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
-						$page.url.pathname.startsWith('/new/source')}
-					data-tooltip="Git Sources"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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" />
-						<circle cx="6" cy="6" r="2" />
-						<circle cx="18" cy="18" r="2" />
-						<path d="M11 6h5a2 2 0 0 1 2 2v8" />
-						<polyline points="14 9 11 6 14 3" />
-						<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
-						<polyline points="10 15 13 18 10 21" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/destinations"
-					class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
-					class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
-						$page.url.pathname.startsWith('/new/destination')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
-						$page.url.pathname.startsWith('/new/destination')}
-					data-tooltip="Destinations"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
-						/>
-						<path d="M5 10h3v3h-3z" />
-						<path d="M8 10h3v3h-3z" />
-						<path d="M11 10h3v3h-3z" />
-						<path d="M8 7h3v3h-3z" />
-						<path d="M11 7h3v3h-3z" />
-						<path d="M11 4h3v3h-3z" />
-						<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
-						<line x1="10" y1="16" x2="10" y2="16.01" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/databases"
-					class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
-					class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
-						$page.url.pathname.startsWith('/new/database')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
-						$page.url.pathname.startsWith('/new/database')}
-					data-tooltip="Databases"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/services"
-					class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
-					class:text-pink-500={$page.url.pathname.startsWith('/services') ||
-						$page.url.pathname.startsWith('/new/service')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
-						$page.url.pathname.startsWith('/new/service')}
-					data-tooltip="Services"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-			</div>
-			<div class="flex-1" />
-
-			<div class="flex flex-col space-y-4 py-2">
-				{#if $session.teamId === '0'}
-					{#if isUpdateAvailable}
-						<button
-							disabled={updateStatus.success === false}
-							title={$t('layout.update_available')}
-							on:click={update}
-							class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
-						>
-							{#if updateStatus.loading}
-								<svg
-									xmlns="http://www.w3.org/2000/svg"
-									class="lds-heart h-9 w-8"
-									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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
-									/>
-								</svg>
-							{:else if updateStatus.success === null}
-								<svg
-									xmlns="http://www.w3.org/2000/svg"
-									class="w-8 h-9"
-									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" />
-									<circle cx="12" cy="12" r="9" />
-									<line x1="12" y1="8" x2="8" y2="12" />
-									<line x1="12" y1="8" x2="12" y2="16" />
-									<line x1="16" y1="12" x2="12" y2="8" />
-								</svg>
-							{:else if updateStatus.success}
-								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-									><path
-										fill="#DD2E44"
-										d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
-									/><path
-										fill="#EA596E"
-										d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
-									/><path
-										fill="#A0041E"
-										d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
-									/><path
-										fill="#AA8DD8"
-										d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
-									/><path
-										fill="#77B255"
-										d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
-									/><path
-										fill="#AA8DD8"
-										d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
-									/><path
-										fill="#77B255"
-										d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
-									/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
-										fill="#9266CC"
-										cx="2"
-										cy="18"
-										r="2"
-									/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
-										fill="#5C913B"
-										cx="23.5"
-										cy="31.5"
-										r="1.5"
-									/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
-										fill="#FFCC4D"
-										cx="32.5"
-										cy="8.5"
-										r="1.5"
-									/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
-										fill="#FFCC4D"
-										cx="7.5"
-										cy="23.5"
-										r="1.5"
-									/></svg
-								>
-							{:else}
-								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-									><path
-										fill="#FFCC4D"
-										d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
-									/><path
-										fill="#664500"
-										d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
-									/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
-										fill="#664500"
-										d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
-									/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
-										fill="#E75A70"
-										cx="18"
-										cy="27"
-										rx="3"
-										ry="2"
-									/></svg
-								>
-							{/if}
-						</button>
-					{/if}
-				{/if}
-			</div>
-			<div class="flex flex-col space-y-4 py-2">
-				<a
-					sveltekit:prefetch
-					href="/teams"
-					class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
-					class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
-					data-tooltip="Teams"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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" />
-						<circle cx="9" cy="7" r="4" />
-						<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
-						<path d="M16 3.13a4 4 0 0 1 0 7.75" />
-						<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
-					</svg>
-				</a>
-				{#if $session.teamId === '0'}
+{#if loading}
+	{#if $session.userId}
+		<nav class="nav-main">
+			<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
+				<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
+				<div class="flex flex-col space-y-4 py-2">
 					<a
 						sveltekit:prefetch
-						href="/settings"
-						class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
-						class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
-						data-tooltip="Settings"
+						href="/"
+						class="icons tooltip-right bg-coolgray-200 hover:text-white"
+						class:text-white={$page.url.pathname === '/'}
+						class:bg-coolgray-500={$page.url.pathname === '/'}
+						data-tooltip={$t('dashboard')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -482,57 +171,373 @@
 						>
 							<path stroke="none" d="M0 0h24v24H0z" fill="none" />
 							<path
-								d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+								d="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
 							/>
-							<circle cx="12" cy="12" r="3" />
+							<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
 						</svg>
 					</a>
-				{/if}
-				<div
-					class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
-					data-tooltip="Logout"
-					on:click={logout}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="ml-1 h-7 w-7"
-						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="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
-						/>
-						<path d="M7 12h14l-3 -3m0 6l3 -3" />
-					</svg>
-				</div>
-				<div
-					class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
-				>
+					<div class="border-t border-stone-700" />
+
 					<a
-						class="text-[10px] no-underline"
-						href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
-						target="_blank">v{$session.version}</a
+						sveltekit:prefetch
+						href="/applications"
+						class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
+						class:text-green-500={$page.url.pathname.startsWith('/applications') ||
+							$page.url.pathname.startsWith('/new/application')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
+							$page.url.pathname.startsWith('/new/application')}
+						data-tooltip={$t('index.applications')}
 					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="4" y="4" width="6" height="6" rx="1" />
+							<rect x="4" y="14" width="6" height="6" rx="1" />
+							<rect x="14" y="14" width="6" height="6" rx="1" />
+							<line x1="14" y1="7" x2="20" y2="7" />
+							<line x1="17" y1="4" x2="17" y2="10" />
+						</svg>
+					</a>
+					<a
+						sveltekit:prefetch
+						href="/sources"
+						class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
+						class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
+							$page.url.pathname.startsWith('/new/source')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
+							$page.url.pathname.startsWith('/new/source')}
+						data-tooltip="Git Sources"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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" />
+							<circle cx="6" cy="6" r="2" />
+							<circle cx="18" cy="18" r="2" />
+							<path d="M11 6h5a2 2 0 0 1 2 2v8" />
+							<polyline points="14 9 11 6 14 3" />
+							<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
+							<polyline points="10 15 13 18 10 21" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/destinations"
+						class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
+						class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
+							$page.url.pathname.startsWith('/new/destination')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
+							$page.url.pathname.startsWith('/new/destination')}
+						data-tooltip="Destinations"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
+							/>
+							<path d="M5 10h3v3h-3z" />
+							<path d="M8 10h3v3h-3z" />
+							<path d="M11 10h3v3h-3z" />
+							<path d="M8 7h3v3h-3z" />
+							<path d="M11 7h3v3h-3z" />
+							<path d="M11 4h3v3h-3z" />
+							<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
+							<line x1="10" y1="16" x2="10" y2="16.01" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/databases"
+						class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
+						class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
+							$page.url.pathname.startsWith('/new/database')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
+							$page.url.pathname.startsWith('/new/database')}
+						data-tooltip="Databases"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/services"
+						class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
+						class:text-pink-500={$page.url.pathname.startsWith('/services') ||
+							$page.url.pathname.startsWith('/new/service')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
+							$page.url.pathname.startsWith('/new/service')}
+						data-tooltip="Services"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+				</div>
+				<div class="flex-1" />
+
+				<div class="flex flex-col space-y-4 py-2">
+					{#if $session.teamId === '0'}
+						{#if isUpdateAvailable}
+							<button
+								disabled={updateStatus.success === false}
+								title={$t('layout.update_available')}
+								on:click={update}
+								class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
+							>
+								{#if updateStatus.loading}
+									<svg
+										xmlns="http://www.w3.org/2000/svg"
+										class="lds-heart h-9 w-8"
+										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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
+										/>
+									</svg>
+								{:else if updateStatus.success === null}
+									<svg
+										xmlns="http://www.w3.org/2000/svg"
+										class="w-8 h-9"
+										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" />
+										<circle cx="12" cy="12" r="9" />
+										<line x1="12" y1="8" x2="8" y2="12" />
+										<line x1="12" y1="8" x2="12" y2="16" />
+										<line x1="16" y1="12" x2="12" y2="8" />
+									</svg>
+								{:else if updateStatus.success}
+									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+										><path
+											fill="#DD2E44"
+											d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
+										/><path
+											fill="#EA596E"
+											d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
+										/><path
+											fill="#A0041E"
+											d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
+										/><path
+											fill="#AA8DD8"
+											d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
+										/><path
+											fill="#77B255"
+											d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
+										/><path
+											fill="#AA8DD8"
+											d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
+										/><path
+											fill="#77B255"
+											d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
+										/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
+											fill="#9266CC"
+											cx="2"
+											cy="18"
+											r="2"
+										/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
+											fill="#5C913B"
+											cx="23.5"
+											cy="31.5"
+											r="1.5"
+										/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
+											fill="#FFCC4D"
+											cx="32.5"
+											cy="8.5"
+											r="1.5"
+										/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
+											fill="#FFCC4D"
+											cx="7.5"
+											cy="23.5"
+											r="1.5"
+										/></svg
+									>
+								{:else}
+									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+										><path
+											fill="#FFCC4D"
+											d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
+										/><path
+											fill="#664500"
+											d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
+										/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
+											fill="#664500"
+											d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
+										/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
+											fill="#E75A70"
+											cx="18"
+											cy="27"
+											rx="3"
+											ry="2"
+										/></svg
+									>
+								{/if}
+							</button>
+						{/if}
+					{/if}
+				</div>
+				<div class="flex flex-col space-y-4 py-2">
+					<a
+						sveltekit:prefetch
+						href="/teams"
+						class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
+						class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
+						data-tooltip="Teams"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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" />
+							<circle cx="9" cy="7" r="4" />
+							<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
+							<path d="M16 3.13a4 4 0 0 1 0 7.75" />
+							<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
+						</svg>
+					</a>
+					{#if $session.teamId === '0'}
+						<a
+							sveltekit:prefetch
+							href="/settings"
+							class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
+							class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
+							class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
+							data-tooltip="Settings"
+						>
+							<svg
+								xmlns="http://www.w3.org/2000/svg"
+								class="h-8 w-8"
+								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="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+								/>
+								<circle cx="12" cy="12" r="3" />
+							</svg>
+						</a>
+					{/if}
+					<div
+						class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
+						data-tooltip="Logout"
+						on:click={logout}
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="ml-1 h-7 w-7"
+							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="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
+							/>
+							<path d="M7 12h14l-3 -3m0 6l3 -3" />
+						</svg>
+					</div>
+					<div
+						class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
+					>
+						<a
+							class="text-[10px] no-underline"
+							href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
+							target="_blank">v{$session.version}</a
+						>
+					</div>
 				</div>
 			</div>
-		</div>
-	</nav>
-	<select
-		class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
-		bind:value={selectedTeamId}
-		on:change={switchTeam}
-	>
-		<option value="" disabled selected>{$t('layout.switch_to_a_different_team')}</option>
-		{#each teams as team}
-			<option value={team.teamId}>{team.team.name} - {team.permission}</option>
-		{/each}
-	</select>
+		</nav>
+		<select
+			class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
+			bind:value={selectedTeamId}
+			on:change={switchTeam}
+		>
+			<option value="" disabled selected>{$t('layout.switch_to_a_different_team')}</option>
+			{#each teams as team}
+				<option value={team.teamId}>{team.team.name} - {team.permission}</option>
+			{/each}
+		</select>
+	{/if}
+	<main>
+		<slot />
+	</main>
+{:else}
+	<p>Loading...</p>
 {/if}
-<main>
-	<slot />
-</main>

From 92d1f5aa5565378756312d581cb9599d798dba69 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 19:28:20 +0200
Subject: [PATCH 04/23] Revert "Patch bugs on locale redirections"

This reverts commit 614eb923d84a5c3bee4008bec2291b5d4e9ff5c1.
---
 src/hooks.ts               |  66 ++--
 src/lib/lang.json          |   4 +-
 src/lib/translations.ts    |  10 +-
 src/routes/__layout.svelte | 741 ++++++++++++++++++-------------------
 4 files changed, 409 insertions(+), 412 deletions(-)

diff --git a/src/hooks.ts b/src/hooks.ts
index 53b6d07f2..4a0fa2e87 100644
--- a/src/hooks.ts
+++ b/src/hooks.ts
@@ -18,36 +18,6 @@ export const handle = handleSession(
 	},
 	async function ({ event, resolve }) {
 		let response;
-		let locale;
-
-		const { url, request } = event;
-		const { pathname } = url;
-
-		// If this request is a route request
-		if (routeRegex.test(pathname)) {
-			// Get defined locales
-			const supportedLocales = locales.get();
-
-			// Try to get locale from `pathname`.
-			locale = supportedLocales.find(
-				(l) => `${l}`.toLowerCase() === `${pathname.match(/[^/]+?(?=\/|$)/)}`.toLowerCase()
-			);
-
-			if (!locale) {
-				// Get user preferred locale
-				locale = `${`${request.headers.get('accept-language')}`.match(/[a-zA-Z-]+?(?=_|,|;)/)}`;
-
-				// Set default locale if user preferred locale does not match
-				if (!supportedLocales.includes(locale)) locale = 'en-US';
-
-				// 302 redirect
-				return new Response(undefined, {
-					headers: { location: `/${locale}${pathname}` },
-					status: 302
-				});
-			}
-		}
-
 		try {
 			if (event.locals.cookies) {
 				if (event.locals.cookies['kit.session']) {
@@ -70,6 +40,7 @@ export const handle = handleSession(
 				ssr: !event.url.pathname.startsWith('/webhooks/success')
 			});
 		} catch (error) {
+			console.log(error);
 			response = await resolve(event, {
 				ssr: !event.url.pathname.startsWith('/webhooks/success')
 			});
@@ -96,9 +67,40 @@ export const handle = handleSession(
 			);
 		}
 
-		if (locale && response.headers.get('content-type') === 'text/html') {
+		const { url, request } = event;
+		const { pathname } = url;
+
+		// If this request is a route request
+		if (routeRegex.test(pathname)) {
+			// Get defined locales
+			const supportedLocales = locales.get();
+
+			// Try to get locale from `pathname`.
+			let locale = supportedLocales.find(
+				(l) => `${l}`.toLowerCase() === `${pathname.match(/[^/]+?(?=\/|$)/)}`.toLowerCase()
+			);
+
+			// If route locale is not supported
+			if (!locale) {
+				// Get user preferred locale
+				locale = `${`${request.headers['accept-language']}`.match(
+					/[a-zA-Z]+?(?=-|_|,|;)/
+				)}`.toLowerCase();
+
+				// Set default locale if user preferred locale does not match
+				if (!supportedLocales.includes(locale)) locale = 'en';
+
+				// 301 redirect
+				return new Response(undefined, {
+					headers: { location: `/${locale}${pathname}` },
+					status: 301
+				});
+			}
+
+			// Add html `lang` attribute
 			const body = await response.text();
-			return new Response(body.replace(/<html.*>/, `<html lang="${locale}">`), response);
+
+			return new Response(`${body}`.replace(/<html.*>/, `<html lang="${locale}">`), response);
 		}
 
 		return response;
diff --git a/src/lib/lang.json b/src/lib/lang.json
index 082405899..b01c522bb 100644
--- a/src/lib/lang.json
+++ b/src/lib/lang.json
@@ -1,4 +1,4 @@
 {
-	"en-US": "English",
-	"fr-FR": "Français"
+	"en": "English",
+	"fr": "Français"
 }
diff --git a/src/lib/translations.ts b/src/lib/translations.ts
index cfa5398ab..299c8a75b 100644
--- a/src/lib/translations.ts
+++ b/src/lib/translations.ts
@@ -3,19 +3,19 @@ import lang from './lang.json';
 
 /** @type {import('sveltekit-i18n').Config} */
 export const config = {
-	fallbackLocale: 'en-US',
+	fallbackLocale: 'en',
 	translations: {
-		'en-US': { lang },
-		'fr-FR': { lang }
+		en: { lang },
+		fr: { lang }
 	},
 	loaders: [
 		{
-			locale: 'en-US',
+			locale: 'en',
 			key: '',
 			loader: async () => (await import('../../static/locales/en.json')).default
 		},
 		{
-			locale: 'fr-FR',
+			locale: 'fr',
 			key: '',
 			loader: async () => (await import('../../static/locales/fr.json')).default
 		}
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index abb230389..1cc8f8198 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -1,7 +1,7 @@
 <script context="module" lang="ts">
 	import type { Load } from '@sveltejs/kit';
 	import { isPublicPath } from '$lib/settings';
-	import { loadTranslations } from '$lib/translations';
+	import { locale, loadTranslations } from '$lib/translations';
 
 	export const load: Load = async ({ fetch, url, session }) => {
 		const { pathname } = url;
@@ -44,7 +44,7 @@
 	import { errorNotification } from '$lib/form';
 	import { asyncSleep } from '$lib/components/common';
 	import { del, get, post } from '$lib/api';
-	import { t, loading } from '$lib/translations';
+	import { t } from '$lib/translations';
 
 	let isUpdateAvailable = false;
 
@@ -144,307 +144,331 @@
 </svelte:head>
 
 <SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
+{#if $session.userId}
+	<nav class="nav-main">
+		<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
+			<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
+			<div class="flex flex-col space-y-4 py-2">
+				<a
+					sveltekit:prefetch
+					href="/"
+					class="icons tooltip-right bg-coolgray-200 hover:text-white"
+					class:text-white={$page.url.pathname === '/'}
+					class:bg-coolgray-500={$page.url.pathname === '/'}
+					data-tooltip={$t('dashboard')}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						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="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
+						/>
+						<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
+					</svg>
+				</a>
+				<div class="border-t border-stone-700" />
 
-{#if loading}
-	{#if $session.userId}
-		<nav class="nav-main">
-			<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
-				<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
-				<div class="flex flex-col space-y-4 py-2">
-					<a
-						sveltekit:prefetch
-						href="/"
-						class="icons tooltip-right bg-coolgray-200 hover:text-white"
-						class:text-white={$page.url.pathname === '/'}
-						class:bg-coolgray-500={$page.url.pathname === '/'}
-						data-tooltip={$t('dashboard')}
+				<a
+					sveltekit:prefetch
+					href="/applications"
+					class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
+					class:text-green-500={$page.url.pathname.startsWith('/applications') ||
+						$page.url.pathname.startsWith('/new/application')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
+						$page.url.pathname.startsWith('/new/application')}
+					data-tooltip={$t('index.applications')}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentcolor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
-							/>
-							<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
-						</svg>
-					</a>
-					<div class="border-t border-stone-700" />
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<rect x="4" y="4" width="6" height="6" rx="1" />
+						<rect x="4" y="14" width="6" height="6" rx="1" />
+						<rect x="14" y="14" width="6" height="6" rx="1" />
+						<line x1="14" y1="7" x2="20" y2="7" />
+						<line x1="17" y1="4" x2="17" y2="10" />
+					</svg>
+				</a>
+				<a
+					sveltekit:prefetch
+					href="/sources"
+					class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
+					class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
+						$page.url.pathname.startsWith('/new/source')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
+						$page.url.pathname.startsWith('/new/source')}
+					data-tooltip="Git Sources"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						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" />
+						<circle cx="6" cy="6" r="2" />
+						<circle cx="18" cy="18" r="2" />
+						<path d="M11 6h5a2 2 0 0 1 2 2v8" />
+						<polyline points="14 9 11 6 14 3" />
+						<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
+						<polyline points="10 15 13 18 10 21" />
+					</svg>
+				</a>
+				<div class="border-t border-stone-700" />
+				<a
+					sveltekit:prefetch
+					href="/destinations"
+					class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
+					class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
+						$page.url.pathname.startsWith('/new/destination')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
+						$page.url.pathname.startsWith('/new/destination')}
+					data-tooltip="Destinations"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
+						/>
+						<path d="M5 10h3v3h-3z" />
+						<path d="M8 10h3v3h-3z" />
+						<path d="M11 10h3v3h-3z" />
+						<path d="M8 7h3v3h-3z" />
+						<path d="M11 7h3v3h-3z" />
+						<path d="M11 4h3v3h-3z" />
+						<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
+						<line x1="10" y1="16" x2="10" y2="16.01" />
+					</svg>
+				</a>
+				<div class="border-t border-stone-700" />
+				<a
+					sveltekit:prefetch
+					href="/databases"
+					class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
+					class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
+						$page.url.pathname.startsWith('/new/database')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
+						$page.url.pathname.startsWith('/new/database')}
+					data-tooltip="Databases"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						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>
+				</a>
+				<div class="border-t border-stone-700" />
+				<a
+					sveltekit:prefetch
+					href="/services"
+					class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
+					class:text-pink-500={$page.url.pathname.startsWith('/services') ||
+						$page.url.pathname.startsWith('/new/service')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
+						$page.url.pathname.startsWith('/new/service')}
+					data-tooltip="Services"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
+					</svg>
+				</a>
+				<div class="border-t border-stone-700" />
+			</div>
+			<div class="flex-1" />
 
-					<a
-						sveltekit:prefetch
-						href="/applications"
-						class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
-						class:text-green-500={$page.url.pathname.startsWith('/applications') ||
-							$page.url.pathname.startsWith('/new/application')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
-							$page.url.pathname.startsWith('/new/application')}
-						data-tooltip={$t('index.applications')}
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							viewBox="0 0 24 24"
-							stroke-width="1.5"
-							stroke="currentcolor"
-							fill="none"
-							stroke-linecap="round"
-							stroke-linejoin="round"
+			<div class="flex flex-col space-y-4 py-2">
+				{#if $session.teamId === '0'}
+					{#if isUpdateAvailable}
+						<button
+							disabled={updateStatus.success === false}
+							title={$t('layout.update_available')}
+							on:click={update}
+							class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
 						>
-							<path stroke="none" d="M0 0h24v24H0z" fill="none" />
-							<rect x="4" y="4" width="6" height="6" rx="1" />
-							<rect x="4" y="14" width="6" height="6" rx="1" />
-							<rect x="14" y="14" width="6" height="6" rx="1" />
-							<line x1="14" y1="7" x2="20" y2="7" />
-							<line x1="17" y1="4" x2="17" y2="10" />
-						</svg>
-					</a>
-					<a
-						sveltekit:prefetch
-						href="/sources"
-						class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
-						class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
-							$page.url.pathname.startsWith('/new/source')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
-							$page.url.pathname.startsWith('/new/source')}
-						data-tooltip="Git Sources"
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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" />
-							<circle cx="6" cy="6" r="2" />
-							<circle cx="18" cy="18" r="2" />
-							<path d="M11 6h5a2 2 0 0 1 2 2v8" />
-							<polyline points="14 9 11 6 14 3" />
-							<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
-							<polyline points="10 15 13 18 10 21" />
-						</svg>
-					</a>
-					<div class="border-t border-stone-700" />
-					<a
-						sveltekit:prefetch
-						href="/destinations"
-						class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
-						class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
-							$page.url.pathname.startsWith('/new/destination')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
-							$page.url.pathname.startsWith('/new/destination')}
-						data-tooltip="Destinations"
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
-							/>
-							<path d="M5 10h3v3h-3z" />
-							<path d="M8 10h3v3h-3z" />
-							<path d="M11 10h3v3h-3z" />
-							<path d="M8 7h3v3h-3z" />
-							<path d="M11 7h3v3h-3z" />
-							<path d="M11 4h3v3h-3z" />
-							<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
-							<line x1="10" y1="16" x2="10" y2="16.01" />
-						</svg>
-					</a>
-					<div class="border-t border-stone-700" />
-					<a
-						sveltekit:prefetch
-						href="/databases"
-						class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
-						class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
-							$page.url.pathname.startsWith('/new/database')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
-							$page.url.pathname.startsWith('/new/database')}
-						data-tooltip="Databases"
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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>
-					</a>
-					<div class="border-t border-stone-700" />
-					<a
-						sveltekit:prefetch
-						href="/services"
-						class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
-						class:text-pink-500={$page.url.pathname.startsWith('/services') ||
-							$page.url.pathname.startsWith('/new/service')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
-							$page.url.pathname.startsWith('/new/service')}
-						data-tooltip="Services"
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="h-8 w-8"
-							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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
-						</svg>
-					</a>
-					<div class="border-t border-stone-700" />
-				</div>
-				<div class="flex-1" />
-
-				<div class="flex flex-col space-y-4 py-2">
-					{#if $session.teamId === '0'}
-						{#if isUpdateAvailable}
-							<button
-								disabled={updateStatus.success === false}
-								title={$t('layout.update_available')}
-								on:click={update}
-								class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
-							>
-								{#if updateStatus.loading}
-									<svg
-										xmlns="http://www.w3.org/2000/svg"
-										class="lds-heart h-9 w-8"
-										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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
-										/>
-									</svg>
-								{:else if updateStatus.success === null}
-									<svg
-										xmlns="http://www.w3.org/2000/svg"
-										class="w-8 h-9"
-										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" />
-										<circle cx="12" cy="12" r="9" />
-										<line x1="12" y1="8" x2="8" y2="12" />
-										<line x1="12" y1="8" x2="12" y2="16" />
-										<line x1="16" y1="12" x2="12" y2="8" />
-									</svg>
-								{:else if updateStatus.success}
-									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-										><path
-											fill="#DD2E44"
-											d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
-										/><path
-											fill="#EA596E"
-											d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
-										/><path
-											fill="#A0041E"
-											d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
-										/><path
-											fill="#AA8DD8"
-											d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
-										/><path
-											fill="#77B255"
-											d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
-										/><path
-											fill="#AA8DD8"
-											d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
-										/><path
-											fill="#77B255"
-											d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
-										/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
-											fill="#9266CC"
-											cx="2"
-											cy="18"
-											r="2"
-										/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
-											fill="#5C913B"
-											cx="23.5"
-											cy="31.5"
-											r="1.5"
-										/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
-											fill="#FFCC4D"
-											cx="32.5"
-											cy="8.5"
-											r="1.5"
-										/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
-											fill="#FFCC4D"
-											cx="7.5"
-											cy="23.5"
-											r="1.5"
-										/></svg
-									>
-								{:else}
-									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-										><path
-											fill="#FFCC4D"
-											d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
-										/><path
-											fill="#664500"
-											d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
-										/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
-											fill="#664500"
-											d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
-										/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
-											fill="#E75A70"
-											cx="18"
-											cy="27"
-											rx="3"
-											ry="2"
-										/></svg
-									>
-								{/if}
-							</button>
-						{/if}
+							{#if updateStatus.loading}
+								<svg
+									xmlns="http://www.w3.org/2000/svg"
+									class="lds-heart h-9 w-8"
+									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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
+									/>
+								</svg>
+							{:else if updateStatus.success === null}
+								<svg
+									xmlns="http://www.w3.org/2000/svg"
+									class="w-8 h-9"
+									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" />
+									<circle cx="12" cy="12" r="9" />
+									<line x1="12" y1="8" x2="8" y2="12" />
+									<line x1="12" y1="8" x2="12" y2="16" />
+									<line x1="16" y1="12" x2="12" y2="8" />
+								</svg>
+							{:else if updateStatus.success}
+								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+									><path
+										fill="#DD2E44"
+										d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
+									/><path
+										fill="#EA596E"
+										d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
+									/><path
+										fill="#A0041E"
+										d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
+									/><path
+										fill="#AA8DD8"
+										d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
+									/><path
+										fill="#77B255"
+										d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
+									/><path
+										fill="#AA8DD8"
+										d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
+									/><path
+										fill="#77B255"
+										d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
+									/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
+										fill="#9266CC"
+										cx="2"
+										cy="18"
+										r="2"
+									/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
+										fill="#5C913B"
+										cx="23.5"
+										cy="31.5"
+										r="1.5"
+									/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
+										fill="#FFCC4D"
+										cx="32.5"
+										cy="8.5"
+										r="1.5"
+									/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
+										fill="#FFCC4D"
+										cx="7.5"
+										cy="23.5"
+										r="1.5"
+									/></svg
+								>
+							{:else}
+								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+									><path
+										fill="#FFCC4D"
+										d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
+									/><path
+										fill="#664500"
+										d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
+									/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
+										fill="#664500"
+										d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
+									/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
+										fill="#E75A70"
+										cx="18"
+										cy="27"
+										rx="3"
+										ry="2"
+									/></svg
+								>
+							{/if}
+						</button>
 					{/if}
-				</div>
-				<div class="flex flex-col space-y-4 py-2">
+				{/if}
+			</div>
+			<div class="flex flex-col space-y-4 py-2">
+				<a
+					sveltekit:prefetch
+					href="/teams"
+					class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
+					class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
+					class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
+					data-tooltip="Teams"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="h-8 w-8"
+						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" />
+						<circle cx="9" cy="7" r="4" />
+						<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
+						<path d="M16 3.13a4 4 0 0 1 0 7.75" />
+						<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
+					</svg>
+				</a>
+				{#if $session.teamId === '0'}
 					<a
 						sveltekit:prefetch
-						href="/teams"
-						class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
-						class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
-						data-tooltip="Teams"
+						href="/settings"
+						class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
+						class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
+						data-tooltip="Settings"
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -457,87 +481,58 @@
 							stroke-linejoin="round"
 						>
 							<path stroke="none" d="M0 0h24v24H0z" fill="none" />
-							<circle cx="9" cy="7" r="4" />
-							<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
-							<path d="M16 3.13a4 4 0 0 1 0 7.75" />
-							<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
+							<path
+								d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+							/>
+							<circle cx="12" cy="12" r="3" />
 						</svg>
 					</a>
-					{#if $session.teamId === '0'}
-						<a
-							sveltekit:prefetch
-							href="/settings"
-							class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
-							class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
-							class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
-							data-tooltip="Settings"
-						>
-							<svg
-								xmlns="http://www.w3.org/2000/svg"
-								class="h-8 w-8"
-								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="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
-								/>
-								<circle cx="12" cy="12" r="3" />
-							</svg>
-						</a>
-					{/if}
-					<div
-						class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
-						data-tooltip="Logout"
-						on:click={logout}
+				{/if}
+				<div
+					class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
+					data-tooltip="Logout"
+					on:click={logout}
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						class="ml-1 h-7 w-7"
+						viewBox="0 0 24 24"
+						stroke-width="1.5"
+						stroke="currentColor"
+						fill="none"
+						stroke-linecap="round"
+						stroke-linejoin="round"
 					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							class="ml-1 h-7 w-7"
-							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="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
-							/>
-							<path d="M7 12h14l-3 -3m0 6l3 -3" />
-						</svg>
-					</div>
-					<div
-						class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
+						<path stroke="none" d="M0 0h24v24H0z" fill="none" />
+						<path
+							d="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
+						/>
+						<path d="M7 12h14l-3 -3m0 6l3 -3" />
+					</svg>
+				</div>
+				<div
+					class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
+				>
+					<a
+						class="text-[10px] no-underline"
+						href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
+						target="_blank">v{$session.version}</a
 					>
-						<a
-							class="text-[10px] no-underline"
-							href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
-							target="_blank">v{$session.version}</a
-						>
-					</div>
 				</div>
 			</div>
-		</nav>
-		<select
-			class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
-			bind:value={selectedTeamId}
-			on:change={switchTeam}
-		>
-			<option value="" disabled selected>{$t('layout.switch_to_a_different_team')}</option>
-			{#each teams as team}
-				<option value={team.teamId}>{team.team.name} - {team.permission}</option>
-			{/each}
-		</select>
-	{/if}
-	<main>
-		<slot />
-	</main>
-{:else}
-	<p>Loading...</p>
+		</div>
+	</nav>
+	<select
+		class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
+		bind:value={selectedTeamId}
+		on:change={switchTeam}
+	>
+		<option value="" disabled selected>{$t('layout.switch_to_a_different_team')}</option>
+		{#each teams as team}
+			<option value={team.teamId}>{team.team.name} - {team.permission}</option>
+		{/each}
+	</select>
 {/if}
+<main>
+	<slot />
+</main>

From 943300509b541765a20775e0d14ab7d7d8eaedfa Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 19:29:22 +0200
Subject: [PATCH 05/23] Revert "Add Locale URL"

This reverts commit d910b21185783a8cb194d03b25cd4803ce1fec41.
---
 .vscode/settings.json                         |   6 +-
 package.json                                  |   2 +-
 pnpm-lock.yaml                                | 124 ++-
 src/hooks.ts                                  |  43 +-
 src/lib/form.ts                               |  11 +-
 src/lib/lang.json                             |   4 -
 src/lib/settings.ts                           |   6 +-
 src/lib/translations.ts                       |  26 -
 src/routes/__error.svelte                     |   8 +-
 src/routes/__layout.svelte                    | 776 +++++++++---------
 .../applications/[id]/__layout.svelte         |   0
 .../applications/[id]/check.json.ts           |   0
 .../[id]/configuration/_BuildPack.svelte      |   0
 .../configuration/_GithubRepositories.svelte  |   0
 .../configuration/_GitlabRepositories.svelte  |   0
 .../[id]/configuration/buildpack.json.ts      |   0
 .../[id]/configuration/buildpack.svelte       |   0
 .../[id]/configuration/deploykey.json.ts      |   0
 .../[id]/configuration/destination.json.ts    |   0
 .../[id]/configuration/destination.svelte     |   0
 .../[id]/configuration/githubToken.json.ts    |   0
 .../[id]/configuration/repository.json.ts     |   0
 .../[id]/configuration/repository.svelte      |   0
 .../[id]/configuration/source.json.ts         |   0
 .../[id]/configuration/source.svelte          |   0
 .../[id]/configuration/sshkey.json.ts         |   0
 .../applications/[id]/delete.json.ts          |   0
 .../applications/[id]/deploy.json.ts          |   0
 .../applications/[id]/index.json.ts           |   0
 .../applications/[id]/index.svelte            |   0
 .../applications/[id]/logs/_Loading.svelte    |   0
 .../[id]/logs/build/_BuildLog.svelte          |   0
 .../[id]/logs/build/build.json.ts             |   0
 .../[id]/logs/build/index.json.ts             |   0
 .../applications/[id]/logs/build/index.svelte |   0
 .../applications/[id]/logs/index.json.ts      |   0
 .../applications/[id]/logs/index.svelte       |   0
 .../applications/[id]/previews/index.json.ts  |   0
 .../applications/[id]/previews/index.svelte   |   0
 .../applications/[id]/secrets/_Secret.svelte  |   0
 .../applications/[id]/secrets/index.json.ts   |   0
 .../applications/[id]/secrets/index.svelte    |   0
 .../applications/[id]/settings.json.ts        |   4 +-
 .../applications/[id]/stop.json.ts            |   0
 .../applications/[id]/storage/_Storage.svelte |   0
 .../applications/[id]/storage/index.json.ts   |   0
 .../applications/[id]/storage/index.svelte    |   0
 .../applications/_Application.svelte          |   3 +-
 .../{[lang] => }/applications/index.svelte    |   5 +-
 src/routes/{[lang] => }/applications/index.ts |   0
 src/routes/{[lang] => }/applications/new.ts   |   0
 .../{[lang] => }/common/getUniqueName.json.ts |   0
 .../databases/[id]/_Databases/_CouchDb.svelte |   0
 .../[id]/_Databases/_Databases.svelte         |   0
 .../databases/[id]/_Databases/_MongoDB.svelte |   0
 .../databases/[id]/_Databases/_MySQL.svelte   |   0
 .../[id]/_Databases/_PostgreSQL.svelte        |   0
 .../databases/[id]/_Databases/_Redis.svelte   |   0
 .../databases/[id]/__layout.svelte            |   0
 .../[id]/configuration/destination.json.ts    |   0
 .../[id]/configuration/destination.svelte     |   0
 .../databases/[id]/configuration/type.json.ts |   0
 .../databases/[id]/configuration/type.svelte  |   0
 .../[id]/configuration/version.json.ts        |   0
 .../[id]/configuration/version.svelte         |   0
 .../databases/[id]/delete.json.ts             |   0
 .../{[lang] => }/databases/[id]/index.json.ts |   0
 .../{[lang] => }/databases/[id]/index.svelte  |   0
 .../databases/[id]/settings.json.ts           |   0
 .../{[lang] => }/databases/[id]/start.json.ts |   0
 .../{[lang] => }/databases/[id]/stop.json.ts  |   0
 .../{[lang] => }/databases/index.svelte       |   0
 src/routes/{[lang] => }/databases/index.ts    |   0
 src/routes/{[lang] => }/databases/new.ts      |   0
 .../destinations/[id]/_FoundApp.svelte        |   0
 .../destinations/[id]/_LocalDocker.svelte     |   0
 .../destinations/[id]/_RemoteDocker.svelte    |   0
 .../destinations/[id]/__layout.svelte         |   0
 .../destinations/[id]/index.json.ts           |   0
 .../destinations/[id]/index.svelte            |   0
 .../destinations/[id]/restart.json.ts         |   0
 .../destinations/[id]/scan.json.ts            |   0
 .../destinations/[id]/settings.json.ts        |   0
 .../destinations/[id]/start.json.ts           |   0
 .../destinations/[id]/stop.json.ts            |   0
 .../{[lang] => }/destinations/index.json.ts   |   0
 .../{[lang] => }/destinations/index.svelte    |   0
 src/routes/index.svelte                       |  21 +-
 src/routes/{[lang] => }/login/index.json.ts   |   0
 src/routes/{[lang] => }/login/index.svelte    |  17 +-
 src/routes/{[lang] => }/logout/index.json.ts  |   0
 .../new/destination/_LocalDocker.svelte       |   0
 .../new/destination/_RemoteDocker.svelte      |   0
 .../new/destination/check.json.ts             |   0
 .../new/destination/docker.json.ts            |   0
 .../{[lang] => }/new/destination/index.svelte |   0
 .../{[lang] => }/new/source/_Github.svelte    |   0
 .../{[lang] => }/new/source/_Gitlab.svelte    |   0
 .../{[lang] => }/new/source/index.json.ts     |   0
 .../{[lang] => }/new/source/index.svelte      |   0
 .../{[lang] => }/new/team/index.json.ts       |   0
 src/routes/{[lang] => }/new/team/index.svelte |   0
 src/routes/{[lang] => }/register/index.svelte |  15 +-
 src/routes/{[lang] => }/register/index.ts     |   0
 src/routes/{[lang] => }/reset/index.json.ts   |   2 +-
 src/routes/{[lang] => }/reset/index.svelte    |   0
 .../{[lang] => }/reset/password.json.ts       |   2 +-
 .../services/[id]/_Services/_Ghost.svelte     |   0
 .../services/[id]/_Services/_MinIO.svelte     |   0
 .../[id]/_Services/_PlausibleAnalytics.svelte |   0
 .../services/[id]/_Services/_Services.svelte  |   0
 .../[id]/_Services/_VSCodeServer.svelte       |   0
 .../services/[id]/_Services/_Wordpress.svelte |   0
 .../services/[id]/__layout.svelte             |   0
 .../{[lang] => }/services/[id]/check.json.ts  |   0
 .../[id]/configuration/destination.json.ts    |   0
 .../[id]/configuration/destination.svelte     |   0
 .../services/[id]/configuration/type.json.ts  |   0
 .../services/[id]/configuration/type.svelte   |   0
 .../[id]/configuration/version.json.ts        |   0
 .../[id]/configuration/version.svelte         |   0
 .../{[lang] => }/services/[id]/delete.json.ts |   0
 .../services/[id]/ghost/index.json.ts         |   0
 .../services/[id]/ghost/start.json.ts         |   0
 .../services/[id]/ghost/stop.json.ts          |   0
 .../{[lang] => }/services/[id]/index.json.ts  |   0
 .../{[lang] => }/services/[id]/index.svelte   |   0
 .../services/[id]/languagetool/index.json.ts  |   0
 .../services/[id]/languagetool/start.json.ts  |   0
 .../services/[id]/languagetool/stop.json.ts   |   0
 .../services/[id]/minio/index.json.ts         |   0
 .../services/[id]/minio/start.json.ts         |   0
 .../services/[id]/minio/stop.json.ts          |   0
 .../services/[id]/n8n/index.json.ts           |   0
 .../services/[id]/n8n/start.json.ts           |   0
 .../services/[id]/n8n/stop.json.ts            |   0
 .../services/[id]/nocodb/index.json.ts        |   0
 .../services/[id]/nocodb/start.json.ts        |   0
 .../services/[id]/nocodb/stop.json.ts         |   0
 .../[id]/plausibleanalytics/activate.json.ts  |   0
 .../[id]/plausibleanalytics/index.json.ts     |   0
 .../[id]/plausibleanalytics/start.json.ts     |   0
 .../[id]/plausibleanalytics/stop.json.ts      |   0
 .../services/[id]/secrets/_Secret.svelte      |   0
 .../services/[id]/secrets/index.json.ts       |   0
 .../services/[id]/secrets/index.svelte        |   0
 .../services/[id]/settings.json.ts            |   0
 .../services/[id]/uptimekuma/index.json.ts    |   0
 .../services/[id]/uptimekuma/start.json.ts    |   0
 .../services/[id]/uptimekuma/stop.json.ts     |   0
 .../services/[id]/vaultwarden/index.json.ts   |   0
 .../services/[id]/vaultwarden/start.json.ts   |   0
 .../services/[id]/vaultwarden/stop.json.ts    |   0
 .../services/[id]/vscodeserver/index.json.ts  |   0
 .../services/[id]/vscodeserver/start.json.ts  |   0
 .../services/[id]/vscodeserver/stop.json.ts   |   0
 .../services/[id]/wordpress/index.json.ts     |   0
 .../services/[id]/wordpress/start.json.ts     |   0
 .../services/[id]/wordpress/stop.json.ts      |   0
 src/routes/{[lang] => }/services/index.svelte |   0
 src/routes/{[lang] => }/services/index.ts     |   0
 src/routes/{[lang] => }/services/new.ts       |   0
 .../{[lang] => }/settings/check.json.ts       |   0
 .../{[lang] => }/settings/index.json.ts       |   0
 src/routes/{[lang] => }/settings/index.svelte |   0
 .../{[lang] => }/sources/[id]/_Github.svelte  |  17 +-
 .../{[lang] => }/sources/[id]/_Gitlab.svelte  |   0
 .../{[lang] => }/sources/[id]/__layout.svelte |   9 +-
 .../{[lang] => }/sources/[id]/check.json.ts   |   0
 .../{[lang] => }/sources/[id]/gitlab.json.ts  |   0
 .../{[lang] => }/sources/[id]/index.json.ts   |   0
 .../{[lang] => }/sources/[id]/index.svelte    |   0
 .../sources/[id]/newGithubApp.svelte          |   0
 src/routes/{[lang] => }/sources/index.json.ts |   0
 src/routes/{[lang] => }/sources/index.svelte  |   7 +-
 .../{[lang] => }/teams/[id]/__layout.svelte   |   0
 .../{[lang] => }/teams/[id]/index.json.ts     |   0
 .../{[lang] => }/teams/[id]/index.svelte      |   0
 .../teams/[id]/invitation/accept.json.ts      |   0
 .../teams/[id]/invitation/invite.json.ts      |   0
 .../teams/[id]/invitation/revoke.json.ts      |   0
 .../teams/[id]/permission/change.json.ts      |   0
 .../teams/[id]/remove/user.json.ts            |   0
 src/routes/{[lang] => }/teams/index.json.ts   |   0
 src/routes/{[lang] => }/teams/index.svelte    |   0
 static/locales/en.json                        |  55 +-
 static/locales/fr.json                        |  66 --
 187 files changed, 539 insertions(+), 690 deletions(-)
 delete mode 100644 src/lib/lang.json
 delete mode 100644 src/lib/translations.ts
 rename src/routes/{[lang] => }/applications/[id]/__layout.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/check.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/_BuildPack.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/_GithubRepositories.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/_GitlabRepositories.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/buildpack.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/buildpack.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/deploykey.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/destination.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/destination.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/githubToken.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/repository.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/repository.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/source.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/source.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/configuration/sshkey.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/delete.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/deploy.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/index.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/index.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/logs/_Loading.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/logs/build/_BuildLog.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/logs/build/build.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/logs/build/index.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/logs/build/index.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/logs/index.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/logs/index.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/previews/index.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/previews/index.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/secrets/_Secret.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/secrets/index.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/secrets/index.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/settings.json.ts (85%)
 rename src/routes/{[lang] => }/applications/[id]/stop.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/storage/_Storage.svelte (100%)
 rename src/routes/{[lang] => }/applications/[id]/storage/index.json.ts (100%)
 rename src/routes/{[lang] => }/applications/[id]/storage/index.svelte (100%)
 rename src/routes/{[lang] => }/applications/_Application.svelte (96%)
 rename src/routes/{[lang] => }/applications/index.svelte (84%)
 rename src/routes/{[lang] => }/applications/index.ts (100%)
 rename src/routes/{[lang] => }/applications/new.ts (100%)
 rename src/routes/{[lang] => }/common/getUniqueName.json.ts (100%)
 rename src/routes/{[lang] => }/databases/[id]/_Databases/_CouchDb.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/_Databases/_Databases.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/_Databases/_MongoDB.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/_Databases/_MySQL.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/_Databases/_PostgreSQL.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/_Databases/_Redis.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/__layout.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/configuration/destination.json.ts (100%)
 rename src/routes/{[lang] => }/databases/[id]/configuration/destination.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/configuration/type.json.ts (100%)
 rename src/routes/{[lang] => }/databases/[id]/configuration/type.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/configuration/version.json.ts (100%)
 rename src/routes/{[lang] => }/databases/[id]/configuration/version.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/delete.json.ts (100%)
 rename src/routes/{[lang] => }/databases/[id]/index.json.ts (100%)
 rename src/routes/{[lang] => }/databases/[id]/index.svelte (100%)
 rename src/routes/{[lang] => }/databases/[id]/settings.json.ts (100%)
 rename src/routes/{[lang] => }/databases/[id]/start.json.ts (100%)
 rename src/routes/{[lang] => }/databases/[id]/stop.json.ts (100%)
 rename src/routes/{[lang] => }/databases/index.svelte (100%)
 rename src/routes/{[lang] => }/databases/index.ts (100%)
 rename src/routes/{[lang] => }/databases/new.ts (100%)
 rename src/routes/{[lang] => }/destinations/[id]/_FoundApp.svelte (100%)
 rename src/routes/{[lang] => }/destinations/[id]/_LocalDocker.svelte (100%)
 rename src/routes/{[lang] => }/destinations/[id]/_RemoteDocker.svelte (100%)
 rename src/routes/{[lang] => }/destinations/[id]/__layout.svelte (100%)
 rename src/routes/{[lang] => }/destinations/[id]/index.json.ts (100%)
 rename src/routes/{[lang] => }/destinations/[id]/index.svelte (100%)
 rename src/routes/{[lang] => }/destinations/[id]/restart.json.ts (100%)
 rename src/routes/{[lang] => }/destinations/[id]/scan.json.ts (100%)
 rename src/routes/{[lang] => }/destinations/[id]/settings.json.ts (100%)
 rename src/routes/{[lang] => }/destinations/[id]/start.json.ts (100%)
 rename src/routes/{[lang] => }/destinations/[id]/stop.json.ts (100%)
 rename src/routes/{[lang] => }/destinations/index.json.ts (100%)
 rename src/routes/{[lang] => }/destinations/index.svelte (100%)
 rename src/routes/{[lang] => }/login/index.json.ts (100%)
 rename src/routes/{[lang] => }/login/index.svelte (81%)
 rename src/routes/{[lang] => }/logout/index.json.ts (100%)
 rename src/routes/{[lang] => }/new/destination/_LocalDocker.svelte (100%)
 rename src/routes/{[lang] => }/new/destination/_RemoteDocker.svelte (100%)
 rename src/routes/{[lang] => }/new/destination/check.json.ts (100%)
 rename src/routes/{[lang] => }/new/destination/docker.json.ts (100%)
 rename src/routes/{[lang] => }/new/destination/index.svelte (100%)
 rename src/routes/{[lang] => }/new/source/_Github.svelte (100%)
 rename src/routes/{[lang] => }/new/source/_Gitlab.svelte (100%)
 rename src/routes/{[lang] => }/new/source/index.json.ts (100%)
 rename src/routes/{[lang] => }/new/source/index.svelte (100%)
 rename src/routes/{[lang] => }/new/team/index.json.ts (100%)
 rename src/routes/{[lang] => }/new/team/index.svelte (100%)
 rename src/routes/{[lang] => }/register/index.svelte (84%)
 rename src/routes/{[lang] => }/register/index.ts (100%)
 rename src/routes/{[lang] => }/reset/index.json.ts (91%)
 rename src/routes/{[lang] => }/reset/index.svelte (100%)
 rename src/routes/{[lang] => }/reset/password.json.ts (93%)
 rename src/routes/{[lang] => }/services/[id]/_Services/_Ghost.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/_Services/_MinIO.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/_Services/_PlausibleAnalytics.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/_Services/_Services.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/_Services/_VSCodeServer.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/_Services/_Wordpress.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/__layout.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/check.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/configuration/destination.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/configuration/destination.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/configuration/type.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/configuration/type.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/configuration/version.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/configuration/version.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/delete.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/ghost/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/ghost/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/ghost/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/index.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/languagetool/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/languagetool/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/languagetool/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/minio/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/minio/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/minio/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/n8n/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/n8n/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/n8n/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/nocodb/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/nocodb/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/nocodb/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/plausibleanalytics/activate.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/plausibleanalytics/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/plausibleanalytics/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/plausibleanalytics/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/secrets/_Secret.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/secrets/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/secrets/index.svelte (100%)
 rename src/routes/{[lang] => }/services/[id]/settings.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/uptimekuma/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/uptimekuma/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/uptimekuma/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/vaultwarden/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/vaultwarden/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/vaultwarden/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/vscodeserver/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/vscodeserver/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/vscodeserver/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/wordpress/index.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/wordpress/start.json.ts (100%)
 rename src/routes/{[lang] => }/services/[id]/wordpress/stop.json.ts (100%)
 rename src/routes/{[lang] => }/services/index.svelte (100%)
 rename src/routes/{[lang] => }/services/index.ts (100%)
 rename src/routes/{[lang] => }/services/new.ts (100%)
 rename src/routes/{[lang] => }/settings/check.json.ts (100%)
 rename src/routes/{[lang] => }/settings/index.json.ts (100%)
 rename src/routes/{[lang] => }/settings/index.svelte (100%)
 rename src/routes/{[lang] => }/sources/[id]/_Github.svelte (81%)
 rename src/routes/{[lang] => }/sources/[id]/_Gitlab.svelte (100%)
 rename src/routes/{[lang] => }/sources/[id]/__layout.svelte (82%)
 rename src/routes/{[lang] => }/sources/[id]/check.json.ts (100%)
 rename src/routes/{[lang] => }/sources/[id]/gitlab.json.ts (100%)
 rename src/routes/{[lang] => }/sources/[id]/index.json.ts (100%)
 rename src/routes/{[lang] => }/sources/[id]/index.svelte (100%)
 rename src/routes/{[lang] => }/sources/[id]/newGithubApp.svelte (100%)
 rename src/routes/{[lang] => }/sources/index.json.ts (100%)
 rename src/routes/{[lang] => }/sources/index.svelte (88%)
 rename src/routes/{[lang] => }/teams/[id]/__layout.svelte (100%)
 rename src/routes/{[lang] => }/teams/[id]/index.json.ts (100%)
 rename src/routes/{[lang] => }/teams/[id]/index.svelte (100%)
 rename src/routes/{[lang] => }/teams/[id]/invitation/accept.json.ts (100%)
 rename src/routes/{[lang] => }/teams/[id]/invitation/invite.json.ts (100%)
 rename src/routes/{[lang] => }/teams/[id]/invitation/revoke.json.ts (100%)
 rename src/routes/{[lang] => }/teams/[id]/permission/change.json.ts (100%)
 rename src/routes/{[lang] => }/teams/[id]/remove/user.json.ts (100%)
 rename src/routes/{[lang] => }/teams/index.json.ts (100%)
 rename src/routes/{[lang] => }/teams/index.svelte (100%)
 delete mode 100644 static/locales/fr.json

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 9a291b28c..1cc7be6e1 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,5 +1,7 @@
 {
-	"i18n-ally.localesPaths": ["static/locales"],
+	"i18n-ally.localesPaths": ["locales"],
 	"i18n-ally.keystyle": "nested",
-	"i18n-ally.extract.ignored": ["Coolify", "coolLabs logo"]
+	"i18n-ally.extract.ignoredByFiles": {
+		"src\\routes\\__layout.svelte": ["Coolify", "coolLabs logo"]
+	}
 }
diff --git a/package.json b/package.json
index 39696ce59..7a0a8e4bf 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
 		"prisma": "3.11.1",
 		"svelte": "3.46.4",
 		"svelte-check": "2.4.6",
+		"svelte-i18n": "^3.3.13",
 		"svelte-preprocess": "4.10.4",
 		"svelte-select": "^4.4.7",
 		"tailwindcss": "3.0.23",
@@ -81,7 +82,6 @@
 		"mustache": "^4.2.0",
 		"node-forge": "1.3.0",
 		"svelte-kit-cookie-session": "2.1.2",
-		"sveltekit-i18n": "^2.1.2",
 		"tailwindcss-scrollbar": "^0.1.0",
 		"unique-names-generator": "4.7.1"
 	},
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 2b7677e8d..e7594b347 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -46,10 +46,10 @@ specifiers:
   prisma: 3.11.1
   svelte: 3.46.4
   svelte-check: 2.4.6
+  svelte-i18n: ^3.3.13
   svelte-kit-cookie-session: 2.1.2
   svelte-preprocess: 4.10.4
   svelte-select: ^4.4.7
-  sveltekit-i18n: ^2.1.2
   tailwindcss: 3.0.23
   tailwindcss-scrollbar: ^0.1.0
   ts-node: 10.7.0
@@ -79,7 +79,6 @@ dependencies:
   mustache: 4.2.0
   node-forge: 1.3.0
   svelte-kit-cookie-session: 2.1.2
-  sveltekit-i18n: 2.1.2_svelte@3.46.4
   tailwindcss-scrollbar: 0.1.0_tailwindcss@3.0.23
   unique-names-generator: 4.7.1
 
@@ -109,6 +108,7 @@ devDependencies:
   prisma: 3.11.1
   svelte: 3.46.4
   svelte-check: 2.4.6_postcss@8.4.12+svelte@3.46.4
+  svelte-i18n: 3.3.13_svelte@3.46.4
   svelte-preprocess: 4.10.4_296873641a0ad9f42fe92172d27bcedd
   svelte-select: 4.4.7
   tailwindcss: 3.0.23_b89136460714832cdda11d1e9d57d1ff
@@ -184,6 +184,55 @@ packages:
       - supports-color
     dev: true
 
+  /@formatjs/ecma402-abstract/1.11.4:
+    resolution:
+      {
+        integrity: sha512-EBikYFp2JCdIfGEb5G9dyCkTGDmC57KSHhRQOC3aYxoPWVZvfWCDjZwkGYHN7Lis/fmuWl906bnNTJifDQ3sXw==
+      }
+    dependencies:
+      '@formatjs/intl-localematcher': 0.2.25
+      tslib: 2.3.1
+    dev: true
+
+  /@formatjs/fast-memoize/1.2.1:
+    resolution:
+      {
+        integrity: sha512-Rg0e76nomkz3vF9IPlKeV+Qynok0r7YZjL6syLz4/urSg0IbjPZCB/iYUMNsYA643gh4mgrX3T7KEIFIxJBQeg==
+      }
+    dependencies:
+      tslib: 2.3.1
+    dev: true
+
+  /@formatjs/icu-messageformat-parser/2.0.19:
+    resolution:
+      {
+        integrity: sha512-8HsLm9YLyVVIDMyBJb7wmve2wGd461cUwJ470eUog5YH5ZsF4p5lgvaJ+oGKxz1mrSMNNdDHU9v/NDsS+z+ilg==
+      }
+    dependencies:
+      '@formatjs/ecma402-abstract': 1.11.4
+      '@formatjs/icu-skeleton-parser': 1.3.6
+      tslib: 2.3.1
+    dev: true
+
+  /@formatjs/icu-skeleton-parser/1.3.6:
+    resolution:
+      {
+        integrity: sha512-I96mOxvml/YLrwU2Txnd4klA7V8fRhb6JG/4hm3VMNmeJo1F03IpV2L3wWt7EweqNLES59SZ4d6hVOPCSf80Bg==
+      }
+    dependencies:
+      '@formatjs/ecma402-abstract': 1.11.4
+      tslib: 2.3.1
+    dev: true
+
+  /@formatjs/intl-localematcher/0.2.25:
+    resolution:
+      {
+        integrity: sha512-YmLcX70BxoSopLFdLr1Ds99NdlTI2oWoLbaUW2M406lxOIPzE1KQhRz2fPUkq34xVZQaihCoU29h0KK7An3bhA==
+      }
+    dependencies:
+      tslib: 2.3.1
+    dev: true
+
   /@humanwhocodes/config-array/0.5.0:
     resolution:
       {
@@ -446,26 +495,6 @@ packages:
       - supports-color
     dev: true
 
-  /@sveltekit-i18n/base/1.1.1_svelte@3.46.4:
-    resolution:
-      {
-        integrity: sha512-J/sMU0OwS3dCLOuilHMBqu8vZHuuXiNV9vFJx8Nb4/b5BlR/KCZ4bCXI8wZR02GHeCOYKZxWus07CM1scxa/jw==
-      }
-    peerDependencies:
-      svelte: ^3.x
-    dependencies:
-      svelte: 3.46.4
-    optionalDependencies:
-      '@sveltekit-i18n/parser-default': 1.0.3
-    dev: false
-
-  /@sveltekit-i18n/parser-default/1.0.3:
-    resolution:
-      {
-        integrity: sha512-HheveklTjp3hxpYQhoHfyA6B4bQaUeSV5MQf2usIv/58UF2jY/YqhCAWj9bDBjufbuZc5pSz4BXvdX3WVT+viA==
-      }
-    dev: false
-
   /@szmarczak/http-timer/5.0.1:
     resolution:
       {
@@ -2225,6 +2254,14 @@ packages:
       }
     dev: true
 
+  /deepmerge/4.2.2:
+    resolution:
+      {
+        integrity: sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==
+      }
+    engines: { node: '>=0.10.0' }
+    dev: true
+
   /defer-to-connect/2.0.1:
     resolution:
       {
@@ -3425,6 +3462,18 @@ packages:
         integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
       }
 
+  /intl-messageformat/9.12.0:
+    resolution:
+      {
+        integrity: sha512-5Q9j21JreB1G27/CqMYsA+pvJ19JjHyhiTSeUuvZK9BCDJGHtOLgpUUcGM+GLHiUuoVMKVeeX1smamiVHQrSKQ==
+      }
+    dependencies:
+      '@formatjs/ecma402-abstract': 1.11.4
+      '@formatjs/fast-memoize': 1.2.1
+      '@formatjs/icu-messageformat-parser': 2.0.19
+      tslib: 2.3.1
+    dev: true
+
   /invariant/2.2.4:
     resolution:
       {
@@ -5194,6 +5243,24 @@ packages:
       svelte: 3.46.4
     dev: true
 
+  /svelte-i18n/3.3.13_svelte@3.46.4:
+    resolution:
+      {
+        integrity: sha512-RQM+ys4+Y9ztH//tX22H1UL2cniLNmIR+N4xmYygV6QpQ6EyQvloZiENRew8XrVzfvJ8HaE8NU6/yurLkl7z3g==
+      }
+    engines: { node: '>= 11.15.0' }
+    hasBin: true
+    peerDependencies:
+      svelte: ^3.25.1
+    dependencies:
+      deepmerge: 4.2.2
+      estree-walker: 2.0.2
+      intl-messageformat: 9.12.0
+      sade: 1.7.4
+      svelte: 3.46.4
+      tiny-glob: 0.2.9
+    dev: true
+
   /svelte-kit-cookie-session/2.1.2:
     resolution:
       {
@@ -5271,19 +5338,6 @@ packages:
     engines: { node: '>= 8' }
     dev: true
 
-  /sveltekit-i18n/2.1.2_svelte@3.46.4:
-    resolution:
-      {
-        integrity: sha512-s5YxcbNd2EWNZaZR1A4Drt8s53E4fpUkN4XIWd3VRpw1pihZVWssqmBW1qkjQ6AB0kiu1Qwule+vt1HkbQOjrg==
-      }
-    peerDependencies:
-      svelte: ^3.x
-    dependencies:
-      '@sveltekit-i18n/base': 1.1.1_svelte@3.46.4
-      '@sveltekit-i18n/parser-default': 1.0.3
-      svelte: 3.46.4
-    dev: false
-
   /table/6.7.2:
     resolution:
       {
diff --git a/src/hooks.ts b/src/hooks.ts
index 4a0fa2e87..d6c6eca6d 100644
--- a/src/hooks.ts
+++ b/src/hooks.ts
@@ -6,9 +6,6 @@ import { getUserDetails, sentry } from '$lib/common';
 import { version } from '$lib/common';
 import cookie from 'cookie';
 import { dev } from '$app/env';
-import { locales } from '$lib/translations';
-
-const routeRegex = new RegExp(/^\/[^.]*([?#].*)?$/);
 
 export const handle = handleSession(
 	{
@@ -65,45 +62,9 @@ export const handle = handleSession(
 					expires: new Date('Thu, 01 Jan 1970 00:00:01 GMT')
 				})
 			);
+		} finally {
+			return response;
 		}
-
-		const { url, request } = event;
-		const { pathname } = url;
-
-		// If this request is a route request
-		if (routeRegex.test(pathname)) {
-			// Get defined locales
-			const supportedLocales = locales.get();
-
-			// Try to get locale from `pathname`.
-			let locale = supportedLocales.find(
-				(l) => `${l}`.toLowerCase() === `${pathname.match(/[^/]+?(?=\/|$)/)}`.toLowerCase()
-			);
-
-			// If route locale is not supported
-			if (!locale) {
-				// Get user preferred locale
-				locale = `${`${request.headers['accept-language']}`.match(
-					/[a-zA-Z]+?(?=-|_|,|;)/
-				)}`.toLowerCase();
-
-				// Set default locale if user preferred locale does not match
-				if (!supportedLocales.includes(locale)) locale = 'en';
-
-				// 301 redirect
-				return new Response(undefined, {
-					headers: { location: `/${locale}${pathname}` },
-					status: 301
-				});
-			}
-
-			// Add html `lang` attribute
-			const body = await response.text();
-
-			return new Response(`${body}`.replace(/<html.*>/, `<html lang="${locale}">`), response);
-		}
-
-		return response;
 	}
 );
 
diff --git a/src/lib/form.ts b/src/lib/form.ts
index 94871a66e..08099576d 100644
--- a/src/lib/form.ts
+++ b/src/lib/form.ts
@@ -1,15 +1,10 @@
 import { toast } from '@zerodevx/svelte-toast';
-import { t } from '$lib/translations';
-
-let formatMessage;
-t.subscribe((storeFormat) => (formatMessage = storeFormat));
-
-export function errorNotification(message: string): void {
+export function errorNotification(message: string) {
 	console.error(message);
 	if (typeof message !== 'string') {
-		toast.push(formatMessage('error.generic_message'));
+		toast.push('Ooops, something is not okay, are you okay?');
 	} else {
-		toast.push(formatMessage(message));
+		toast.push(message);
 	}
 }
 export function enhance(
diff --git a/src/lib/lang.json b/src/lib/lang.json
deleted file mode 100644
index b01c522bb..000000000
--- a/src/lib/lang.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
-	"en": "English",
-	"fr": "Français"
-}
diff --git a/src/lib/settings.ts b/src/lib/settings.ts
index 437f1e415..211852c06 100644
--- a/src/lib/settings.ts
+++ b/src/lib/settings.ts
@@ -1,4 +1,4 @@
-const publicPaths = [
+export const publicPaths = [
 	'/login',
 	'/register',
 	'/reset',
@@ -8,7 +8,3 @@ const publicPaths = [
 	'/webhooks/github/install',
 	'/webhooks/gitlab'
 ];
-
-export function isPublicPath(path: string): boolean {
-	return publicPaths.includes(path);
-}
diff --git a/src/lib/translations.ts b/src/lib/translations.ts
deleted file mode 100644
index 299c8a75b..000000000
--- a/src/lib/translations.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import i18n from 'sveltekit-i18n';
-import lang from './lang.json';
-
-/** @type {import('sveltekit-i18n').Config} */
-export const config = {
-	fallbackLocale: 'en',
-	translations: {
-		en: { lang },
-		fr: { lang }
-	},
-	loaders: [
-		{
-			locale: 'en',
-			key: '',
-			loader: async () => (await import('../../static/locales/en.json')).default
-		},
-		{
-			locale: 'fr',
-			key: '',
-			loader: async () => (await import('../../static/locales/fr.json')).default
-		}
-	]
-};
-
-export const { t, loading, locales, locale, loadTranslations } = new i18n(config);
-loading.subscribe(($loading) => $loading && console.log('Loading translations...'));
diff --git a/src/routes/__error.svelte b/src/routes/__error.svelte
index 97ee15b01..67693e70a 100644
--- a/src/routes/__error.svelte
+++ b/src/routes/__error.svelte
@@ -12,17 +12,17 @@
 </script>
 
 <script>
-	import { t } from '$lib/translations';
+	import { _ } from 'svelte-i18n';
 	export let status;
 	export let error;
 </script>
 
 <div class="mx-auto flex h-screen flex-col items-center justify-center px-4">
 	<div class="pb-10 text-7xl font-bold">{status}</div>
-	<div class="text-3xl font-bold">{$t('error.oops_your_lost')}</div>
+	<div class="text-3xl font-bold">Ooops you are lost! But don't be afraid!</div>
 	<div class="text-xl">
-		{$t('error.you_can_find_your_way_back')}
-		<a href="/" class="font-bold uppercase text-sky-400">{$t('error.here')}</a>
+		{$_('error.you_can_find_your_way_back')}
+		<a href="/" class="font-bold uppercase text-sky-400">{$_('error.here')}</a>
 	</div>
 	<div class="py-10 text-xs font-bold">
 		<pre
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 1cc8f8198..bb2665238 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -1,15 +1,9 @@
 <script context="module" lang="ts">
 	import type { Load } from '@sveltejs/kit';
-	import { isPublicPath } from '$lib/settings';
-	import { locale, loadTranslations } from '$lib/translations';
+	import { publicPaths } from '$lib/settings';
 
 	export const load: Load = async ({ fetch, url, session }) => {
-		const { pathname } = url;
-		const lang = `${pathname.match(/[^/]+?(?=\/|$)/) || ''}`;
-		const route = pathname.replace(new RegExp(`^/${lang}`), '');
-		await loadTranslations(lang, route);
-
-		if (!session.userId && !isPublicPath(route)) {
+		if (!session.userId && !publicPaths.includes(url.pathname)) {
 			return {
 				status: 302,
 				redirect: '/login'
@@ -44,7 +38,18 @@
 	import { errorNotification } from '$lib/form';
 	import { asyncSleep } from '$lib/components/common';
 	import { del, get, post } from '$lib/api';
-	import { t } from '$lib/translations';
+	import { register, init, _, getLocaleFromNavigator } from 'svelte-i18n';
+
+	async function setup() {
+		register('en', () => import('../../static/locales/en.json'));
+
+		return await Promise.allSettled([
+			// TODO: add some more stuff you want to init ...
+			init({ initialLocale: getLocaleFromNavigator(), fallbackLocale: 'en' })
+		]);
+	}
+
+	const setupResult = setup();
 
 	let isUpdateAvailable = false;
 
@@ -54,7 +59,6 @@
 		success: null
 	};
 	let latestVersion = 'latest';
-
 	onMount(async () => {
 		if ($session.userId) {
 			const overrideVersion = browser && window.localStorage.getItem('latestVersion');
@@ -111,7 +115,7 @@
 				return window.location.reload();
 			} else {
 				await post(`/update.json`, { type: 'update', latestVersion });
-				toast.push(`${$t('layout.update_done')}<br><br>${$t('layout.wait_new_version_startup')}`);
+				toast.push(`${$_('layout.update_done')}<br><br>${$_('layout.wait_new_version_startup')}`);
 				let reachable = false;
 				let tries = 0;
 				do {
@@ -125,7 +129,7 @@
 					if (reachable) break;
 					tries++;
 				} while (!reachable || tries < 120);
-				toast.push($t('layout.new_version'));
+				toast.push($_('layout.new_version'));
 				updateStatus.loading = false;
 				updateStatus.success = true;
 				await asyncSleep(3000);
@@ -143,332 +147,22 @@
 	<title>Coolify</title>
 </svelte:head>
 
-<SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
-{#if $session.userId}
-	<nav class="nav-main">
-		<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
-			<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
-			<div class="flex flex-col space-y-4 py-2">
-				<a
-					sveltekit:prefetch
-					href="/"
-					class="icons tooltip-right bg-coolgray-200 hover:text-white"
-					class:text-white={$page.url.pathname === '/'}
-					class:bg-coolgray-500={$page.url.pathname === '/'}
-					data-tooltip={$t('dashboard')}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
-						/>
-						<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-
-				<a
-					sveltekit:prefetch
-					href="/applications"
-					class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
-					class:text-green-500={$page.url.pathname.startsWith('/applications') ||
-						$page.url.pathname.startsWith('/new/application')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
-						$page.url.pathname.startsWith('/new/application')}
-					data-tooltip={$t('index.applications')}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="4" y="4" width="6" height="6" rx="1" />
-						<rect x="4" y="14" width="6" height="6" rx="1" />
-						<rect x="14" y="14" width="6" height="6" rx="1" />
-						<line x1="14" y1="7" x2="20" y2="7" />
-						<line x1="17" y1="4" x2="17" y2="10" />
-					</svg>
-				</a>
-				<a
-					sveltekit:prefetch
-					href="/sources"
-					class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
-					class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
-						$page.url.pathname.startsWith('/new/source')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
-						$page.url.pathname.startsWith('/new/source')}
-					data-tooltip="Git Sources"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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" />
-						<circle cx="6" cy="6" r="2" />
-						<circle cx="18" cy="18" r="2" />
-						<path d="M11 6h5a2 2 0 0 1 2 2v8" />
-						<polyline points="14 9 11 6 14 3" />
-						<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
-						<polyline points="10 15 13 18 10 21" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/destinations"
-					class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
-					class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
-						$page.url.pathname.startsWith('/new/destination')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
-						$page.url.pathname.startsWith('/new/destination')}
-					data-tooltip="Destinations"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
-						/>
-						<path d="M5 10h3v3h-3z" />
-						<path d="M8 10h3v3h-3z" />
-						<path d="M11 10h3v3h-3z" />
-						<path d="M8 7h3v3h-3z" />
-						<path d="M11 7h3v3h-3z" />
-						<path d="M11 4h3v3h-3z" />
-						<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
-						<line x1="10" y1="16" x2="10" y2="16.01" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/databases"
-					class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
-					class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
-						$page.url.pathname.startsWith('/new/database')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
-						$page.url.pathname.startsWith('/new/database')}
-					data-tooltip="Databases"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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>
-				</a>
-				<div class="border-t border-stone-700" />
-				<a
-					sveltekit:prefetch
-					href="/services"
-					class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
-					class:text-pink-500={$page.url.pathname.startsWith('/services') ||
-						$page.url.pathname.startsWith('/new/service')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
-						$page.url.pathname.startsWith('/new/service')}
-					data-tooltip="Services"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
-					</svg>
-				</a>
-				<div class="border-t border-stone-700" />
-			</div>
-			<div class="flex-1" />
-
-			<div class="flex flex-col space-y-4 py-2">
-				{#if $session.teamId === '0'}
-					{#if isUpdateAvailable}
-						<button
-							disabled={updateStatus.success === false}
-							title={$t('layout.update_available')}
-							on:click={update}
-							class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
-						>
-							{#if updateStatus.loading}
-								<svg
-									xmlns="http://www.w3.org/2000/svg"
-									class="lds-heart h-9 w-8"
-									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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
-									/>
-								</svg>
-							{:else if updateStatus.success === null}
-								<svg
-									xmlns="http://www.w3.org/2000/svg"
-									class="w-8 h-9"
-									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" />
-									<circle cx="12" cy="12" r="9" />
-									<line x1="12" y1="8" x2="8" y2="12" />
-									<line x1="12" y1="8" x2="12" y2="16" />
-									<line x1="16" y1="12" x2="12" y2="8" />
-								</svg>
-							{:else if updateStatus.success}
-								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-									><path
-										fill="#DD2E44"
-										d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
-									/><path
-										fill="#EA596E"
-										d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
-									/><path
-										fill="#A0041E"
-										d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
-									/><path
-										fill="#AA8DD8"
-										d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
-									/><path
-										fill="#77B255"
-										d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
-									/><path
-										fill="#AA8DD8"
-										d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
-									/><path
-										fill="#77B255"
-										d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
-									/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
-										fill="#9266CC"
-										cx="2"
-										cy="18"
-										r="2"
-									/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
-										fill="#5C913B"
-										cx="23.5"
-										cy="31.5"
-										r="1.5"
-									/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
-										fill="#FFCC4D"
-										cx="32.5"
-										cy="8.5"
-										r="1.5"
-									/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
-										fill="#FFCC4D"
-										cx="7.5"
-										cy="23.5"
-										r="1.5"
-									/></svg
-								>
-							{:else}
-								<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
-									><path
-										fill="#FFCC4D"
-										d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
-									/><path
-										fill="#664500"
-										d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
-									/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
-										fill="#664500"
-										d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
-									/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
-										fill="#E75A70"
-										cx="18"
-										cy="27"
-										rx="3"
-										ry="2"
-									/></svg
-								>
-							{/if}
-						</button>
-					{/if}
-				{/if}
-			</div>
-			<div class="flex flex-col space-y-4 py-2">
-				<a
-					sveltekit:prefetch
-					href="/teams"
-					class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
-					class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
-					class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
-					data-tooltip="Teams"
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="h-8 w-8"
-						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" />
-						<circle cx="9" cy="7" r="4" />
-						<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
-						<path d="M16 3.13a4 4 0 0 1 0 7.75" />
-						<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
-					</svg>
-				</a>
-				{#if $session.teamId === '0'}
+{#await setupResult}
+	Please wait...
+{:then}
+	<SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
+	{#if $session.userId}
+		<nav class="nav-main">
+			<div class="flex h-screen w-full flex-col items-center transition-all duration-100">
+				<div class="my-4 h-10 w-10"><img src="/favicon.png" alt="coolLabs logo" /></div>
+				<div class="flex flex-col space-y-4 py-2">
 					<a
 						sveltekit:prefetch
-						href="/settings"
-						class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
-						class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
-						class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
-						data-tooltip="Settings"
+						href="/"
+						class="icons tooltip-right bg-coolgray-200 hover:text-white"
+						class:text-white={$page.url.pathname === '/'}
+						class:bg-coolgray-500={$page.url.pathname === '/'}
+						data-tooltip="Dashboard"
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -482,57 +176,373 @@
 						>
 							<path stroke="none" d="M0 0h24v24H0z" fill="none" />
 							<path
-								d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+								d="M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105"
 							/>
-							<circle cx="12" cy="12" r="3" />
+							<path d="M16 15c-2.21 1.333 -5.792 1.333 -8 0" />
 						</svg>
 					</a>
-				{/if}
-				<div
-					class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
-					data-tooltip="Logout"
-					on:click={logout}
-				>
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						class="ml-1 h-7 w-7"
-						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="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
-						/>
-						<path d="M7 12h14l-3 -3m0 6l3 -3" />
-					</svg>
-				</div>
-				<div
-					class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
-				>
+					<div class="border-t border-stone-700" />
+
 					<a
-						class="text-[10px] no-underline"
-						href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
-						target="_blank">v{$session.version}</a
+						sveltekit:prefetch
+						href="/applications"
+						class="icons tooltip-right bg-coolgray-200 hover:text-green-500"
+						class:text-green-500={$page.url.pathname.startsWith('/applications') ||
+							$page.url.pathname.startsWith('/new/application')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
+							$page.url.pathname.startsWith('/new/application')}
+						data-tooltip="Applications"
 					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="4" y="4" width="6" height="6" rx="1" />
+							<rect x="4" y="14" width="6" height="6" rx="1" />
+							<rect x="14" y="14" width="6" height="6" rx="1" />
+							<line x1="14" y1="7" x2="20" y2="7" />
+							<line x1="17" y1="4" x2="17" y2="10" />
+						</svg>
+					</a>
+					<a
+						sveltekit:prefetch
+						href="/sources"
+						class="icons tooltip-right bg-coolgray-200 hover:text-orange-500"
+						class:text-orange-500={$page.url.pathname.startsWith('/sources') ||
+							$page.url.pathname.startsWith('/new/source')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
+							$page.url.pathname.startsWith('/new/source')}
+						data-tooltip="Git Sources"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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" />
+							<circle cx="6" cy="6" r="2" />
+							<circle cx="18" cy="18" r="2" />
+							<path d="M11 6h5a2 2 0 0 1 2 2v8" />
+							<polyline points="14 9 11 6 14 3" />
+							<path d="M13 18h-5a2 2 0 0 1 -2 -2v-8" />
+							<polyline points="10 15 13 18 10 21" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/destinations"
+						class="icons tooltip-right bg-coolgray-200 hover:text-sky-500"
+						class:text-sky-500={$page.url.pathname.startsWith('/destinations') ||
+							$page.url.pathname.startsWith('/new/destination')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
+							$page.url.pathname.startsWith('/new/destination')}
+						data-tooltip="Destinations"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="M22 12.54c-1.804 -.345 -2.701 -1.08 -3.523 -2.94c-.487 .696 -1.102 1.568 -.92 2.4c.028 .238 -.32 1.002 -.557 1h-14c0 5.208 3.164 7 6.196 7c4.124 .022 7.828 -1.376 9.854 -5c1.146 -.101 2.296 -1.505 2.95 -2.46z"
+							/>
+							<path d="M5 10h3v3h-3z" />
+							<path d="M8 10h3v3h-3z" />
+							<path d="M11 10h3v3h-3z" />
+							<path d="M8 7h3v3h-3z" />
+							<path d="M11 7h3v3h-3z" />
+							<path d="M11 4h3v3h-3z" />
+							<path d="M4.571 18c1.5 0 2.047 -.074 2.958 -.78" />
+							<line x1="10" y1="16" x2="10" y2="16.01" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/databases"
+						class="icons tooltip-right bg-coolgray-200 hover:text-purple-500"
+						class:text-purple-500={$page.url.pathname.startsWith('/databases') ||
+							$page.url.pathname.startsWith('/new/database')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
+							$page.url.pathname.startsWith('/new/database')}
+						data-tooltip="Databases"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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>
+					</a>
+					<div class="border-t border-stone-700" />
+					<a
+						sveltekit:prefetch
+						href="/services"
+						class="icons tooltip-right bg-coolgray-200 hover:text-pink-500"
+						class:text-pink-500={$page.url.pathname.startsWith('/services') ||
+							$page.url.pathname.startsWith('/new/service')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
+							$page.url.pathname.startsWith('/new/service')}
+						data-tooltip="Services"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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="M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-12" />
+						</svg>
+					</a>
+					<div class="border-t border-stone-700" />
+				</div>
+				<div class="flex-1" />
+
+				<div class="flex flex-col space-y-4 py-2">
+					{#if $session.teamId === '0'}
+						{#if isUpdateAvailable}
+							<button
+								disabled={updateStatus.success === false}
+								title={$_('layout.update_available')}
+								on:click={update}
+								class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
+							>
+								{#if updateStatus.loading}
+									<svg
+										xmlns="http://www.w3.org/2000/svg"
+										class="lds-heart h-9 w-8"
+										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="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"
+										/>
+									</svg>
+								{:else if updateStatus.success === null}
+									<svg
+										xmlns="http://www.w3.org/2000/svg"
+										class="w-8 h-9"
+										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" />
+										<circle cx="12" cy="12" r="9" />
+										<line x1="12" y1="8" x2="8" y2="12" />
+										<line x1="12" y1="8" x2="12" y2="16" />
+										<line x1="16" y1="12" x2="12" y2="8" />
+									</svg>
+								{:else if updateStatus.success}
+									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+										><path
+											fill="#DD2E44"
+											d="M11.626 7.488c-.112.112-.197.247-.268.395l-.008-.008L.134 33.141l.011.011c-.208.403.14 1.223.853 1.937.713.713 1.533 1.061 1.936.853l.01.01L28.21 24.735l-.008-.009c.147-.07.282-.155.395-.269 1.562-1.562-.971-6.627-5.656-11.313-4.687-4.686-9.752-7.218-11.315-5.656z"
+										/><path
+											fill="#EA596E"
+											d="M13 12L.416 32.506l-.282.635.011.011c-.208.403.14 1.223.853 1.937.232.232.473.408.709.557L17 17l-4-5z"
+										/><path
+											fill="#A0041E"
+											d="M23.012 13.066c4.67 4.672 7.263 9.652 5.789 11.124-1.473 1.474-6.453-1.118-11.126-5.788-4.671-4.672-7.263-9.654-5.79-11.127 1.474-1.473 6.454 1.119 11.127 5.791z"
+										/><path
+											fill="#AA8DD8"
+											d="M18.59 13.609c-.199.161-.459.245-.734.215-.868-.094-1.598-.396-2.109-.873-.541-.505-.808-1.183-.735-1.862.128-1.192 1.324-2.286 3.363-2.066.793.085 1.147-.17 1.159-.292.014-.121-.277-.446-1.07-.532-.868-.094-1.598-.396-2.11-.873-.541-.505-.809-1.183-.735-1.862.13-1.192 1.325-2.286 3.362-2.065.578.062.883-.057 1.012-.134.103-.063.144-.123.148-.158.012-.121-.275-.446-1.07-.532-.549-.06-.947-.552-.886-1.102.059-.549.55-.946 1.101-.886 2.037.219 2.973 1.542 2.844 2.735-.13 1.194-1.325 2.286-3.364 2.067-.578-.063-.88.057-1.01.134-.103.062-.145.123-.149.157-.013.122.276.446 1.071.532 2.037.22 2.973 1.542 2.844 2.735-.129 1.192-1.324 2.286-3.362 2.065-.578-.062-.882.058-1.012.134-.104.064-.144.124-.148.158-.013.121.276.446 1.07.532.548.06.947.553.886 1.102-.028.274-.167.511-.366.671z"
+										/><path
+											fill="#77B255"
+											d="M30.661 22.857c1.973-.557 3.334.323 3.658 1.478.324 1.154-.378 2.615-2.35 3.17-.77.216-1.001.584-.97.701.034.118.425.312 1.193.095 1.972-.555 3.333.325 3.657 1.479.326 1.155-.378 2.614-2.351 3.17-.769.216-1.001.585-.967.702.033.117.423.311 1.192.095.53-.149 1.084.16 1.233.691.148.532-.161 1.084-.693 1.234-1.971.555-3.333-.323-3.659-1.479-.324-1.154.379-2.613 2.353-3.169.77-.217 1.001-.584.967-.702-.032-.117-.422-.312-1.19-.096-1.974.556-3.334-.322-3.659-1.479-.325-1.154.378-2.613 2.351-3.17.768-.215.999-.585.967-.701-.034-.118-.423-.312-1.192-.096-.532.15-1.083-.16-1.233-.691-.149-.53.161-1.082.693-1.232z"
+										/><path
+											fill="#AA8DD8"
+											d="M23.001 20.16c-.294 0-.584-.129-.782-.375-.345-.432-.274-1.061.156-1.406.218-.175 5.418-4.259 12.767-3.208.547.078.927.584.849 1.131-.078.546-.58.93-1.132.848-6.493-.922-11.187 2.754-11.233 2.791-.186.148-.406.219-.625.219z"
+										/><path
+											fill="#77B255"
+											d="M5.754 16c-.095 0-.192-.014-.288-.042-.529-.159-.829-.716-.67-1.245 1.133-3.773 2.16-9.794.898-11.364-.141-.178-.354-.353-.842-.316-.938.072-.849 2.051-.848 2.071.042.551-.372 1.031-.922 1.072-.559.034-1.031-.372-1.072-.923-.103-1.379.326-4.035 2.692-4.214 1.056-.08 1.933.287 2.552 1.057 2.371 2.951-.036 11.506-.542 13.192-.13.433-.528.712-.958.712z"
+										/><circle fill="#5C913B" cx="25.5" cy="9.5" r="1.5" /><circle
+											fill="#9266CC"
+											cx="2"
+											cy="18"
+											r="2"
+										/><circle fill="#5C913B" cx="32.5" cy="19.5" r="1.5" /><circle
+											fill="#5C913B"
+											cx="23.5"
+											cy="31.5"
+											r="1.5"
+										/><circle fill="#FFCC4D" cx="28" cy="4" r="2" /><circle
+											fill="#FFCC4D"
+											cx="32.5"
+											cy="8.5"
+											r="1.5"
+										/><circle fill="#FFCC4D" cx="29.5" cy="12.5" r="1.5" /><circle
+											fill="#FFCC4D"
+											cx="7.5"
+											cy="23.5"
+											r="1.5"
+										/></svg
+									>
+								{:else}
+									<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" class="w-8 h-9"
+										><path
+											fill="#FFCC4D"
+											d="M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18 8.059 0 18 0s18 8.059 18 18"
+										/><path
+											fill="#664500"
+											d="M22 27c0 2.763-1.791 3-4 3-2.21 0-4-.237-4-3 0-2.761 1.79-6 4-6 2.209 0 4 3.239 4 6zm8-12c-.124 0-.25-.023-.371-.072-5.229-2.091-7.372-5.241-7.461-5.374-.307-.46-.183-1.081.277-1.387.459-.306 1.077-.184 1.385.274.019.027 1.93 2.785 6.541 4.629.513.206.763.787.558 1.3-.157.392-.533.63-.929.63zM6 15c-.397 0-.772-.238-.929-.629-.205-.513.044-1.095.557-1.3 4.612-1.844 6.523-4.602 6.542-4.629.308-.456.929-.577 1.387-.27.457.308.581.925.275 1.383-.089.133-2.232 3.283-7.46 5.374C6.25 14.977 6.124 15 6 15z"
+										/><path fill="#5DADEC" d="M24 16h4v19l-4-.046V16zM8 35l4-.046V16H8v19z" /><path
+											fill="#664500"
+											d="M14.999 18c-.15 0-.303-.034-.446-.105-3.512-1.756-7.07-.018-7.105 0-.495.249-1.095.046-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.498-2.197 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552zm14 0c-.15 0-.303-.034-.446-.105-3.513-1.756-7.07-.018-7.105 0-.494.248-1.094.047-1.342-.447-.247-.494-.047-1.095.447-1.342.182-.09 4.501-2.196 8.895 0 .494.247.694.848.447 1.342-.176.35-.529.552-.896.552z"
+										/><ellipse fill="#5DADEC" cx="18" cy="34" rx="18" ry="2" /><ellipse
+											fill="#E75A70"
+											cx="18"
+											cy="27"
+											rx="3"
+											ry="2"
+										/></svg
+									>
+								{/if}
+							</button>
+						{/if}
+					{/if}
+				</div>
+				<div class="flex flex-col space-y-4 py-2">
+					<a
+						sveltekit:prefetch
+						href="/teams"
+						class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
+						class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
+						class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
+						data-tooltip="Teams"
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="h-8 w-8"
+							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" />
+							<circle cx="9" cy="7" r="4" />
+							<path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" />
+							<path d="M16 3.13a4 4 0 0 1 0 7.75" />
+							<path d="M21 21v-2a4 4 0 0 0 -3 -3.85" />
+						</svg>
+					</a>
+					{#if $session.teamId === '0'}
+						<a
+							sveltekit:prefetch
+							href="/settings"
+							class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
+							class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
+							class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
+							data-tooltip="Settings"
+						>
+							<svg
+								xmlns="http://www.w3.org/2000/svg"
+								class="h-8 w-8"
+								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="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+								/>
+								<circle cx="12" cy="12" r="3" />
+							</svg>
+						</a>
+					{/if}
+					<div
+						class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
+						data-tooltip="Logout"
+						on:click={logout}
+					>
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							class="ml-1 h-7 w-7"
+							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="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"
+							/>
+							<path d="M7 12h14l-3 -3m0 6l3 -3" />
+						</svg>
+					</div>
+					<div
+						class="w-full text-center font-bold text-stone-400 hover:bg-coolgray-200 hover:text-white"
+					>
+						<a
+							class="text-[10px] no-underline"
+							href={`https://github.com/coollabsio/coolify/releases/tag/v${$session.version}`}
+							target="_blank">v{$session.version}</a
+						>
+					</div>
 				</div>
 			</div>
-		</div>
-	</nav>
-	<select
-		class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
-		bind:value={selectedTeamId}
-		on:change={switchTeam}
-	>
-		<option value="" disabled selected>{$t('layout.switch_to_a_different_team')}</option>
-		{#each teams as team}
-			<option value={team.teamId}>{team.team.name} - {team.permission}</option>
-		{/each}
-	</select>
-{/if}
-<main>
-	<slot />
-</main>
+		</nav>
+		<select
+			class="fixed right-0 bottom-0 z-50 m-2 w-64 bg-opacity-30 p-2 px-4"
+			bind:value={selectedTeamId}
+			on:change={switchTeam}
+		>
+			<option value="" disabled selected>{$_('layout.switch_to_a_different_team')}</option>
+			{#each teams as team}
+				<option value={team.teamId}>{team.team.name} - {team.permission}</option>
+			{/each}
+		</select>
+	{/if}
+	<main>
+		<slot />
+	</main>
+{:catch error}
+	<p style="color: red">{error.message}</p>
+{/await}
diff --git a/src/routes/[lang]/applications/[id]/__layout.svelte b/src/routes/applications/[id]/__layout.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/__layout.svelte
rename to src/routes/applications/[id]/__layout.svelte
diff --git a/src/routes/[lang]/applications/[id]/check.json.ts b/src/routes/applications/[id]/check.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/check.json.ts
rename to src/routes/applications/[id]/check.json.ts
diff --git a/src/routes/[lang]/applications/[id]/configuration/_BuildPack.svelte b/src/routes/applications/[id]/configuration/_BuildPack.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/_BuildPack.svelte
rename to src/routes/applications/[id]/configuration/_BuildPack.svelte
diff --git a/src/routes/[lang]/applications/[id]/configuration/_GithubRepositories.svelte b/src/routes/applications/[id]/configuration/_GithubRepositories.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/_GithubRepositories.svelte
rename to src/routes/applications/[id]/configuration/_GithubRepositories.svelte
diff --git a/src/routes/[lang]/applications/[id]/configuration/_GitlabRepositories.svelte b/src/routes/applications/[id]/configuration/_GitlabRepositories.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/_GitlabRepositories.svelte
rename to src/routes/applications/[id]/configuration/_GitlabRepositories.svelte
diff --git a/src/routes/[lang]/applications/[id]/configuration/buildpack.json.ts b/src/routes/applications/[id]/configuration/buildpack.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/buildpack.json.ts
rename to src/routes/applications/[id]/configuration/buildpack.json.ts
diff --git a/src/routes/[lang]/applications/[id]/configuration/buildpack.svelte b/src/routes/applications/[id]/configuration/buildpack.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/buildpack.svelte
rename to src/routes/applications/[id]/configuration/buildpack.svelte
diff --git a/src/routes/[lang]/applications/[id]/configuration/deploykey.json.ts b/src/routes/applications/[id]/configuration/deploykey.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/deploykey.json.ts
rename to src/routes/applications/[id]/configuration/deploykey.json.ts
diff --git a/src/routes/[lang]/applications/[id]/configuration/destination.json.ts b/src/routes/applications/[id]/configuration/destination.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/destination.json.ts
rename to src/routes/applications/[id]/configuration/destination.json.ts
diff --git a/src/routes/[lang]/applications/[id]/configuration/destination.svelte b/src/routes/applications/[id]/configuration/destination.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/destination.svelte
rename to src/routes/applications/[id]/configuration/destination.svelte
diff --git a/src/routes/[lang]/applications/[id]/configuration/githubToken.json.ts b/src/routes/applications/[id]/configuration/githubToken.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/githubToken.json.ts
rename to src/routes/applications/[id]/configuration/githubToken.json.ts
diff --git a/src/routes/[lang]/applications/[id]/configuration/repository.json.ts b/src/routes/applications/[id]/configuration/repository.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/repository.json.ts
rename to src/routes/applications/[id]/configuration/repository.json.ts
diff --git a/src/routes/[lang]/applications/[id]/configuration/repository.svelte b/src/routes/applications/[id]/configuration/repository.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/repository.svelte
rename to src/routes/applications/[id]/configuration/repository.svelte
diff --git a/src/routes/[lang]/applications/[id]/configuration/source.json.ts b/src/routes/applications/[id]/configuration/source.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/source.json.ts
rename to src/routes/applications/[id]/configuration/source.json.ts
diff --git a/src/routes/[lang]/applications/[id]/configuration/source.svelte b/src/routes/applications/[id]/configuration/source.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/source.svelte
rename to src/routes/applications/[id]/configuration/source.svelte
diff --git a/src/routes/[lang]/applications/[id]/configuration/sshkey.json.ts b/src/routes/applications/[id]/configuration/sshkey.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/configuration/sshkey.json.ts
rename to src/routes/applications/[id]/configuration/sshkey.json.ts
diff --git a/src/routes/[lang]/applications/[id]/delete.json.ts b/src/routes/applications/[id]/delete.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/delete.json.ts
rename to src/routes/applications/[id]/delete.json.ts
diff --git a/src/routes/[lang]/applications/[id]/deploy.json.ts b/src/routes/applications/[id]/deploy.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/deploy.json.ts
rename to src/routes/applications/[id]/deploy.json.ts
diff --git a/src/routes/[lang]/applications/[id]/index.json.ts b/src/routes/applications/[id]/index.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/index.json.ts
rename to src/routes/applications/[id]/index.json.ts
diff --git a/src/routes/[lang]/applications/[id]/index.svelte b/src/routes/applications/[id]/index.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/index.svelte
rename to src/routes/applications/[id]/index.svelte
diff --git a/src/routes/[lang]/applications/[id]/logs/_Loading.svelte b/src/routes/applications/[id]/logs/_Loading.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/logs/_Loading.svelte
rename to src/routes/applications/[id]/logs/_Loading.svelte
diff --git a/src/routes/[lang]/applications/[id]/logs/build/_BuildLog.svelte b/src/routes/applications/[id]/logs/build/_BuildLog.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/logs/build/_BuildLog.svelte
rename to src/routes/applications/[id]/logs/build/_BuildLog.svelte
diff --git a/src/routes/[lang]/applications/[id]/logs/build/build.json.ts b/src/routes/applications/[id]/logs/build/build.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/logs/build/build.json.ts
rename to src/routes/applications/[id]/logs/build/build.json.ts
diff --git a/src/routes/[lang]/applications/[id]/logs/build/index.json.ts b/src/routes/applications/[id]/logs/build/index.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/logs/build/index.json.ts
rename to src/routes/applications/[id]/logs/build/index.json.ts
diff --git a/src/routes/[lang]/applications/[id]/logs/build/index.svelte b/src/routes/applications/[id]/logs/build/index.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/logs/build/index.svelte
rename to src/routes/applications/[id]/logs/build/index.svelte
diff --git a/src/routes/[lang]/applications/[id]/logs/index.json.ts b/src/routes/applications/[id]/logs/index.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/logs/index.json.ts
rename to src/routes/applications/[id]/logs/index.json.ts
diff --git a/src/routes/[lang]/applications/[id]/logs/index.svelte b/src/routes/applications/[id]/logs/index.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/logs/index.svelte
rename to src/routes/applications/[id]/logs/index.svelte
diff --git a/src/routes/[lang]/applications/[id]/previews/index.json.ts b/src/routes/applications/[id]/previews/index.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/previews/index.json.ts
rename to src/routes/applications/[id]/previews/index.json.ts
diff --git a/src/routes/[lang]/applications/[id]/previews/index.svelte b/src/routes/applications/[id]/previews/index.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/previews/index.svelte
rename to src/routes/applications/[id]/previews/index.svelte
diff --git a/src/routes/[lang]/applications/[id]/secrets/_Secret.svelte b/src/routes/applications/[id]/secrets/_Secret.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/secrets/_Secret.svelte
rename to src/routes/applications/[id]/secrets/_Secret.svelte
diff --git a/src/routes/[lang]/applications/[id]/secrets/index.json.ts b/src/routes/applications/[id]/secrets/index.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/secrets/index.json.ts
rename to src/routes/applications/[id]/secrets/index.json.ts
diff --git a/src/routes/[lang]/applications/[id]/secrets/index.svelte b/src/routes/applications/[id]/secrets/index.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/secrets/index.svelte
rename to src/routes/applications/[id]/secrets/index.svelte
diff --git a/src/routes/[lang]/applications/[id]/settings.json.ts b/src/routes/applications/[id]/settings.json.ts
similarity index 85%
rename from src/routes/[lang]/applications/[id]/settings.json.ts
rename to src/routes/applications/[id]/settings.json.ts
index 222eff807..aea78ff96 100644
--- a/src/routes/[lang]/applications/[id]/settings.json.ts
+++ b/src/routes/applications/[id]/settings.json.ts
@@ -2,7 +2,6 @@ import { getUserDetails } from '$lib/common';
 import * as db from '$lib/database';
 import { ErrorHandler } from '$lib/database';
 import type { RequestHandler } from '@sveltejs/kit';
-import { _ } from 'svelte-i18n';
 
 export const post: RequestHandler = async (event) => {
 	const { teamId, status, body } = await getUserDetails(event);
@@ -15,7 +14,8 @@ export const post: RequestHandler = async (event) => {
 		const isDouble = await db.checkDoubleBranch(branch, projectId);
 		if (isDouble && autodeploy) {
 			throw {
-				message: $_('application.app.error_double_app_for_one_branch')
+				message:
+					'Cannot activate automatic deployments until only one application is defined for this repository / branch.'
 			};
 		}
 		await db.setApplicationSettings({ id, debug, previews, dualCerts, autodeploy });
diff --git a/src/routes/[lang]/applications/[id]/stop.json.ts b/src/routes/applications/[id]/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/stop.json.ts
rename to src/routes/applications/[id]/stop.json.ts
diff --git a/src/routes/[lang]/applications/[id]/storage/_Storage.svelte b/src/routes/applications/[id]/storage/_Storage.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/storage/_Storage.svelte
rename to src/routes/applications/[id]/storage/_Storage.svelte
diff --git a/src/routes/[lang]/applications/[id]/storage/index.json.ts b/src/routes/applications/[id]/storage/index.json.ts
similarity index 100%
rename from src/routes/[lang]/applications/[id]/storage/index.json.ts
rename to src/routes/applications/[id]/storage/index.json.ts
diff --git a/src/routes/[lang]/applications/[id]/storage/index.svelte b/src/routes/applications/[id]/storage/index.svelte
similarity index 100%
rename from src/routes/[lang]/applications/[id]/storage/index.svelte
rename to src/routes/applications/[id]/storage/index.svelte
diff --git a/src/routes/[lang]/applications/_Application.svelte b/src/routes/applications/_Application.svelte
similarity index 96%
rename from src/routes/[lang]/applications/_Application.svelte
rename to src/routes/applications/_Application.svelte
index 910c8e0c4..16d19a42f 100644
--- a/src/routes/[lang]/applications/_Application.svelte
+++ b/src/routes/applications/_Application.svelte
@@ -15,7 +15,6 @@
 	import Docker from '$lib/components/svg/applications/Docker.svelte';
 	import Astro from '$lib/components/svg/applications/Astro.svelte';
 	import Eleventy from '$lib/components/svg/applications/Eleventy.svelte';
-	import { t } from '$lib/translations';
 
 	const buildPack = application?.buildPack?.toLowerCase();
 </script>
@@ -60,7 +59,7 @@
 		{/if}
 		{#if !application.gitSourceId || !application.destinationDockerId}
 			<div class="truncate text-center font-bold text-red-500 group-hover:text-white">
-				{$t('application.configuration_missing')}
+				Configuration missing
 			</div>
 		{/if}
 	</div>
diff --git a/src/routes/[lang]/applications/index.svelte b/src/routes/applications/index.svelte
similarity index 84%
rename from src/routes/[lang]/applications/index.svelte
rename to src/routes/applications/index.svelte
index d559fd7b9..5f6056ac5 100644
--- a/src/routes/[lang]/applications/index.svelte
+++ b/src/routes/applications/index.svelte
@@ -4,7 +4,6 @@
 	import Application from './_Application.svelte';
 	import { post } from '$lib/api';
 	import { goto } from '$app/navigation';
-	import { t } from '$lib/translations';
 	async function newApplication() {
 		const { id } = await post('/applications/new', {});
 		return await goto(`/applications/${id}`, { replaceState: true });
@@ -12,7 +11,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl ">{$t('index.applications')}</div>
+	<div class="mr-4 text-2xl ">Applications</div>
 	{#if $session.isAdmin}
 		<div on:click={newApplication} class="add-icon cursor-pointer bg-green-600 hover:bg-green-500">
 			<svg
@@ -34,7 +33,7 @@
 <div class="flex flex-wrap justify-center">
 	{#if !applications || applications.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">{$t('application.no_applications_found')}</div>
+			<div class="text-center text-xl font-bold">No applications found</div>
 		</div>
 	{:else}
 		{#each applications as application}
diff --git a/src/routes/[lang]/applications/index.ts b/src/routes/applications/index.ts
similarity index 100%
rename from src/routes/[lang]/applications/index.ts
rename to src/routes/applications/index.ts
diff --git a/src/routes/[lang]/applications/new.ts b/src/routes/applications/new.ts
similarity index 100%
rename from src/routes/[lang]/applications/new.ts
rename to src/routes/applications/new.ts
diff --git a/src/routes/[lang]/common/getUniqueName.json.ts b/src/routes/common/getUniqueName.json.ts
similarity index 100%
rename from src/routes/[lang]/common/getUniqueName.json.ts
rename to src/routes/common/getUniqueName.json.ts
diff --git a/src/routes/[lang]/databases/[id]/_Databases/_CouchDb.svelte b/src/routes/databases/[id]/_Databases/_CouchDb.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/_Databases/_CouchDb.svelte
rename to src/routes/databases/[id]/_Databases/_CouchDb.svelte
diff --git a/src/routes/[lang]/databases/[id]/_Databases/_Databases.svelte b/src/routes/databases/[id]/_Databases/_Databases.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/_Databases/_Databases.svelte
rename to src/routes/databases/[id]/_Databases/_Databases.svelte
diff --git a/src/routes/[lang]/databases/[id]/_Databases/_MongoDB.svelte b/src/routes/databases/[id]/_Databases/_MongoDB.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/_Databases/_MongoDB.svelte
rename to src/routes/databases/[id]/_Databases/_MongoDB.svelte
diff --git a/src/routes/[lang]/databases/[id]/_Databases/_MySQL.svelte b/src/routes/databases/[id]/_Databases/_MySQL.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/_Databases/_MySQL.svelte
rename to src/routes/databases/[id]/_Databases/_MySQL.svelte
diff --git a/src/routes/[lang]/databases/[id]/_Databases/_PostgreSQL.svelte b/src/routes/databases/[id]/_Databases/_PostgreSQL.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/_Databases/_PostgreSQL.svelte
rename to src/routes/databases/[id]/_Databases/_PostgreSQL.svelte
diff --git a/src/routes/[lang]/databases/[id]/_Databases/_Redis.svelte b/src/routes/databases/[id]/_Databases/_Redis.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/_Databases/_Redis.svelte
rename to src/routes/databases/[id]/_Databases/_Redis.svelte
diff --git a/src/routes/[lang]/databases/[id]/__layout.svelte b/src/routes/databases/[id]/__layout.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/__layout.svelte
rename to src/routes/databases/[id]/__layout.svelte
diff --git a/src/routes/[lang]/databases/[id]/configuration/destination.json.ts b/src/routes/databases/[id]/configuration/destination.json.ts
similarity index 100%
rename from src/routes/[lang]/databases/[id]/configuration/destination.json.ts
rename to src/routes/databases/[id]/configuration/destination.json.ts
diff --git a/src/routes/[lang]/databases/[id]/configuration/destination.svelte b/src/routes/databases/[id]/configuration/destination.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/configuration/destination.svelte
rename to src/routes/databases/[id]/configuration/destination.svelte
diff --git a/src/routes/[lang]/databases/[id]/configuration/type.json.ts b/src/routes/databases/[id]/configuration/type.json.ts
similarity index 100%
rename from src/routes/[lang]/databases/[id]/configuration/type.json.ts
rename to src/routes/databases/[id]/configuration/type.json.ts
diff --git a/src/routes/[lang]/databases/[id]/configuration/type.svelte b/src/routes/databases/[id]/configuration/type.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/configuration/type.svelte
rename to src/routes/databases/[id]/configuration/type.svelte
diff --git a/src/routes/[lang]/databases/[id]/configuration/version.json.ts b/src/routes/databases/[id]/configuration/version.json.ts
similarity index 100%
rename from src/routes/[lang]/databases/[id]/configuration/version.json.ts
rename to src/routes/databases/[id]/configuration/version.json.ts
diff --git a/src/routes/[lang]/databases/[id]/configuration/version.svelte b/src/routes/databases/[id]/configuration/version.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/configuration/version.svelte
rename to src/routes/databases/[id]/configuration/version.svelte
diff --git a/src/routes/[lang]/databases/[id]/delete.json.ts b/src/routes/databases/[id]/delete.json.ts
similarity index 100%
rename from src/routes/[lang]/databases/[id]/delete.json.ts
rename to src/routes/databases/[id]/delete.json.ts
diff --git a/src/routes/[lang]/databases/[id]/index.json.ts b/src/routes/databases/[id]/index.json.ts
similarity index 100%
rename from src/routes/[lang]/databases/[id]/index.json.ts
rename to src/routes/databases/[id]/index.json.ts
diff --git a/src/routes/[lang]/databases/[id]/index.svelte b/src/routes/databases/[id]/index.svelte
similarity index 100%
rename from src/routes/[lang]/databases/[id]/index.svelte
rename to src/routes/databases/[id]/index.svelte
diff --git a/src/routes/[lang]/databases/[id]/settings.json.ts b/src/routes/databases/[id]/settings.json.ts
similarity index 100%
rename from src/routes/[lang]/databases/[id]/settings.json.ts
rename to src/routes/databases/[id]/settings.json.ts
diff --git a/src/routes/[lang]/databases/[id]/start.json.ts b/src/routes/databases/[id]/start.json.ts
similarity index 100%
rename from src/routes/[lang]/databases/[id]/start.json.ts
rename to src/routes/databases/[id]/start.json.ts
diff --git a/src/routes/[lang]/databases/[id]/stop.json.ts b/src/routes/databases/[id]/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/databases/[id]/stop.json.ts
rename to src/routes/databases/[id]/stop.json.ts
diff --git a/src/routes/[lang]/databases/index.svelte b/src/routes/databases/index.svelte
similarity index 100%
rename from src/routes/[lang]/databases/index.svelte
rename to src/routes/databases/index.svelte
diff --git a/src/routes/[lang]/databases/index.ts b/src/routes/databases/index.ts
similarity index 100%
rename from src/routes/[lang]/databases/index.ts
rename to src/routes/databases/index.ts
diff --git a/src/routes/[lang]/databases/new.ts b/src/routes/databases/new.ts
similarity index 100%
rename from src/routes/[lang]/databases/new.ts
rename to src/routes/databases/new.ts
diff --git a/src/routes/[lang]/destinations/[id]/_FoundApp.svelte b/src/routes/destinations/[id]/_FoundApp.svelte
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/_FoundApp.svelte
rename to src/routes/destinations/[id]/_FoundApp.svelte
diff --git a/src/routes/[lang]/destinations/[id]/_LocalDocker.svelte b/src/routes/destinations/[id]/_LocalDocker.svelte
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/_LocalDocker.svelte
rename to src/routes/destinations/[id]/_LocalDocker.svelte
diff --git a/src/routes/[lang]/destinations/[id]/_RemoteDocker.svelte b/src/routes/destinations/[id]/_RemoteDocker.svelte
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/_RemoteDocker.svelte
rename to src/routes/destinations/[id]/_RemoteDocker.svelte
diff --git a/src/routes/[lang]/destinations/[id]/__layout.svelte b/src/routes/destinations/[id]/__layout.svelte
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/__layout.svelte
rename to src/routes/destinations/[id]/__layout.svelte
diff --git a/src/routes/[lang]/destinations/[id]/index.json.ts b/src/routes/destinations/[id]/index.json.ts
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/index.json.ts
rename to src/routes/destinations/[id]/index.json.ts
diff --git a/src/routes/[lang]/destinations/[id]/index.svelte b/src/routes/destinations/[id]/index.svelte
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/index.svelte
rename to src/routes/destinations/[id]/index.svelte
diff --git a/src/routes/[lang]/destinations/[id]/restart.json.ts b/src/routes/destinations/[id]/restart.json.ts
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/restart.json.ts
rename to src/routes/destinations/[id]/restart.json.ts
diff --git a/src/routes/[lang]/destinations/[id]/scan.json.ts b/src/routes/destinations/[id]/scan.json.ts
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/scan.json.ts
rename to src/routes/destinations/[id]/scan.json.ts
diff --git a/src/routes/[lang]/destinations/[id]/settings.json.ts b/src/routes/destinations/[id]/settings.json.ts
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/settings.json.ts
rename to src/routes/destinations/[id]/settings.json.ts
diff --git a/src/routes/[lang]/destinations/[id]/start.json.ts b/src/routes/destinations/[id]/start.json.ts
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/start.json.ts
rename to src/routes/destinations/[id]/start.json.ts
diff --git a/src/routes/[lang]/destinations/[id]/stop.json.ts b/src/routes/destinations/[id]/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/destinations/[id]/stop.json.ts
rename to src/routes/destinations/[id]/stop.json.ts
diff --git a/src/routes/[lang]/destinations/index.json.ts b/src/routes/destinations/index.json.ts
similarity index 100%
rename from src/routes/[lang]/destinations/index.json.ts
rename to src/routes/destinations/index.json.ts
diff --git a/src/routes/[lang]/destinations/index.svelte b/src/routes/destinations/index.svelte
similarity index 100%
rename from src/routes/[lang]/destinations/index.svelte
rename to src/routes/destinations/index.svelte
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index e67e7d64d..1a5f61b4b 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -1,6 +1,5 @@
 <script context="module" lang="ts">
 	import type { Load } from '@sveltejs/kit';
-	import { t } from '$lib/translations';
 	export const load: Load = async ({ fetch, session }) => {
 		const url = `/dashboard.json`;
 		const res = await fetch(url);
@@ -30,7 +29,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">{$t('dashboard')}</div>
+	<div class="mr-4 text-2xl tracking-tight">Dashboard</div>
 </div>
 
 <div class="mt-10 pb-12 tracking-tight sm:pb-16">
@@ -45,7 +44,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-green-500 no-underline transition duration-150 hover:bg-green-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							{$t('index.applications')}
+							Applications
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{applicationsCount}
@@ -57,7 +56,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-sky-500 no-underline transition duration-150 hover:bg-sky-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							{$t('index.destinations')}
+							Destinations
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{destinationsCount}
@@ -69,7 +68,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-orange-500 no-underline transition duration-150 hover:bg-orange-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							{$t('index.git_sources')}
+							Git Sources
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{sourcesCount}
@@ -80,9 +79,7 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-purple-500 no-underline transition duration-150 hover:bg-purple-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							{$t('index.databases')}
-						</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Databases</dt>
 						<dd class="order-1 text-5xl font-extrabold ">{databasesCount}</dd>
 					</a>
 					<a
@@ -90,9 +87,7 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-pink-500 no-underline transition duration-150 hover:bg-pink-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							{$t('index.services')}
-						</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Services</dt>
 						<dd class="order-1 text-5xl font-extrabold ">{servicesCount}</dd>
 					</a>
 
@@ -101,9 +96,7 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-cyan-500 no-underline transition duration-150 hover:bg-cyan-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							{$t('index.teams')}
-						</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Teams</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{teamsCount}
 						</dd>
diff --git a/src/routes/[lang]/login/index.json.ts b/src/routes/login/index.json.ts
similarity index 100%
rename from src/routes/[lang]/login/index.json.ts
rename to src/routes/login/index.json.ts
diff --git a/src/routes/[lang]/login/index.svelte b/src/routes/login/index.svelte
similarity index 81%
rename from src/routes/[lang]/login/index.svelte
rename to src/routes/login/index.svelte
index dccbc90c9..b321bc086 100644
--- a/src/routes/[lang]/login/index.svelte
+++ b/src/routes/login/index.svelte
@@ -5,8 +5,6 @@
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
 	import { onMount } from 'svelte';
-	import { t } from '$lib/translations';
-
 	let loading = false;
 	let emailEl;
 	let email, password;
@@ -41,7 +39,7 @@
 
 <div class="flex h-screen flex-col items-center justify-center">
 	{#if $session.userId}
-		<div class="flex justify-center px-4 text-xl font-bold">{$t('login.already_logged_in')}</div>
+		<div class="flex justify-center px-4 text-xl font-bold">Already logged in...</div>
 	{:else}
 		<div class="flex justify-center px-4">
 			<form on:submit|preventDefault={handleSubmit} class="flex flex-col py-4 space-y-2">
@@ -50,7 +48,7 @@
 				<input
 					type="email"
 					name="email"
-					placeholder={$t('forms.email')}
+					placeholder="Email"
 					autocomplete="off"
 					required
 					bind:this={emailEl}
@@ -59,7 +57,7 @@
 				<input
 					type="password"
 					name="password"
-					placeholder={$t('forms.password')}
+					placeholder="Password"
 					bind:value={password}
 					required
 				/>
@@ -71,19 +69,16 @@
 						class="hover:opacity-90 text-white"
 						class:bg-transparent={loading}
 						class:text-stone-600={loading}
-						class:bg-coollabs={!loading}
-						>{loading ? $t('login.authenticating') : $t('login.login')}</button
+						class:bg-coollabs={!loading}>{loading ? 'Authenticating...' : 'Login'}</button
 					>
 
 					<button
 						on:click|preventDefault={() => goto('/register')}
-						class="bg-transparent hover:bg-coolgray-300	text-white "
-						>{$t('register.register')}</button
+						class="bg-transparent hover:bg-coolgray-300	text-white ">Register</button
 					>
 					<button
 						class="bg-transparent hover:bg-coolgray-300"
-						on:click|preventDefault={() => goto('/reset')}
-						>{$t('reset_password.reset_password')}</button
+						on:click|preventDefault={() => goto('/reset')}>Reset password</button
 					>
 				</div>
 			</form>
diff --git a/src/routes/[lang]/logout/index.json.ts b/src/routes/logout/index.json.ts
similarity index 100%
rename from src/routes/[lang]/logout/index.json.ts
rename to src/routes/logout/index.json.ts
diff --git a/src/routes/[lang]/new/destination/_LocalDocker.svelte b/src/routes/new/destination/_LocalDocker.svelte
similarity index 100%
rename from src/routes/[lang]/new/destination/_LocalDocker.svelte
rename to src/routes/new/destination/_LocalDocker.svelte
diff --git a/src/routes/[lang]/new/destination/_RemoteDocker.svelte b/src/routes/new/destination/_RemoteDocker.svelte
similarity index 100%
rename from src/routes/[lang]/new/destination/_RemoteDocker.svelte
rename to src/routes/new/destination/_RemoteDocker.svelte
diff --git a/src/routes/[lang]/new/destination/check.json.ts b/src/routes/new/destination/check.json.ts
similarity index 100%
rename from src/routes/[lang]/new/destination/check.json.ts
rename to src/routes/new/destination/check.json.ts
diff --git a/src/routes/[lang]/new/destination/docker.json.ts b/src/routes/new/destination/docker.json.ts
similarity index 100%
rename from src/routes/[lang]/new/destination/docker.json.ts
rename to src/routes/new/destination/docker.json.ts
diff --git a/src/routes/[lang]/new/destination/index.svelte b/src/routes/new/destination/index.svelte
similarity index 100%
rename from src/routes/[lang]/new/destination/index.svelte
rename to src/routes/new/destination/index.svelte
diff --git a/src/routes/[lang]/new/source/_Github.svelte b/src/routes/new/source/_Github.svelte
similarity index 100%
rename from src/routes/[lang]/new/source/_Github.svelte
rename to src/routes/new/source/_Github.svelte
diff --git a/src/routes/[lang]/new/source/_Gitlab.svelte b/src/routes/new/source/_Gitlab.svelte
similarity index 100%
rename from src/routes/[lang]/new/source/_Gitlab.svelte
rename to src/routes/new/source/_Gitlab.svelte
diff --git a/src/routes/[lang]/new/source/index.json.ts b/src/routes/new/source/index.json.ts
similarity index 100%
rename from src/routes/[lang]/new/source/index.json.ts
rename to src/routes/new/source/index.json.ts
diff --git a/src/routes/[lang]/new/source/index.svelte b/src/routes/new/source/index.svelte
similarity index 100%
rename from src/routes/[lang]/new/source/index.svelte
rename to src/routes/new/source/index.svelte
diff --git a/src/routes/[lang]/new/team/index.json.ts b/src/routes/new/team/index.json.ts
similarity index 100%
rename from src/routes/[lang]/new/team/index.json.ts
rename to src/routes/new/team/index.json.ts
diff --git a/src/routes/[lang]/new/team/index.svelte b/src/routes/new/team/index.svelte
similarity index 100%
rename from src/routes/[lang]/new/team/index.svelte
rename to src/routes/new/team/index.svelte
diff --git a/src/routes/[lang]/register/index.svelte b/src/routes/register/index.svelte
similarity index 84%
rename from src/routes/[lang]/register/index.svelte
rename to src/routes/register/index.svelte
index ee4e0a61e..35501fce2 100644
--- a/src/routes/[lang]/register/index.svelte
+++ b/src/routes/register/index.svelte
@@ -7,7 +7,6 @@
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
 	import { onMount } from 'svelte';
-	import { t } from '$lib/translations';
 
 	let loading = false;
 	let emailEl;
@@ -21,7 +20,7 @@
 	});
 	async function handleSubmit() {
 		if (password !== passwordCheck) {
-			return errorNotification($t('register.passwords_do_not_match'));
+			return errorNotification('Passwords do not match.');
 		}
 		loading = true;
 		try {
@@ -58,7 +57,7 @@
 </div>
 <div class="flex h-screen flex-col items-center justify-center">
 	{#if $session.userId}
-		<div class="flex justify-center px-4 text-xl font-bold">{$t('login.already_logged_in')}</div>
+		<div class="flex justify-center px-4 text-xl font-bold">Already logged in...</div>
 	{:else}
 		<div class="flex justify-center px-4">
 			<form on:submit|preventDefault={handleSubmit} class="flex flex-col py-4 space-y-2">
@@ -67,7 +66,7 @@
 				<input
 					type="email"
 					name="email"
-					placeholder={$t('forms.email')}
+					placeholder="Email"
 					autocomplete="off"
 					required
 					bind:this={emailEl}
@@ -76,28 +75,28 @@
 				<input
 					type="password"
 					name="password"
-					placeholder={$t('forms.password')}
+					placeholder="Password"
 					bind:value={password}
 					required
 				/>
 				<input
 					type="password"
 					name="passwordCheck"
-					placeholder={$t('forms.password_again')}
+					placeholder="Password again"
 					bind:value={passwordCheck}
 					required
 				/>
 
 				<div class="flex space-x-2 h-8 items-center justify-center pt-8">
 					<button type="submit" class="hover:bg-coollabs-100 text-white bg-coollabs"
-						>{$t('register.register')}</button
+						>Register</button
 					>
 				</div>
 			</form>
 		</div>
 		{#if userCount === 0}
 			<div class="pt-5">
-				{$t('register.register_first_user')}
+				You are registering the first user. It will be the administrator of your Coolify instance.
 			</div>
 		{/if}
 	{/if}
diff --git a/src/routes/[lang]/register/index.ts b/src/routes/register/index.ts
similarity index 100%
rename from src/routes/[lang]/register/index.ts
rename to src/routes/register/index.ts
diff --git a/src/routes/[lang]/reset/index.json.ts b/src/routes/reset/index.json.ts
similarity index 91%
rename from src/routes/[lang]/reset/index.json.ts
rename to src/routes/reset/index.json.ts
index 21e403509..a75ea4766 100644
--- a/src/routes/[lang]/reset/index.json.ts
+++ b/src/routes/reset/index.json.ts
@@ -16,7 +16,7 @@ export const post: RequestHandler = async (event) => {
 		return {
 			status: 500,
 			body: {
-				error: 'reset_password.invalid_secret_key'
+				error: 'Invalid secret key.'
 			}
 		};
 	}
diff --git a/src/routes/[lang]/reset/index.svelte b/src/routes/reset/index.svelte
similarity index 100%
rename from src/routes/[lang]/reset/index.svelte
rename to src/routes/reset/index.svelte
diff --git a/src/routes/[lang]/reset/password.json.ts b/src/routes/reset/password.json.ts
similarity index 93%
rename from src/routes/[lang]/reset/password.json.ts
rename to src/routes/reset/password.json.ts
index 9856349b3..28e9d56e3 100644
--- a/src/routes/[lang]/reset/password.json.ts
+++ b/src/routes/reset/password.json.ts
@@ -8,7 +8,7 @@ export const post: RequestHandler = async (event) => {
 		return {
 			status: 500,
 			body: {
-				error: 'reset_password.invalid_secret_key'
+				error: 'Invalid secret key.'
 			}
 		};
 	}
diff --git a/src/routes/[lang]/services/[id]/_Services/_Ghost.svelte b/src/routes/services/[id]/_Services/_Ghost.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/_Services/_Ghost.svelte
rename to src/routes/services/[id]/_Services/_Ghost.svelte
diff --git a/src/routes/[lang]/services/[id]/_Services/_MinIO.svelte b/src/routes/services/[id]/_Services/_MinIO.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/_Services/_MinIO.svelte
rename to src/routes/services/[id]/_Services/_MinIO.svelte
diff --git a/src/routes/[lang]/services/[id]/_Services/_PlausibleAnalytics.svelte b/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/_Services/_PlausibleAnalytics.svelte
rename to src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
diff --git a/src/routes/[lang]/services/[id]/_Services/_Services.svelte b/src/routes/services/[id]/_Services/_Services.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/_Services/_Services.svelte
rename to src/routes/services/[id]/_Services/_Services.svelte
diff --git a/src/routes/[lang]/services/[id]/_Services/_VSCodeServer.svelte b/src/routes/services/[id]/_Services/_VSCodeServer.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/_Services/_VSCodeServer.svelte
rename to src/routes/services/[id]/_Services/_VSCodeServer.svelte
diff --git a/src/routes/[lang]/services/[id]/_Services/_Wordpress.svelte b/src/routes/services/[id]/_Services/_Wordpress.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/_Services/_Wordpress.svelte
rename to src/routes/services/[id]/_Services/_Wordpress.svelte
diff --git a/src/routes/[lang]/services/[id]/__layout.svelte b/src/routes/services/[id]/__layout.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/__layout.svelte
rename to src/routes/services/[id]/__layout.svelte
diff --git a/src/routes/[lang]/services/[id]/check.json.ts b/src/routes/services/[id]/check.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/check.json.ts
rename to src/routes/services/[id]/check.json.ts
diff --git a/src/routes/[lang]/services/[id]/configuration/destination.json.ts b/src/routes/services/[id]/configuration/destination.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/configuration/destination.json.ts
rename to src/routes/services/[id]/configuration/destination.json.ts
diff --git a/src/routes/[lang]/services/[id]/configuration/destination.svelte b/src/routes/services/[id]/configuration/destination.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/configuration/destination.svelte
rename to src/routes/services/[id]/configuration/destination.svelte
diff --git a/src/routes/[lang]/services/[id]/configuration/type.json.ts b/src/routes/services/[id]/configuration/type.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/configuration/type.json.ts
rename to src/routes/services/[id]/configuration/type.json.ts
diff --git a/src/routes/[lang]/services/[id]/configuration/type.svelte b/src/routes/services/[id]/configuration/type.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/configuration/type.svelte
rename to src/routes/services/[id]/configuration/type.svelte
diff --git a/src/routes/[lang]/services/[id]/configuration/version.json.ts b/src/routes/services/[id]/configuration/version.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/configuration/version.json.ts
rename to src/routes/services/[id]/configuration/version.json.ts
diff --git a/src/routes/[lang]/services/[id]/configuration/version.svelte b/src/routes/services/[id]/configuration/version.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/configuration/version.svelte
rename to src/routes/services/[id]/configuration/version.svelte
diff --git a/src/routes/[lang]/services/[id]/delete.json.ts b/src/routes/services/[id]/delete.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/delete.json.ts
rename to src/routes/services/[id]/delete.json.ts
diff --git a/src/routes/[lang]/services/[id]/ghost/index.json.ts b/src/routes/services/[id]/ghost/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/ghost/index.json.ts
rename to src/routes/services/[id]/ghost/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/ghost/start.json.ts b/src/routes/services/[id]/ghost/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/ghost/start.json.ts
rename to src/routes/services/[id]/ghost/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/ghost/stop.json.ts b/src/routes/services/[id]/ghost/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/ghost/stop.json.ts
rename to src/routes/services/[id]/ghost/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/index.json.ts b/src/routes/services/[id]/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/index.json.ts
rename to src/routes/services/[id]/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/index.svelte b/src/routes/services/[id]/index.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/index.svelte
rename to src/routes/services/[id]/index.svelte
diff --git a/src/routes/[lang]/services/[id]/languagetool/index.json.ts b/src/routes/services/[id]/languagetool/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/languagetool/index.json.ts
rename to src/routes/services/[id]/languagetool/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/languagetool/start.json.ts b/src/routes/services/[id]/languagetool/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/languagetool/start.json.ts
rename to src/routes/services/[id]/languagetool/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/languagetool/stop.json.ts b/src/routes/services/[id]/languagetool/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/languagetool/stop.json.ts
rename to src/routes/services/[id]/languagetool/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/minio/index.json.ts b/src/routes/services/[id]/minio/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/minio/index.json.ts
rename to src/routes/services/[id]/minio/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/minio/start.json.ts b/src/routes/services/[id]/minio/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/minio/start.json.ts
rename to src/routes/services/[id]/minio/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/minio/stop.json.ts b/src/routes/services/[id]/minio/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/minio/stop.json.ts
rename to src/routes/services/[id]/minio/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/n8n/index.json.ts b/src/routes/services/[id]/n8n/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/n8n/index.json.ts
rename to src/routes/services/[id]/n8n/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/n8n/start.json.ts b/src/routes/services/[id]/n8n/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/n8n/start.json.ts
rename to src/routes/services/[id]/n8n/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/n8n/stop.json.ts b/src/routes/services/[id]/n8n/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/n8n/stop.json.ts
rename to src/routes/services/[id]/n8n/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/nocodb/index.json.ts b/src/routes/services/[id]/nocodb/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/nocodb/index.json.ts
rename to src/routes/services/[id]/nocodb/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/nocodb/start.json.ts b/src/routes/services/[id]/nocodb/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/nocodb/start.json.ts
rename to src/routes/services/[id]/nocodb/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/nocodb/stop.json.ts b/src/routes/services/[id]/nocodb/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/nocodb/stop.json.ts
rename to src/routes/services/[id]/nocodb/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/plausibleanalytics/activate.json.ts b/src/routes/services/[id]/plausibleanalytics/activate.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/plausibleanalytics/activate.json.ts
rename to src/routes/services/[id]/plausibleanalytics/activate.json.ts
diff --git a/src/routes/[lang]/services/[id]/plausibleanalytics/index.json.ts b/src/routes/services/[id]/plausibleanalytics/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/plausibleanalytics/index.json.ts
rename to src/routes/services/[id]/plausibleanalytics/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/plausibleanalytics/start.json.ts b/src/routes/services/[id]/plausibleanalytics/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/plausibleanalytics/start.json.ts
rename to src/routes/services/[id]/plausibleanalytics/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/plausibleanalytics/stop.json.ts b/src/routes/services/[id]/plausibleanalytics/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/plausibleanalytics/stop.json.ts
rename to src/routes/services/[id]/plausibleanalytics/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/secrets/_Secret.svelte b/src/routes/services/[id]/secrets/_Secret.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/secrets/_Secret.svelte
rename to src/routes/services/[id]/secrets/_Secret.svelte
diff --git a/src/routes/[lang]/services/[id]/secrets/index.json.ts b/src/routes/services/[id]/secrets/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/secrets/index.json.ts
rename to src/routes/services/[id]/secrets/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/secrets/index.svelte b/src/routes/services/[id]/secrets/index.svelte
similarity index 100%
rename from src/routes/[lang]/services/[id]/secrets/index.svelte
rename to src/routes/services/[id]/secrets/index.svelte
diff --git a/src/routes/[lang]/services/[id]/settings.json.ts b/src/routes/services/[id]/settings.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/settings.json.ts
rename to src/routes/services/[id]/settings.json.ts
diff --git a/src/routes/[lang]/services/[id]/uptimekuma/index.json.ts b/src/routes/services/[id]/uptimekuma/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/uptimekuma/index.json.ts
rename to src/routes/services/[id]/uptimekuma/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/uptimekuma/start.json.ts b/src/routes/services/[id]/uptimekuma/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/uptimekuma/start.json.ts
rename to src/routes/services/[id]/uptimekuma/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/uptimekuma/stop.json.ts b/src/routes/services/[id]/uptimekuma/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/uptimekuma/stop.json.ts
rename to src/routes/services/[id]/uptimekuma/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/vaultwarden/index.json.ts b/src/routes/services/[id]/vaultwarden/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/vaultwarden/index.json.ts
rename to src/routes/services/[id]/vaultwarden/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/vaultwarden/start.json.ts b/src/routes/services/[id]/vaultwarden/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/vaultwarden/start.json.ts
rename to src/routes/services/[id]/vaultwarden/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/vaultwarden/stop.json.ts b/src/routes/services/[id]/vaultwarden/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/vaultwarden/stop.json.ts
rename to src/routes/services/[id]/vaultwarden/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/vscodeserver/index.json.ts b/src/routes/services/[id]/vscodeserver/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/vscodeserver/index.json.ts
rename to src/routes/services/[id]/vscodeserver/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/vscodeserver/start.json.ts b/src/routes/services/[id]/vscodeserver/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/vscodeserver/start.json.ts
rename to src/routes/services/[id]/vscodeserver/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/vscodeserver/stop.json.ts b/src/routes/services/[id]/vscodeserver/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/vscodeserver/stop.json.ts
rename to src/routes/services/[id]/vscodeserver/stop.json.ts
diff --git a/src/routes/[lang]/services/[id]/wordpress/index.json.ts b/src/routes/services/[id]/wordpress/index.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/wordpress/index.json.ts
rename to src/routes/services/[id]/wordpress/index.json.ts
diff --git a/src/routes/[lang]/services/[id]/wordpress/start.json.ts b/src/routes/services/[id]/wordpress/start.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/wordpress/start.json.ts
rename to src/routes/services/[id]/wordpress/start.json.ts
diff --git a/src/routes/[lang]/services/[id]/wordpress/stop.json.ts b/src/routes/services/[id]/wordpress/stop.json.ts
similarity index 100%
rename from src/routes/[lang]/services/[id]/wordpress/stop.json.ts
rename to src/routes/services/[id]/wordpress/stop.json.ts
diff --git a/src/routes/[lang]/services/index.svelte b/src/routes/services/index.svelte
similarity index 100%
rename from src/routes/[lang]/services/index.svelte
rename to src/routes/services/index.svelte
diff --git a/src/routes/[lang]/services/index.ts b/src/routes/services/index.ts
similarity index 100%
rename from src/routes/[lang]/services/index.ts
rename to src/routes/services/index.ts
diff --git a/src/routes/[lang]/services/new.ts b/src/routes/services/new.ts
similarity index 100%
rename from src/routes/[lang]/services/new.ts
rename to src/routes/services/new.ts
diff --git a/src/routes/[lang]/settings/check.json.ts b/src/routes/settings/check.json.ts
similarity index 100%
rename from src/routes/[lang]/settings/check.json.ts
rename to src/routes/settings/check.json.ts
diff --git a/src/routes/[lang]/settings/index.json.ts b/src/routes/settings/index.json.ts
similarity index 100%
rename from src/routes/[lang]/settings/index.json.ts
rename to src/routes/settings/index.json.ts
diff --git a/src/routes/[lang]/settings/index.svelte b/src/routes/settings/index.svelte
similarity index 100%
rename from src/routes/[lang]/settings/index.svelte
rename to src/routes/settings/index.svelte
diff --git a/src/routes/[lang]/sources/[id]/_Github.svelte b/src/routes/sources/[id]/_Github.svelte
similarity index 81%
rename from src/routes/[lang]/sources/[id]/_Github.svelte
rename to src/routes/sources/[id]/_Github.svelte
index e3243fc76..102971353 100644
--- a/src/routes/[lang]/sources/[id]/_Github.svelte
+++ b/src/routes/sources/[id]/_Github.svelte
@@ -3,7 +3,6 @@
 	import { page, session } from '$app/stores';
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
-	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	let loading = false;
@@ -44,7 +43,7 @@
 		const top = screen.height / 2 - 618 / 2;
 		const newWindow = open(
 			`/sources/${id}/newGithubApp`,
-			$t('sources.source.new_github_app'),
+			'New Github App',
 			'resizable=1, scrollbars=1, fullscreen=0, height=618, width=1020,top=' +
 				top +
 				', left=' +
@@ -61,32 +60,30 @@
 </script>
 
 {#if !source.githubAppId}
-	<button on:click={newGithubApp}>{$t('sources.source.create_new_github_app')}</button>
+	<button on:click={newGithubApp}>Create new GitHub App</button>
 {:else if source.githubApp?.installationId}
 	<form on:submit|preventDefault={handleSubmit} class="py-4">
 		<div class="flex space-x-1 pb-5 font-bold">
-			<div class="title">{$t('general')}</div>
+			<div class="title">General</div>
 			{#if $session.isAdmin}
 				<button
 					type="submit"
 					class:bg-orange-600={!loading}
 					class:hover:bg-orange-500={!loading}
-					disabled={loading}>{loading ? $t('saving') : $t('save')}</button
+					disabled={loading}>{loading ? 'Saving...' : 'Save'}</button
 				>
 				<button on:click|preventDefault={() => installRepositories(source)}
-					>{$t('sources.source.change_app_settings', { values: { name: 'Github' } })}</button
+					>Change GitHub App Settings</button
 				>
 			{/if}
 		</div>
 		<div class="grid grid-flow-row gap-2 px-10">
 			<div class="grid grid-cols-2 items-center mt-2">
-				<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
+				<label for="name" class="text-base font-bold text-stone-100">Name</label>
 				<input name="name" id="name" required bind:value={source.name} />
 			</div>
 		</div>
 	</form>
 {:else}
-	<button on:click={() => installRepositories(source)}
-		>{$t('sources.source.install_repositories')}</button
-	>
+	<button on:click={() => installRepositories(source)}>Install Repositories</button>
 {/if}
diff --git a/src/routes/[lang]/sources/[id]/_Gitlab.svelte b/src/routes/sources/[id]/_Gitlab.svelte
similarity index 100%
rename from src/routes/[lang]/sources/[id]/_Gitlab.svelte
rename to src/routes/sources/[id]/_Gitlab.svelte
diff --git a/src/routes/[lang]/sources/[id]/__layout.svelte b/src/routes/sources/[id]/__layout.svelte
similarity index 82%
rename from src/routes/[lang]/sources/[id]/__layout.svelte
rename to src/routes/sources/[id]/__layout.svelte
index accaa7c06..0f5139558 100644
--- a/src/routes/[lang]/sources/[id]/__layout.svelte
+++ b/src/routes/sources/[id]/__layout.svelte
@@ -34,11 +34,10 @@
 	import { page, session } from '$app/stores';
 	import { errorNotification } from '$lib/form';
 	import DeleteIcon from '$lib/components/DeleteIcon.svelte';
-	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	async function deleteSource(name) {
-		const sure = confirm(`${$t('sources.source.sure_to_delete')} '${name}'?`);
+		const sure = confirm(`Are you sure you would like to delete '${name}'?`);
 		if (sure) {
 			const response = await fetch(`/sources/${id}.json`, {
 				method: 'delete'
@@ -56,14 +55,14 @@
 <nav class="nav-side">
 	<button
 		on:click={() => deleteSource(source.name)}
-		title={$t('sources.source.delete_git_source')}
+		title="Delete Git Source"
 		type="submit"
 		disabled={!$session.isAdmin}
 		class:hover:text-red-500={$session.isAdmin}
 		class="icons tooltip-bottom bg-transparent text-sm"
 		data-tooltip={$session.isAdmin
-			? $t('sources.source.delete_git_source')
-			: $t('sources.source.permission_denied_delete_git_source')}><DeleteIcon /></button
+			? 'Delete Git Source'
+			: 'You do not have permission to delete a Git Source'}><DeleteIcon /></button
 	>
 </nav>
 <slot />
diff --git a/src/routes/[lang]/sources/[id]/check.json.ts b/src/routes/sources/[id]/check.json.ts
similarity index 100%
rename from src/routes/[lang]/sources/[id]/check.json.ts
rename to src/routes/sources/[id]/check.json.ts
diff --git a/src/routes/[lang]/sources/[id]/gitlab.json.ts b/src/routes/sources/[id]/gitlab.json.ts
similarity index 100%
rename from src/routes/[lang]/sources/[id]/gitlab.json.ts
rename to src/routes/sources/[id]/gitlab.json.ts
diff --git a/src/routes/[lang]/sources/[id]/index.json.ts b/src/routes/sources/[id]/index.json.ts
similarity index 100%
rename from src/routes/[lang]/sources/[id]/index.json.ts
rename to src/routes/sources/[id]/index.json.ts
diff --git a/src/routes/[lang]/sources/[id]/index.svelte b/src/routes/sources/[id]/index.svelte
similarity index 100%
rename from src/routes/[lang]/sources/[id]/index.svelte
rename to src/routes/sources/[id]/index.svelte
diff --git a/src/routes/[lang]/sources/[id]/newGithubApp.svelte b/src/routes/sources/[id]/newGithubApp.svelte
similarity index 100%
rename from src/routes/[lang]/sources/[id]/newGithubApp.svelte
rename to src/routes/sources/[id]/newGithubApp.svelte
diff --git a/src/routes/[lang]/sources/index.json.ts b/src/routes/sources/index.json.ts
similarity index 100%
rename from src/routes/[lang]/sources/index.json.ts
rename to src/routes/sources/index.json.ts
diff --git a/src/routes/[lang]/sources/index.svelte b/src/routes/sources/index.svelte
similarity index 88%
rename from src/routes/[lang]/sources/index.svelte
rename to src/routes/sources/index.svelte
index 4823c1e64..bd9039514 100644
--- a/src/routes/[lang]/sources/index.svelte
+++ b/src/routes/sources/index.svelte
@@ -22,11 +22,10 @@
 <script lang="ts">
 	export let sources;
 	import { session } from '$app/stores';
-	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">{$t('index.git_sources')}</div>
+	<div class="mr-4 text-2xl tracking-tight">Git Sources</div>
 	{#if $session.isAdmin}
 		<a href="/new/source" sveltekit:prefetch class="add-icon bg-orange-600 hover:bg-orange-500">
 			<svg
@@ -48,7 +47,7 @@
 <div class="flex justify-center">
 	{#if !sources || sources.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">{$t('sources.no_git_sources_found')}</div>
+			<div class="text-center text-xl font-bold">No git sources found</div>
 		</div>
 	{:else}
 		<div class="flex flex-wrap justify-center">
@@ -63,7 +62,7 @@
 						<div class="font-bold text-xl text-center truncate">{source.name}</div>
 						{#if (source.type === 'gitlab' && !source.gitlabAppId) || (source.type === 'github' && !source.githubAppId && !source.githubApp?.installationId)}
 							<div class="font-bold text-center truncate text-red-500 group-hover:text-white">
-								{$t('application.configuration_missing')}
+								Configuration missing
 							</div>
 						{:else}
 							<div class="truncate text-center">{source.htmlUrl}</div>
diff --git a/src/routes/[lang]/teams/[id]/__layout.svelte b/src/routes/teams/[id]/__layout.svelte
similarity index 100%
rename from src/routes/[lang]/teams/[id]/__layout.svelte
rename to src/routes/teams/[id]/__layout.svelte
diff --git a/src/routes/[lang]/teams/[id]/index.json.ts b/src/routes/teams/[id]/index.json.ts
similarity index 100%
rename from src/routes/[lang]/teams/[id]/index.json.ts
rename to src/routes/teams/[id]/index.json.ts
diff --git a/src/routes/[lang]/teams/[id]/index.svelte b/src/routes/teams/[id]/index.svelte
similarity index 100%
rename from src/routes/[lang]/teams/[id]/index.svelte
rename to src/routes/teams/[id]/index.svelte
diff --git a/src/routes/[lang]/teams/[id]/invitation/accept.json.ts b/src/routes/teams/[id]/invitation/accept.json.ts
similarity index 100%
rename from src/routes/[lang]/teams/[id]/invitation/accept.json.ts
rename to src/routes/teams/[id]/invitation/accept.json.ts
diff --git a/src/routes/[lang]/teams/[id]/invitation/invite.json.ts b/src/routes/teams/[id]/invitation/invite.json.ts
similarity index 100%
rename from src/routes/[lang]/teams/[id]/invitation/invite.json.ts
rename to src/routes/teams/[id]/invitation/invite.json.ts
diff --git a/src/routes/[lang]/teams/[id]/invitation/revoke.json.ts b/src/routes/teams/[id]/invitation/revoke.json.ts
similarity index 100%
rename from src/routes/[lang]/teams/[id]/invitation/revoke.json.ts
rename to src/routes/teams/[id]/invitation/revoke.json.ts
diff --git a/src/routes/[lang]/teams/[id]/permission/change.json.ts b/src/routes/teams/[id]/permission/change.json.ts
similarity index 100%
rename from src/routes/[lang]/teams/[id]/permission/change.json.ts
rename to src/routes/teams/[id]/permission/change.json.ts
diff --git a/src/routes/[lang]/teams/[id]/remove/user.json.ts b/src/routes/teams/[id]/remove/user.json.ts
similarity index 100%
rename from src/routes/[lang]/teams/[id]/remove/user.json.ts
rename to src/routes/teams/[id]/remove/user.json.ts
diff --git a/src/routes/[lang]/teams/index.json.ts b/src/routes/teams/index.json.ts
similarity index 100%
rename from src/routes/[lang]/teams/index.json.ts
rename to src/routes/teams/index.json.ts
diff --git a/src/routes/[lang]/teams/index.svelte b/src/routes/teams/index.svelte
similarity index 100%
rename from src/routes/[lang]/teams/index.svelte
rename to src/routes/teams/index.svelte
diff --git a/static/locales/en.json b/static/locales/en.json
index 897d6158c..aa64ad4e5 100644
--- a/static/locales/en.json
+++ b/static/locales/en.json
@@ -8,59 +8,6 @@
 	},
 	"error": {
 		"you_can_find_your_way_back": "You can find your way back",
-		"here": "here",
-		"oops_your_lost": "Ooops you are lost! But don't be afraid!",
-		"generic_message": "Ooops, something is not okay, are you okay?"
-	},
-	"index": {
-		"applications": "Applications",
-		"destinations": "Destinations",
-		"git_sources": "Git Sources",
-		"databases": "Databases",
-		"services": "Services",
-		"teams": "Teams"
-	},
-	"dashboard": "Dashboard",
-	"application": {
-		"configuration_missing": "Configuration missing",
-		"no_applications_found": "No applications found",
-		"app": {
-			"error_double_app_for_one_branch": "Cannot activate automatic deployments until only one application is defined for this repository / branch."
-		}
-	},
-	"sources": {
-		"no_git_sources_found": "No git sources found",
-		"source": {
-			"delete_git_source": "Delete Git Source",
-			"permission_denied_delete_git_source": "You do not have permission to delete a Git Source",
-			"sure_to_delete": "Are you sure you would like to delete",
-			"create_new_github_app": "Create new GitHub App",
-			"install_repositories": "Install Repositories",
-			"change_app_settings": "Change {name} App Settings",
-			"new_github_app": "New Github App"
-		}
-	},
-	"general": "General",
-	"saving": "Saving...",
-	"save": "Save",
-	"forms": {
-		"name": "Name",
-		"email": "Email",
-		"password": "Password",
-		"password_again": "Password again"
-	},
-	"login": {
-		"already_logged_in": "Already logged in...",
-		"authenticating": "Authenticating...",
-		"login": "Login"
-	},
-	"register": {
-		"register": "Register",
-		"passwords_do_not_match": "Passwords do not match.",
-		"register_first_user": "You are registering the first user. It will be the administrator of your Coolify instance."
-	},
-	"reset_password": {
-		"reset_password": "Reset password",
-		"invalid_secret_key": "Invalid secret key."
+		"here": "here"
 	}
 }
diff --git a/static/locales/fr.json b/static/locales/fr.json
deleted file mode 100644
index 2cce1d2fb..000000000
--- a/static/locales/fr.json
+++ /dev/null
@@ -1,66 +0,0 @@
-{
-	"layout": {
-		"update_done": "Mise à jour réalisée.",
-		"wait_new_version_startup": "En attente du démarrage de la nouvelle version...",
-		"new_version": "Nouvel version accessible. Rafraichissement de la page...",
-		"switch_to_a_different_team": "Changer d'équipe...",
-		"update_available": "Mise à jour disponible"
-	},
-	"error": {
-		"you_can_find_your_way_back": "Vous ne trouvez pas votre chemin ?",
-		"here": "Ici",
-		"oops_your_lost": "Oups vous êtes perdu ! \nMais n'ayez pas peur !",
-		"generic_message": "Oups, quelque chose ne va pas, ça va ?"
-	},
-	"dashboard": "Tableau de bord",
-	"index": {
-		"applications": "Applications",
-		"databases": "Bases de données",
-		"destinations": "Destinations",
-		"git_sources": "Sources Git",
-		"services": "Services",
-		"teams": "Équipes"
-	},
-	"application": {
-		"no_applications_found": "Aucune application trouvée",
-		"app": {
-			"error_double_app_for_one_branch": "Impossible d'activer les déploiements automatiques tant qu'une seule application n'est pas définie pour ce référentiel/branche."
-		},
-		"configuration_missing": "Configuration manquante"
-	},
-	"forms": {
-		"email": "E-mail",
-		"name": "Nom",
-		"password": "Mot de passe",
-		"password_again": "Retaper le mot de passe"
-	},
-	"general": "Général",
-	"login": {
-		"already_logged_in": "Déjà connecté...",
-		"authenticating": "Authentification...",
-		"login": "Connexion"
-	},
-	"register": {
-		"passwords_do_not_match": "Les mots de passe ne correspondent pas.",
-		"register": "S'inscrire",
-		"register_first_user": "Vous enregistrez le premier utilisateur. \nCe sera l'administrateur de votre instance Coolify."
-	},
-	"reset_password": {
-		"invalid_secret_key": "Clé secrète invalide.",
-		"reset_password": "Réinitialiser le mot de passe"
-	},
-	"save": "Enregistrer",
-	"saving": "Enregistrement...",
-	"sources": {
-		"no_git_sources_found": "Aucune source git trouvée",
-		"source": {
-			"change_app_settings": "Modifier les paramètres de l'application {name}",
-			"create_new_github_app": "Créer une nouvelle application GitHub",
-			"delete_git_source": "Supprimer la source Git",
-			"install_repositories": "Installer les référentiels",
-			"new_github_app": "Nouvelle application Github",
-			"permission_denied_delete_git_source": "Vous n'êtes pas autorisé à supprimer une source Git",
-			"sure_to_delete": "Êtes-vous sûr de vouloir supprimer"
-		}
-	}
-}

From a3241516cb1e15197080fcc20eb2ded0f061bcad Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 20:25:24 +0200
Subject: [PATCH 06/23] Change the way to load i18n (go throw cookie)

---
 .vscode/settings.json      |   5 +-
 package.json               |   2 +-
 pnpm-lock.yaml             | 124 +++++++++++--------------------------
 src/hooks.ts               |  46 ++++++++++++--
 src/lib/lang.json          |   4 ++
 src/lib/translations.ts    |  28 +++++++++
 src/routes/__error.svelte  |   7 ++-
 src/routes/__layout.svelte |  32 +++++-----
 src/routes/index.svelte    |   4 +-
 static/locales/en.json     |   3 +
 static/locales/fr.json     |   5 ++
 11 files changed, 142 insertions(+), 118 deletions(-)
 create mode 100644 src/lib/lang.json
 create mode 100644 src/lib/translations.ts
 create mode 100644 static/locales/fr.json

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 1cc7be6e1..ab2903b56 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,7 +1,8 @@
 {
-	"i18n-ally.localesPaths": ["locales"],
+	"i18n-ally.localesPaths": ["static/locales"],
 	"i18n-ally.keystyle": "nested",
 	"i18n-ally.extract.ignoredByFiles": {
 		"src\\routes\\__layout.svelte": ["Coolify", "coolLabs logo"]
-	}
+	},
+	"i18n-ally.sourceLanguage": "fr"
 }
diff --git a/package.json b/package.json
index 7a0a8e4bf..2ac79d547 100644
--- a/package.json
+++ b/package.json
@@ -51,9 +51,9 @@
 		"prisma": "3.11.1",
 		"svelte": "3.46.4",
 		"svelte-check": "2.4.6",
-		"svelte-i18n": "^3.3.13",
 		"svelte-preprocess": "4.10.4",
 		"svelte-select": "^4.4.7",
+		"sveltekit-i18n": "^2.1.2",
 		"tailwindcss": "3.0.23",
 		"ts-node": "10.7.0",
 		"tslib": "2.3.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e7594b347..0a432406d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -46,10 +46,10 @@ specifiers:
   prisma: 3.11.1
   svelte: 3.46.4
   svelte-check: 2.4.6
-  svelte-i18n: ^3.3.13
   svelte-kit-cookie-session: 2.1.2
   svelte-preprocess: 4.10.4
   svelte-select: ^4.4.7
+  sveltekit-i18n: ^2.1.2
   tailwindcss: 3.0.23
   tailwindcss-scrollbar: ^0.1.0
   ts-node: 10.7.0
@@ -108,9 +108,9 @@ devDependencies:
   prisma: 3.11.1
   svelte: 3.46.4
   svelte-check: 2.4.6_postcss@8.4.12+svelte@3.46.4
-  svelte-i18n: 3.3.13_svelte@3.46.4
   svelte-preprocess: 4.10.4_296873641a0ad9f42fe92172d27bcedd
   svelte-select: 4.4.7
+  sveltekit-i18n: 2.1.2_svelte@3.46.4
   tailwindcss: 3.0.23_b89136460714832cdda11d1e9d57d1ff
   ts-node: 10.7.0_ee885bc7281b682b6adbed6ae09ee090
   tslib: 2.3.1
@@ -184,55 +184,6 @@ packages:
       - supports-color
     dev: true
 
-  /@formatjs/ecma402-abstract/1.11.4:
-    resolution:
-      {
-        integrity: sha512-EBikYFp2JCdIfGEb5G9dyCkTGDmC57KSHhRQOC3aYxoPWVZvfWCDjZwkGYHN7Lis/fmuWl906bnNTJifDQ3sXw==
-      }
-    dependencies:
-      '@formatjs/intl-localematcher': 0.2.25
-      tslib: 2.3.1
-    dev: true
-
-  /@formatjs/fast-memoize/1.2.1:
-    resolution:
-      {
-        integrity: sha512-Rg0e76nomkz3vF9IPlKeV+Qynok0r7YZjL6syLz4/urSg0IbjPZCB/iYUMNsYA643gh4mgrX3T7KEIFIxJBQeg==
-      }
-    dependencies:
-      tslib: 2.3.1
-    dev: true
-
-  /@formatjs/icu-messageformat-parser/2.0.19:
-    resolution:
-      {
-        integrity: sha512-8HsLm9YLyVVIDMyBJb7wmve2wGd461cUwJ470eUog5YH5ZsF4p5lgvaJ+oGKxz1mrSMNNdDHU9v/NDsS+z+ilg==
-      }
-    dependencies:
-      '@formatjs/ecma402-abstract': 1.11.4
-      '@formatjs/icu-skeleton-parser': 1.3.6
-      tslib: 2.3.1
-    dev: true
-
-  /@formatjs/icu-skeleton-parser/1.3.6:
-    resolution:
-      {
-        integrity: sha512-I96mOxvml/YLrwU2Txnd4klA7V8fRhb6JG/4hm3VMNmeJo1F03IpV2L3wWt7EweqNLES59SZ4d6hVOPCSf80Bg==
-      }
-    dependencies:
-      '@formatjs/ecma402-abstract': 1.11.4
-      tslib: 2.3.1
-    dev: true
-
-  /@formatjs/intl-localematcher/0.2.25:
-    resolution:
-      {
-        integrity: sha512-YmLcX70BxoSopLFdLr1Ds99NdlTI2oWoLbaUW2M406lxOIPzE1KQhRz2fPUkq34xVZQaihCoU29h0KK7An3bhA==
-      }
-    dependencies:
-      tslib: 2.3.1
-    dev: true
-
   /@humanwhocodes/config-array/0.5.0:
     resolution:
       {
@@ -495,6 +446,26 @@ packages:
       - supports-color
     dev: true
 
+  /@sveltekit-i18n/base/1.1.1_svelte@3.46.4:
+    resolution:
+      {
+        integrity: sha512-J/sMU0OwS3dCLOuilHMBqu8vZHuuXiNV9vFJx8Nb4/b5BlR/KCZ4bCXI8wZR02GHeCOYKZxWus07CM1scxa/jw==
+      }
+    peerDependencies:
+      svelte: ^3.x
+    dependencies:
+      svelte: 3.46.4
+    optionalDependencies:
+      '@sveltekit-i18n/parser-default': 1.0.3
+    dev: true
+
+  /@sveltekit-i18n/parser-default/1.0.3:
+    resolution:
+      {
+        integrity: sha512-HheveklTjp3hxpYQhoHfyA6B4bQaUeSV5MQf2usIv/58UF2jY/YqhCAWj9bDBjufbuZc5pSz4BXvdX3WVT+viA==
+      }
+    dev: true
+
   /@szmarczak/http-timer/5.0.1:
     resolution:
       {
@@ -2254,14 +2225,6 @@ packages:
       }
     dev: true
 
-  /deepmerge/4.2.2:
-    resolution:
-      {
-        integrity: sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==
-      }
-    engines: { node: '>=0.10.0' }
-    dev: true
-
   /defer-to-connect/2.0.1:
     resolution:
       {
@@ -3462,18 +3425,6 @@ packages:
         integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
       }
 
-  /intl-messageformat/9.12.0:
-    resolution:
-      {
-        integrity: sha512-5Q9j21JreB1G27/CqMYsA+pvJ19JjHyhiTSeUuvZK9BCDJGHtOLgpUUcGM+GLHiUuoVMKVeeX1smamiVHQrSKQ==
-      }
-    dependencies:
-      '@formatjs/ecma402-abstract': 1.11.4
-      '@formatjs/fast-memoize': 1.2.1
-      '@formatjs/icu-messageformat-parser': 2.0.19
-      tslib: 2.3.1
-    dev: true
-
   /invariant/2.2.4:
     resolution:
       {
@@ -5243,24 +5194,6 @@ packages:
       svelte: 3.46.4
     dev: true
 
-  /svelte-i18n/3.3.13_svelte@3.46.4:
-    resolution:
-      {
-        integrity: sha512-RQM+ys4+Y9ztH//tX22H1UL2cniLNmIR+N4xmYygV6QpQ6EyQvloZiENRew8XrVzfvJ8HaE8NU6/yurLkl7z3g==
-      }
-    engines: { node: '>= 11.15.0' }
-    hasBin: true
-    peerDependencies:
-      svelte: ^3.25.1
-    dependencies:
-      deepmerge: 4.2.2
-      estree-walker: 2.0.2
-      intl-messageformat: 9.12.0
-      sade: 1.7.4
-      svelte: 3.46.4
-      tiny-glob: 0.2.9
-    dev: true
-
   /svelte-kit-cookie-session/2.1.2:
     resolution:
       {
@@ -5338,6 +5271,19 @@ packages:
     engines: { node: '>= 8' }
     dev: true
 
+  /sveltekit-i18n/2.1.2_svelte@3.46.4:
+    resolution:
+      {
+        integrity: sha512-s5YxcbNd2EWNZaZR1A4Drt8s53E4fpUkN4XIWd3VRpw1pihZVWssqmBW1qkjQ6AB0kiu1Qwule+vt1HkbQOjrg==
+      }
+    peerDependencies:
+      svelte: ^3.x
+    dependencies:
+      '@sveltekit-i18n/base': 1.1.1_svelte@3.46.4
+      '@sveltekit-i18n/parser-default': 1.0.3
+      svelte: 3.46.4
+    dev: true
+
   /table/6.7.2:
     resolution:
       {
diff --git a/src/hooks.ts b/src/hooks.ts
index d6c6eca6d..e0e4707cb 100644
--- a/src/hooks.ts
+++ b/src/hooks.ts
@@ -6,6 +6,7 @@ import { getUserDetails, sentry } from '$lib/common';
 import { version } from '$lib/common';
 import cookie from 'cookie';
 import { dev } from '$app/env';
+import { locales } from '$lib/translations';
 
 export const handle = handleSession(
 	{
@@ -15,6 +16,29 @@ export const handle = handleSession(
 	},
 	async function ({ event, resolve }) {
 		let response;
+
+		const { url, request } = event;
+		const { pathname } = url;
+
+		// Get defined locales
+		const supportedLocales = locales.get();
+		let locale;
+
+		if (event.locals.cookies) {
+			locale = supportedLocales.find(
+				(l) => `${l}`.toLowerCase() === `${event.locals.cookies['lang']}`.toLowerCase()
+			);
+		}
+
+		if (!locale) {
+			locale = `${`${request.headers.get('accept-language')}`.match(
+				/[a-zA-Z]+?(?=-|_|,|;)/
+			)}`.toLowerCase();
+
+			// Set default locale if user preferred locale does not match
+			if (!supportedLocales.includes(locale)) locale = 'en';
+		}
+
 		try {
 			if (event.locals.cookies) {
 				if (event.locals.cookies['kit.session']) {
@@ -24,7 +48,8 @@ export const handle = handleSession(
 						teamId,
 						permission,
 						isAdmin: permission === 'admin' || permission === 'owner',
-						expires: event.locals.session.data.expires
+						expires: event.locals.session.data.expires,
+						lang: locale
 					};
 
 					if (JSON.stringify(event.locals.session.data) !== JSON.stringify(newSession)) {
@@ -34,12 +59,14 @@ export const handle = handleSession(
 			}
 
 			response = await resolve(event, {
-				ssr: !event.url.pathname.startsWith('/webhooks/success')
+				ssr: !event.url.pathname.startsWith('/webhooks/success'),
+				transformPage: ({ html }) => html.replace(/<html.*>/, `<html lang="${locale}">`)
 			});
 		} catch (error) {
 			console.log(error);
 			response = await resolve(event, {
-				ssr: !event.url.pathname.startsWith('/webhooks/success')
+				ssr: !event.url.pathname.startsWith('/webhooks/success'),
+				transformPage: ({ html }) => html.replace(/<html.*>/, `<html lang="${locale}">`)
 			});
 			response.headers.append(
 				'Set-Cookie',
@@ -62,9 +89,18 @@ export const handle = handleSession(
 					expires: new Date('Thu, 01 Jan 1970 00:00:01 GMT')
 				})
 			);
-		} finally {
-			return response;
 		}
+
+		response.headers.append(
+			'Set-Cookie',
+			cookie.serialize('lang', locale, {
+				path: '/',
+				sameSite: 'strict',
+				maxAge: 30 * 24 * 60 * 60
+			})
+		);
+
+		return response;
 	}
 );
 
diff --git a/src/lib/lang.json b/src/lib/lang.json
new file mode 100644
index 000000000..fdfc5bf80
--- /dev/null
+++ b/src/lib/lang.json
@@ -0,0 +1,4 @@
+{
+	"fr": "Français",
+	"en": "English"
+}
diff --git a/src/lib/translations.ts b/src/lib/translations.ts
new file mode 100644
index 000000000..69282b21c
--- /dev/null
+++ b/src/lib/translations.ts
@@ -0,0 +1,28 @@
+import i18n from 'sveltekit-i18n';
+import lang from './lang.json';
+
+/** @type {import('sveltekit-i18n').Config} */
+const config = {
+	defaultLocale: 'en',
+	fallbackLocale: 'en',
+	translations: {
+		en: { lang },
+		fr: { lang }
+	},
+	loaders: [
+		{
+			locale: 'en',
+			key: '',
+			loader: async () => (await import('../../static/locales/en.json')).default
+		},
+		{
+			locale: 'fr',
+			key: '',
+			loader: async () => (await import('../../static/locales/fr.json')).default
+		}
+	]
+};
+
+export const { t, locale, locales, loading, loadTranslations } = new i18n(config);
+
+loading.subscribe(($loading) => $loading && console.log('Loading translations...'));
diff --git a/src/routes/__error.svelte b/src/routes/__error.svelte
index 67693e70a..edecc0f82 100644
--- a/src/routes/__error.svelte
+++ b/src/routes/__error.svelte
@@ -12,7 +12,8 @@
 </script>
 
 <script>
-	import { _ } from 'svelte-i18n';
+	import { t } from '$lib/translations';
+
 	export let status;
 	export let error;
 </script>
@@ -21,8 +22,8 @@
 	<div class="pb-10 text-7xl font-bold">{status}</div>
 	<div class="text-3xl font-bold">Ooops you are lost! But don't be afraid!</div>
 	<div class="text-xl">
-		{$_('error.you_can_find_your_way_back')}
-		<a href="/" class="font-bold uppercase text-sky-400">{$_('error.here')}</a>
+		{$t('error.you_can_find_your_way_back')}
+		<a href="/" class="font-bold uppercase text-sky-400">{$t('error.here')}</a>
 	</div>
 	<div class="py-10 text-xs font-bold">
 		<pre
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index bb2665238..ceaf7cffb 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -1,6 +1,7 @@
 <script context="module" lang="ts">
 	import type { Load } from '@sveltejs/kit';
 	import { publicPaths } from '$lib/settings';
+	import { locale, loadTranslations } from '$lib/translations';
 
 	export const load: Load = async ({ fetch, url, session }) => {
 		if (!session.userId && !publicPaths.includes(url.pathname)) {
@@ -15,6 +16,12 @@
 		const endpoint = `/teams.json`;
 		const res = await fetch(endpoint);
 
+		const { pathname } = url;
+		const defaultLocale = session.lang;
+		const initLocale = locale.get() || defaultLocale;
+
+		await loadTranslations(initLocale, pathname);
+
 		if (res.ok) {
 			return {
 				props: {
@@ -23,6 +30,7 @@
 				}
 			};
 		}
+
 		return {};
 	};
 </script>
@@ -38,18 +46,8 @@
 	import { errorNotification } from '$lib/form';
 	import { asyncSleep } from '$lib/components/common';
 	import { del, get, post } from '$lib/api';
-	import { register, init, _, getLocaleFromNavigator } from 'svelte-i18n';
-
-	async function setup() {
-		register('en', () => import('../../static/locales/en.json'));
-
-		return await Promise.allSettled([
-			// TODO: add some more stuff you want to init ...
-			init({ initialLocale: getLocaleFromNavigator(), fallbackLocale: 'en' })
-		]);
-	}
-
-	const setupResult = setup();
+	import { browser } from '$app/env';
+	import { loading, t } from '$lib/translations';
 
 	let isUpdateAvailable = false;
 
@@ -115,7 +113,7 @@
 				return window.location.reload();
 			} else {
 				await post(`/update.json`, { type: 'update', latestVersion });
-				toast.push(`${$_('layout.update_done')}<br><br>${$_('layout.wait_new_version_startup')}`);
+				toast.push(`${$t('layout.update_done')}<br><br>${$t('layout.wait_new_version_startup')}`);
 				let reachable = false;
 				let tries = 0;
 				do {
@@ -129,7 +127,7 @@
 					if (reachable) break;
 					tries++;
 				} while (!reachable || tries < 120);
-				toast.push($_('layout.new_version'));
+				toast.push($t('layout.new_version'));
 				updateStatus.loading = false;
 				updateStatus.success = true;
 				await asyncSleep(3000);
@@ -147,7 +145,7 @@
 	<title>Coolify</title>
 </svelte:head>
 
-{#await setupResult}
+{#await loading}
 	Please wait...
 {:then}
 	<SvelteToast options={{ intro: { y: -64 }, duration: 3000, pausable: true }} />
@@ -336,7 +334,7 @@
 						{#if isUpdateAvailable}
 							<button
 								disabled={updateStatus.success === false}
-								title={$_('layout.update_available')}
+								title={$t('layout.update_available')}
 								on:click={update}
 								class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
 							>
@@ -534,7 +532,7 @@
 			bind:value={selectedTeamId}
 			on:change={switchTeam}
 		>
-			<option value="" disabled selected>{$_('layout.switch_to_a_different_team')}</option>
+			<option value="" disabled selected>{$t('layout.switch_to_a_different_team')}</option>
 			{#each teams as team}
 				<option value={team.teamId}>{team.team.name} - {team.permission}</option>
 			{/each}
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 1a5f61b4b..2e3fc5137 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -20,6 +20,8 @@
 </script>
 
 <script lang="ts">
+	import { t } from '$lib/translations';
+
 	export let applicationsCount: number;
 	export let sourcesCount: number;
 	export let destinationsCount: number;
@@ -29,7 +31,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Dashboard</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('index.dashboard')}</div>
 </div>
 
 <div class="mt-10 pb-12 tracking-tight sm:pb-16">
diff --git a/static/locales/en.json b/static/locales/en.json
index aa64ad4e5..f0f095a3b 100644
--- a/static/locales/en.json
+++ b/static/locales/en.json
@@ -9,5 +9,8 @@
 	"error": {
 		"you_can_find_your_way_back": "You can find your way back",
 		"here": "here"
+	},
+	"index": {
+		"dashboard": "Dashboard"
 	}
 }
diff --git a/static/locales/fr.json b/static/locales/fr.json
new file mode 100644
index 000000000..14f19dd47
--- /dev/null
+++ b/static/locales/fr.json
@@ -0,0 +1,5 @@
+{
+	"index": {
+		"dashboard": "Tableau de bord"
+	}
+}

From 269250ef3d8b5e64025259cc4eaf761229ffbab2 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 21:08:55 +0200
Subject: [PATCH 07/23] Begin translation and finish i18n system

---
 .vscode/settings.json            |  4 ++--
 src/app.d.ts                     |  1 +
 src/hooks.ts                     | 28 +++++++++++++---------
 src/lib/locales/en.json          | 40 ++++++++++++++++++++++++++++++++
 src/lib/locales/fr.json          | 40 ++++++++++++++++++++++++++++++++
 src/lib/translations.ts          |  9 ++++---
 src/routes/__layout.svelte       | 11 ++++-----
 src/routes/index.svelte          | 18 +++++++++-----
 src/routes/login/index.svelte    | 19 ++++++++++-----
 src/routes/register/index.svelte | 15 ++++++------
 static/locales/en.json           | 16 -------------
 static/locales/fr.json           |  5 ----
 svelte.config.js                 |  6 -----
 13 files changed, 142 insertions(+), 70 deletions(-)
 create mode 100644 src/lib/locales/en.json
 create mode 100644 src/lib/locales/fr.json
 delete mode 100644 static/locales/en.json
 delete mode 100644 static/locales/fr.json

diff --git a/.vscode/settings.json b/.vscode/settings.json
index ab2903b56..b823b0001 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,8 +1,8 @@
 {
-	"i18n-ally.localesPaths": ["static/locales"],
+	"i18n-ally.localesPaths": ["src/lib/locales"],
 	"i18n-ally.keystyle": "nested",
 	"i18n-ally.extract.ignoredByFiles": {
 		"src\\routes\\__layout.svelte": ["Coolify", "coolLabs logo"]
 	},
-	"i18n-ally.sourceLanguage": "fr"
+	"i18n-ally.sourceLanguage": "en"
 }
diff --git a/src/app.d.ts b/src/app.d.ts
index 0557299b9..6dacd8395 100644
--- a/src/app.d.ts
+++ b/src/app.d.ts
@@ -23,6 +23,7 @@ interface SessionData {
 	userId?: string | null;
 	teamId?: string | null;
 	permission?: string;
+	lang?: string;
 	isAdmin?: boolean;
 	expires?: string | null;
 	gitlabToken?: string | null;
diff --git a/src/hooks.ts b/src/hooks.ts
index e0e4707cb..ac60a2a25 100644
--- a/src/hooks.ts
+++ b/src/hooks.ts
@@ -18,27 +18,22 @@ export const handle = handleSession(
 		let response;
 
 		const { url, request } = event;
-		const { pathname } = url;
 
 		// Get defined locales
 		const supportedLocales = locales.get();
 		let locale;
 
-		if (event.locals.cookies) {
-			locale = supportedLocales.find(
-				(l) => `${l}`.toLowerCase() === `${event.locals.cookies['lang']}`.toLowerCase()
-			);
-		}
-
-		if (!locale) {
+		if (event.locals.cookies['lang']) {
+			locale = event.locals.cookies['lang'];
+		} else if (!locale) {
 			locale = `${`${request.headers.get('accept-language')}`.match(
 				/[a-zA-Z]+?(?=-|_|,|;)/
 			)}`.toLowerCase();
-
-			// Set default locale if user preferred locale does not match
-			if (!supportedLocales.includes(locale)) locale = 'en';
 		}
 
+		// Set default locale if user preferred locale does not match
+		if (!supportedLocales.includes(locale)) locale = 'en';
+
 		try {
 			if (event.locals.cookies) {
 				if (event.locals.cookies['kit.session']) {
@@ -105,7 +100,18 @@ export const handle = handleSession(
 );
 
 export const getSession: GetSession = function ({ locals }) {
+	// Get defined locales
+	const supportedLocales = locales.get();
+	let locale;
+
+	if (locals.cookies) {
+		locale = supportedLocales.find(
+			(l) => `${l}`.toLowerCase() === `${locals.cookies['lang']}`.toLowerCase()
+		);
+	}
+
 	return {
+		lang: locale,
 		version,
 		...locals.session.data
 	};
diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
new file mode 100644
index 000000000..a6a99215b
--- /dev/null
+++ b/src/lib/locales/en.json
@@ -0,0 +1,40 @@
+{
+	"layout": {
+		"update_done": "Update completed.",
+		"wait_new_version_startup": "Waiting for the new version to start...",
+		"new_version": "New version reachable. Reloading...",
+		"switch_to_a_different_team": "Switch to a different team...",
+		"update_available": "Update available"
+	},
+	"error": {
+		"you_can_find_your_way_back": "You can find your way back",
+		"here": "here"
+	},
+	"index": {
+		"dashboard": "Dashboard",
+		"applications": "Applications",
+		"destinations": "Destinations",
+		"git_sources": "Git Sources",
+		"databases": "Databases",
+		"services": "Services",
+		"teams": "Teams"
+	},
+	"login": {
+		"already_logged_in": "Already logged in...",
+		"authenticating": "Authenticating...",
+		"login": "Login"
+	},
+	"forms": {
+		"password": "Password",
+		"email": "Email",
+		"passwords_not_match": "Passwords do not match.",
+		"password_again": "Password again"
+	},
+	"register": {
+		"register": "Register",
+		"first_user": "You are registering the first user. It will be the administrator of your Coolify instance."
+	},
+	"reset": {
+		"reset_password": "Reset password"
+	}
+}
diff --git a/src/lib/locales/fr.json b/src/lib/locales/fr.json
new file mode 100644
index 000000000..d52be9989
--- /dev/null
+++ b/src/lib/locales/fr.json
@@ -0,0 +1,40 @@
+{
+	"index": {
+		"dashboard": "Tableau de bord",
+		"applications": "Applications",
+		"databases": "Bases de données",
+		"destinations": "Destinations",
+		"git_sources": "Sources Git",
+		"services": "Prestations de service",
+		"teams": "Équipes"
+	},
+	"error": {
+		"here": "ici",
+		"you_can_find_your_way_back": "Tu peux retrouver ton chemin"
+	},
+	"forms": {
+		"email": "E-mail",
+		"password": "Mot de passe",
+		"password_again": "Retaper le mot de passe",
+		"passwords_not_match": "Les mots de passe ne correspondent pas."
+	},
+	"layout": {
+		"new_version": "Nouvelle version disponible. \nActualisation...",
+		"switch_to_a_different_team": "Changer d'équipe...",
+		"update_available": "Mise à jour disponible",
+		"update_done": "Mise à jour terminée.",
+		"wait_new_version_startup": "Attente du lancement de la nouvelle version..."
+	},
+	"login": {
+		"already_logged_in": "Déjà connecté...",
+		"authenticating": "Authentification...",
+		"login": "Connexion"
+	},
+	"register": {
+		"first_user": "Vous enregistrez le premier utilisateur. \nCe sera l'administrateur de votre instance Coolify.",
+		"register": "S'inscrire"
+	},
+	"reset": {
+		"reset_password": "Réinitialiser le mot de passe"
+	}
+}
diff --git a/src/lib/translations.ts b/src/lib/translations.ts
index 69282b21c..9d31f11bf 100644
--- a/src/lib/translations.ts
+++ b/src/lib/translations.ts
@@ -3,7 +3,6 @@ import lang from './lang.json';
 
 /** @type {import('sveltekit-i18n').Config} */
 const config = {
-	defaultLocale: 'en',
 	fallbackLocale: 'en',
 	translations: {
 		en: { lang },
@@ -13,16 +12,16 @@ const config = {
 		{
 			locale: 'en',
 			key: '',
-			loader: async () => (await import('../../static/locales/en.json')).default
+			loader: async () => (await import('./locales/en.json')).default
 		},
 		{
 			locale: 'fr',
 			key: '',
-			loader: async () => (await import('../../static/locales/fr.json')).default
+			loader: async () => (await import('./locales/fr.json')).default
 		}
 	]
 };
 
-export const { t, locale, locales, loading, loadTranslations } = new i18n(config);
+export const { t, loading, locales, locale, loadTranslations } = new i18n(config);
 
-loading.subscribe(($loading) => $loading && console.log('Loading translations...'));
+loading.subscribe(($loading) => $loading);
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index ceaf7cffb..7d6946b8d 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -4,6 +4,11 @@
 	import { locale, loadTranslations } from '$lib/translations';
 
 	export const load: Load = async ({ fetch, url, session }) => {
+		const { pathname } = url;
+		const initLocale = locale.get() || session.lang || 'en';
+
+		await loadTranslations(initLocale, pathname);
+
 		if (!session.userId && !publicPaths.includes(url.pathname)) {
 			return {
 				status: 302,
@@ -16,12 +21,6 @@
 		const endpoint = `/teams.json`;
 		const res = await fetch(endpoint);
 
-		const { pathname } = url;
-		const defaultLocale = session.lang;
-		const initLocale = locale.get() || defaultLocale;
-
-		await loadTranslations(initLocale, pathname);
-
 		if (res.ok) {
 			return {
 				props: {
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 2e3fc5137..ba7dd18a1 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -46,7 +46,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-green-500 no-underline transition duration-150 hover:bg-green-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							Applications
+							{$t('index.applications')}
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{applicationsCount}
@@ -58,7 +58,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-sky-500 no-underline transition duration-150 hover:bg-sky-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							Destinations
+							{$t('index.destinations')}
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{destinationsCount}
@@ -70,7 +70,7 @@
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-orange-500 no-underline transition duration-150 hover:bg-orange-500 hover:text-white"
 					>
 						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
-							Git Sources
+							{$t('index.git_sources')}
 						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{sourcesCount}
@@ -81,7 +81,9 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-purple-500 no-underline transition duration-150 hover:bg-purple-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Databases</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
+							{$t('index.databases')}
+						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">{databasesCount}</dd>
 					</a>
 					<a
@@ -89,7 +91,9 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-pink-500 no-underline transition duration-150 hover:bg-pink-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Services</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
+							{$t('index.services')}
+						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">{servicesCount}</dd>
 					</a>
 
@@ -98,7 +102,9 @@
 						sveltekit:prefetch
 						class="flex cursor-pointer flex-col rounded p-6 text-center text-cyan-500 no-underline transition duration-150 hover:bg-cyan-500 hover:text-white"
 					>
-						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">Teams</dt>
+						<dt class="order-2 mt-2 text-sm font-bold uppercase leading-6 text-white">
+							{$t('index.teams')}
+						</dt>
 						<dd class="order-1 text-5xl font-extrabold ">
 							{teamsCount}
 						</dd>
diff --git a/src/routes/login/index.svelte b/src/routes/login/index.svelte
index b321bc086..6b3c79679 100644
--- a/src/routes/login/index.svelte
+++ b/src/routes/login/index.svelte
@@ -4,6 +4,7 @@
 	import { session } from '$app/stores';
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	import { onMount } from 'svelte';
 	let loading = false;
 	let emailEl;
@@ -37,9 +38,13 @@
 	}
 </script>
 
+<svelt:head>
+	<title>{$t('login.login')}</title>
+</svelt:head>
+
 <div class="flex h-screen flex-col items-center justify-center">
 	{#if $session.userId}
-		<div class="flex justify-center px-4 text-xl font-bold">Already logged in...</div>
+		<div class="flex justify-center px-4 text-xl font-bold">{$t('login.already_logged_in')}</div>
 	{:else}
 		<div class="flex justify-center px-4">
 			<form on:submit|preventDefault={handleSubmit} class="flex flex-col py-4 space-y-2">
@@ -48,7 +53,7 @@
 				<input
 					type="email"
 					name="email"
-					placeholder="Email"
+					placeholder={$t('forms.email')}
 					autocomplete="off"
 					required
 					bind:this={emailEl}
@@ -57,7 +62,7 @@
 				<input
 					type="password"
 					name="password"
-					placeholder="Password"
+					placeholder={$t('index.password')}
 					bind:value={password}
 					required
 				/>
@@ -69,16 +74,18 @@
 						class="hover:opacity-90 text-white"
 						class:bg-transparent={loading}
 						class:text-stone-600={loading}
-						class:bg-coollabs={!loading}>{loading ? 'Authenticating...' : 'Login'}</button
+						class:bg-coollabs={!loading}
+						>{loading ? $t('login.authenticating') : $t('login.login')}</button
 					>
 
 					<button
 						on:click|preventDefault={() => goto('/register')}
-						class="bg-transparent hover:bg-coolgray-300	text-white ">Register</button
+						class="bg-transparent hover:bg-coolgray-300	text-white "
+						>{$t('register.register')}</button
 					>
 					<button
 						class="bg-transparent hover:bg-coolgray-300"
-						on:click|preventDefault={() => goto('/reset')}>Reset password</button
+						on:click|preventDefault={() => goto('/reset')}>{$t('reset.reset_password')}</button
 					>
 				</div>
 			</form>
diff --git a/src/routes/register/index.svelte b/src/routes/register/index.svelte
index 35501fce2..9de0626db 100644
--- a/src/routes/register/index.svelte
+++ b/src/routes/register/index.svelte
@@ -6,6 +6,7 @@
 	import { session } from '$app/stores';
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	import { onMount } from 'svelte';
 
 	let loading = false;
@@ -20,7 +21,7 @@
 	});
 	async function handleSubmit() {
 		if (password !== passwordCheck) {
-			return errorNotification('Passwords do not match.');
+			return errorNotification($t('forms.passwords_not_match'));
 		}
 		loading = true;
 		try {
@@ -57,7 +58,7 @@
 </div>
 <div class="flex h-screen flex-col items-center justify-center">
 	{#if $session.userId}
-		<div class="flex justify-center px-4 text-xl font-bold">Already logged in...</div>
+		<div class="flex justify-center px-4 text-xl font-bold">{$t('login.already_logged_in')}</div>
 	{:else}
 		<div class="flex justify-center px-4">
 			<form on:submit|preventDefault={handleSubmit} class="flex flex-col py-4 space-y-2">
@@ -66,7 +67,7 @@
 				<input
 					type="email"
 					name="email"
-					placeholder="Email"
+					placeholder={$t('forms.email')}
 					autocomplete="off"
 					required
 					bind:this={emailEl}
@@ -75,28 +76,28 @@
 				<input
 					type="password"
 					name="password"
-					placeholder="Password"
+					placeholder={$t('forms.password')}
 					bind:value={password}
 					required
 				/>
 				<input
 					type="password"
 					name="passwordCheck"
-					placeholder="Password again"
+					placeholder={$t('forms.password_again')}
 					bind:value={passwordCheck}
 					required
 				/>
 
 				<div class="flex space-x-2 h-8 items-center justify-center pt-8">
 					<button type="submit" class="hover:bg-coollabs-100 text-white bg-coollabs"
-						>Register</button
+						>{$t('register.register')}</button
 					>
 				</div>
 			</form>
 		</div>
 		{#if userCount === 0}
 			<div class="pt-5">
-				You are registering the first user. It will be the administrator of your Coolify instance.
+				{$t('register.first_user')}
 			</div>
 		{/if}
 	{/if}
diff --git a/static/locales/en.json b/static/locales/en.json
deleted file mode 100644
index f0f095a3b..000000000
--- a/static/locales/en.json
+++ /dev/null
@@ -1,16 +0,0 @@
-{
-	"layout": {
-		"update_done": "Update completed.",
-		"wait_new_version_startup": "Waiting for the new version to start...",
-		"new_version": "New version reachable. Reloading...",
-		"switch_to_a_different_team": "Switch to a different team...",
-		"update_available": "Update available"
-	},
-	"error": {
-		"you_can_find_your_way_back": "You can find your way back",
-		"here": "here"
-	},
-	"index": {
-		"dashboard": "Dashboard"
-	}
-}
diff --git a/static/locales/fr.json b/static/locales/fr.json
deleted file mode 100644
index 14f19dd47..000000000
--- a/static/locales/fr.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-	"index": {
-		"dashboard": "Tableau de bord"
-	}
-}
diff --git a/svelte.config.js b/svelte.config.js
index 9d711910b..4e8bc8966 100644
--- a/svelte.config.js
+++ b/svelte.config.js
@@ -12,12 +12,6 @@ const config = {
 		vite: {
 			optimizeDeps: {
 				exclude: ['svelte-kit-cookie-session']
-			},
-			server: {
-				fs: {
-					// Allow serving files from one level up to the project root
-					allow: ['../locales']
-				}
 			}
 		}
 	}

From 8f58b14629f986c8486f6aa409fa7aa86ee154ef Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 22:04:50 +0200
Subject: [PATCH 08/23] Add application i18n

---
 src/lib/locales/en.json                       | 34 ++++++++++++++++++-
 src/lib/locales/fr.json                       |  2 +-
 .../[id]/configuration/_BuildPack.svelte      |  5 ++-
 .../configuration/_GithubRepositories.svelte  | 23 +++++++------
 .../configuration/_GitlabRepositories.svelte  | 30 +++++++++-------
 .../[id]/configuration/buildpack.svelte       | 12 ++++---
 .../[id]/configuration/destination.svelte     |  7 ++--
 .../[id]/configuration/repository.svelte      |  6 +++-
 .../[id]/configuration/source.svelte          |  9 +++--
 9 files changed, 92 insertions(+), 36 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index a6a99215b..2c6d457eb 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -28,7 +28,9 @@
 		"password": "Password",
 		"email": "Email",
 		"passwords_not_match": "Passwords do not match.",
-		"password_again": "Password again"
+		"password_again": "Password again",
+		"save": "Save",
+		"saving": "Saving..."
 	},
 	"register": {
 		"register": "Register",
@@ -36,5 +38,35 @@
 	},
 	"reset": {
 		"reset_password": "Reset password"
+	},
+	"application": {
+		"configuration": {
+			"buildpack": {
+				"choose_this_one": "Choose this one..."
+			},
+			"branch_already_in_use": "This branch is already used by another application. Webhooks won't work in this case for both applications. Are you sure you want to use it?",
+			"no_repositories_configured": "No repositories configured for your Git Application.",
+			"configure_it_now": "Configure it now",
+			"loading_repositories": "Loading repositories ...",
+			"select_a_repository": "Please select a repository",
+			"loading_branches": "Loading branches ...",
+			"select_a_repository_first": "Please select a repository first",
+			"select_a_branch": "Please select a branch",
+			"loading_groups": "Loading groups...",
+			"select_a_group": "Please select a group",
+			"loading_projects": "Loading projects...",
+			"select_a_project": "Please select a project",
+			"no_projects_found": "No projects found",
+			"no_branches_found": "No branches found",
+			"configure_build_pack": "Configure Build Pack",
+			"scanning_repository_suggest_build_pack": "Scanning repository to suggest a build pack for you...",
+			"found_lock_file": "Found lock file for <span class=\"font-bold text-orange-500 pl-1\">{packageManager}</span>. Using it for predefined commands commands.",
+			"configure_destination": "Configure Destination",
+			"no_configurable_destination": "No configurable Destination found",
+			"select_a_repository_project": "Select a Repository / Project",
+			"select_a_git_source": "Select a Git Source",
+			"no_configurable_git": "No configurable Git Source found",
+			"configuration_missing": "Configuration missing"
+		}
 	}
 }
diff --git a/src/lib/locales/fr.json b/src/lib/locales/fr.json
index d52be9989..a4a2cea1d 100644
--- a/src/lib/locales/fr.json
+++ b/src/lib/locales/fr.json
@@ -5,7 +5,7 @@
 		"databases": "Bases de données",
 		"destinations": "Destinations",
 		"git_sources": "Sources Git",
-		"services": "Prestations de service",
+		"services": "Services",
 		"teams": "Équipes"
 	},
 	"error": {
diff --git a/src/routes/applications/[id]/configuration/_BuildPack.svelte b/src/routes/applications/[id]/configuration/_BuildPack.svelte
index dadbc9dde..60dbcc789 100644
--- a/src/routes/applications/[id]/configuration/_BuildPack.svelte
+++ b/src/routes/applications/[id]/configuration/_BuildPack.svelte
@@ -5,6 +5,7 @@
 	import { post } from '$lib/api';
 	import { findBuildPack } from '$lib/components/templates';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -42,7 +43,9 @@
 			buildPack.name && buildPack.color}"
 		><span>{buildPack.fancyName}</span>
 		{#if !scanning && foundConfig?.name === buildPack.name}
-			<span class="absolute bottom-0 pb-2 text-xs">Choose this one...</span>
+			<span class="absolute bottom-0 pb-2 text-xs"
+				>{$t('application.configuration.buildpack.choose_this_one')}</span
+			>
 		{/if}
 	</button>
 </form>
diff --git a/src/routes/applications/[id]/configuration/_GithubRepositories.svelte b/src/routes/applications/[id]/configuration/_GithubRepositories.svelte
index 06e58be58..4523da47f 100644
--- a/src/routes/applications/[id]/configuration/_GithubRepositories.svelte
+++ b/src/routes/applications/[id]/configuration/_GithubRepositories.svelte
@@ -7,6 +7,7 @@
 	import { errorNotification } from '$lib/form';
 	import { onMount } from 'svelte';
 	import { gitTokens } from '$lib/store';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -84,9 +85,7 @@
 				`/applications/${id}/configuration/repository.json?repository=${selected.repository}&branch=${selected.branch}`
 			);
 			if (data.used) {
-				const sure = confirm(
-					`This branch is already used by another application. Webhooks won't work in this case for both applications. Are you sure you want to use it?`
-				);
+				const sure = confirm($t('application.configuration.branch_already_in_use'));
 				if (sure) {
 					selected.autodeploy = false;
 					showSave = true;
@@ -160,8 +159,10 @@
 
 {#if repositories.length === 0 && loading.repositories === false}
 	<div class="flex-col text-center">
-		<div class="pb-4">No repositories configured for your Git Application.</div>
-		<a href={`/sources/${application.gitSource.id}`}><button>Configure it now</button></a>
+		<div class="pb-4">{$t('application.configuration.no_repositories_configured')}</div>
+		<a href={`/sources/${application.gitSource.id}`}
+			><button>{$t('application.configuration.configure_it_now')}</button></a
+		>
 	</div>
 {:else}
 	<form on:submit|preventDefault={handleSubmit} class="flex flex-col justify-center text-center">
@@ -170,8 +171,8 @@
 				<div class="custom-select-wrapper">
 					<Select
 						placeholder={loading.repositories
-							? 'Loading repositories ...'
-							: 'Please select a repository'}
+							? $t('application.configuration.loading_repositories')
+							: $t('application.configuration.select_a_repository')}
 						id="repository"
 						on:select={loadBranches}
 						items={reposSelectOptions}
@@ -182,10 +183,10 @@
 				<div class="custom-select-wrapper">
 					<Select
 						placeholder={loading.branches
-							? 'Loading branches ...'
+							? $t('application.configuration.loading_branches')
 							: !selected.repository
-							? 'Please select a repository first'
-							: 'Please select a branch'}
+							? $t('application.configuration.select_a_repository_first')
+							: $t('application.configuration.select_a_branch')}
 						id="repository"
 						on:select={isBranchAlreadyUsed}
 						items={branchSelectOptions}
@@ -200,7 +201,7 @@
 				type="submit"
 				disabled={!showSave}
 				class:bg-orange-600={showSave}
-				class:hover:bg-orange-500={showSave}>Save</button
+				class:hover:bg-orange-500={showSave}>{$t('forms.save')}</button
 			>
 			<!-- <button class="w-40"
 				><a
diff --git a/src/routes/applications/[id]/configuration/_GitlabRepositories.svelte b/src/routes/applications/[id]/configuration/_GitlabRepositories.svelte
index d83f56d17..a836b3507 100644
--- a/src/routes/applications/[id]/configuration/_GitlabRepositories.svelte
+++ b/src/routes/applications/[id]/configuration/_GitlabRepositories.svelte
@@ -9,6 +9,7 @@
 	import { goto } from '$app/navigation';
 	import { del, get, post, put } from '$lib/api';
 	import { gitTokens } from '$lib/store';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -139,9 +140,7 @@
 				`/applications/${id}/configuration/repository.json?repository=${selected.project.path_with_namespace}&branch=${selected.branch.name}`
 			);
 			if (data.used) {
-				const sure = confirm(
-					`This branch is already used by another application. Webhooks won't work in this case for both applications. Are you sure you want to use it?`
-				);
+				const sure = confirm($t('application.configuration.branch_already_in_use'));
 				if (sure) {
 					autodeploy = false;
 					showSave = true;
@@ -270,11 +269,11 @@
 	<div class="flex flex-col space-y-2 px-4 xl:flex-row xl:space-y-0 xl:space-x-2 ">
 		{#if loading.base}
 			<select name="group" disabled class="w-96">
-				<option selected value="">Loading groups...</option>
+				<option selected value="">{$t('application.configuration.loading_groups')}</option>
 			</select>
 		{:else}
 			<select name="group" class="w-96" bind:value={selected.group} on:change={loadProjects}>
-				<option value="" disabled selected>Please select a group</option>
+				<option value="" disabled selected>{$t('application.configuration.select_a_group')}</option>
 				{#each groups as group}
 					<option value={group}>{group.full_name}</option>
 				{/each}
@@ -282,7 +281,7 @@
 		{/if}
 		{#if loading.projects}
 			<select name="project" disabled class="w-96">
-				<option selected value="">Loading projects...</option>
+				<option selected value="">{$t('application.configuration.loading_projects')}</option>
 			</select>
 		{:else if !loading.projects && projects.length > 0}
 			<select
@@ -292,20 +291,24 @@
 				on:change={loadBranches}
 				disabled={!selected.group}
 			>
-				<option value="" disabled selected>Please select a project</option>
+				<option value="" disabled selected
+					>{$t('application.configuration.select_a_project')}</option
+				>
 				{#each projects as project}
 					<option value={project}>{project.name}</option>
 				{/each}
 			</select>
 		{:else}
 			<select name="project" disabled class="w-96">
-				<option disabled selected value="">No projects found</option>
+				<option disabled selected value=""
+					>{$t('application.configuration.no_projects_found')}</option
+				>
 			</select>
 		{/if}
 
 		{#if loading.branches}
 			<select name="branch" disabled class="w-96">
-				<option selected value="">Loading branches...</option>
+				<option selected value="">{$t('application.configuration.loading_branches')}</option>
 			</select>
 		{:else if !loading.branches && branches.length > 0}
 			<select
@@ -315,14 +318,17 @@
 				on:change={isBranchAlreadyUsed}
 				disabled={!selected.project}
 			>
-				<option value="" disabled selected>Please select a branch</option>
+				<option value="" disabled selected>{$t('application.configuration.select_a_branch')}</option
+				>
 				{#each branches as branch}
 					<option value={branch}>{branch.name}</option>
 				{/each}
 			</select>
 		{:else}
 			<select name="project" disabled class="w-96">
-				<option disabled selected value="">No branches found</option>
+				<option disabled selected value=""
+					>{$t('application.configuration.no_branches_found')}</option
+				>
 			</select>
 		{/if}
 	</div>
@@ -334,7 +340,7 @@
 			disabled={!showSave || loading.save}
 			class:bg-orange-600={showSave && !loading.save}
 			class:hover:bg-orange-500={showSave && !loading.save}
-			>{loading.save ? 'Saving...' : 'Save'}</button
+			>{loading.save ? $t('forms.saving') : $t('forms.save')}</button
 		>
 	</div>
 </form>
diff --git a/src/routes/applications/[id]/configuration/buildpack.svelte b/src/routes/applications/[id]/configuration/buildpack.svelte
index cd005768c..53b03a2d1 100644
--- a/src/routes/applications/[id]/configuration/buildpack.svelte
+++ b/src/routes/applications/[id]/configuration/buildpack.svelte
@@ -36,6 +36,7 @@
 	import { errorNotification } from '$lib/form';
 	import { gitTokens } from '$lib/store';
 	import { browser } from '$app/env';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 
@@ -198,18 +199,21 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Configure Build Pack</div>
+	<div class="mr-4 text-2xl tracking-tight">
+		{$t('application.configuration.configure_build_pack')}
+	</div>
 </div>
 
 {#if scanning}
 	<div class="flex justify-center space-x-1 p-6 font-bold">
-		<div class="text-xl tracking-tight">Scanning repository to suggest a build pack for you...</div>
+		<div class="text-xl tracking-tight">
+			{$t('application.configuration.scanning_repository_suggest_build_pack')}
+		</div>
 	</div>
 {:else}
 	{#if packageManager === 'yarn' || packageManager === 'pnpm'}
 		<div class="flex justify-center p-6">
-			Found lock file for <span class="font-bold text-orange-500 pl-1">{packageManager}</span>.
-			Using it for predefined commands commands.
+			{@html $t('application.configuration.found_lock_file')}
 		</div>
 	{/if}
 	<div class="max-w-7xl mx-auto flex flex-wrap justify-center">
diff --git a/src/routes/applications/[id]/configuration/destination.svelte b/src/routes/applications/[id]/configuration/destination.svelte
index 2c796b5ed..f46245951 100644
--- a/src/routes/applications/[id]/configuration/destination.svelte
+++ b/src/routes/applications/[id]/configuration/destination.svelte
@@ -33,6 +33,7 @@
 	import { errorNotification } from '$lib/form';
 	import { goto } from '$app/navigation';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -50,12 +51,14 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Configure Destination</div>
+	<div class="mr-4 text-2xl tracking-tight">
+		{$t('application.configuration.configure_destination')}
+	</div>
 </div>
 <div class="flex justify-center">
 	{#if !destinations || destinations.length === 0}
 		<div class="flex-col">
-			<div class="pb-2">No configurable Destination found</div>
+			<div class="pb-2">{$t('application.configuration.no_configurable_destination')}</div>
 			<div class="flex justify-center">
 				<a href="/new/destination" sveltekit:prefetch class="add-icon bg-sky-600 hover:bg-sky-500">
 					<svg
diff --git a/src/routes/applications/[id]/configuration/repository.svelte b/src/routes/applications/[id]/configuration/repository.svelte
index 330222861..822c0f74f 100644
--- a/src/routes/applications/[id]/configuration/repository.svelte
+++ b/src/routes/applications/[id]/configuration/repository.svelte
@@ -18,6 +18,8 @@
 </script>
 
 <script lang="ts">
+	import { t } from '$lib/translations';
+
 	export let application;
 	export let appId;
 
@@ -26,7 +28,9 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Select a Repository / Project</div>
+	<div class="mr-4 text-2xl tracking-tight">
+		{$t('application.configuration.select_a_repository_project')}
+	</div>
 </div>
 <div class="flex flex-wrap justify-center">
 	{#if application.gitSource.type === 'github'}
diff --git a/src/routes/applications/[id]/configuration/source.svelte b/src/routes/applications/[id]/configuration/source.svelte
index b1df17aa3..33736e3ac 100644
--- a/src/routes/applications/[id]/configuration/source.svelte
+++ b/src/routes/applications/[id]/configuration/source.svelte
@@ -33,6 +33,7 @@
 	import { errorNotification } from '$lib/form';
 	import { goto } from '$app/navigation';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -57,12 +58,14 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Select a Git Source</div>
+	<div class="mr-4 text-2xl tracking-tight">
+		{$t('application.configuration.select_a_git_source')}
+	</div>
 </div>
 <div class="flex flex-col justify-center">
 	{#if !filteredSources || filteredSources.length === 0}
 		<div class="flex-col">
-			<div class="pb-2">No configurable Git Source found</div>
+			<div class="pb-2">{$t('application.configuration.no_configurable_git')}</div>
 			<div class="flex justify-center">
 				<a href="/new/source" sveltekit:prefetch class="add-icon bg-orange-600 hover:bg-orange-500">
 					<svg
@@ -97,7 +100,7 @@
 							<div class="font-bold text-xl text-center truncate">{source.name}</div>
 							{#if source.gitlabApp && !source.gitlabAppId}
 								<div class="font-bold text-center truncate text-red-500 group-hover:text-white">
-									Configuration missing
+									{$t('application.configuration.configuration_missing')}
 								</div>
 							{/if}
 						</button>

From a788b7bc138d9022fce08ac36f011d2da76a5d55 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 23:00:03 +0200
Subject: [PATCH 09/23] Add translation for applications components

---
 src/lib/locales/en.json                       | 93 +++++++++++++++++-
 src/routes/applications/[id]/__layout.svelte  | 53 +++++-----
 src/routes/applications/[id]/check.json.ts    |  7 +-
 .../[id]/configuration/buildpack.svelte       |  2 +-
 src/routes/applications/[id]/index.svelte     | 97 +++++++++++--------
 .../[id]/logs/build/_BuildLog.svelte          |  3 +-
 .../applications/[id]/logs/build/index.svelte | 18 ++--
 .../applications/[id]/logs/index.svelte       |  3 +-
 .../applications/[id]/previews/index.svelte   | 21 ++--
 .../applications/[id]/secrets/_Secret.svelte  | 19 ++--
 .../applications/[id]/secrets/index.svelte    | 14 ++-
 src/routes/applications/[id]/settings.json.ts |  4 +-
 .../applications/[id]/storage/_Storage.svelte | 18 ++--
 .../applications/[id]/storage/index.svelte    |  8 +-
 src/routes/applications/_Application.svelte   |  3 +-
 src/routes/applications/index.svelte          |  5 +-
 16 files changed, 249 insertions(+), 119 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index 2c6d457eb..6c52891c6 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -30,7 +30,21 @@
 		"passwords_not_match": "Passwords do not match.",
 		"password_again": "Password again",
 		"save": "Save",
-		"saving": "Saving..."
+		"saving": "Saving...",
+		"name": "Name",
+		"value": "Value",
+		"action": "Action",
+		"is_required": "is required.",
+		"add": "Add",
+		"set": "Set",
+		"remove": "Remove",
+		"path": "Path",
+		"confirm_continue": "Are you sure to continue?",
+		"must_be_stopped_to_modify": "Must be stopped to modify.",
+		"port": "Port",
+		"default": "default",
+		"base_directory": "Base Directory",
+		"publish_directory": "Publish Directory"
 	},
 	"register": {
 		"register": "Register",
@@ -67,6 +81,79 @@
 			"select_a_git_source": "Select a Git Source",
 			"no_configurable_git": "No configurable Git Source found",
 			"configuration_missing": "Configuration missing"
-		}
-	}
+		},
+		"build": {
+			"queued_waiting_exec": "Queued and waiting for execution.",
+			"build_logs_of": "Build logs of",
+			"running": "Running",
+			"queued": "Queued",
+			"finished_in": "Finished in",
+			"load_more": "Load More",
+			"no_logs": "No logs found",
+			"waiting_logs": "Waiting for the logs..."
+		},
+		"preview": {
+			"need_during_buildtime": "Need during buildtime?",
+			"setup_secret_app_first": "You can add secrets to PR/MR deployments. Please add secrets to the application first. <br>Useful for creating <span class='text-green-500 font-bold'>staging</span> environments.",
+			"values_overwriting_app_secrets": "These values overwrite application secrets in PR/MR deployments. Useful for creating <span class='text-green-500 font-bold'>staging</span> environments.",
+			"redeploy": "Redeploy",
+			"no_previews_available": "No previews available"
+		},
+		"secrets": {
+			"secret_saved": "Secret saved.",
+			"use_isbuildsecret": "Use isBuildSecret",
+			"secrets_for": "Secrets for"
+		},
+		"storage": {
+			"path_is_required": "Path is required.",
+			"storage_saved": "Storage saved.",
+			"storage_updated": "Storage updated.",
+			"storage_deleted": "Storage deleted.",
+			"persistent_storage_explainer": "You can specify any folder that you want to be persistent across deployments. <br>This is useful for storing data such as a database (SQLite) or a cache."
+		},
+		"deployment_queued": "Deployment queued.",
+		"confirm_to_delete": "Are you sure you would like to delete '{0}'?",
+		"stop_application": "Stop application",
+		"permission_denied_stop_application": "You do not have permission to stop the application.",
+		"rebuild_application": "Rebuild application",
+		"permission_denied_rebuild_application": "You do not have permission to rebuild application.",
+		"build_and_start_application": "Build and start application",
+		"permission_denied_build_and_start_application": "You do not have permission to Build and start application.",
+		"configurations": "Configurations",
+		"secret": "Secrets",
+		"persistent_storage": "Persistent Storage",
+		"previews": "Previews",
+		"logs": "Application Logs",
+		"build_logs": "Build Logs",
+		"delete_application": "Delete application",
+		"permission_denied_delete_application": "You do not have permission to delete this application",
+		"domain_already_in_use": "Domain {domain} is already used.",
+		"dns_not_set_error": "DNS not set or propogated for {domain}.<br><br>Please check your DNS settings.",
+		"settings_saved": "Settings saved.",
+		"dns_not_set_partial_error": "DNS not set",
+		"git_source": "Git Source",
+		"git_repository": "Git Repository",
+		"build_pack": "Build Pack",
+		"destination": "Destination",
+		"application": "Application",
+		"domain_fqdn": "Domain (FQDN)",
+		"https_explainer": "If you specify <span class='text-green-500 font-bold'>https</span>, the application will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-green-500 font-bold'>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application.<br><br><span class='text-white font-bold'>You must set your DNS to point to the server IP in advance.</span>",
+		"ssl_www_and_non_www": "Generate SSL for www and non-www?",
+		"ssl_explainer": "It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-green-500'>both DNS entries</span> set in advance.<br><br>Useful if you expect to have visitors on both.",
+		"install_command": "Install Command",
+		"build_command": "Build Command",
+		"start_command": "Start Command",
+		"directory_to_use_explainer": "Directory to use as the base for all commands.<br>Could be useful with <span class='text-green-500 font-bold'>monorepos</span>.",
+		"publish_directory_explainer": "Directory containing all the assets for deployment. <br> For example: <span class='text-green-500 font-bold'>dist</span>,<span class='text-green-500 font-bold'>_site</span> or <span class='text-green-500 font-bold'>public</span>.",
+		"features": "Features",
+		"enable_automatic_deployment": "Enable Automatic Deployment",
+		"enable_auto_deploy_webhooks": "Enable automatic deployment through webhooks.",
+		"enable_mr_pr_previews": "Enable MR/PR Previews",
+		"enable_preview_deploy_mr_pr_requests": "Enable preview deployments from pull or merge requests.",
+		"debug_logs": "Debug Logs",
+		"enable_debug_log_during_build": "Enable debug logs during build phase.<br><span class='text-red-500 font-bold'>Sensitive information</span> could be visible and saved in logs.",
+		"cant_activate_auto_deploy_without_repo": "Cannot activate automatic deployments until only one application is defined for this repository / branch.",
+		"no_applications_found": "No applications found"
+	},
+	"general": "General"
 }
diff --git a/src/routes/applications/[id]/__layout.svelte b/src/routes/applications/[id]/__layout.svelte
index 4a79bba44..342ad99b4 100644
--- a/src/routes/applications/[id]/__layout.svelte
+++ b/src/routes/applications/[id]/__layout.svelte
@@ -77,6 +77,7 @@
 	import { goto } from '$app/navigation';
 	import { gitTokens } from '$lib/store';
 	import { toast } from '@zerodevx/svelte-toast';
+	import { t } from '$lib/translations';
 
 	if (githubToken) $gitTokens.githubToken = githubToken;
 	if (gitlabToken) $gitTokens.gitlabToken = gitlabToken;
@@ -87,7 +88,7 @@
 	async function handleDeploySubmit() {
 		try {
 			const { buildId } = await post(`/applications/${id}/deploy.json`, { ...application });
-			toast.push('Deployment queued.');
+			toast.push($t('application.deployment_queued'));
 			console.log($page.url);
 			if ($page.url.pathname.startsWith(`/applications/${id}/logs/build`)) {
 				return window.location.assign(`/applications/${id}/logs/build?buildId=${buildId}`);
@@ -102,7 +103,7 @@
 	}
 
 	async function deleteApplication(name) {
-		const sure = confirm(`Are you sure you would like to delete '${name}'?`);
+		const sure = confirm($t('application.confirm_to_delete', { name }));
 		if (sure) {
 			loading = true;
 			try {
@@ -132,13 +133,13 @@
 			{#if isRunning}
 				<button
 					on:click={stopApplication}
-					title="Stop application"
+					title={$t('application.stop_application')}
 					type="submit"
 					disabled={!$session.isAdmin}
 					class="icons bg-transparent tooltip-bottom text-sm flex items-center space-x-2 text-red-500"
 					data-tooltip={$session.isAdmin
-						? 'Stop application'
-						: 'You do not have permission to stop the application.'}
+						? $t('application.stop_application')
+						: $t('application.permission_denied_stop_application')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -157,13 +158,13 @@
 				</button>
 				<form on:submit|preventDefault={handleDeploySubmit}>
 					<button
-						title="Rebuild application"
+						title={$t('application.rebuild_application')}
 						type="submit"
 						disabled={!$session.isAdmin}
 						class="icons bg-transparent tooltip-bottom text-sm flex items-center space-x-2 hover:text-green-500"
 						data-tooltip={$session.isAdmin
-							? 'Rebuild application'
-							: 'You do not have permission to rebuild application.'}
+							? $t('application.rebuild_application')
+							: $t('application.permission_denied_rebuild_application')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -186,13 +187,13 @@
 			{:else}
 				<form on:submit|preventDefault={handleDeploySubmit}>
 					<button
-						title="Build and start application"
+						title={$t('application.build_and_start_application')}
 						type="submit"
 						disabled={!$session.isAdmin}
 						class="icons bg-transparent tooltip-bottom text-sm flex items-center space-x-2 text-green-500"
 						data-tooltip={$session.isAdmin
-							? 'Build and start application'
-							: 'You do not have permission to Build and start application.'}
+							? $t('application.build_and_start_application')
+							: $t('application.permission_denied_build_and_start_application')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -220,9 +221,9 @@
 				class:bg-coolgray-500={$page.url.pathname === `/applications/${id}`}
 			>
 				<button
-					title="Configurations"
+					title={$t('application.configurations')}
 					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500"
-					data-tooltip="Configurations"
+					data-tooltip={$t('application.configurations')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -255,9 +256,9 @@
 				class:bg-coolgray-500={$page.url.pathname === `/applications/${id}/secrets`}
 			>
 				<button
-					title="Secrets"
+					title={$t('application.secret')}
 					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500"
-					data-tooltip="Secrets"
+					data-tooltip={$t('application.secret')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -286,9 +287,9 @@
 				class:bg-coolgray-500={$page.url.pathname === `/applications/${id}/storage`}
 			>
 				<button
-					title="Persistent Storage"
+					title={$t('application.persistent_storage')}
 					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500"
-					data-tooltip="Persistent Storage"
+					data-tooltip={$t('application.persistent_storage')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -315,9 +316,9 @@
 				class:bg-coolgray-500={$page.url.pathname === `/applications/${id}/previews`}
 			>
 				<button
-					title="Previews"
+					title={$t('application.previews')}
 					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500"
-					data-tooltip="Previews"
+					data-tooltip={$t('application.previews')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -347,9 +348,9 @@
 				class:bg-coolgray-500={$page.url.pathname === `/applications/${id}/logs`}
 			>
 				<button
-					title="Application Logs"
+					title={$t('application.logs')}
 					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500 "
-					data-tooltip="Application Logs"
+					data-tooltip={$t('application.logs')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -378,9 +379,9 @@
 				class:bg-coolgray-500={$page.url.pathname === `/applications/${id}/logs/build`}
 			>
 				<button
-					title="Build Logs"
+					title={$t('application.build_logs')}
 					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500 "
-					data-tooltip="Build Logs"
+					data-tooltip={$t('application.build_logs')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -409,14 +410,14 @@
 
 		<button
 			on:click={() => deleteApplication(application.name)}
-			title="Delete application"
+			title={$t('application.delete_application')}
 			type="submit"
 			disabled={!$session.isAdmin}
 			class:hover:text-red-500={$session.isAdmin}
 			class="icons bg-transparent  tooltip-bottom text-sm"
 			data-tooltip={$session.isAdmin
-				? 'Delete application'
-				: 'You do not have permission to delete this application'}
+				? $t('application.delete_application')
+				: $t('application.permission_denied_delete_application')}
 		>
 			<DeleteIcon />
 		</button>
diff --git a/src/routes/applications/[id]/check.json.ts b/src/routes/applications/[id]/check.json.ts
index dc1b8ea98..c15fd8bab 100644
--- a/src/routes/applications/[id]/check.json.ts
+++ b/src/routes/applications/[id]/check.json.ts
@@ -4,6 +4,7 @@ import * as db from '$lib/database';
 import { ErrorHandler } from '$lib/database';
 import type { RequestHandler } from '@sveltejs/kit';
 import { promises as dns } from 'dns';
+import { t } from '$lib/translations';
 
 export const post: RequestHandler = async (event) => {
 	const { status, body } = await getUserDetails(event);
@@ -18,7 +19,9 @@ export const post: RequestHandler = async (event) => {
 		const found = await db.isDomainConfigured({ id, fqdn });
 		if (found) {
 			throw {
-				message: `Domain ${getDomain(fqdn).replace('www.', '')} is already used.`
+				message: t.get('application.domain_already_in_use', {
+					domain: getDomain(fqdn).replace('www.', '')
+				})
 			};
 		}
 		if (!dev && !forceSave) {
@@ -36,7 +39,7 @@ export const post: RequestHandler = async (event) => {
 			if (localIp?.length > 0) {
 				if (ip?.length === 0 || !ip.includes(localIp[0])) {
 					throw {
-						message: `DNS not set or propogated for ${domain}.<br><br>Please check your DNS settings.`
+						message: t.get('application.dns_not_set_error', { domain: domain })
 					};
 				}
 			}
diff --git a/src/routes/applications/[id]/configuration/buildpack.svelte b/src/routes/applications/[id]/configuration/buildpack.svelte
index 53b03a2d1..1b92877ca 100644
--- a/src/routes/applications/[id]/configuration/buildpack.svelte
+++ b/src/routes/applications/[id]/configuration/buildpack.svelte
@@ -213,7 +213,7 @@
 {:else}
 	{#if packageManager === 'yarn' || packageManager === 'pnpm'}
 		<div class="flex justify-center p-6">
-			{@html $t('application.configuration.found_lock_file')}
+			{@html $t('application.configuration.found_lock_file', { packageManager })}
 		</div>
 	{/if}
 	<div class="max-w-7xl mx-auto flex flex-wrap justify-center">
diff --git a/src/routes/applications/[id]/index.svelte b/src/routes/applications/[id]/index.svelte
index 49f800975..835b96cfa 100644
--- a/src/routes/applications/[id]/index.svelte
+++ b/src/routes/applications/[id]/index.svelte
@@ -47,6 +47,7 @@
 	import { post } from '$lib/api';
 	import cuid from 'cuid';
 	import { browser } from '$app/env';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	let domainEl: HTMLInputElement;
@@ -87,7 +88,7 @@
 				branch: application.branch,
 				projectId: application.projectId
 			});
-			return toast.push('Settings saved.');
+			return toast.push($t('application.settings_saved'));
 		} catch ({ error }) {
 			if (name === 'debug') {
 				debug = !debug;
@@ -111,7 +112,7 @@
 			await post(`/applications/${id}.json`, { ...application });
 			return window.location.reload();
 		} catch ({ error }) {
-			if (error.startsWith('DNS not set')) {
+			if (error.startsWith($t('application.dns_not_set_partial_error'))) {
 				forceSave = true;
 			}
 			return errorNotification(error);
@@ -194,7 +195,7 @@
 	<!-- svelte-ignore missing-declaration -->
 	<form on:submit|preventDefault={handleSubmit} class="py-4">
 		<div class="flex space-x-1 pb-5 font-bold">
-			<div class="title">General</div>
+			<div class="title">{$t('general')}</div>
 			{#if $session.isAdmin}
 				<button
 					type="submit"
@@ -203,13 +204,17 @@
 					class:hover:bg-green-500={!loading}
 					class:hover:bg-orange-400={forceSave}
 					disabled={loading}
-					>{loading ? 'Saving...' : forceSave ? 'Are you sure to continue?' : 'Save'}</button
+					>{loading
+						? $t('forms.saving')
+						: forceSave
+						? $t('forms.confirm_continue')
+						: $t('forms.save')}</button
 				>
 			{/if}
 		</div>
 		<div class="grid grid-flow-row gap-2 px-10">
 			<div class="mt-2 grid grid-cols-2 items-center">
-				<label for="name" class="text-base font-bold text-stone-100">Name</label>
+				<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 				<input
 					readonly={!$session.isAdmin}
 					name="name"
@@ -219,7 +224,9 @@
 				/>
 			</div>
 			<div class="grid grid-cols-2 items-center">
-				<label for="gitSource" class="text-base font-bold text-stone-100">Git Source</label>
+				<label for="gitSource" class="text-base font-bold text-stone-100"
+					>{$t('application.git_source')}</label
+				>
 				<a
 					href={$session.isAdmin
 						? `/applications/${id}/configuration/source?from=/applications/${id}`
@@ -234,7 +241,9 @@
 				>
 			</div>
 			<div class="grid grid-cols-2 items-center">
-				<label for="repository" class="text-base font-bold text-stone-100">Git Repository</label>
+				<label for="repository" class="text-base font-bold text-stone-100"
+					>{$t('application.git_repository')}</label
+				>
 				<a
 					href={$session.isAdmin
 						? `/applications/${id}/configuration/repository?from=/applications/${id}&to=/applications/${id}/configuration/buildpack`
@@ -249,7 +258,9 @@
 				>
 			</div>
 			<div class="grid grid-cols-2 items-center">
-				<label for="buildPack" class="text-base font-bold text-stone-100">Build Pack</label>
+				<label for="buildPack" class="text-base font-bold text-stone-100"
+					>{$t('application.build_pack')}</label
+				>
 				<a
 					href={$session.isAdmin
 						? `/applications/${id}/configuration/buildpack?from=/applications/${id}`
@@ -265,7 +276,9 @@
 				>
 			</div>
 			<div class="grid grid-cols-2 items-center pb-8">
-				<label for="destination" class="text-base font-bold text-stone-100">Destination</label>
+				<label for="destination" class="text-base font-bold text-stone-100"
+					>{$t('application.destination')}</label
+				>
 				<div class="no-underline">
 					<input
 						value={application.destinationDocker.name}
@@ -277,20 +290,20 @@
 			</div>
 		</div>
 		<div class="flex space-x-1 py-5 font-bold">
-			<div class="title">Application</div>
+			<div class="title">{$t('application.application')}</div>
 		</div>
 		<div class="grid grid-flow-row gap-2 px-10">
 			<div class="grid grid-cols-2">
 				<div class="flex-col">
-					<label for="fqdn" class="pt-2 text-base font-bold text-stone-100">Domain (FQDN)</label>
+					<label for="fqdn" class="pt-2 text-base font-bold text-stone-100"
+						>{$t('application.domain_fqdn')}</label
+					>
 					{#if browser && window.location.hostname === 'demo.coolify.io'}
 						<Explainer
 							text="<span class='text-white font-bold'>You can use the predefined random domain name or enter your own domain name.</span>"
 						/>
 					{/if}
-					<Explainer
-						text="If you specify <span class='text-green-500 font-bold'>https</span>, the application will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-green-500 font-bold'>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application.<br><br><span class='text-white font-bold'>You must set your DNS to point to the server IP in advance.</span>"
-					/>
+					<Explainer text={$t('application.https_explainer')} />
 				</div>
 				<input
 					readonly={!$session.isAdmin || isRunning}
@@ -306,24 +319,24 @@
 			</div>
 			<div class="grid grid-cols-2 items-center pb-8">
 				<Setting
-					dataTooltip="Must be stopped to modify."
+					dataTooltip={$t('forms.must_be_stopped_to_modify')}
 					disabled={isRunning}
 					isCenter={false}
 					bind:setting={dualCerts}
-					title="Generate SSL for www and non-www?"
-					description="It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-green-500'>both DNS entries</span> set in advance.<br><br>Useful if you expect to have visitors on both."
+					title={$t('application.ssl_www_and_non_www')}
+					description={$t('application.ssl_explainer')}
 					on:click={() => !isRunning && changeSettings('dualCerts')}
 				/>
 			</div>
 			{#if !staticDeployments.includes(application.buildPack)}
 				<div class="grid grid-cols-2 items-center">
-					<label for="port" class="text-base font-bold text-stone-100">Port</label>
+					<label for="port" class="text-base font-bold text-stone-100">{$t('forms.port')}</label>
 					<input
 						readonly={!$session.isAdmin}
 						name="port"
 						id="port"
 						bind:value={application.port}
-						placeholder="default: 3000"
+						placeholder="{$t('forms.default')}: 3000"
 					/>
 				</div>
 			{/if}
@@ -331,63 +344,63 @@
 			{#if !notNodeDeployments.includes(application.buildPack)}
 				<div class="grid grid-cols-2 items-center">
 					<label for="installCommand" class="text-base font-bold text-stone-100"
-						>Install Command</label
+						>{$t('application.install_command')}</label
 					>
 					<input
 						readonly={!$session.isAdmin}
 						name="installCommand"
 						id="installCommand"
 						bind:value={application.installCommand}
-						placeholder="default: yarn install"
+						placeholder="{$t('forms.default')}: yarn install"
 					/>
 				</div>
 				<div class="grid grid-cols-2 items-center">
-					<label for="buildCommand" class="text-base font-bold text-stone-100">Build Command</label>
+					<label for="buildCommand" class="text-base font-bold text-stone-100"
+						>{$t('application.build_command')}</label
+					>
 					<input
 						readonly={!$session.isAdmin}
 						name="buildCommand"
 						id="buildCommand"
 						bind:value={application.buildCommand}
-						placeholder="default: yarn build"
+						placeholder="{$t('forms.default')}: yarn build"
 					/>
 				</div>
 				<div class="grid grid-cols-2 items-center">
-					<label for="startCommand" class="text-base font-bold text-stone-100">Start Command</label>
+					<label for="startCommand" class="text-base font-bold text-stone-100"
+						>{$t('application.start_command')}</label
+					>
 					<input
 						readonly={!$session.isAdmin}
 						name="startCommand"
 						id="startCommand"
 						bind:value={application.startCommand}
-						placeholder="default: yarn start"
+						placeholder="{$t('forms.default')}: yarn start"
 					/>
 				</div>
 			{/if}
 			<div class="grid grid-cols-2 items-center">
 				<div class="flex-col">
 					<label for="baseDirectory" class="pt-2 text-base font-bold text-stone-100"
-						>Base Directory</label
+						>{$t('forms.base_directory')}</label
 					>
-					<Explainer
-						text="Directory to use as the base for all commands.<br>Could be useful with <span class='text-green-500 font-bold'>monorepos</span>."
-					/>
+					<Explainer text={$t('application.directory_to_use_explainer')} />
 				</div>
 				<input
 					readonly={!$session.isAdmin}
 					name="baseDirectory"
 					id="baseDirectory"
 					bind:value={application.baseDirectory}
-					placeholder="default: /"
+					placeholder="{$t('forms.default')}: /"
 				/>
 			</div>
 			{#if !notNodeDeployments.includes(application.buildPack)}
 				<div class="grid grid-cols-2 items-center">
 					<div class="flex-col">
 						<label for="publishDirectory" class="pt-2 text-base font-bold text-stone-100"
-							>Publish Directory</label
+							>{$t('forms.publish_directory')}</label
 						>
-						<Explainer
-							text="Directory containing all the assets for deployment. <br> For example: <span class='text-green-500 font-bold'>dist</span>,<span class='text-green-500 font-bold'>_site</span> or <span class='text-green-500 font-bold'>public</span>."
-						/>
+						<Explainer text={$t('application.publish_directory_explainer')} />
 					</div>
 
 					<input
@@ -395,14 +408,14 @@
 						name="publishDirectory"
 						id="publishDirectory"
 						bind:value={application.publishDirectory}
-						placeholder=" default: /"
+						placeholder=" {$t('forms.default')}: /"
 					/>
 				</div>
 			{/if}
 		</div>
 	</form>
 	<div class="flex space-x-1 pb-5 font-bold">
-		<div class="title">Features</div>
+		<div class="title">{$t('application.features')}</div>
 	</div>
 	<div class="px-10 pb-10">
 		<div class="grid grid-cols-2 items-center">
@@ -410,8 +423,8 @@
 				isCenter={false}
 				bind:setting={autodeploy}
 				on:click={() => changeSettings('autodeploy')}
-				title="Enable Automatic Deployment"
-				description="Enable automatic deployment through webhooks."
+				title={$t('application.enable_automatic_deployment')}
+				description={$t('application.enable_auto_deploy_webhooks')}
 			/>
 		</div>
 		<div class="grid grid-cols-2 items-center">
@@ -419,8 +432,8 @@
 				isCenter={false}
 				bind:setting={previews}
 				on:click={() => changeSettings('previews')}
-				title="Enable MR/PR Previews"
-				description="Enable preview deployments from pull or merge requests."
+				title={$t('application.enable_mr_pr_previews')}
+				description={$t('application.enable_preview_deploy_mr_pr_requests')}
 			/>
 		</div>
 		<div class="grid grid-cols-2 items-center">
@@ -428,8 +441,8 @@
 				isCenter={false}
 				bind:setting={debug}
 				on:click={() => changeSettings('debug')}
-				title="Debug Logs"
-				description="Enable debug logs during build phase.<br><span class='text-red-500 font-bold'>Sensitive information</span> could be visible and saved in logs."
+				title={$t('application.debug_logs')}
+				description={$t('application.enable_debug_log_during_build')}
 			/>
 		</div>
 	</div>
diff --git a/src/routes/applications/[id]/logs/build/_BuildLog.svelte b/src/routes/applications/[id]/logs/build/_BuildLog.svelte
index 4379d2d27..9a8dea4cc 100644
--- a/src/routes/applications/[id]/logs/build/_BuildLog.svelte
+++ b/src/routes/applications/[id]/logs/build/_BuildLog.svelte
@@ -10,6 +10,7 @@
 	import LoadingLogs from '../_Loading.svelte';
 	import { get } from '$lib/api';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 
 	let logs = [];
 	let loading = true;
@@ -84,7 +85,7 @@
 			<LoadingLogs />
 		{/if}
 		{#if currentStatus === 'queued'}
-			<div class="text-center font-bold text-xl">Queued and waiting for execution.</div>
+			<div class="text-center font-bold text-xl">{$t('application.build.queued_waiting_exec')}</div>
 		{:else}
 			<div class="flex justify-end sticky top-0 p-2">
 				<button
diff --git a/src/routes/applications/[id]/logs/build/index.svelte b/src/routes/applications/[id]/logs/build/index.svelte
index e4c5c4ec9..712c37346 100644
--- a/src/routes/applications/[id]/logs/build/index.svelte
+++ b/src/routes/applications/[id]/logs/build/index.svelte
@@ -27,6 +27,7 @@
 	import { get } from '$lib/api';
 	import { errorNotification } from '$lib/form';
 	import { goto } from '$app/navigation';
+	import { t } from '$lib/translations';
 
 	export let builds;
 	export let application;
@@ -87,7 +88,8 @@
 
 <div class="flex space-x-1 p-6 font-bold">
 	<div class="mr-4 text-2xl tracking-tight">
-		Build logs of <a href={application.fqdn} target="_blank">{getDomain(application.fqdn)}</a>
+		{$t('application.build.build_logs_of')}
+		<a href={application.fqdn} target="_blank">{getDomain(application.fqdn)}</a>
 	</div>
 </div>
 <div class="block flex-row justify-start space-x-2 px-5 pt-6 sm:px-10 md:flex">
@@ -119,19 +121,23 @@
 
 					<div class="w-48 text-center text-xs">
 						{#if build.status === 'running'}
-							<div class="font-bold">Running</div>
+							<div class="font-bold">{$t('application.build.running')}</div>
 						{:else if build.status === 'queued'}
-							<div class="font-bold">Queued</div>
+							<div class="font-bold">{$t('application.build.queued')}</div>
 						{:else}
 							<div>{build.since}</div>
-							<div>Finished in <span class="font-bold">{build.took}s</span></div>
+							<div>
+								{$t('application.build.finished_in')} <span class="font-bold">{build.took}s</span>
+							</div>
 						{/if}
 					</div>
 				</div>
 			{/each}
 		</div>
 		<div class="flex space-x-2">
-			<button disabled={noMoreBuilds} class="w-full" on:click={loadMoreBuilds}>Load More</button>
+			<button disabled={noMoreBuilds} class="w-full" on:click={loadMoreBuilds}
+				>{$t('application.build.load_more')}</button
+			>
 		</div>
 	</div>
 	<div class="flex-1 md:w-96">
@@ -143,5 +149,5 @@
 	</div>
 </div>
 {#if buildCount === 0}
-	<div class="text-center text-xl font-bold">No logs found</div>
+	<div class="text-center text-xl font-bold">{$t('application.build.no_logs')}</div>
 {/if}
diff --git a/src/routes/applications/[id]/logs/index.svelte b/src/routes/applications/[id]/logs/index.svelte
index 036832f6c..c5eb52a2f 100644
--- a/src/routes/applications/[id]/logs/index.svelte
+++ b/src/routes/applications/[id]/logs/index.svelte
@@ -27,6 +27,7 @@
 	import { getDomain } from '$lib/components/common';
 	import { get } from '$lib/api';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 
 	let loadLogsInterval = null;
 	let logs = [];
@@ -75,7 +76,7 @@
 </div>
 <div class="flex flex-row justify-center space-x-2 px-10 pt-6">
 	{#if logs.length === 0}
-		<div class="text-xl font-bold tracking-tighter">Waiting for the logs...</div>
+		<div class="text-xl font-bold tracking-tighter">{$t('application.build.waiting_logs')}</div>
 	{:else}
 		<div class="relative">
 			<LoadingLogs />
diff --git a/src/routes/applications/[id]/previews/index.svelte b/src/routes/applications/[id]/previews/index.svelte
index e78e46efd..5d249412d 100644
--- a/src/routes/applications/[id]/previews/index.svelte
+++ b/src/routes/applications/[id]/previews/index.svelte
@@ -31,6 +31,7 @@
 	import Explainer from '$lib/components/Explainer.svelte';
 	import { errorNotification } from '$lib/form';
 	import { toast } from '@zerodevx/svelte-toast';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	async function refreshSecrets() {
@@ -61,10 +62,12 @@
 		<table class="mx-auto border-separate text-left">
 			<thead>
 				<tr class="h-12">
-					<th scope="col">Name</th>
-					<th scope="col">Value</th>
-					<th scope="col" class="w-64 text-center">Need during buildtime?</th>
-					<th scope="col" class="w-96 text-center">Action</th>
+					<th scope="col">{$t('forms.name')}</th>
+					<th scope="col">{$t('forms.value')}</th>
+					<th scope="col" class="w-64 text-center"
+						>{$t('application.preview.need_during_buildtime')}</th
+					>
+					<th scope="col" class="w-96 text-center">{$t('forms.action')}</th>
 				</tr>
 			</thead>
 			<tbody>
@@ -90,8 +93,8 @@
 	<Explainer
 		customClass="w-full"
 		text={applicationSecrets.length === 0
-			? "You can add secrets to PR/MR deployments. Please add secrets to the application first. <br>Useful for creating <span class='text-green-500 font-bold'>staging</span> environments."
-			: "These values overwrite application secrets in PR/MR deployments. Useful for creating <span class='text-green-500 font-bold'>staging</span> environments."}
+			? $t('application.preview.setup_secret_app_first')
+			: $t('application.preview.values_overwriting_app_secrets')}
 	/>
 </div>
 <div class="mx-auto max-w-4xl py-10">
@@ -105,13 +108,15 @@
 				</a>
 				<div class="flex items-center justify-center">
 					<button class="bg-coollabs hover:bg-coollabs-100" on:click={() => redeploy(container)}
-						>Redeploy</button
+						>{$t('application.preview.redeploy')}</button
 					>
 				</div>
 			{/each}
 		{:else}
 			<div class="flex-col">
-				<div class="text-center font-bold text-xl">No previews available</div>
+				<div class="text-center font-bold text-xl">
+					{$t('application.preview.no_previews_available')}
+				</div>
 			</div>
 		{/if}
 	</div>
diff --git a/src/routes/applications/[id]/secrets/_Secret.svelte b/src/routes/applications/[id]/secrets/_Secret.svelte
index 12b03cb7b..34b997761 100644
--- a/src/routes/applications/[id]/secrets/_Secret.svelte
+++ b/src/routes/applications/[id]/secrets/_Secret.svelte
@@ -12,6 +12,7 @@
 	import { del, post } from '$lib/api';
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	import { toast } from '@zerodevx/svelte-toast';
 	import { createEventDispatcher } from 'svelte';
 
@@ -31,8 +32,8 @@
 		}
 	}
 	async function saveSecret(isNew = false) {
-		if (!name) return errorNotification('Name is required.');
-		if (!value) return errorNotification('Value is required.');
+		if (!name) return errorNotification(`${$t('forms.name')} ${$t('forms.is_required')}`);
+		if (!value) return errorNotification(`${$t('forms.value')} ${$t('forms.is_required')}`);
 		try {
 			await post(`/applications/${id}/secrets.json`, {
 				name,
@@ -47,7 +48,7 @@
 				value = '';
 				isBuildSecret = false;
 			}
-			toast.push('Secret saved.');
+			toast.push($t('application.secrets.secret_saved'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
@@ -93,7 +94,7 @@
 		class:cursor-not-allowed={!isNewSecret}
 		class:cursor-pointer={isNewSecret}
 	>
-		<span class="sr-only">Use isBuildSecret</span>
+		<span class="sr-only">{$t('application.secrets.use_isbuildsecret')}</span>
 		<span
 			class="pointer-events-none relative inline-block h-5 w-5 transform rounded-full bg-white shadow transition duration-200 ease-in-out"
 			class:translate-x-5={isBuildSecret}
@@ -133,16 +134,20 @@
 <td>
 	{#if isNewSecret}
 		<div class="flex items-center justify-center">
-			<button class="bg-green-600 hover:bg-green-500" on:click={() => saveSecret(true)}>Add</button>
+			<button class="bg-green-600 hover:bg-green-500" on:click={() => saveSecret(true)}
+				>{$t('forms.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={() => saveSecret(false)}>Set</button>
+				<button class="" on:click={() => saveSecret(false)}>{$t('forms.set')}</button>
 			</div>
 			{#if !isPRMRSecret}
 				<div class="flex justify-center items-end">
-					<button class="bg-red-600 hover:bg-red-500" on:click={removeSecret}>Remove</button>
+					<button class="bg-red-600 hover:bg-red-500" on:click={removeSecret}
+						>{$t('forms.remove')}</button
+					>
 				</div>
 			{/if}
 		</div>
diff --git a/src/routes/applications/[id]/secrets/index.svelte b/src/routes/applications/[id]/secrets/index.svelte
index faeb22361..dd0ceab49 100644
--- a/src/routes/applications/[id]/secrets/index.svelte
+++ b/src/routes/applications/[id]/secrets/index.svelte
@@ -26,6 +26,7 @@
 	import { getDomain } from '$lib/components/common';
 	import { page } from '$app/stores';
 	import { get } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 
@@ -37,17 +38,20 @@
 
 <div class="flex space-x-1 p-6 font-bold">
 	<div class="mr-4 text-2xl tracking-tight">
-		Secrets for <a href={application.fqdn} target="_blank">{getDomain(application.fqdn)}</a>
+		{$t('application.secrets.secrets_for')}
+		<a href={application.fqdn} target="_blank">{getDomain(application.fqdn)}</a>
 	</div>
 </div>
 <div class="mx-auto max-w-6xl rounded-xl px-6 pt-4">
 	<table class="mx-auto border-separate text-left">
 		<thead>
 			<tr class="h-12">
-				<th scope="col">Name</th>
-				<th scope="col">Value</th>
-				<th scope="col" class="w-64 text-center">Need during buildtime?</th>
-				<th scope="col" class="w-96 text-center">Action</th>
+				<th scope="col">{$t('forms.name')}</th>
+				<th scope="col">{$t('forms.value')}</th>
+				<th scope="col" class="w-64 text-center"
+					>{$t('application.preview.need_during_buildtime')}</th
+				>
+				<th scope="col" class="w-96 text-center">{$t('forms.action')}</th>
 			</tr>
 		</thead>
 		<tbody>
diff --git a/src/routes/applications/[id]/settings.json.ts b/src/routes/applications/[id]/settings.json.ts
index aea78ff96..77c4bc886 100644
--- a/src/routes/applications/[id]/settings.json.ts
+++ b/src/routes/applications/[id]/settings.json.ts
@@ -1,6 +1,7 @@
 import { getUserDetails } from '$lib/common';
 import * as db from '$lib/database';
 import { ErrorHandler } from '$lib/database';
+import { t } from '$lib/translations';
 import type { RequestHandler } from '@sveltejs/kit';
 
 export const post: RequestHandler = async (event) => {
@@ -14,8 +15,7 @@ export const post: RequestHandler = async (event) => {
 		const isDouble = await db.checkDoubleBranch(branch, projectId);
 		if (isDouble && autodeploy) {
 			throw {
-				message:
-					'Cannot activate automatic deployments until only one application is defined for this repository / branch.'
+				message: t.get('application.cant_activate_auto_deploy_without_repo')
 			};
 		}
 		await db.setApplicationSettings({ id, debug, previews, dualCerts, autodeploy });
diff --git a/src/routes/applications/[id]/storage/_Storage.svelte b/src/routes/applications/[id]/storage/_Storage.svelte
index 0b75ec717..363c93390 100644
--- a/src/routes/applications/[id]/storage/_Storage.svelte
+++ b/src/routes/applications/[id]/storage/_Storage.svelte
@@ -10,12 +10,13 @@
 
 	import { errorNotification } from '$lib/form';
 	import { toast } from '@zerodevx/svelte-toast';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	const dispatch = createEventDispatcher();
 	async function saveStorage(newStorage = false) {
 		try {
-			if (!storage.path) return errorNotification('Path is required.');
+			if (!storage.path) return errorNotification($t('application.storage.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, '/');
@@ -29,8 +30,8 @@
 				storage.path = null;
 				storage.id = null;
 			}
-			if (newStorage) toast.push('Storage saved.');
-			else toast.push('Storage updated.');
+			if (newStorage) toast.push($t('application.storage.storage_saved'));
+			else toast.push($t('application.storage.storage_updated'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
@@ -39,7 +40,7 @@
 		try {
 			await del(`/applications/${id}/storage.json`, { path: storage.path });
 			dispatch('refresh');
-			toast.push('Storage deleted.');
+			toast.push($t('application.storage.storage_deleted'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
@@ -57,16 +58,19 @@
 <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
+			<button class="bg-green-600 hover:bg-green-500" on:click={() => saveStorage(true)}
+				>{$t('forms.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>
+				<button class="" on:click={() => saveStorage(false)}>{$t('forms.set')}</button>
 			</div>
 			<div class="flex justify-center items-end">
-				<button class="bg-red-600 hover:bg-red-500" on:click={removeStorage}>Remove</button>
+				<button class="bg-red-600 hover:bg-red-500" on:click={removeStorage}
+					>{$t('forms.remove')}</button
+				>
 			</div>
 		</div>
 	{/if}
diff --git a/src/routes/applications/[id]/storage/index.svelte b/src/routes/applications/[id]/storage/index.svelte
index 75b129d68..473d35f2a 100644
--- a/src/routes/applications/[id]/storage/index.svelte
+++ b/src/routes/applications/[id]/storage/index.svelte
@@ -28,6 +28,7 @@
 	import Storage from './_Storage.svelte';
 	import { get } from '$lib/api';
 	import Explainer from '$lib/components/Explainer.svelte';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	async function refreshStorage() {
@@ -46,15 +47,12 @@
 
 <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 deployments. <br>This is useful for storing data such as a database (SQLite) or a cache.'}
-		/>
+		<Explainer customClass="w-full" text={$t('application.storage.persistent_storage_explainer')} />
 	</div>
 	<table class="mx-auto border-separate text-left">
 		<thead>
 			<tr class="h-12">
-				<th scope="col">Path</th>
+				<th scope="col">{$t('forms.path')}</th>
 			</tr>
 		</thead>
 		<tbody>
diff --git a/src/routes/applications/_Application.svelte b/src/routes/applications/_Application.svelte
index 16d19a42f..d3b9b9d51 100644
--- a/src/routes/applications/_Application.svelte
+++ b/src/routes/applications/_Application.svelte
@@ -15,6 +15,7 @@
 	import Docker from '$lib/components/svg/applications/Docker.svelte';
 	import Astro from '$lib/components/svg/applications/Astro.svelte';
 	import Eleventy from '$lib/components/svg/applications/Eleventy.svelte';
+	import { t } from '$lib/translations';
 
 	const buildPack = application?.buildPack?.toLowerCase();
 </script>
@@ -59,7 +60,7 @@
 		{/if}
 		{#if !application.gitSourceId || !application.destinationDockerId}
 			<div class="truncate text-center font-bold text-red-500 group-hover:text-white">
-				Configuration missing
+				{$t('application.configuration.configuration_missing')}
 			</div>
 		{/if}
 	</div>
diff --git a/src/routes/applications/index.svelte b/src/routes/applications/index.svelte
index 5f6056ac5..d559fd7b9 100644
--- a/src/routes/applications/index.svelte
+++ b/src/routes/applications/index.svelte
@@ -4,6 +4,7 @@
 	import Application from './_Application.svelte';
 	import { post } from '$lib/api';
 	import { goto } from '$app/navigation';
+	import { t } from '$lib/translations';
 	async function newApplication() {
 		const { id } = await post('/applications/new', {});
 		return await goto(`/applications/${id}`, { replaceState: true });
@@ -11,7 +12,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl ">Applications</div>
+	<div class="mr-4 text-2xl ">{$t('index.applications')}</div>
 	{#if $session.isAdmin}
 		<div on:click={newApplication} class="add-icon cursor-pointer bg-green-600 hover:bg-green-500">
 			<svg
@@ -33,7 +34,7 @@
 <div class="flex flex-wrap justify-center">
 	{#if !applications || applications.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">No applications found</div>
+			<div class="text-center text-xl font-bold">{$t('application.no_applications_found')}</div>
 		</div>
 	{:else}
 		{#each applications as application}

From 7a0d15146749f8cde90699ee9db0b2148b7102c6 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 23:17:59 +0200
Subject: [PATCH 10/23] Add database translation

---
 src/lib/locales/en.json                       | 31 +++++++++++++-
 .../databases/[id]/_Databases/_CouchDb.svelte | 27 +++++++-----
 .../[id]/_Databases/_Databases.svelte         | 41 +++++++++++--------
 .../databases/[id]/_Databases/_MongoDB.svelte | 11 +++--
 .../databases/[id]/_Databases/_MySQL.svelte   | 27 +++++++-----
 .../[id]/_Databases/_PostgreSQL.svelte        | 17 +++++---
 .../databases/[id]/_Databases/_Redis.svelte   | 15 ++++---
 src/routes/databases/[id]/__layout.svelte     | 21 +++++-----
 .../[id]/configuration/destination.svelte     |  7 +++-
 .../databases/[id]/configuration/type.svelte  |  2 +-
 .../[id]/configuration/version.svelte         |  3 +-
 src/routes/databases/index.svelte             |  7 ++--
 .../services/[id]/_Services/_MinIO.svelte     |  6 +--
 .../[id]/_Services/_PlausibleAnalytics.svelte |  2 +-
 .../services/[id]/_Services/_Wordpress.svelte |  4 +-
 15 files changed, 143 insertions(+), 78 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index 6c52891c6..3b0ff03fd 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -44,7 +44,15 @@
 		"port": "Port",
 		"default": "default",
 		"base_directory": "Base Directory",
-		"publish_directory": "Publish Directory"
+		"publish_directory": "Publish Directory",
+		"generated_automatically_after_start": "Generated automatically after start",
+		"roots_password": "Root's Password",
+		"root_user": "Root User",
+		"eg": "eg",
+		"user": "User",
+		"loading": "Loading...",
+		"version": "Version",
+		"host": "Host"
 	},
 	"register": {
 		"register": "Register",
@@ -155,5 +163,24 @@
 		"cant_activate_auto_deploy_without_repo": "Cannot activate automatic deployments until only one application is defined for this repository / branch.",
 		"no_applications_found": "No applications found"
 	},
-	"general": "General"
+	"general": "General",
+	"database": {
+		"default_database": "Default Database",
+		"generated_automatically_after_set_to_public": "Generated automatically after set to public",
+		"connection_string": "Connection String",
+		"set_public": "Set it public",
+		"warning_database_public": "Your database will be reachable over the internet. <br>Take security seriously in this case!",
+		"change_append_only_mode": "Change append only mode",
+		"warning_append_only": "Useful if you would like to restore redis data from a backup.<br><span class='font-bold text-white'>Database restart is required.</span>",
+		"select_database_type": "Select a Database type",
+		"select_database_version": "Select a Database version",
+		"confirm_stop": "Are you sure you would like to stop {name}?",
+		"stop_database": "Stop database",
+		"permission_denied_stop_database": "You do not have permission to stop the database.",
+		"start_database": "Start database",
+		"permission_denied_start_database": "You do not have permission to start the database.",
+		"delete_database": "Delete Database",
+		"permission_denied_delete_database": "You do not have permission to delete a Database",
+		"no_databases_found": "No databases found"
+	}
 }
diff --git a/src/routes/databases/[id]/_Databases/_CouchDb.svelte b/src/routes/databases/[id]/_Databases/_CouchDb.svelte
index 861e21cb5..f8f9ebc10 100644
--- a/src/routes/databases/[id]/_Databases/_CouchDb.svelte
+++ b/src/routes/databases/[id]/_Databases/_CouchDb.svelte
@@ -1,6 +1,7 @@
 <script>
 	export let database;
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 py-5 font-bold">
@@ -8,34 +9,38 @@
 </div>
 <div class="space-y-2 px-10">
 	<div class="grid grid-cols-2 items-center">
-		<label for="defaultDatabase" class="text-base font-bold text-stone-100">Default Database</label>
+		<label for="defaultDatabase" class="text-base font-bold text-stone-100"
+			>{$t('database.default_database')}</label
+		>
 		<CopyPasswordField
 			required
 			readonly={database.defaultDatabase}
 			disabled={database.defaultDatabase}
-			placeholder="eg: mydb"
+			placeholder="{$t('forms.eg')}: mydb"
 			id="defaultDatabase"
 			name="defaultDatabase"
 			bind:value={database.defaultDatabase}
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="dbUser" class="text-base font-bold text-stone-100">User</label>
+		<label for="dbUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			id="dbUser"
 			name="dbUser"
 			value={database.dbUser}
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="dbUserPassword" class="text-base font-bold text-stone-100">Password</label>
+		<label for="dbUserPassword" class="text-base font-bold text-stone-100"
+			>{$t('forms.password')}</label
+		>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			isPasswordField
 			id="dbUserPassword"
 			name="dbUserPassword"
@@ -43,22 +48,24 @@
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="rootUser" class="text-base font-bold text-stone-100">Root User</label>
+		<label for="rootUser" class="text-base font-bold text-stone-100">{$t('forms.root_user')}</label>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			id="rootUser"
 			name="rootUser"
 			value={database.rootUser}
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="rootUserPassword" class="text-base font-bold text-stone-100">Root's Password</label>
+		<label for="rootUserPassword" class="text-base font-bold text-stone-100"
+			>{$t('forms.roots_password')}</label
+		>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			isPasswordField
 			id="rootUserPassword"
 			name="rootUserPassword"
diff --git a/src/routes/databases/[id]/_Databases/_Databases.svelte b/src/routes/databases/[id]/_Databases/_Databases.svelte
index 1820577bc..38a3e2c3e 100644
--- a/src/routes/databases/[id]/_Databases/_Databases.svelte
+++ b/src/routes/databases/[id]/_Databases/_Databases.svelte
@@ -15,6 +15,7 @@
 	import { browser } from '$app/env';
 	import { post } from '$lib/api';
 	import { getDomain } from '$lib/components/common';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	let loading = false;
@@ -45,7 +46,7 @@
 							: window.location.hostname
 						: database.id
 			  }:${isPublic ? database.publicPort : privatePort}/${databaseDefault}`
-			: 'Loading...';
+			: $t('forms.loading');
 	}
 
 	async function changeSettings(name) {
@@ -78,20 +79,20 @@
 <div class="mx-auto max-w-4xl px-6">
 	<form on:submit|preventDefault={handleSubmit} class="py-4">
 		<div class="flex space-x-1 pb-5 font-bold">
-			<div class="title">General</div>
+			<div class="title">{$t('general')}</div>
 			{#if $session.isAdmin}
 				<button
 					type="submit"
 					class:bg-purple-600={!loading}
 					class:hover:bg-purple-500={!loading}
-					disabled={loading}>{loading ? 'Saving...' : 'Save'}</button
+					disabled={loading}>{loading ? $t('forms.saving') : $t('forms.save')}</button
 				>
 			{/if}
 		</div>
 
 		<div class="grid grid-flow-row gap-2 px-10">
 			<div class="grid grid-cols-2 items-center">
-				<label for="name" class="text-base font-bold text-stone-100">Name</label>
+				<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 				<input
 					readonly={!$session.isAdmin}
 					name="name"
@@ -101,7 +102,9 @@
 				/>
 			</div>
 			<div class="grid grid-cols-2 items-center">
-				<label for="destination" class="text-base font-bold text-stone-100">Destination</label>
+				<label for="destination" class="text-base font-bold text-stone-100"
+					>{$t('application.destination')}</label
+				>
 				{#if database.destinationDockerId}
 					<div class="no-underline">
 						<input
@@ -116,16 +119,17 @@
 			</div>
 
 			<div class="grid grid-cols-2 items-center">
-				<label for="version" class="text-base font-bold text-stone-100">Version</label>
+				<label for="version" class="text-base font-bold text-stone-100">{$t('forms.version')}</label
+				>
 				<input value={database.version} readonly disabled class="bg-transparent " />
 			</div>
 		</div>
 
 		<div class="grid grid-flow-row gap-2 px-10 pt-2">
 			<div class="grid grid-cols-2 items-center">
-				<label for="host" class="text-base font-bold text-stone-100">Host</label>
+				<label for="host" class="text-base font-bold text-stone-100">{$t('forms.host')}</label>
 				<CopyPasswordField
-					placeholder="Generated automatically after start"
+					placeholder={$t('forms.generated_automatically_after_start')}
 					isPasswordField={false}
 					readonly
 					disabled
@@ -135,9 +139,10 @@
 				/>
 			</div>
 			<div class="grid grid-cols-2 items-center">
-				<label for="publicPort" class="text-base font-bold text-stone-100">Port</label>
+				<label for="publicPort" class="text-base font-bold text-stone-100">{$t('forms.port')}</label
+				>
 				<CopyPasswordField
-					placeholder="Generated automatically after set to public"
+					placeholder={$t('database.generated_automatically_after_set_to_public')}
 					id="publicPort"
 					readonly
 					disabled
@@ -159,10 +164,12 @@
 				<CouchDb bind:database />
 			{/if}
 			<div class="grid grid-cols-2 items-center px-10 pb-8">
-				<label for="url" class="text-base font-bold text-stone-100">Connection String</label>
+				<label for="url" class="text-base font-bold text-stone-100"
+					>{$t('database.connection_string')}</label
+				>
 				<CopyPasswordField
 					textarea={true}
-					placeholder="Generated automatically after start"
+					placeholder={$t('forms.generated_automatically_after_start')}
 					isPasswordField={false}
 					id="url"
 					name="url"
@@ -174,15 +181,15 @@
 		</div>
 	</form>
 	<div class="flex space-x-1 pb-5 font-bold">
-		<div class="title">Features</div>
+		<div class="title">{$t('application.features')}</div>
 	</div>
 	<div class="px-10 pb-10">
 		<div class="grid grid-cols-2 items-center">
 			<Setting
 				bind:setting={isPublic}
 				on:click={() => changeSettings('isPublic')}
-				title="Set it public"
-				description="Your database will be reachable over the internet. <br>Take security seriously in this case!"
+				title={$t('database.set_public')}
+				description={$t('database.warning_database_public')}
 			/>
 		</div>
 		{#if database.type === 'redis'}
@@ -190,8 +197,8 @@
 				<Setting
 					bind:setting={appendOnly}
 					on:click={() => changeSettings('appendOnly')}
-					title="Change append only mode"
-					description="Useful if you would like to restore redis data from a backup.<br><span class='font-bold text-white'>Database restart is required.</span>"
+					title={$t('database.change_append_only_mode')}
+					description={$t('database.warning_append_only')}
 				/>
 			</div>
 		{/if}
diff --git a/src/routes/databases/[id]/_Databases/_MongoDB.svelte b/src/routes/databases/[id]/_Databases/_MongoDB.svelte
index 7ec21edcd..1a6a526ce 100644
--- a/src/routes/databases/[id]/_Databases/_MongoDB.svelte
+++ b/src/routes/databases/[id]/_Databases/_MongoDB.svelte
@@ -1,6 +1,7 @@
 <script>
 	export let database;
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 py-5 font-bold">
@@ -8,9 +9,9 @@
 </div>
 <div class="space-y-2 px-10">
 	<div class="grid grid-cols-2 items-center">
-		<label for="rootUser" class="text-base font-bold text-stone-100">Root User</label>
+		<label for="rootUser" class="text-base font-bold text-stone-100">{$t('forms.root_user')}</label>
 		<CopyPasswordField
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			id="rootUser"
 			readonly
 			disabled
@@ -19,9 +20,11 @@
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="rootUserPassword" class="text-base font-bold text-stone-100">Root's Password</label>
+		<label for="rootUserPassword" class="text-base font-bold text-stone-100"
+			>{$t('forms.roots_password')}</label
+		>
 		<CopyPasswordField
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			isPasswordField={true}
 			readonly
 			disabled
diff --git a/src/routes/databases/[id]/_Databases/_MySQL.svelte b/src/routes/databases/[id]/_Databases/_MySQL.svelte
index f085b3320..001587845 100644
--- a/src/routes/databases/[id]/_Databases/_MySQL.svelte
+++ b/src/routes/databases/[id]/_Databases/_MySQL.svelte
@@ -1,6 +1,7 @@
 <script>
 	export let database;
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 py-5 font-bold">
@@ -8,34 +9,38 @@
 </div>
 <div class="space-y-2 px-10">
 	<div class="grid grid-cols-2 items-center">
-		<label for="defaultDatabase" class="text-base font-bold text-stone-100">Default Database</label>
+		<label for="defaultDatabase" class="text-base font-bold text-stone-100"
+			>{$t('database.default_database')}</label
+		>
 		<CopyPasswordField
 			required
 			readonly={database.defaultDatabase}
 			disabled={database.defaultDatabase}
-			placeholder="eg: mydb"
+			placeholder="{$t('forms.eg')}: mydb"
 			id="defaultDatabase"
 			name="defaultDatabase"
 			bind:value={database.defaultDatabase}
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="dbUser" class="text-base font-bold text-stone-100">User</label>
+		<label for="dbUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			id="dbUser"
 			name="dbUser"
 			value={database.dbUser}
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="dbUserPassword" class="text-base font-bold text-stone-100">Password</label>
+		<label for="dbUserPassword" class="text-base font-bold text-stone-100"
+			>{$t('forms.password')}</label
+		>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			isPasswordField
 			id="dbUserPassword"
 			name="dbUserPassword"
@@ -43,22 +48,24 @@
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="rootUser" class="text-base font-bold text-stone-100">Root User</label>
+		<label for="rootUser" class="text-base font-bold text-stone-100">{$t('forms.root_user')}</label>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			id="rootUser"
 			name="rootUser"
 			value={database.rootUser}
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="rootUserPassword" class="text-base font-bold text-stone-100">Root's Password</label>
+		<label for="rootUserPassword" class="text-base font-bold text-stone-100"
+			>{$t('forms.roots_password')}</label
+		>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			isPasswordField
 			id="rootUserPassword"
 			name="rootUserPassword"
diff --git a/src/routes/databases/[id]/_Databases/_PostgreSQL.svelte b/src/routes/databases/[id]/_Databases/_PostgreSQL.svelte
index 3f995cafc..7b207b851 100644
--- a/src/routes/databases/[id]/_Databases/_PostgreSQL.svelte
+++ b/src/routes/databases/[id]/_Databases/_PostgreSQL.svelte
@@ -1,6 +1,7 @@
 <script>
 	export let database;
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 py-5 font-bold">
@@ -8,34 +9,38 @@
 </div>
 <div class="space-y-2 px-10">
 	<div class="grid grid-cols-2 items-center">
-		<label for="defaultDatabase" class="text-base font-bold text-stone-100">Default Database</label>
+		<label for="defaultDatabase" class="text-base font-bold text-stone-100"
+			>{$t('database.default_database')}</label
+		>
 		<CopyPasswordField
 			required
 			readonly={database.defaultDatabase}
 			disabled={database.defaultDatabase}
-			placeholder="eg: mydb"
+			placeholder="{$t('forms.eg')}: mydb"
 			id="defaultDatabase"
 			name="defaultDatabase"
 			bind:value={database.defaultDatabase}
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="dbUser" class="text-base font-bold text-stone-100">User</label>
+		<label for="dbUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			id="dbUser"
 			name="dbUser"
 			value={database.dbUser}
 		/>
 	</div>
 	<div class="grid grid-cols-2 items-center">
-		<label for="dbUserPassword" class="text-base font-bold text-stone-100">Password</label>
+		<label for="dbUserPassword" class="text-base font-bold text-stone-100"
+			>{$t('forms.password')}</label
+		>
 		<CopyPasswordField
 			readonly
 			disabled
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			isPasswordField
 			id="dbUserPassword"
 			name="dbUserPassword"
diff --git a/src/routes/databases/[id]/_Databases/_Redis.svelte b/src/routes/databases/[id]/_Databases/_Redis.svelte
index fece7c837..4a783a99b 100644
--- a/src/routes/databases/[id]/_Databases/_Redis.svelte
+++ b/src/routes/databases/[id]/_Databases/_Redis.svelte
@@ -1,6 +1,7 @@
 <script>
 	export let database;
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 py-5 font-bold">
@@ -8,11 +9,13 @@
 </div>
 <div class="space-y-2 px-10">
 	<div class="grid grid-cols-2 items-center">
-		<label for="dbUserPassword" class="text-base font-bold text-stone-100">Password</label>
+		<label for="dbUserPassword" class="text-base font-bold text-stone-100"
+			>{$t('forms.password')}</label
+		>
 		<CopyPasswordField
 			disabled
 			readonly
-			placeholder="Generated automatically after start"
+			placeholder={$t('forms.generated_automatically_after_start')}
 			isPasswordField
 			id="dbUserPassword"
 			name="dbUserPassword"
@@ -20,12 +23,12 @@
 		/>
 	</div>
 	<!-- <div class="grid grid-cols-3 items-center">
-		<label for="rootUser">Root User</label>
+		<label for="rootUser">{ $t('forms.root_user') }</label>
 		<div class="col-span-2 ">
 			<CopyPasswordField
 				disabled
 				readonly
-				placeholder="Generated automatically after start"
+				placeholder="{ $t('forms.generated_automatically_after_start') }"
 				id="rootUser"
 				name="rootUser"
 				value={database.rootUser}
@@ -33,12 +36,12 @@
 		</div>
 	</div>
 	<div class="grid grid-cols-3 items-center">
-		<label for="rootUserPassword">Root's Password</label>
+		<label for="rootUserPassword">{ $t('forms.roots_password') }</label>
 		<div class="col-span-2 ">
 			<CopyPasswordField
 				disabled
 				readonly
-				placeholder="Generated automatically after start"
+				placeholder="{ $t('forms.generated_automatically_after_start') }"
 				isPasswordField
 				id="rootUserPassword"
 				name="rootUserPassword"
diff --git a/src/routes/databases/[id]/__layout.svelte b/src/routes/databases/[id]/__layout.svelte
index ae08d48f7..db0d45ee2 100644
--- a/src/routes/databases/[id]/__layout.svelte
+++ b/src/routes/databases/[id]/__layout.svelte
@@ -63,6 +63,7 @@
 	import Loading from '$lib/components/Loading.svelte';
 	import { del, post } from '$lib/api';
 	import { goto } from '$app/navigation';
+	import { t } from '$lib/translations';
 
 	export let database;
 	export let state;
@@ -83,7 +84,7 @@
 		}
 	}
 	async function stopDatabase() {
-		const sure = confirm(`Are you sure you would like to stop '${database.name}'?`);
+		const sure = confirm($t('database.confirm_stop', { name: database.name }));
 		if (sure) {
 			loading = true;
 			try {
@@ -117,13 +118,13 @@
 			{#if state === 'running'}
 				<button
 					on:click={stopDatabase}
-					title="Stop database"
+					title={$t('database.stop_database')}
 					type="submit"
 					disabled={!$session.isAdmin}
 					class="icons bg-transparent tooltip-bottom text-sm flex items-center space-x-2 text-red-500"
 					data-tooltip={$session.isAdmin
-						? 'Stop database'
-						: 'You do not have permission to stop the database.'}
+						? $t('database.stop_database')
+						: $t('database.permission_denied_stop_database')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -143,13 +144,13 @@
 			{:else if state === 'not started'}
 				<button
 					on:click={startDatabase}
-					title="Start database"
+					title={$t('database.start_database')}
 					type="submit"
 					disabled={!$session.isAdmin}
 					class="icons bg-transparent tooltip-bottom text-sm flex items-center space-x-2 text-green-500"
 					data-tooltip={$session.isAdmin
-						? 'Start database'
-						: 'You do not have permission to start the database.'}
+						? $t('database.start_database')
+						: $t('database.permission_denied_start_database')}
 					><svg
 						xmlns="http://www.w3.org/2000/svg"
 						class="w-6 h-6"
@@ -168,14 +169,14 @@
 		{/if}
 		<button
 			on:click={deleteDatabase}
-			title="Delete Database"
+			title={$t('database.delete_database')}
 			type="submit"
 			disabled={!$session.isAdmin}
 			class:hover:text-red-500={$session.isAdmin}
 			class="icons bg-transparent tooltip-bottom text-sm"
 			data-tooltip={$session.isAdmin
-				? 'Delete Database'
-				: 'You do not have permission to delete a Database'}><DeleteIcon /></button
+				? $t('database.delete_database')
+				: $t('database.permission_denied_delete_database')}><DeleteIcon /></button
 		>
 	{/if}
 </nav>
diff --git a/src/routes/databases/[id]/configuration/destination.svelte b/src/routes/databases/[id]/configuration/destination.svelte
index 1a8afc817..a7c96c145 100644
--- a/src/routes/databases/[id]/configuration/destination.svelte
+++ b/src/routes/databases/[id]/configuration/destination.svelte
@@ -34,6 +34,7 @@
 	import { errorNotification } from '$lib/form';
 	import { goto } from '$app/navigation';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -52,12 +53,14 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Configure Destination</div>
+	<div class="mr-4 text-2xl tracking-tight">
+		{$t('application.configuration.configure_destination')}
+	</div>
 </div>
 <div class="flex justify-center">
 	{#if !destinations || destinations.length === 0}
 		<div class="flex-col">
-			<div class="pb-2">No configurable Destination found</div>
+			<div class="pb-2">{$t('application.configuration.no_configurable_destination')}</div>
 			<div class="flex justify-center">
 				<a href="/new/destination" sveltekit:prefetch class="add-icon bg-sky-600 hover:bg-sky-500">
 					<svg
diff --git a/src/routes/databases/[id]/configuration/type.svelte b/src/routes/databases/[id]/configuration/type.svelte
index 2d527a7b9..4a306383f 100644
--- a/src/routes/databases/[id]/configuration/type.svelte
+++ b/src/routes/databases/[id]/configuration/type.svelte
@@ -53,7 +53,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Select a Database type</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('database.select_database_type')}</div>
 </div>
 
 <div class="flex flex-wrap justify-center">
diff --git a/src/routes/databases/[id]/configuration/version.svelte b/src/routes/databases/[id]/configuration/version.svelte
index 9e0761130..841190dc5 100644
--- a/src/routes/databases/[id]/configuration/version.svelte
+++ b/src/routes/databases/[id]/configuration/version.svelte
@@ -31,6 +31,7 @@
 	import { enhance, errorNotification } from '$lib/form';
 	import { goto } from '$app/navigation';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -47,7 +48,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Select a Database version</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('database.select_database_version')}</div>
 </div>
 
 <div class="flex flex-wrap justify-center">
diff --git a/src/routes/databases/index.svelte b/src/routes/databases/index.svelte
index f6834cd0b..af8defa32 100644
--- a/src/routes/databases/index.svelte
+++ b/src/routes/databases/index.svelte
@@ -8,6 +8,7 @@
 	import Redis from '$lib/components/svg/databases/Redis.svelte';
 	import { post } from '$lib/api';
 	import { goto } from '$app/navigation';
+	import { t } from '$lib/translations';
 
 	async function newDatabase() {
 		const { id } = await post('/databases/new', {});
@@ -16,7 +17,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Databases</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('index.databases')}</div>
 	<div on:click={newDatabase} class="add-icon cursor-pointer bg-purple-600 hover:bg-purple-500">
 		<svg
 			class="w-6"
@@ -37,7 +38,7 @@
 <div class="flex flex-wrap justify-center">
 	{#if !databases || databases.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">No databases found</div>
+			<div class="text-center text-xl font-bold">{$t('database.no_databases_found')}</div>
 		</div>
 	{:else}
 		{#each databases as database}
@@ -61,7 +62,7 @@
 					</div>
 					{#if !database.type}
 						<div class="font-bold text-center truncate text-red-500 group-hover:text-white">
-							Configuration missing
+							{$t('application.configuration.configuration_missing')}
 						</div>
 					{:else}
 						<div class="text-center truncate">{database.type}</div>
diff --git a/src/routes/services/[id]/_Services/_MinIO.svelte b/src/routes/services/[id]/_Services/_MinIO.svelte
index ffc67346d..27c320d14 100644
--- a/src/routes/services/[id]/_Services/_MinIO.svelte
+++ b/src/routes/services/[id]/_Services/_MinIO.svelte
@@ -8,7 +8,7 @@
 	<div class="title">MinIO Server</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="rootUser">Root User</label>
+	<label for="rootUser">{$t('forms.root_user')}</label>
 	<input
 		name="rootUser"
 		id="rootUser"
@@ -19,7 +19,7 @@
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="rootUserPassword">Root's Password</label>
+	<label for="rootUserPassword">{$t('forms.roots_password')}</label>
 	<CopyPasswordField
 		id="rootUserPassword"
 		isPasswordField
@@ -37,6 +37,6 @@
 		value={service.minio.publicPort}
 		disabled
 		readonly
-		placeholder="Generated automatically after start"
+		placeholder={$t('forms.generated_automatically_after_start')}
 	/>
 </div>
diff --git a/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte b/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
index a6d739353..a8b03a0d0 100644
--- a/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
+++ b/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
@@ -80,7 +80,7 @@
 	<label for="postgresqlPublicPort">Public Port</label>
 	<div class="col-span-2 ">
 		<CopyPasswordField
-			placeholder="Generated automatically after start"
+			placeholder="{ $t('forms.generated_automatically_after_start') }"
 			readonly
 			disabled
 			id="postgresqlPublicPort"
diff --git a/src/routes/services/[id]/_Services/_Wordpress.svelte b/src/routes/services/[id]/_Services/_Wordpress.svelte
index 883178a22..bd701bd54 100644
--- a/src/routes/services/[id]/_Services/_Wordpress.svelte
+++ b/src/routes/services/[id]/_Services/_Wordpress.svelte
@@ -44,7 +44,7 @@ define('SUBDOMAIN_INSTALL', false);`
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mysqlRootUser">Root User</label>
+	<label for="mysqlRootUser">{$t('forms.root_user')}</label>
 	<input
 		name="mysqlRootUser"
 		id="mysqlRootUser"
@@ -55,7 +55,7 @@ define('SUBDOMAIN_INSTALL', false);`
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mysqlRootUserPassword">Root's Password</label>
+	<label for="mysqlRootUserPassword">{$t('forms.roots_password')}</label>
 	<CopyPasswordField
 		id="mysqlRootUserPassword"
 		isPasswordField

From a53bda1436742db449ad7763563ca15775b1ee00 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 23:34:30 +0200
Subject: [PATCH 11/23] Add destinations i18n

---
 src/lib/locales/en.json                       | 21 ++++++++++--
 src/routes/destinations/[id]/_FoundApp.svelte |  9 ++---
 .../destinations/[id]/_LocalDocker.svelte     | 33 ++++++++++---------
 .../destinations/[id]/_RemoteDocker.svelte    | 33 ++++++++++---------
 src/routes/destinations/[id]/__layout.svelte  |  9 ++---
 src/routes/destinations/[id]/index.svelte     |  3 +-
 src/routes/destinations/index.svelte          |  6 ++--
 7 files changed, 69 insertions(+), 45 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index 3b0ff03fd..0d65578b4 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -31,7 +31,7 @@
 		"password_again": "Password again",
 		"save": "Save",
 		"saving": "Saving...",
-		"name": "Name",
+		"name": "name",
 		"value": "Value",
 		"action": "Action",
 		"is_required": "is required.",
@@ -52,7 +52,11 @@
 		"user": "User",
 		"loading": "Loading...",
 		"version": "Version",
-		"host": "Host"
+		"host": "Host",
+		"already_used_for": "<span class=\"text-red-500\">{type}</span> already used for",
+		"configuration": "Configuration",
+		"engine": "Engine",
+		"network": "Network"
 	},
 	"register": {
 		"register": "Register",
@@ -182,5 +186,18 @@
 		"delete_database": "Delete Database",
 		"permission_denied_delete_database": "You do not have permission to delete a Database",
 		"no_databases_found": "No databases found"
+	},
+	"destination": {
+		"delete_destination": "Delete Destination",
+		"permission_denied_delete_destination": "You do not have permission to delete this destination",
+		"add_to_coolify": "Add to Coolify",
+		"coolify_proxy_stopped": "Coolify Proxy stopped!",
+		"coolify_proxy_started": "Coolify Proxy started!",
+		"confirm_restart_proxy": "Are you sure you want to restart the proxy? Everything will be reconfigured in ~10 secs.",
+		"coolify_proxy_restarting": "Coolify Proxy restarting...",
+		"restarting_please_wait": "Restarting... please wait...",
+		"force_restart_proxy": "Force restart proxy",
+		"use_coolify_proxy": "Use Coolify Proxy?",
+		"no_destination_found": "No destination found"
 	}
 }
diff --git a/src/routes/destinations/[id]/_FoundApp.svelte b/src/routes/destinations/[id]/_FoundApp.svelte
index 835c121bf..f6c44bb25 100644
--- a/src/routes/destinations/[id]/_FoundApp.svelte
+++ b/src/routes/destinations/[id]/_FoundApp.svelte
@@ -2,6 +2,7 @@
 	export let app;
 	import { onMount } from 'svelte';
 	import { page } from '$app/stores';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 	let loading = true;
 	async function checkApp() {
@@ -58,20 +59,20 @@
 <div class="box-selection hover:border-transparent hover:bg-coolgray-200">
 	<div class="truncate pb-2 text-center text-xl font-bold">{app.domain}</div>
 	{#if loading}
-		<div class="w-full text-center font-bold">Loading...</div>
+		<div class="w-full text-center font-bold">{$t('forms.loading')}</div>
 	{:else if app.foundByDomain}
 		<div class="w-full bg-coolgray-200 text-xs">
-			<span class="text-red-500">Domain</span> already used for
+			{@html $t('forms.already_used_for', { type: 'Domains' })}
 			<span class="text-red-500">{app.foundName}</span>
 		</div>
 	{:else if app.foundByRepository}
 		<div class="w-full bg-coolgray-200 text-xs">
-			<span class="text-red-500">Repository</span> already used for
+			{@html $t('forms.already_used_for', { type: 'Repository' })}
 			<span class="text-red-500">{app.foundName}</span>
 		</div>
 	{:else}
 		<button class="bg-green-600 hover:bg-green-500 w-full" on:click={addToCoolify}
-			>Add to Coolify</button
+			>{$t('destination.add_to_coolify')}</button
 		>
 	{/if}
 </div>
diff --git a/src/routes/destinations/[id]/_LocalDocker.svelte b/src/routes/destinations/[id]/_LocalDocker.svelte
index 329d23c2f..4ee6195e0 100644
--- a/src/routes/destinations/[id]/_LocalDocker.svelte
+++ b/src/routes/destinations/[id]/_LocalDocker.svelte
@@ -10,6 +10,7 @@
 	import { post } from '$lib/api';
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
 	import { onMount } from 'svelte';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 	let cannotDisable = settings.fqdn && destination.engine === '/var/run/docker.sock';
 	// let scannedApps = [];
@@ -88,7 +89,7 @@
 	async function stopProxy() {
 		try {
 			await post(`/destinations/${id}/stop.json`, { engine: destination.engine });
-			return toast.push('Coolify Proxy stopped!');
+			return toast.push($t('destination.coolify_proxy_stopped'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
@@ -96,19 +97,17 @@
 	async function startProxy() {
 		try {
 			await post(`/destinations/${id}/start.json`, { engine: destination.engine });
-			return toast.push('Coolify Proxy started!');
+			return toast.push($t('destination.coolify_proxy_started'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
 	}
 	async function forceRestartProxy() {
-		const sure = confirm(
-			'Are you sure you want to restart the proxy? Everything will be reconfigured in ~10 secs.'
-		);
+		const sure = confirm($t('destination.confirm_restart_proxy'));
 		if (sure) {
 			try {
 				restarting = true;
-				toast.push('Coolify Proxy restarting...');
+				toast.push($t('destination.coolify_proxy_restarting'));
 				await post(`/destinations/${id}/restart.json`, {
 					engine: destination.engine,
 					fqdn: settings.fqdn
@@ -126,7 +125,7 @@
 
 <form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
 	<div class="flex space-x-1 pb-5">
-		<div class="title font-bold">Configuration</div>
+		<div class="title font-bold">{$t('forms.configuration')}</div>
 		{#if $session.isAdmin}
 			<button
 				type="submit"
@@ -134,13 +133,15 @@
 				class:bg-sky-600={!loading}
 				class:hover:bg-sky-500={!loading}
 				disabled={loading}
-				>{loading ? 'Saving...' : 'Save'}
+				>{loading ? $t('forms.saving') : $t('forms.save')}
 			</button>
 			<button
 				class={restarting ? '' : 'bg-red-600 hover:bg-red-500'}
 				disabled={restarting}
 				on:click|preventDefault={forceRestartProxy}
-				>{restarting ? 'Restarting... please wait...' : 'Force restart proxy'}</button
+				>{restarting
+					? $t('destination.restarting_please_wait')
+					: $t('destination.force_restart_proxy')}</button
 			>
 		{/if}
 		<!-- <button type="button" class="bg-coollabs hover:bg-coollabs-100" on:click={scanApps}
@@ -148,10 +149,10 @@
 			> -->
 	</div>
 	<div class="grid grid-cols-2 items-center px-10 ">
-		<label for="name" class="text-base font-bold text-stone-100">Name</label>
+		<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 		<input
 			name="name"
-			placeholder="name"
+			placeholder={$t('forms.name')}
 			disabled={!$session.isAdmin}
 			readonly={!$session.isAdmin}
 			bind:value={destination.name}
@@ -159,13 +160,13 @@
 	</div>
 
 	<div class="grid grid-cols-2 items-center px-10">
-		<label for="engine" class="text-base font-bold text-stone-100">Engine</label>
+		<label for="engine" class="text-base font-bold text-stone-100">{$t('forms.engine')}</label>
 		<CopyPasswordField
 			id="engine"
 			readonly
 			disabled
 			name="engine"
-			placeholder="eg: /var/run/docker.sock"
+			placeholder="{$t('forms.eg')}: /var/run/docker.sock"
 			value={destination.engine}
 		/>
 	</div>
@@ -174,13 +175,13 @@
 			<input name="remoteEngine" type="checkbox" bind:checked={payload.remoteEngine} />
 		</div> -->
 	<div class="grid grid-cols-2 items-center px-10">
-		<label for="network" class="text-base font-bold text-stone-100">Network</label>
+		<label for="network" class="text-base font-bold text-stone-100">{$t('forms.network')}</label>
 		<CopyPasswordField
 			id="network"
 			readonly
 			disabled
 			name="network"
-			placeholder="default: coolify"
+			placeholder="{$t('forms.default')}: coolify"
 			value={destination.network}
 		/>
 	</div>
@@ -189,7 +190,7 @@
 			disabled={cannotDisable}
 			bind:setting={destination.isCoolifyProxyUsed}
 			on:click={changeProxySetting}
-			title="Use Coolify Proxy?"
+			title={$t('destination.use_coolify_proxy')}
 			description={`This will install a proxy on the destination to allow you to access your applications and services without any manual configuration. Databases will have their own proxy. <br><br>${
 				cannotDisable
 					? '<span class="font-bold text-white">You cannot disable this proxy as FQDN is configured for Coolify.</span>'
diff --git a/src/routes/destinations/[id]/_RemoteDocker.svelte b/src/routes/destinations/[id]/_RemoteDocker.svelte
index 4de1b82ce..c17d0239b 100644
--- a/src/routes/destinations/[id]/_RemoteDocker.svelte
+++ b/src/routes/destinations/[id]/_RemoteDocker.svelte
@@ -11,6 +11,7 @@
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
 	import { onMount } from 'svelte';
 	import { generateRemoteEngine } from '$lib/components/common';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 	let cannotDisable = settings.fqdn && destination.engine === '/var/run/docker.sock';
 	// let scannedApps = [];
@@ -90,7 +91,7 @@
 		try {
 			const engine = generateRemoteEngine(destination);
 			await post(`/destinations/${id}/stop.json`, { engine });
-			return toast.push('Coolify Proxy stopped!');
+			return toast.push($t('destination.coolify_proxy_stopped'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
@@ -99,19 +100,17 @@
 		try {
 			const engine = generateRemoteEngine(destination);
 			await post(`/destinations/${id}/start.json`, { engine });
-			return toast.push('Coolify Proxy started!');
+			return toast.push($t('destination.coolify_proxy_started'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
 	}
 	async function forceRestartProxy() {
-		const sure = confirm(
-			'Are you sure you want to restart the proxy? Everything will be reconfigured in ~10 secs.'
-		);
+		const sure = confirm($t('destination.confirm_restart_proxy'));
 		if (sure) {
 			try {
 				restarting = true;
-				toast.push('Coolify Proxy restarting...');
+				toast.push($t('destination.coolify_proxy_restarting'));
 				await post(`/destinations/${id}/restart.json`, {
 					engine: destination.engine,
 					fqdn: settings.fqdn
@@ -127,7 +126,7 @@
 
 <form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
 	<div class="flex space-x-1 pb-5">
-		<div class="title font-bold">Configuration</div>
+		<div class="title font-bold">{$t('forms.configuration')}</div>
 		{#if $session.isAdmin}
 			<button
 				type="submit"
@@ -135,13 +134,15 @@
 				class:bg-sky-600={!loading}
 				class:hover:bg-sky-500={!loading}
 				disabled={loading}
-				>{loading ? 'Saving...' : 'Save'}
+				>{loading ? $t('forms.saving') : $t('forms.save')}
 			</button>
 			<button
 				class={restarting ? '' : 'bg-red-600 hover:bg-red-500'}
 				disabled={restarting}
 				on:click|preventDefault={forceRestartProxy}
-				>{restarting ? 'Restarting... please wait...' : 'Force restart proxy'}</button
+				>{restarting
+					? $t('destination.restarting_please_wait')
+					: $t('destination.force_restart_proxy')}</button
 			>
 		{/if}
 		<!-- <button type="button" class="bg-coollabs hover:bg-coollabs-100" on:click={scanApps}
@@ -149,10 +150,10 @@
 			> -->
 	</div>
 	<div class="grid grid-cols-2 items-center px-10 ">
-		<label for="name" class="text-base font-bold text-stone-100">Name</label>
+		<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 		<input
 			name="name"
-			placeholder="name"
+			placeholder={$t('forms.name')}
 			disabled={!$session.isAdmin}
 			readonly={!$session.isAdmin}
 			bind:value={destination.name}
@@ -160,13 +161,13 @@
 	</div>
 
 	<div class="grid grid-cols-2 items-center px-10">
-		<label for="engine" class="text-base font-bold text-stone-100">Engine</label>
+		<label for="engine" class="text-base font-bold text-stone-100">{$t('forms.engine')}</label>
 		<CopyPasswordField
 			id="engine"
 			readonly
 			disabled
 			name="engine"
-			placeholder="eg: /var/run/docker.sock"
+			placeholder="{$t('forms.eg')}: /var/run/docker.sock"
 			value={destination.engine}
 		/>
 	</div>
@@ -175,13 +176,13 @@
 			<input name="remoteEngine" type="checkbox" bind:checked={payload.remoteEngine} />
 		</div> -->
 	<div class="grid grid-cols-2 items-center px-10">
-		<label for="network" class="text-base font-bold text-stone-100">Network</label>
+		<label for="network" class="text-base font-bold text-stone-100">{$t('forms.network')}</label>
 		<CopyPasswordField
 			id="network"
 			readonly
 			disabled
 			name="network"
-			placeholder="default: coolify"
+			placeholder="{$t('forms.default')}: coolify"
 			value={destination.network}
 		/>
 	</div>
@@ -190,7 +191,7 @@
 			disabled={cannotDisable}
 			bind:setting={destination.isCoolifyProxyUsed}
 			on:click={changeProxySetting}
-			title="Use Coolify Proxy?"
+			title={$t('destination.use_coolify_proxy')}
 			description={`This will install a proxy on the destination to allow you to access your applications and services without any manual configuration. Databases will have their own proxy. <br><br>${
 				cannotDisable
 					? '<span class="font-bold text-white">You cannot disable this proxy as FQDN is configured for Coolify.</span>'
diff --git a/src/routes/destinations/[id]/__layout.svelte b/src/routes/destinations/[id]/__layout.svelte
index 892e8e99b..6d49fbb63 100644
--- a/src/routes/destinations/[id]/__layout.svelte
+++ b/src/routes/destinations/[id]/__layout.svelte
@@ -37,10 +37,11 @@
 	import DeleteIcon from '$lib/components/DeleteIcon.svelte';
 	import { del } from '$lib/api';
 	import { goto } from '$app/navigation';
+	import { t } from '$lib/translations';
 
 	export let destination;
 	async function deleteDestination(destination) {
-		const sure = confirm(`Are you sure you would like to delete '${destination.name}'?`);
+		const sure = confirm($t('application.confirm_to_delete', { name: destination.name }));
 		if (sure) {
 			try {
 				await del(`/destinations/${destination.id}.json`, { id: destination.id });
@@ -55,14 +56,14 @@
 <nav class="nav-side">
 	<button
 		on:click={() => deleteDestination(destination)}
-		title="Delete Destination"
+		title={$t('destination.delete_destination')}
 		type="submit"
 		disabled={!$session.isAdmin}
 		class:hover:text-red-500={$session.isAdmin}
 		class="icons tooltip-bottom bg-transparent text-sm"
 		data-tooltip={$session.isAdmin
-			? 'Delete Destination'
-			: 'You do not have permission to delete this destination'}><DeleteIcon /></button
+			? $t('destination.delete_destination')
+			: $t('destination.permission_denied_delete_destination')}><DeleteIcon /></button
 	>
 </nav>
 <slot />
diff --git a/src/routes/destinations/[id]/index.svelte b/src/routes/destinations/[id]/index.svelte
index 68f529b54..1effefdd7 100644
--- a/src/routes/destinations/[id]/index.svelte
+++ b/src/routes/destinations/[id]/index.svelte
@@ -36,10 +36,11 @@
 	import type Prisma from '@prisma/client';
 	import LocalDocker from './_LocalDocker.svelte';
 	import RemoteDocker from './_RemoteDocker.svelte';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 p-6 text-2xl font-bold">
-	<div class="tracking-tight">Destination</div>
+	<div class="tracking-tight">{$t('application.destination')}</div>
 	<span class="arrow-right-applications px-1">></span>
 	<span class="pr-2">{destination.name}</span>
 </div>
diff --git a/src/routes/destinations/index.svelte b/src/routes/destinations/index.svelte
index 01f860b21..e610777c0 100644
--- a/src/routes/destinations/index.svelte
+++ b/src/routes/destinations/index.svelte
@@ -23,11 +23,13 @@
 	import type Prisma from '@prisma/client';
 
 	import { session } from '$app/stores';
+	import { t } from '$lib/translations';
+
 	export let destinations: Prisma.DestinationDocker[];
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Destinations</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('index.destinations')}</div>
 	{#if $session.isAdmin}
 		<a href="/new/destination" class="add-icon bg-sky-600 hover:bg-sky-500">
 			<svg
@@ -49,7 +51,7 @@
 <div class="flex justify-center">
 	{#if !destinations || destinations.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">No destination found</div>
+			<div class="text-center text-xl font-bold">{$t('destination.no_destination_found')}</div>
 		</div>
 	{:else}
 		<div class="flex flex-wrap justify-center">

From c1c25d59c8333a725faf82f0f8dd722588216151 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 23:53:10 +0200
Subject: [PATCH 12/23] Add "new" i18n

---
 src/lib/locales/en.json                       | 35 ++++++++++++--
 .../new/destination/_LocalDocker.svelte       | 30 +++++++-----
 .../new/destination/_RemoteDocker.svelte      | 46 +++++++++++--------
 src/routes/new/destination/check.json.ts      |  4 +-
 src/routes/new/destination/index.svelte       | 15 +++---
 src/routes/new/source/_Github.svelte          | 27 +++++------
 src/routes/new/source/_Gitlab.svelte          | 17 +++----
 src/routes/new/source/index.svelte            |  8 ++--
 8 files changed, 117 insertions(+), 65 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index 0d65578b4..ef2a5f2e8 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -17,7 +17,8 @@
 		"git_sources": "Git Sources",
 		"databases": "Databases",
 		"services": "Services",
-		"teams": "Teams"
+		"teams": "Teams",
+		"not_implemented_yet": "Not implemented yet"
 	},
 	"login": {
 		"already_logged_in": "Already logged in...",
@@ -31,7 +32,7 @@
 		"password_again": "Password again",
 		"save": "Save",
 		"saving": "Saving...",
-		"name": "name",
+		"name": "Name",
 		"value": "Value",
 		"action": "Action",
 		"is_required": "is required.",
@@ -56,7 +57,13 @@
 		"already_used_for": "<span class=\"text-red-500\">{type}</span> already used for",
 		"configuration": "Configuration",
 		"engine": "Engine",
-		"network": "Network"
+		"network": "Network",
+		"ip_address": "IP Address",
+		"ssh_private_key": "SSH Private Key",
+		"type": "Type",
+		"html_url": "HTML URL",
+		"api_url": "API URL",
+		"organization": "Organization"
 	},
 	"register": {
 		"register": "Register",
@@ -198,6 +205,26 @@
 		"restarting_please_wait": "Restarting... please wait...",
 		"force_restart_proxy": "Force restart proxy",
 		"use_coolify_proxy": "Use Coolify Proxy?",
-		"no_destination_found": "No destination found"
+		"no_destination_found": "No destination found",
+		"new_error_network_already_exists": "Network {network} already configured for another team!",
+		"new": {
+			"saving_and_configuring_proxy": "Saving and configuring proxy...",
+			"install_proxy": "This will install a proxy on the destination to allow you to access your applications and services without any manual configuration (recommended for Docker).<br><br>Databases will have their own proxy.",
+			"add_new_destination": "Add New Destination",
+			"predefined_destinations": "Predefined destinations"
+		}
+	},
+	"sources": {
+		"local_docker": "Local Docker",
+		"remote_docker": "Remote Docker",
+		"organization_explainer": "Fill it if you would like to use an organization's as your Git Source. Otherwise your user will be used."
+	},
+	"eg_https_api_github_com": "eg: https://api.github.com",
+	"eg_https_github_com": "eg: https://github.com",
+	"source": {
+		"new": {
+			"git_source": "Add New Git Source",
+			"official_providers": "Official providers"
+		}
 	}
 }
diff --git a/src/routes/new/destination/_LocalDocker.svelte b/src/routes/new/destination/_LocalDocker.svelte
index 79a2c81b0..2cc8e65ff 100644
--- a/src/routes/new/destination/_LocalDocker.svelte
+++ b/src/routes/new/destination/_LocalDocker.svelte
@@ -6,6 +6,7 @@
 	import { post } from '$lib/api';
 	import Setting from '$lib/components/Setting.svelte';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 
 	let loading = false;
 
@@ -25,7 +26,7 @@
 <div class="flex justify-center px-6 pb-8">
 	<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
 		<div class="flex items-center space-x-2 pb-5">
-			<div class="title font-bold">Configuration</div>
+			<div class="title font-bold">{$t('forms.configuration')}</div>
 			<button
 				type="submit"
 				class:bg-sky-600={!loading}
@@ -33,35 +34,40 @@
 				disabled={loading}
 				>{loading
 					? payload.isCoolifyProxyUsed
-						? 'Saving and configuring proxy...'
-						: 'Saving...'
-					: 'Save'}</button
+						? $t('destination.new.saving_and_configuring_proxy')
+						: $t('forms.saving')
+					: $t('forms.save')}</button
 			>
 		</div>
 		<div class="mt-2 grid grid-cols-2 items-center px-10">
-			<label for="name" class="text-base font-bold text-stone-100">Name</label>
-			<input required name="name" placeholder="name" bind:value={payload.name} />
+			<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
+			<input required name="name" placeholder={$t('forms.name')} bind:value={payload.name} />
 		</div>
 
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="engine" class="text-base font-bold text-stone-100">Engine</label>
+			<label for="engine" class="text-base font-bold text-stone-100">{$t('forms.engine')}</label>
 			<input
 				required
 				name="engine"
-				placeholder="eg: /var/run/docker.sock"
+				placeholder="{$t('forms.eg')}: /var/run/docker.sock"
 				bind:value={payload.engine}
 			/>
 		</div>
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="network" class="text-base font-bold text-stone-100">Network</label>
-			<input required name="network" placeholder="default: coolify" bind:value={payload.network} />
+			<label for="network" class="text-base font-bold text-stone-100">{$t('forms.network')}</label>
+			<input
+				required
+				name="network"
+				placeholder="{$t('forms.default')}: coolify"
+				bind:value={payload.network}
+			/>
 		</div>
 		<div class="grid grid-cols-2 items-center">
 			<Setting
 				bind:setting={payload.isCoolifyProxyUsed}
 				on:click={() => (payload.isCoolifyProxyUsed = !payload.isCoolifyProxyUsed)}
-				title="Use Coolify Proxy?"
-				description="This will install a proxy on the destination to allow you to access your applications and services without any manual configuration (recommended for Docker).<br><br>Databases will have their own proxy."
+				title={$t('destination.use_coolify_proxy')}
+				description={$t('destination.new.install_proxy')}
 			/>
 		</div>
 	</form>
diff --git a/src/routes/new/destination/_RemoteDocker.svelte b/src/routes/new/destination/_RemoteDocker.svelte
index 780c66019..d032d77b4 100644
--- a/src/routes/new/destination/_RemoteDocker.svelte
+++ b/src/routes/new/destination/_RemoteDocker.svelte
@@ -7,6 +7,7 @@
 	import Explainer from '$lib/components/Explainer.svelte';
 	import Setting from '$lib/components/Setting.svelte';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 
 	let loading = false;
 
@@ -25,7 +26,7 @@
 <div class="flex justify-center px-6 pb-8">
 	<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
 		<div class="flex items-center space-x-2 pb-5">
-			<div class="title font-bold">Configuration</div>
+			<div class="title font-bold">{$t('forms.configuration')}</div>
 			<button
 				type="submit"
 				class:bg-sky-600={!loading}
@@ -33,57 +34,66 @@
 				disabled={loading}
 				>{loading
 					? payload.isCoolifyProxyUsed
-						? 'Saving and configuring proxy...'
-						: 'Saving...'
-					: 'Save'}</button
+						? $t('destination.new.saving_and_configuring_proxy')
+						: $t('forms.saving')
+					: $t('forms.save')}</button
 			>
 		</div>
 		<div class="mt-2 grid grid-cols-2 items-center px-10">
-			<label for="name" class="text-base font-bold text-stone-100">Name</label>
-			<input required name="name" placeholder="name" bind:value={payload.name} />
+			<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
+			<input required name="name" placeholder={$t('forms.name')} bind:value={payload.name} />
 		</div>
 
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="ipAddress" class="text-base font-bold text-stone-100">IP Address</label>
+			<label for="ipAddress" class="text-base font-bold text-stone-100"
+				>{$t('forms.ip_address')}</label
+			>
 			<input
 				required
 				name="ipAddress"
-				placeholder="eg: 192.168..."
+				placeholder="{$t('forms.eg')}: 192.168..."
 				bind:value={payload.ipAddress}
 			/>
 		</div>
 
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="user" class="text-base font-bold text-stone-100">User</label>
-			<input required name="user" placeholder="eg: root" bind:value={payload.user} />
+			<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} />
 		</div>
 
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="port" class="text-base font-bold text-stone-100">Port</label>
-			<input required name="port" placeholder="eg: 22" bind:value={payload.port} />
+			<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} />
 		</div>
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="sshPrivateKey" class="text-base font-bold text-stone-100">SSH Private Key</label>
+			<label for="sshPrivateKey" class="text-base font-bold text-stone-100"
+				>{$t('forms.ssh_private_key')}</label
+			>
 			<textarea
 				rows="10"
 				class="resize-none"
 				required
 				name="sshPrivateKey"
-				placeholder="eg: -----BEGIN...."
+				placeholder="{$t('forms.eg')}: -----BEGIN...."
 				bind:value={payload.sshPrivateKey}
 			/>
 		</div>
 
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="network" class="text-base font-bold text-stone-100">Network</label>
-			<input required name="network" placeholder="default: coolify" bind:value={payload.network} />
+			<label for="network" class="text-base font-bold text-stone-100">{$t('forms.network')}</label>
+			<input
+				required
+				name="network"
+				placeholder="{$t('forms.default')}: coolify"
+				bind:value={payload.network}
+			/>
 		</div>
 		<div class="grid grid-cols-2 items-center">
 			<Setting
 				bind:setting={payload.isCoolifyProxyUsed}
 				on:click={() => (payload.isCoolifyProxyUsed = !payload.isCoolifyProxyUsed)}
-				title="Use Coolify Proxy?"
-				description="This will install a proxy on the destination to allow you to access your applications and services without any manual configuration (recommended for Docker).<br><br>Databases will have their own proxy."
+				title={$t('destination.use_coolify_proxy')}
+				description={$t('destination.new.install_proxy')}
 			/>
 		</div>
 	</form>
diff --git a/src/routes/new/destination/check.json.ts b/src/routes/new/destination/check.json.ts
index 22af08e91..54f099e4a 100644
--- a/src/routes/new/destination/check.json.ts
+++ b/src/routes/new/destination/check.json.ts
@@ -1,5 +1,6 @@
 import { getUserDetails } from '$lib/common';
 import { isDockerNetworkExists, ErrorHandler } from '$lib/database';
+import { t } from '$lib/translations';
 import type { RequestHandler } from '@sveltejs/kit';
 
 export const post: RequestHandler = async (event) => {
@@ -9,9 +10,10 @@ export const post: RequestHandler = async (event) => {
 	const { network } = await event.request.json();
 	try {
 		const found = await isDockerNetworkExists({ network });
+
 		if (found) {
 			throw {
-				error: `Network ${network} already configured for another team!`
+				error: t.get('destination.new_error_network_already_exists', { network: network })
 			};
 		}
 		return {
diff --git a/src/routes/new/destination/index.svelte b/src/routes/new/destination/index.svelte
index 5ad82cbb7..9641ed72f 100644
--- a/src/routes/new/destination/index.svelte
+++ b/src/routes/new/destination/index.svelte
@@ -2,6 +2,7 @@
 	import LocalDocker from './_LocalDocker.svelte';
 	import cuid from 'cuid';
 	import RemoteDocker from './_RemoteDocker.svelte';
+	import { t } from '$lib/translations';
 	let payload = {};
 	let selected = 'localDocker';
 
@@ -10,7 +11,7 @@
 		switch (type) {
 			case 'localDocker':
 				payload = {
-					name: 'Local Docker',
+					name: t.get('sources.local_docker'),
 					engine: '/var/run/docker.sock',
 					remoteEngine: false,
 					network: cuid(),
@@ -19,7 +20,7 @@
 				break;
 			case 'remoteDocker':
 				payload = {
-					name: 'Remote Docker',
+					name: $t('sources.remote_docker'),
 					remoteEngine: true,
 					ipAddress: null,
 					user: 'root',
@@ -36,12 +37,14 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Add New Destination</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('destination.new.add_new_destination')}</div>
 </div>
 <div class="flex-col space-y-2 pb-10 text-center">
-	<div class="text-xl font-bold text-white">Predefined destinations</div>
+	<div class="text-xl font-bold text-white">{$t('destination.new.predefined_destinations')}</div>
 	<div class="flex justify-center space-x-2">
-		<button class="w-32" on:click={() => setPredefined('localDocker')}>Local Docker</button>
+		<button class="w-32" on:click={() => setPredefined('localDocker')}
+			>{$t('sources.local_docker')}</button
+		>
 		<!-- <button class="w-32" on:click={() => setPredefined('remoteDocker')}>Remote Docker</button> -->
 		<button class="w-32" on:click={() => setPredefined('kubernetes')}>Kubernetes</button>
 	</div>
@@ -51,5 +54,5 @@
 {:else if selected === 'remoteDocker'}
 	<RemoteDocker {payload} />
 {:else}
-	<div class="text-center font-bold text-4xl py-10">Not implemented yet</div>
+	<div class="text-center font-bold text-4xl py-10">{$t('index.not_implemented_yet')}</div>
 {/if}
diff --git a/src/routes/new/source/_Github.svelte b/src/routes/new/source/_Github.svelte
index e8f2d33c4..aaa673aca 100644
--- a/src/routes/new/source/_Github.svelte
+++ b/src/routes/new/source/_Github.svelte
@@ -6,6 +6,7 @@
 	import Explainer from '$lib/components/Explainer.svelte';
 
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	import { onMount } from 'svelte';
 
 	let nameEl;
@@ -28,11 +29,11 @@
 	<div class="flex justify-center pb-8">
 		<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
 			<div class="flex h-8 items-center space-x-2">
-				<div class="text-xl font-bold text-white">Configuration</div>
-				<button type="submit" class="bg-orange-600 hover:bg-orange-500">Save</button>
+				<div class="text-xl font-bold text-white">{$t('forms.configuration')}</div>
+				<button type="submit" class="bg-orange-600 hover:bg-orange-500">{$t('forms.save')}</button>
 			</div>
 			<div class="grid grid-cols-2 items-center px-10">
-				<label for="type" class="text-base font-bold text-stone-100">Type</label>
+				<label for="type" class="text-base font-bold text-stone-100">{$t('forms.type')}</label>
 
 				<select name="type" id="type" class="w-96" bind:value={gitSource.type}>
 					<option value="github">GitHub</option>
@@ -41,7 +42,7 @@
 				</select>
 			</div>
 			<div class="grid grid-cols-2 items-center px-10">
-				<label for="name" class="text-base font-bold text-stone-100">Name</label>
+				<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 				<input
 					name="name"
 					id="name"
@@ -53,23 +54,25 @@
 			</div>
 
 			<div class="grid grid-cols-2 items-center px-10">
-				<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
+				<label for="htmlUrl" class="text-base font-bold text-stone-100"
+					>{$t('forms.html_url')}</label
+				>
 				<input
 					type="url"
 					name="htmlUrl"
 					id="htmlUrl"
-					placeholder="eg: https://github.com"
+					placeholder="{$t('forms.eg')}: https://github.com"
 					required
 					bind:value={gitSource.htmlUrl}
 				/>
 			</div>
 			<div class="grid grid-cols-2 items-center px-10">
-				<label for="apiUrl" class="text-base font-bold text-stone-100">API URL</label>
+				<label for="apiUrl" class="text-base font-bold text-stone-100">{$t('forms.api_url')}</label>
 				<input
 					name="apiUrl"
 					type="url"
 					id="apiUrl"
-					placeholder="eg: https://api.github.com"
+					placeholder="{$t('forms.eg')}: https://api.github.com"
 					required
 					bind:value={gitSource.apiUrl}
 				/>
@@ -77,16 +80,14 @@
 			<div class="grid grid-cols-2 px-10">
 				<div class="flex flex-col">
 					<label for="organization" class="pt-2 text-base font-bold text-stone-100"
-						>Organization</label
+						>{$t('forms.organization')}</label
 					>
-					<Explainer
-						text="Fill it if you would like to use an organization's as your Git Source. Otherwise your user will be used."
-					/>
+					<Explainer text={$t('sources.organization_explainer')} />
 				</div>
 				<input
 					name="organization"
 					id="organization"
-					placeholder="eg: coollabsio"
+					placeholder="{$t('forms.eg')}: coollabsio"
 					bind:value={gitSource.organization}
 					bind:this={organizationEl}
 				/>
diff --git a/src/routes/new/source/_Gitlab.svelte b/src/routes/new/source/_Gitlab.svelte
index 219bc56b0..345b2ab49 100644
--- a/src/routes/new/source/_Gitlab.svelte
+++ b/src/routes/new/source/_Gitlab.svelte
@@ -4,6 +4,7 @@
 	import { post } from '$lib/api';
 
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	import { onMount } from 'svelte';
 
 	let nameEl;
@@ -24,11 +25,11 @@
 <div class="flex justify-center pb-8">
 	<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
 		<div class="flex h-8 items-center space-x-2">
-			<div class="text-xl font-bold text-white">Configuration</div>
-			<button type="submit" class="bg-orange-600 hover:bg-orange-500">Save</button>
+			<div class="text-xl font-bold text-white">{$t('forms.configuration')}</div>
+			<button type="submit" class="bg-orange-600 hover:bg-orange-500">{$t('forms.save')}</button>
 		</div>
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="type" class="text-base font-bold text-stone-100">Type</label>
+			<label for="type" class="text-base font-bold text-stone-100">{$t('forms.type')}</label>
 			<select name="type" id="type" class="w-96" bind:value={gitSource.type}>
 				<option value="github">GitHub</option>
 				<option value="gitlab">GitLab</option>
@@ -36,7 +37,7 @@
 			</select>
 		</div>
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="name" class="text-base font-bold text-stone-100">Name</label>
+			<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 			<input
 				name="name"
 				id="name"
@@ -48,23 +49,23 @@
 		</div>
 
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
+			<label for="htmlUrl" class="text-base font-bold text-stone-100">{$t('forms.html_url')}</label>
 			<input
 				type="url"
 				name="htmlUrl"
 				id="htmlUrl"
-				placeholder="eg: https://github.com"
+				placeholder="{$t('forms.eg')}: https://github.com"
 				required
 				bind:value={gitSource.htmlUrl}
 			/>
 		</div>
 		<div class="grid grid-cols-2 items-center px-10">
-			<label for="apiUrl" class="text-base font-bold text-stone-100">API URL</label>
+			<label for="apiUrl" class="text-base font-bold text-stone-100">{$t('forms.api_url')}</label>
 			<input
 				name="apiUrl"
 				type="url"
 				id="apiUrl"
-				placeholder="eg: https://api.github.com"
+				placeholder="{$t('forms.eg')}: https://api.github.com"
 				required
 				bind:value={gitSource.apiUrl}
 			/>
diff --git a/src/routes/new/source/index.svelte b/src/routes/new/source/index.svelte
index 73384561a..a4becb9a1 100644
--- a/src/routes/new/source/index.svelte
+++ b/src/routes/new/source/index.svelte
@@ -1,4 +1,6 @@
 <script lang="ts">
+	import { t } from '$lib/translations';
+
 	import Github from './_Github.svelte';
 	import Gitlab from './_Gitlab.svelte';
 	let gitSource = {
@@ -44,11 +46,11 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Add New Git Source</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('source.new.git_source')}</div>
 </div>
 
 <div class="flex-col space-y-2 pb-10 text-center">
-	<div class="text-xl font-bold text-white">Official providers</div>
+	<div class="text-xl font-bold text-white">{$t('source.new.official_providers')}</div>
 	<div class="flex justify-center space-x-2">
 		<button class="w-32" on:click={() => setPredefined('github')}>GitHub.com</button>
 		<button class="w-32" on:click={() => setPredefined('gitlab')}>GitLab.com</button>
@@ -61,6 +63,6 @@
 	{:else if gitSource.type === 'gitlab'}
 		<Gitlab {gitSource} />
 	{:else if gitSource.type === 'bitbucket'}
-		<div class="text-center font-bold text-4xl py-10">Not implemented yet</div>
+		<div class="text-center font-bold text-4xl py-10">{$t('index.not_implemented_yet')}</div>
 	{/if}
 </div>

From 13891110ce1d9e7192406e44338c21eddf04c550 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sat, 2 Apr 2022 23:57:37 +0200
Subject: [PATCH 13/23] Add reset i18n

---
 src/lib/locales/en.json           | 10 ++++++++--
 src/routes/reset/index.json.ts    |  3 ++-
 src/routes/reset/index.svelte     | 17 +++++++++--------
 src/routes/reset/password.json.ts |  3 ++-
 4 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index ef2a5f2e8..7b8591530 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -63,14 +63,20 @@
 		"type": "Type",
 		"html_url": "HTML URL",
 		"api_url": "API URL",
-		"organization": "Organization"
+		"organization": "Organization",
+		"new_password": "New password",
+		"super_secure_new_password": "Super secure new password",
+		"submit": "Submit"
 	},
 	"register": {
 		"register": "Register",
 		"first_user": "You are registering the first user. It will be the administrator of your Coolify instance."
 	},
 	"reset": {
-		"reset_password": "Reset password"
+		"reset_password": "Reset",
+		"invalid_secret_key": "Invalid secret key.",
+		"secret_key": "Secret Key",
+		"find_path_secret_key": "You can find it in ~/coolify/.env (COOLIFY_SECRET_KEY)"
 	},
 	"application": {
 		"configuration": {
diff --git a/src/routes/reset/index.json.ts b/src/routes/reset/index.json.ts
index a75ea4766..1eddbd82b 100644
--- a/src/routes/reset/index.json.ts
+++ b/src/routes/reset/index.json.ts
@@ -1,5 +1,6 @@
 import type { RequestHandler } from '@sveltejs/kit';
 import * as db from '$lib/database';
+import { t } from '$lib/translations';
 
 export const get: RequestHandler = async () => {
 	const users = await db.prisma.user.findMany({});
@@ -16,7 +17,7 @@ export const post: RequestHandler = async (event) => {
 		return {
 			status: 500,
 			body: {
-				error: 'Invalid secret key.'
+				error: t.get('reset.invalid_secret_key')
 			}
 		};
 	}
diff --git a/src/routes/reset/index.svelte b/src/routes/reset/index.svelte
index 498c63e64..acb042c8f 100644
--- a/src/routes/reset/index.svelte
+++ b/src/routes/reset/index.svelte
@@ -3,6 +3,7 @@
 	import { get, post } from '$lib/api';
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	import { toast } from '@zerodevx/svelte-toast';
 
 	let secretKey;
@@ -48,14 +49,14 @@
 		<line x1="5" y1="12" x2="11" y2="6" />
 	</svg>
 </div>
-<div class="pb-10 pt-24 text-center text-4xl font-bold">Reset Password</div>
+<div class="pb-10 pt-24 text-center text-4xl font-bold">{$t('reset.reset_password')}</div>
 <div class="flex items-center justify-center">
 	{#if password}
 		<table class="mx-2 text-left">
 			<thead class="mb-2">
 				<tr>
-					<th class="px-2">Email</th>
-					<th>New password</th>
+					<th class="px-2">{$t('forms.email')}</th>
+					<th>{$t('forms.new_password')}</th>
 				</tr>
 			</thead>
 			<tbody>
@@ -67,11 +68,11 @@
 								id="newPassword"
 								name="newPassword"
 								bind:value={user.newPassword}
-								placeholder="Super secure new password"
+								placeholder={$t('forms.super_secure_new_password')}
 							/>
 							<button
 								class="mx-auto my-4 w-32 bg-coollabs hover:bg-coollabs-100"
-								on:click={() => resetPassword(user)}>Reset</button
+								on:click={() => resetPassword(user)}>{$t('reset.reset_password')}</button
 							></td
 						>
 					</tr>
@@ -80,16 +81,16 @@
 		</table>
 	{:else}
 		<form class="flex flex-col" on:submit|preventDefault={handleSubmit}>
-			<div class="text-center text-2xl py-2 font-bold">Secret Key</div>
+			<div class="text-center text-2xl py-2 font-bold">{$t('reset.secret_key')}</div>
 			<CopyPasswordField
 				isPasswordField={true}
 				id="secretKey"
 				name="secretKey"
 				bind:value={secretKey}
-				placeholder="You can find it in ~/coolify/.env (COOLIFY_SECRET_KEY)"
+				placeholder={$t('reset.find_path_secret_key')}
 			/>
 			<button type="submit" class="bg-coollabs hover:bg-coollabs-100 mx-auto w-32 my-4"
-				>Submit</button
+				>{$t('forms.submit')}</button
 			>
 		</form>
 	{/if}
diff --git a/src/routes/reset/password.json.ts b/src/routes/reset/password.json.ts
index 28e9d56e3..103d07ff3 100644
--- a/src/routes/reset/password.json.ts
+++ b/src/routes/reset/password.json.ts
@@ -1,6 +1,7 @@
 import type { RequestHandler } from '@sveltejs/kit';
 import * as db from '$lib/database';
 import { ErrorHandler, hashPassword } from '$lib/database';
+import { t } from '$lib/translations';
 
 export const post: RequestHandler = async (event) => {
 	const { secretKey, user } = await event.request.json();
@@ -8,7 +9,7 @@ export const post: RequestHandler = async (event) => {
 		return {
 			status: 500,
 			body: {
-				error: 'Invalid secret key.'
+				error: t.get('reset.invalid_secret_key')
 			}
 		};
 	}

From 360fb5ea37a43537e64452b033a2511552c0fb5f Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sun, 3 Apr 2022 00:18:48 +0200
Subject: [PATCH 14/23] Add services i18n

---
 src/lib/locales/en.json                       | 32 +++++++++++++++---
 src/routes/login/index.svelte                 |  2 +-
 .../services/[id]/_Services/_Ghost.svelte     | 19 ++++++-----
 .../services/[id]/_Services/_MinIO.svelte     |  7 ++--
 .../[id]/_Services/_PlausibleAnalytics.svelte | 17 +++++-----
 .../services/[id]/_Services/_Services.svelte  | 33 +++++++++++--------
 .../[id]/_Services/_VSCodeServer.svelte       |  3 +-
 .../services/[id]/_Services/_Wordpress.svelte | 15 +++++----
 src/routes/services/[id]/__layout.svelte      | 31 ++++++++---------
 .../[id]/configuration/destination.svelte     |  7 ++--
 .../services/[id]/configuration/type.svelte   |  3 +-
 .../[id]/configuration/version.svelte         |  2 +-
 src/routes/services/[id]/secrets/index.svelte | 10 +++---
 src/routes/sources/[id]/_Github.svelte        |  2 +-
 src/routes/sources/[id]/_Gitlab.svelte        |  2 +-
 src/routes/teams/[id]/index.svelte            |  2 +-
 16 files changed, 114 insertions(+), 73 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index 7b8591530..3f8da70a8 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -18,7 +18,8 @@
 		"databases": "Databases",
 		"services": "Services",
 		"teams": "Teams",
-		"not_implemented_yet": "Not implemented yet"
+		"not_implemented_yet": "Not implemented yet",
+		"database": "Database"
 	},
 	"login": {
 		"already_logged_in": "Already logged in...",
@@ -27,7 +28,7 @@
 	},
 	"forms": {
 		"password": "Password",
-		"email": "Email",
+		"email": "Email address",
 		"passwords_not_match": "Passwords do not match.",
 		"password_again": "Password again",
 		"save": "Save",
@@ -66,7 +67,18 @@
 		"organization": "Organization",
 		"new_password": "New password",
 		"super_secure_new_password": "Super secure new password",
-		"submit": "Submit"
+		"submit": "Submit",
+		"default_email_address": "Default Email Address",
+		"default_password": "Default Password",
+		"username": "Username",
+		"root_db_user": "Root DB User",
+		"root_db_password": "Root DB Password",
+		"api_port": "API Port",
+		"verifying": "Verifying",
+		"verify_emails_without_smtp": "Verify emails without SMTP",
+		"extra_config": "Extra Config",
+		"select_a_service": "Select a Service",
+		"select_a_service_version": "Select a Service version"
 	},
 	"register": {
 		"register": "Register",
@@ -137,7 +149,7 @@
 			"persistent_storage_explainer": "You can specify any folder that you want to be persistent across deployments. <br>This is useful for storing data such as a database (SQLite) or a cache."
 		},
 		"deployment_queued": "Deployment queued.",
-		"confirm_to_delete": "Are you sure you would like to delete '{0}'?",
+		"confirm_to_delete": "Are you sure you would like to delete '{name}'?",
 		"stop_application": "Stop application",
 		"permission_denied_stop_application": "You do not have permission to stop the application.",
 		"rebuild_application": "Rebuild application",
@@ -232,5 +244,17 @@
 			"git_source": "Add New Git Source",
 			"official_providers": "Official providers"
 		}
+	},
+	"services": {
+		"all_email_verified": "All email verified. You can login now.",
+		"generate_www_non_www_ssl": "It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-pink-600'>both DNS entries</span> set in advance.<br><br>Service needs to be restarted."
+	},
+	"service": {
+		"stop_service": "Stop Service",
+		"permission_denied_stop_service": "You do not have permission to stop the service.",
+		"start_service": "Start Service",
+		"permission_denied_start_service": "You do not have permission to start the service.",
+		"delete_service": "Delete Service",
+		"permission_denied_delete_service": "You do not have permission to delete a service."
 	}
 }
diff --git a/src/routes/login/index.svelte b/src/routes/login/index.svelte
index 6b3c79679..654df5688 100644
--- a/src/routes/login/index.svelte
+++ b/src/routes/login/index.svelte
@@ -62,7 +62,7 @@
 				<input
 					type="password"
 					name="password"
-					placeholder={$t('index.password')}
+					placeholder={$t('forms.password')}
 					bind:value={password}
 					required
 				/>
diff --git a/src/routes/services/[id]/_Services/_Ghost.svelte b/src/routes/services/[id]/_Services/_Ghost.svelte
index 8a6154ac9..48f947971 100644
--- a/src/routes/services/[id]/_Services/_Ghost.svelte
+++ b/src/routes/services/[id]/_Services/_Ghost.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 	export let readOnly;
 	export let service;
 </script>
@@ -8,19 +9,19 @@
 	<div class="title">Ghost</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="email">Default Email Address</label>
+	<label for="email">{$t('forms.default_email_address')}</label>
 	<input
 		name="email"
 		id="email"
 		disabled
 		readonly
-		placeholder="Email address"
+		placeholder={$t('forms.email')}
 		value={service.ghost.defaultEmail}
 		required
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="defaultPassword">Default Password</label>
+	<label for="defaultPassword">{$t('forms.default_password')}</label>
 	<CopyPasswordField
 		id="defaultPassword"
 		isPasswordField
@@ -34,7 +35,7 @@
 	<div class="title">MariaDB</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mariadbUser">Username</label>
+	<label for="mariadbUser">{$t('forms.username')}</label>
 	<CopyPasswordField
 		name="mariadbUser"
 		id="mariadbUser"
@@ -44,7 +45,7 @@
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mariadbPassword">Password</label>
+	<label for="mariadbPassword">{$t('forms.password')}</label>
 	<CopyPasswordField
 		id="mariadbPassword"
 		isPasswordField
@@ -55,7 +56,7 @@
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mariadbDatabase">Database</label>
+	<label for="mariadbDatabase">{$t('index.database')}</label>
 	<input
 		name="mariadbDatabase"
 		id="mariadbDatabase"
@@ -63,11 +64,11 @@
 		readonly={readOnly}
 		disabled={readOnly}
 		bind:value={service.ghost.mariadbDatabase}
-		placeholder="eg: ghost_db"
+		placeholder="{$t('forms.eg')}: ghost_db"
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mariadbRootUser">Root DB User</label>
+	<label for="mariadbRootUser">{$t('forms.root_db_user')}</label>
 	<CopyPasswordField
 		id="mariadbRootUser"
 		isPasswordField
@@ -78,7 +79,7 @@
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mariadbRootUserPassword">Root DB Password</label>
+	<label for="mariadbRootUserPassword">{$t('forms.root_db_password')}</label>
 	<CopyPasswordField
 		id="mariadbRootUserPassword"
 		isPasswordField
diff --git a/src/routes/services/[id]/_Services/_MinIO.svelte b/src/routes/services/[id]/_Services/_MinIO.svelte
index 27c320d14..8610b0025 100644
--- a/src/routes/services/[id]/_Services/_MinIO.svelte
+++ b/src/routes/services/[id]/_Services/_MinIO.svelte
@@ -1,18 +1,19 @@
 <script lang="ts">
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 
 	export let service;
 </script>
 
 <div class="flex space-x-1 py-5 font-bold">
-	<div class="title">MinIO Server</div>
+	<div class="title">MinIO</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
 	<label for="rootUser">{$t('forms.root_user')}</label>
 	<input
 		name="rootUser"
 		id="rootUser"
-		placeholder="User to login"
+		placeholder={$t('forms.username')}
 		value={service.minio.rootUser}
 		disabled
 		readonly
@@ -30,7 +31,7 @@
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="publicPort">API Port</label>
+	<label for="publicPort">{$t('forms.api_port')}</label>
 	<input
 		name="publicPort"
 		id="publicPort"
diff --git a/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte b/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
index a8b03a0d0..26b11c6f7 100644
--- a/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
+++ b/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 	export let service;
 	export let readOnly;
 </script>
@@ -8,31 +9,31 @@
 	<div class="title">Plausible Analytics</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="email">Email Address</label>
+	<label for="email">{$t('forms.email')}</label>
 	<input
 		name="email"
 		id="email"
 		disabled={readOnly}
 		readonly={readOnly}
-		placeholder="Email address"
+		placeholder={$t('forms.email')}
 		bind:value={service.plausibleAnalytics.email}
 		required
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="username">Username</label>
+	<label for="username">{$t('forms.username')}</label>
 	<CopyPasswordField
 		name="username"
 		id="username"
 		disabled={readOnly}
 		readonly={readOnly}
-		placeholder="User to login"
+		placeholder={$t('forms.username')}
 		bind:value={service.plausibleAnalytics.username}
 		required
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="password">Password</label>
+	<label for="password">{$t('forms.password')}</label>
 	<CopyPasswordField
 		id="password"
 		isPasswordField
@@ -46,7 +47,7 @@
 	<div class="title">PostgreSQL</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="postgresqlUser">Username</label>
+	<label for="postgresqlUser">{$t('forms.username')}</label>
 	<CopyPasswordField
 		name="postgresqlUser"
 		id="postgresqlUser"
@@ -56,7 +57,7 @@
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="postgresqlPassword">Password</label>
+	<label for="postgresqlPassword">{$t('forms.password')}</label>
 	<CopyPasswordField
 		id="postgresqlPassword"
 		isPasswordField
@@ -67,7 +68,7 @@
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="postgresqlDatabase">Database</label>
+	<label for="postgresqlDatabase">{$t('index.database')}</label>
 	<CopyPasswordField
 		name="postgresqlDatabase"
 		id="postgresqlDatabase"
diff --git a/src/routes/services/[id]/_Services/_Services.svelte b/src/routes/services/[id]/_Services/_Services.svelte
index 6a54d9b98..9970eec7c 100644
--- a/src/routes/services/[id]/_Services/_Services.svelte
+++ b/src/routes/services/[id]/_Services/_Services.svelte
@@ -9,6 +9,7 @@
 	import Explainer from '$lib/components/Explainer.svelte';
 	import Setting from '$lib/components/Setting.svelte';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	import { toast } from '@zerodevx/svelte-toast';
 	import Ghost from './_Ghost.svelte';
 	import MinIo from './_MinIO.svelte';
@@ -38,7 +39,7 @@
 		loadingVerification = true;
 		try {
 			await post(`/services/${id}/${service.type}/activate.json`, { id: service.id });
-			toast.push('All email verified. You can login now.');
+			toast.push(t.get('services.all_email_verified'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		} finally {
@@ -51,7 +52,7 @@
 				dualCerts = !dualCerts;
 			}
 			await post(`/services/${id}/settings.json`, { dualCerts });
-			return toast.push('Settings saved.');
+			return toast.push(t.get('application.settings_saved'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
@@ -61,25 +62,27 @@
 <div class="mx-auto max-w-4xl px-6 pb-12">
 	<form on:submit|preventDefault={handleSubmit} class="py-4">
 		<div class="flex space-x-1 pb-5 font-bold">
-			<div class="title">General</div>
+			<div class="title">{$t('general')}</div>
 			{#if $session.isAdmin}
 				<button
 					type="submit"
 					class:bg-pink-600={!loading}
 					class:hover:bg-pink-500={!loading}
-					disabled={loading}>{loading ? 'Saving...' : 'Save'}</button
+					disabled={loading}>{loading ? $t('forms.saving') : $t('forms.save')}</button
 				>
 			{/if}
 			{#if service.type === 'plausibleanalytics' && isRunning}
 				<button on:click|preventDefault={setEmailsToVerified} disabled={loadingVerification}
-					>{loadingVerification ? 'Verifying' : 'Verify emails without SMTP'}</button
+					>{loadingVerification
+						? $t('forms.verifying')
+						: $t('forms.verify_emails_without_smtp')}</button
 				>
 			{/if}
 		</div>
 
 		<div class="grid grid-flow-row gap-2">
 			<div class="mt-2 grid grid-cols-2 items-center px-10">
-				<label for="name" class="text-base font-bold text-stone-100">Name</label>
+				<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 				<div>
 					<input
 						readonly={!$session.isAdmin}
@@ -92,7 +95,9 @@
 			</div>
 
 			<div class="grid grid-cols-2 items-center px-10">
-				<label for="destination" class="text-base font-bold text-stone-100">Destination</label>
+				<label for="destination" class="text-base font-bold text-stone-100"
+					>{$t('application.destination')}</label
+				>
 				<div>
 					{#if service.destinationDockerId}
 						<div class="no-underline">
@@ -108,10 +113,10 @@
 			</div>
 			<div class="grid grid-cols-2 px-10">
 				<div class="flex-col ">
-					<label for="fqdn" class="pt-2 text-base font-bold text-stone-100">Domain (FQDN)</label>
-					<Explainer
-						text="If you specify <span class='text-pink-600 font-bold'>https</span>, the application will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-pink-600 font-bold'>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application."
-					/>
+					<label for="fqdn" class="pt-2 text-base font-bold text-stone-100"
+						>{$t('application.domain_fqdn')}</label
+					>
+					<Explainer text={$t('application.https_explainer')} />
 				</div>
 
 				<CopyPasswordField
@@ -128,10 +133,10 @@
 			<div class="grid grid-cols-2 items-center px-10">
 				<Setting
 					disabled={isRunning}
-					dataTooltip="Must be stopped to modify."
+					dataTooltip={$t('forms.must_be_stopped_to_modify')}
 					bind:setting={dualCerts}
-					title="Generate SSL for www and non-www?"
-					description="It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-pink-600'>both DNS entries</span> set in advance.<br><br>Service needs to be restarted."
+					title={$t('application.ssl_www_and_non_www')}
+					description={$t('services.generate_www_non_www_ssl')}
 					on:click={() => !isRunning && changeSettings('dualCerts')}
 				/>
 			</div>
diff --git a/src/routes/services/[id]/_Services/_VSCodeServer.svelte b/src/routes/services/[id]/_Services/_VSCodeServer.svelte
index f8be43aa5..43873bf4d 100644
--- a/src/routes/services/[id]/_Services/_VSCodeServer.svelte
+++ b/src/routes/services/[id]/_Services/_VSCodeServer.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 
 	export let service;
 </script>
@@ -8,7 +9,7 @@
 	<div class="title">VSCode Server</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="password">Password</label>
+	<label for="password">{$t('forms.password')}</label>
 	<CopyPasswordField
 		id="password"
 		isPasswordField
diff --git a/src/routes/services/[id]/_Services/_Wordpress.svelte b/src/routes/services/[id]/_Services/_Wordpress.svelte
index bd701bd54..0f5c4bb20 100644
--- a/src/routes/services/[id]/_Services/_Wordpress.svelte
+++ b/src/routes/services/[id]/_Services/_Wordpress.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 
 	export let service;
 	export let isRunning;
@@ -11,7 +12,7 @@
 </div>
 
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="extraConfig">Extra Config</label>
+	<label for="extraConfig">{$t('forms.extra_config')}</label>
 	<textarea
 		disabled={isRunning}
 		readonly={isRunning}
@@ -20,7 +21,7 @@
 		name="extraConfig"
 		id="extraConfig"
 		placeholder={!isRunning
-			? `eg:
+			? `${$t('forms.eg')}:
 
 define('WP_ALLOW_MULTISITE', true);
 define('MULTISITE', true);
@@ -32,7 +33,7 @@ define('SUBDOMAIN_INSTALL', false);`
 	<div class="title">MySQL</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mysqlDatabase">Database</label>
+	<label for="mysqlDatabase">{$t('index.database')}</label>
 	<input
 		name="mysqlDatabase"
 		id="mysqlDatabase"
@@ -40,7 +41,7 @@ define('SUBDOMAIN_INSTALL', false);`
 		readonly={readOnly}
 		disabled={readOnly}
 		bind:value={service.wordpress.mysqlDatabase}
-		placeholder="eg: wordpress_db"
+		placeholder="{$t('forms.eg')}: wordpress_db"
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
@@ -48,7 +49,7 @@ define('SUBDOMAIN_INSTALL', false);`
 	<input
 		name="mysqlRootUser"
 		id="mysqlRootUser"
-		placeholder="MySQL Root User"
+		placeholder="MySQL {$t('forms.root_user')}"
 		value={service.wordpress.mysqlRootUser}
 		disabled
 		readonly
@@ -66,11 +67,11 @@ define('SUBDOMAIN_INSTALL', false);`
 	/>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mysqlUser">User</label>
+	<label for="mysqlUser">{$t('forms.user')}</label>
 	<input name="mysqlUser" id="mysqlUser" value={service.wordpress.mysqlUser} disabled readonly />
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="mysqlPassword">Password</label>
+	<label for="mysqlPassword">{$t('forms.password')}</label>
 	<CopyPasswordField
 		id="mysqlPassword"
 		isPasswordField
diff --git a/src/routes/services/[id]/__layout.svelte b/src/routes/services/[id]/__layout.svelte
index 362f89786..593c5bc56 100644
--- a/src/routes/services/[id]/__layout.svelte
+++ b/src/routes/services/[id]/__layout.svelte
@@ -64,6 +64,7 @@
 	import Loading from '$lib/components/Loading.svelte';
 	import { del, post } from '$lib/api';
 	import { goto } from '$app/navigation';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	export let service;
@@ -72,7 +73,7 @@
 	let loading = false;
 
 	async function deleteService() {
-		const sure = confirm(`Are you sure you would like to delete '${service.name}'?`);
+		const sure = confirm(t.get('application.confirm_to_delete', { name: service.name }));
 		if (sure) {
 			loading = true;
 			try {
@@ -87,7 +88,7 @@
 		}
 	}
 	async function stopService() {
-		const sure = confirm(`Are you sure you would like to stop '${service.name}'?`);
+		const sure = confirm(t.get('application.confirm_stop', { name: service.name }));
 		if (sure) {
 			loading = true;
 			try {
@@ -121,13 +122,13 @@
 			{#if isRunning}
 				<button
 					on:click={stopService}
-					title="Stop Service"
+					title={$t('service.stop_service')}
 					type="submit"
 					disabled={!$session.isAdmin}
 					class="icons bg-transparent tooltip-bottom text-sm flex items-center space-x-2 text-red-500"
 					data-tooltip={$session.isAdmin
-						? 'Stop Service'
-						: 'You do not have permission to stop the service.'}
+						? $t('service.stop_service')
+						: $t('service.permission_denied_stop_service')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -147,13 +148,13 @@
 			{:else}
 				<button
 					on:click={startService}
-					title="Start Service"
+					title={$t('service.start_service')}
 					type="submit"
 					disabled={!$session.isAdmin}
 					class="icons bg-transparent tooltip-bottom text-sm flex items-center space-x-2 text-green-500"
 					data-tooltip={$session.isAdmin
-						? 'Start Service'
-						: 'You do not have permission to start the service.'}
+						? $t('service.start_service')
+						: $t('service.permission_denied_start_service')}
 					><svg
 						xmlns="http://www.w3.org/2000/svg"
 						class="w-6 h-6"
@@ -180,9 +181,9 @@
 				class:bg-coolgray-500={$page.url.pathname === `/services/${id}`}
 			>
 				<button
-					title="Configurations"
+					title={$t('application.configurations')}
 					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500"
-					data-tooltip="Configurations"
+					data-tooltip={$t('application.configurations')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -215,9 +216,9 @@
 				class:bg-coolgray-500={$page.url.pathname === `/services/${id}/secrets`}
 			>
 				<button
-					title="Secrets"
+					title={$t('application.secret')}
 					class="icons bg-transparent tooltip-bottom text-sm disabled:text-red-500"
-					data-tooltip="Secrets"
+					data-tooltip={$t('application.secret')}
 				>
 					<svg
 						xmlns="http://www.w3.org/2000/svg"
@@ -242,14 +243,14 @@
 		{/if}
 		<button
 			on:click={deleteService}
-			title="Delete Service"
+			title={$t('service.delete_service')}
 			type="submit"
 			disabled={!$session.isAdmin}
 			class:hover:text-red-500={$session.isAdmin}
 			class="icons bg-transparent tooltip-bottom text-sm"
 			data-tooltip={$session.isAdmin
-				? 'Delete Service'
-				: 'You do not have permission to delete a service.'}><DeleteIcon /></button
+				? $t('service.delete_service')
+				: $t('service.permission_denied_delete_service')}><DeleteIcon /></button
 		>
 	{/if}
 </nav>
diff --git a/src/routes/services/[id]/configuration/destination.svelte b/src/routes/services/[id]/configuration/destination.svelte
index d7220df87..6dee1df95 100644
--- a/src/routes/services/[id]/configuration/destination.svelte
+++ b/src/routes/services/[id]/configuration/destination.svelte
@@ -34,6 +34,7 @@
 	import { enhance, errorNotification } from '$lib/form';
 	import { goto } from '$app/navigation';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -50,12 +51,14 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Configure Destination</div>
+	<div class="mr-4 text-2xl tracking-tight">
+		{$t('application.configuration.configure_destination')}
+	</div>
 </div>
 <div class="flex justify-center">
 	{#if !destinations || destinations.length === 0}
 		<div class="flex-col">
-			<div class="pb-2">No configurable Destination found</div>
+			<div class="pb-2">{$t('application.configuration.no_configurable_destination')}</div>
 			<div class="flex justify-center">
 				<a href="/new/destination" sveltekit:prefetch class="add-icon bg-sky-600 hover:bg-sky-500">
 					<svg
diff --git a/src/routes/services/[id]/configuration/type.svelte b/src/routes/services/[id]/configuration/type.svelte
index bf8575065..c158517d9 100644
--- a/src/routes/services/[id]/configuration/type.svelte
+++ b/src/routes/services/[id]/configuration/type.svelte
@@ -41,6 +41,7 @@
 	import N8n from '$lib/components/svg/services/N8n.svelte';
 	import UptimeKuma from '$lib/components/svg/services/UptimeKuma.svelte';
 	import Ghost from '$lib/components/svg/services/Ghost.svelte';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
@@ -58,7 +59,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Select a Service</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('forms.select_a_service')}</div>
 </div>
 
 <div class="flex flex-wrap justify-center">
diff --git a/src/routes/services/[id]/configuration/version.svelte b/src/routes/services/[id]/configuration/version.svelte
index 5f2930487..00c9bc19d 100644
--- a/src/routes/services/[id]/configuration/version.svelte
+++ b/src/routes/services/[id]/configuration/version.svelte
@@ -47,7 +47,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Select a Service version</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('forms.select_a_service_version')}</div>
 </div>
 
 <div class="flex flex-wrap justify-center">
diff --git a/src/routes/services/[id]/secrets/index.svelte b/src/routes/services/[id]/secrets/index.svelte
index d850fd37f..5ff45617c 100644
--- a/src/routes/services/[id]/secrets/index.svelte
+++ b/src/routes/services/[id]/secrets/index.svelte
@@ -26,6 +26,7 @@
 	import { getDomain } from '$lib/components/common';
 	import { page } from '$app/stores';
 	import { get } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 
@@ -37,7 +38,8 @@
 
 <div class="flex space-x-1 p-6 font-bold">
 	<div class="mr-4 text-2xl tracking-tight">
-		Secrets {#if service.fqdn}
+		{$t('application.secret')}
+		{#if service.fqdn}
 			<a href={service.fqdn} target="_blank">{getDomain(service.fqdn)}</a>
 		{/if}
 	</div>
@@ -46,9 +48,9 @@
 	<table class="mx-auto border-separate text-left">
 		<thead>
 			<tr class="h-12">
-				<th scope="col">Name</th>
-				<th scope="col">Value</th>
-				<th scope="col" class="w-96 text-center">Action</th>
+				<th scope="col">{$t('forms.name')}</th>
+				<th scope="col">{$t('forms.value')}</th>
+				<th scope="col" class="w-96 text-center">{$t('forms.action')}</th>
 			</tr>
 		</thead>
 		<tbody>
diff --git a/src/routes/sources/[id]/_Github.svelte b/src/routes/sources/[id]/_Github.svelte
index 102971353..cf4d43354 100644
--- a/src/routes/sources/[id]/_Github.svelte
+++ b/src/routes/sources/[id]/_Github.svelte
@@ -79,7 +79,7 @@
 		</div>
 		<div class="grid grid-flow-row gap-2 px-10">
 			<div class="grid grid-cols-2 items-center mt-2">
-				<label for="name" class="text-base font-bold text-stone-100">Name</label>
+				<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 				<input name="name" id="name" required bind:value={source.name} />
 			</div>
 		</div>
diff --git a/src/routes/sources/[id]/_Gitlab.svelte b/src/routes/sources/[id]/_Gitlab.svelte
index 56bb0288d..3667fc98d 100644
--- a/src/routes/sources/[id]/_Gitlab.svelte
+++ b/src/routes/sources/[id]/_Gitlab.svelte
@@ -195,7 +195,7 @@
 			</div>
 			<div class="grid grid-flow-row gap-2 px-10">
 				<div class="mt-2 grid grid-cols-2 items-center">
-					<label for="name" class="text-base font-bold text-stone-100">Name</label>
+					<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 					<input name="name" id="name" required bind:value={source.name} />
 				</div>
 			</div>
diff --git a/src/routes/teams/[id]/index.svelte b/src/routes/teams/[id]/index.svelte
index 964b57612..91d6cf38d 100644
--- a/src/routes/teams/[id]/index.svelte
+++ b/src/routes/teams/[id]/index.svelte
@@ -107,7 +107,7 @@
 		<div class="grid grid-flow-row gap-2 px-10">
 			<div class="mt-2 grid grid-cols-2">
 				<div class="flex-col">
-					<label for="name" class="text-base font-bold text-stone-100">Name</label>
+					<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 					{#if team.id === '0'}
 						<Explainer
 							customClass="w-full"

From fe787538e3ad04ce3181f09a8a34b26715c952b9 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sun, 3 Apr 2022 14:14:59 +0200
Subject: [PATCH 15/23] Finish routes translations

---
 .vscode/settings.json                       |  5 +-
 src/lib/locales/en.json                     | 72 +++++++++++++++++++--
 src/routes/__error.svelte                   |  2 +-
 src/routes/__layout.svelte                  | 18 +++---
 src/routes/services/index.svelte            |  7 +-
 src/routes/settings/check.json.ts           |  4 +-
 src/routes/settings/index.json.ts           |  7 +-
 src/routes/settings/index.svelte            | 45 ++++++-------
 src/routes/sources/[id]/_Github.svelte      | 11 ++--
 src/routes/sources/[id]/_Gitlab.svelte      | 35 +++++-----
 src/routes/sources/[id]/__layout.svelte     |  9 +--
 src/routes/sources/[id]/check.json.ts       |  3 +-
 src/routes/sources/[id]/index.svelte        |  3 +-
 src/routes/sources/[id]/newGithubApp.svelte |  3 +-
 src/routes/sources/index.svelte             |  7 +-
 src/routes/teams/[id]/index.svelte          | 54 +++++++++-------
 src/routes/teams/index.svelte               | 21 +++---
 17 files changed, 195 insertions(+), 111 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index b823b0001..858d6ae2c 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -4,5 +4,8 @@
 	"i18n-ally.extract.ignoredByFiles": {
 		"src\\routes\\__layout.svelte": ["Coolify", "coolLabs logo"]
 	},
-	"i18n-ally.sourceLanguage": "en"
+	"i18n-ally.sourceLanguage": "en",
+	"i18n-ally.enabledFrameworks": ["svelte"],
+	"i18n-ally.enabledParsers": ["js", "ts", "json"],
+	"i18n-ally.extract.autoDetect": true
 }
diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index 3f8da70a8..58e368e6f 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -8,7 +8,8 @@
 	},
 	"error": {
 		"you_can_find_your_way_back": "You can find your way back",
-		"here": "here"
+		"here": "here",
+		"you_are_lost": "Ooops you are lost! But don't be afraid!"
 	},
 	"index": {
 		"dashboard": "Dashboard",
@@ -19,7 +20,12 @@
 		"services": "Services",
 		"teams": "Teams",
 		"not_implemented_yet": "Not implemented yet",
-		"database": "Database"
+		"database": "Database",
+		"settings": "Settings",
+		"global_settings": "Global Settings",
+		"secret": "Secret",
+		"team": "Team",
+		"logout": "Logout"
 	},
 	"login": {
 		"already_logged_in": "Already logged in...",
@@ -78,7 +84,12 @@
 		"verify_emails_without_smtp": "Verify emails without SMTP",
 		"extra_config": "Extra Config",
 		"select_a_service": "Select a Service",
-		"select_a_service_version": "Select a Service version"
+		"select_a_service_version": "Select a Service version",
+		"removing": "Removing...",
+		"remove_domain": "Remove domain",
+		"public_port_range": "Public Port Range",
+		"public_port_range_explainer": "Ports used to expose databases/services/internal services.<br> Add them to your firewall (if applicable).<br><br>You can specify a range of ports, eg: <span class='text-yellow-500 font-bold'>9000-9100</span>",
+		"no_actions_available": "No actions available"
 	},
 	"register": {
 		"register": "Register",
@@ -237,12 +248,31 @@
 		"remote_docker": "Remote Docker",
 		"organization_explainer": "Fill it if you would like to use an organization's as your Git Source. Otherwise your user will be used."
 	},
-	"eg_https_api_github_com": "eg: https://api.github.com",
-	"eg_https_github_com": "eg: https://github.com",
 	"source": {
 		"new": {
 			"git_source": "Add New Git Source",
 			"official_providers": "Official providers"
+		},
+		"no_git_sources_found": "No git sources found",
+		"delete_git_source": "Delete Git Source",
+		"permission_denied": "You do not have permission to delete a Git Source",
+		"create_new_app": "Create new {name} App",
+		"change_app_settings": "Change {name} App Settings",
+		"install_repositories": "Install Repositories",
+		"application_id": "Application ID",
+		"group_name": "Group Name",
+		"oauth_id": "OAuth ID",
+		"oauth_id_explainer": "The OAuth ID is the unique identifier of the GitLab application. <br>You can find it <span class='font-bold text-orange-600' >in the URL</span> of your GitLab OAuth Application.",
+		"register_oauth_gitlab": "Register new OAuth application on GitLab",
+		"gitlab": {
+			"self_hosted": "Instance-wide application (self-hosted)",
+			"user_owned": "User owned application",
+			"group_owned": "Group owned application",
+			"gitlab_application_type": "GitLab Application Type",
+			"already_configured": "GitLab App is already configured."
+		},
+		"github": {
+			"redirecting": "Redirecting to Github..."
 		}
 	},
 	"services": {
@@ -255,6 +285,36 @@
 		"start_service": "Start Service",
 		"permission_denied_start_service": "You do not have permission to start the service.",
 		"delete_service": "Delete Service",
-		"permission_denied_delete_service": "You do not have permission to delete a service."
+		"permission_denied_delete_service": "You do not have permission to delete a service.",
+		"no_service": "No services found"
+	},
+	"setting": {
+		"permission_denied": "You do not have permission to do this. \\nAsk an admin to modify your permissions.",
+		"domain_removed": "Domain removed",
+		"ssl_explainer": "If you specify <span class='text-yellow-500 font-bold'>https</span>, Coolify will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-yellow-500 font-bold'>www</span>, Coolify will be redirected (302) from non-www and vice versa.",
+		"must_remove_domain_before_changing": "Must remove the domain before you can change this setting.",
+		"registration_allowed": "Registration allowed?",
+		"registration_allowed_explainer": "Allow further registrations to the application. <br>It's turned off after the first registration.",
+		"coolify_proxy_settings": "Coolify Proxy Settings"
+	},
+	"team": {
+		"pending_invitations": "Pending invitations",
+		"accept": "Accept",
+		"delete": "Delete",
+		"member": "member(s)",
+		"root": "(root)",
+		"invited_with_permissions": "Invited to <span class=\"font-bold text-pink-600\">{teamName}</span> with <span class=\"font-bold text-rose-600\">{permission}</span> permission.",
+		"members": "Members",
+		"root_team_explainer": "This is the <span class='text-red-500 font-bold'>root</span> team. That means members of this group can manage instance wide settings and have all the priviliges in Coolify (imagine like root user on Linux).",
+		"permission": "Permission",
+		"you": "(You)",
+		"promote_to": "Promote to {grade}",
+		"revoke_invitation": "Revoke invitation",
+		"pending_invitation": "Pending invitation",
+		"invite_new_member": "Invite new member",
+		"send_invitation": "Send invitation",
+		"invite_only_register_explainer": "You can only invite registered users at the moment - will be extended soon.",
+		"admin": "Admin",
+		"read": "Read"
 	}
 }
diff --git a/src/routes/__error.svelte b/src/routes/__error.svelte
index edecc0f82..1ac61d6bf 100644
--- a/src/routes/__error.svelte
+++ b/src/routes/__error.svelte
@@ -20,7 +20,7 @@
 
 <div class="mx-auto flex h-screen flex-col items-center justify-center px-4">
 	<div class="pb-10 text-7xl font-bold">{status}</div>
-	<div class="text-3xl font-bold">Ooops you are lost! But don't be afraid!</div>
+	<div class="text-3xl font-bold">{$t('error.you_are_lost')}</div>
 	<div class="text-xl">
 		{$t('error.you_can_find_your_way_back')}
 		<a href="/" class="font-bold uppercase text-sky-400">{$t('error.here')}</a>
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 7d6946b8d..3594a8c1c 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -159,7 +159,7 @@
 						class="icons tooltip-right bg-coolgray-200 hover:text-white"
 						class:text-white={$page.url.pathname === '/'}
 						class:bg-coolgray-500={$page.url.pathname === '/'}
-						data-tooltip="Dashboard"
+						data-tooltip={$t('index.dashboard')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -188,7 +188,7 @@
 							$page.url.pathname.startsWith('/new/application')}
 						class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
 							$page.url.pathname.startsWith('/new/application')}
-						data-tooltip="Applications"
+						data-tooltip={$t('index.applications')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -216,7 +216,7 @@
 							$page.url.pathname.startsWith('/new/source')}
 						class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
 							$page.url.pathname.startsWith('/new/source')}
-						data-tooltip="Git Sources"
+						data-tooltip={$t('index.git_sources')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -246,7 +246,7 @@
 							$page.url.pathname.startsWith('/new/destination')}
 						class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
 							$page.url.pathname.startsWith('/new/destination')}
-						data-tooltip="Destinations"
+						data-tooltip={$t('index.destinations')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -281,7 +281,7 @@
 							$page.url.pathname.startsWith('/new/database')}
 						class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
 							$page.url.pathname.startsWith('/new/database')}
-						data-tooltip="Databases"
+						data-tooltip={$t('index.databases')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -308,7 +308,7 @@
 							$page.url.pathname.startsWith('/new/service')}
 						class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
 							$page.url.pathname.startsWith('/new/service')}
-						data-tooltip="Services"
+						data-tooltip={$t('index.services')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -446,7 +446,7 @@
 						class="icons tooltip-right bg-coolgray-200 hover:text-cyan-500"
 						class:text-cyan-500={$page.url.pathname.startsWith('/teams')}
 						class:bg-coolgray-500={$page.url.pathname.startsWith('/teams')}
-						data-tooltip="Teams"
+						data-tooltip={$t('index.teams')}
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -472,7 +472,7 @@
 							class="icons tooltip-right bg-coolgray-200 hover:text-yellow-500"
 							class:text-yellow-500={$page.url.pathname.startsWith('/settings')}
 							class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
-							data-tooltip="Settings"
+							data-tooltip={$t('index.settings')}
 						>
 							<svg
 								xmlns="http://www.w3.org/2000/svg"
@@ -494,7 +494,7 @@
 					{/if}
 					<div
 						class="icons tooltip-right bg-coolgray-200 hover:text-red-500"
-						data-tooltip="Logout"
+						data-tooltip={$t('index.logout')}
 						on:click={logout}
 					>
 						<svg
diff --git a/src/routes/services/index.svelte b/src/routes/services/index.svelte
index 2b5584270..a7ae7b86e 100644
--- a/src/routes/services/index.svelte
+++ b/src/routes/services/index.svelte
@@ -11,6 +11,7 @@
 	import N8n from '$lib/components/svg/services/N8n.svelte';
 	import UptimeKuma from '$lib/components/svg/services/UptimeKuma.svelte';
 	import Ghost from '$lib/components/svg/services/Ghost.svelte';
+	import { t } from '$lib/translations';
 
 	export let services;
 	async function newService() {
@@ -20,7 +21,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Services</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('index.services')}</div>
 	<div on:click={newService} class="add-icon cursor-pointer bg-pink-600 hover:bg-pink-500">
 		<svg
 			class="w-6"
@@ -41,7 +42,7 @@
 <div class="flex flex-wrap justify-center">
 	{#if !services || services.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">No services found</div>
+			<div class="text-center text-xl font-bold">{$t('service.no_service')}</div>
 		</div>
 	{:else}
 		{#each services as service}
@@ -73,7 +74,7 @@
 					</div>
 					{#if !service.type || !service.fqdn}
 						<div class="font-bold text-center truncate text-red-500 group-hover:text-white">
-							Configuration missing
+							{$t('application.configuration.configuration_missing')}
 						</div>
 					{:else}
 						<div class="text-center truncate">{service.type}</div>
diff --git a/src/routes/settings/check.json.ts b/src/routes/settings/check.json.ts
index d24dcc0e6..bec577001 100644
--- a/src/routes/settings/check.json.ts
+++ b/src/routes/settings/check.json.ts
@@ -1,6 +1,7 @@
 import { asyncExecShell, getEngine, getUserDetails } from '$lib/common';
 import * as db from '$lib/database';
 import { ErrorHandler } from '$lib/database';
+import { t } from '$lib/translations';
 import type { RequestHandler } from '@sveltejs/kit';
 
 export const post: RequestHandler = async (event) => {
@@ -16,7 +17,8 @@ export const post: RequestHandler = async (event) => {
 		return {
 			status: found ? 500 : 200,
 			body: {
-				error: found && `Domain ${fqdn.replace('www.', '')} is already used.`
+				error:
+					found && t.get('application.domain_already_in_use', { domain: fqdn.replace('www.', '') })
 			}
 		};
 	} catch (error) {
diff --git a/src/routes/settings/index.json.ts b/src/routes/settings/index.json.ts
index db3dc0710..6f4bd8374 100644
--- a/src/routes/settings/index.json.ts
+++ b/src/routes/settings/index.json.ts
@@ -1,6 +1,7 @@
 import { getUserDetails } from '$lib/common';
 import * as db from '$lib/database';
 import { listSettings, ErrorHandler } from '$lib/database';
+import { t } from '$lib/translations';
 import type { RequestHandler } from '@sveltejs/kit';
 import { promises as dns } from 'dns';
 
@@ -27,7 +28,7 @@ export const del: RequestHandler = async (event) => {
 		return {
 			status: 401,
 			body: {
-				message: 'You do not have permission to do this. \nAsk an admin to modify your permissions.'
+				message: t.get('setting.permission_denied')
 			}
 		};
 	if (status === 401) return { status, body };
@@ -44,7 +45,7 @@ export const del: RequestHandler = async (event) => {
 		return {
 			status: 200,
 			body: {
-				message: 'Domain removed',
+				message: t.get('setting.domain_removed'),
 				redirect: ip ? `http://${ip[0]}:3000/settings` : undefined
 			}
 		};
@@ -58,7 +59,7 @@ export const post: RequestHandler = async (event) => {
 		return {
 			status: 401,
 			body: {
-				message: 'You do not have permission to do this. \nAsk an admin to modify your permissions.'
+				message: t.get('setting.permission_denied')
 			}
 		};
 	if (status === 401) return { status, body };
diff --git a/src/routes/settings/index.svelte b/src/routes/settings/index.svelte
index d4b561ebf..1b3833803 100644
--- a/src/routes/settings/index.svelte
+++ b/src/routes/settings/index.svelte
@@ -31,6 +31,7 @@
 	import { browser } from '$app/env';
 	import { getDomain } from '$lib/components/common';
 	import { toast } from '@zerodevx/svelte-toast';
+	import { t } from '$lib/translations';
 
 	let isRegistrationEnabled = settings.isRegistrationEnabled;
 	let dualCerts = settings.dualCerts;
@@ -67,7 +68,7 @@
 				dualCerts = !dualCerts;
 			}
 			await post(`/settings.json`, { isRegistrationEnabled, dualCerts });
-			return toast.push('Settings saved.');
+			return toast.push(t.get('application.settings_saved'));
 		} catch ({ error }) {
 			return errorNotification(error);
 		}
@@ -94,19 +95,19 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Settings</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('index.settings')}</div>
 </div>
 {#if $session.teamId === '0'}
 	<div class="mx-auto max-w-4xl px-6">
 		<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
 			<div class="flex space-x-1 pb-6">
-				<div class="title font-bold">Global Settings</div>
+				<div class="title font-bold">{$t('index.global_settings')}</div>
 				<button
 					type="submit"
 					disabled={loading.save}
 					class:bg-yellow-500={!loading.save}
 					class:hover:bg-yellow-400={!loading.save}
-					class="mx-2 ">{loading.save ? 'Saving...' : 'Save'}</button
+					class="mx-2 ">{loading.save ? $t('forms.saving') : $t('forms.save')}</button
 				>
 				{#if isFqdnSet}
 					<button
@@ -114,17 +115,17 @@
 						disabled={loading.remove}
 						class:bg-red-600={!loading.remove}
 						class:hover:bg-red-500={!loading.remove}
-						>{loading.remove ? 'Removing...' : 'Remove domain'}</button
+						>{loading.remove ? $t('forms.removing') : $t('forms.remove_domain')}</button
 					>
 				{/if}
 			</div>
 			<div class="grid grid-flow-row gap-2 px-10">
 				<div class="grid grid-cols-2 items-start">
 					<div class="flex-col">
-						<div class="pt-2 text-base font-bold text-stone-100">Domain (FQDN)</div>
-						<Explainer
-							text="If you specify <span class='text-yellow-500 font-bold'>https</span>, Coolify will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-yellow-500 font-bold'>www</span>, Coolify will be redirected (302) from non-www and vice versa."
-						/>
+						<div class="pt-2 text-base font-bold text-stone-100">
+							{$t('application.domain_fqdn')}
+						</div>
+						<Explainer text={$t('setting.ssl_explainer')} />
 					</div>
 					<div class="justify-start text-left">
 						<input
@@ -134,16 +135,16 @@
 							name="fqdn"
 							id="fqdn"
 							pattern="^https?://([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{'{'}2,{'}'}$"
-							placeholder="eg: https://coolify.io"
+							placeholder="{$t('forms.eg')}: https://coolify.io"
 						/>
 					</div>
 				</div>
 				<div class="grid grid-cols-2 items-start py-6">
 					<div class="flex-col">
-						<div class="pt-2 text-base font-bold text-stone-100">Public Port Range</div>
-						<Explainer
-							text="Ports used to expose databases/services/internal services.<br> Add them to your firewall (if applicable).<br><br>You can specify a range of ports, eg: <span class='text-yellow-500 font-bold'>9000-9100</span>"
-						/>
+						<div class="pt-2 text-base font-bold text-stone-100">
+							{$t('forms.public_port_range')}
+						</div>
+						<Explainer text={$t('forms.public_port_range_explainer')} />
 					</div>
 					<div class="mx-auto flex-row items-center justify-center space-y-2">
 						<input
@@ -165,26 +166,26 @@
 				</div>
 				<div class="grid grid-cols-2 items-center">
 					<Setting
-						dataTooltip="Must remove the domain before you can change this setting."
+						dataTooltip={$t('setting.must_remove_domain_before_changing')}
 						disabled={isFqdnSet}
 						bind:setting={dualCerts}
-						title="Generate SSL for www and non-www?"
-						description="It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-yellow-500'>both DNS entries</span> set in advance.<br><br>Useful if you expect to have visitors on both."
+						title={$t('application.ssl_www_and_non_www')}
+						description={$t('services.generate_www_non_www_ssl')}
 						on:click={() => !isFqdnSet && changeSettings('dualCerts')}
 					/>
 				</div>
 				<div class="grid grid-cols-2 items-center">
 					<Setting
 						bind:setting={isRegistrationEnabled}
-						title="Registration allowed?"
-						description="Allow further registrations to the application. <br>It's turned off after the first registration. "
+						title={$t('setting.registration_allowed')}
+						description={$t('setting.registration_allowed_explainer')}
 						on:click={() => changeSettings('isRegistrationEnabled')}
 					/>
 				</div>
 			</div>
 		</form>
 		<div class="flex space-x-1 pt-6 font-bold">
-			<div class="title">Coolify Proxy Settings</div>
+			<div class="title">{$t('setting.coolify_proxy_settings')}</div>
 		</div>
 		<Explainer
 			text={`Credentials for <a class="text-white font-bold" href=${
@@ -198,7 +199,7 @@
 		/>
 		<div class="space-y-2 px-10 py-5">
 			<div class="grid grid-cols-2 items-center">
-				<label for="proxyUser">User</label>
+				<label for="proxyUser">{$t('forms.user')}</label>
 				<CopyPasswordField
 					readonly
 					disabled
@@ -208,7 +209,7 @@
 				/>
 			</div>
 			<div class="grid grid-cols-2 items-center">
-				<label for="proxyPassword">Password</label>
+				<label for="proxyPassword">{$t('forms.password')}</label>
 				<CopyPasswordField
 					readonly
 					disabled
diff --git a/src/routes/sources/[id]/_Github.svelte b/src/routes/sources/[id]/_Github.svelte
index cf4d43354..964d6d4ba 100644
--- a/src/routes/sources/[id]/_Github.svelte
+++ b/src/routes/sources/[id]/_Github.svelte
@@ -3,6 +3,7 @@
 	import { page, session } from '$app/stores';
 	import { post } from '$lib/api';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	let loading = false;
@@ -60,20 +61,20 @@
 </script>
 
 {#if !source.githubAppId}
-	<button on:click={newGithubApp}>Create new GitHub App</button>
+	<button on:click={newGithubApp}>{$t('source.create_new_app', { name: 'GitHub' })}</button>
 {:else if source.githubApp?.installationId}
 	<form on:submit|preventDefault={handleSubmit} class="py-4">
 		<div class="flex space-x-1 pb-5 font-bold">
-			<div class="title">General</div>
+			<div class="title">{$t('general')}</div>
 			{#if $session.isAdmin}
 				<button
 					type="submit"
 					class:bg-orange-600={!loading}
 					class:hover:bg-orange-500={!loading}
-					disabled={loading}>{loading ? 'Saving...' : 'Save'}</button
+					disabled={loading}>{loading ? $t('forms.saving') : $t('forms.save')}</button
 				>
 				<button on:click|preventDefault={() => installRepositories(source)}
-					>Change GitHub App Settings</button
+					>{$t('source.change_app_settings', { name: 'GitHub' })}</button
 				>
 			{/if}
 		</div>
@@ -85,5 +86,5 @@
 		</div>
 	</form>
 {:else}
-	<button on:click={() => installRepositories(source)}>Install Repositories</button>
+	<button on:click={() => installRepositories(source)}>{$t('source.install_repositories')}</button>
 {/if}
diff --git a/src/routes/sources/[id]/_Gitlab.svelte b/src/routes/sources/[id]/_Gitlab.svelte
index 3667fc98d..51616f8e9 100644
--- a/src/routes/sources/[id]/_Gitlab.svelte
+++ b/src/routes/sources/[id]/_Gitlab.svelte
@@ -6,6 +6,7 @@
 	import { onMount } from 'svelte';
 	import { post } from '$lib/api';
 	import { browser } from '$app/env';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	let loading = false;
@@ -93,25 +94,25 @@
 {#if !source.gitlabApp?.appId}
 	<form class="grid grid-flow-row gap-2 py-4" on:submit|preventDefault={newApp}>
 		<div class="grid grid-cols-2 items-center">
-			<label for="type">GitLab Application Type</label>
+			<label for="type">{$t('source.gitlab.gitlab_application_type')}</label>
 			<select name="type" id="type" class="w-96" bind:value={payload.applicationType}>
-				<option value="user">User owned application</option>
-				<option value="group">Group owned application</option>
+				<option value="user">{$t('source.gitlab.user_owned')}</option>
+				<option value="group">{$t('source.gitlab.group_owned')}</option>
 				{#if source.htmlUrl !== 'https://gitlab.com'}
-					<option value="instance">Instance-wide application (self-hosted)</option>
+					<option value="instance">{$t('source.gitlab.self_hosted')}</option>
 				{/if}
 			</select>
 		</div>
 		{#if payload.applicationType === 'group'}
 			<div class="grid grid-cols-2 items-center">
-				<label for="groupName">Group Name</label>
+				<label for="groupName">{$t('source.group_name')}</label>
 				<input name="groupName" id="groupName" required bind:value={payload.groupName} />
 			</div>
 		{/if}
 
 		<div class="w-full pt-10 text-center">
 			<button class="w-96 bg-orange-600 hover:bg-orange-500" type="submit"
-				>Register new OAuth application on GitLab</button
+				>{$t('source.register_oauth_gitlab')}</button
 			>
 		</div>
 
@@ -131,21 +132,19 @@
 	</form>
 	<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4 pt-10">
 		<div class="flex h-8 items-center space-x-2">
-			<div class="text-xl font-bold text-white">Configuration</div>
+			<div class="text-xl font-bold text-white">{$t('forms.configuration')}</div>
 			<button
 				type="submit"
 				class:bg-orange-600={!loading}
 				class:hover:bg-orange-500={!loading}
-				disabled={loading}>{loading ? 'Saving...' : 'Save'}</button
+				disabled={loading}>{loading ? $t('forms.saving') : $t('forms.save')}</button
 			>
 		</div>
 
 		<div class="grid grid-cols-2 items-start">
 			<div class="flex-col">
-				<label for="oauthId" class="pt-2">OAuth ID</label>
-				<Explainer
-					text="The OAuth ID is the unique identifier of the GitLab application. <br>You can find it <span class='font-bold text-orange-600' >in the URL</span> of your GitLab OAuth Application."
-				/>
+				<label for="oauthId" class="pt-2">{$t('source.oauth_id')}</label>
+				<Explainer text={$t('source.oauth_id_explainer')} />
 			</div>
 			<input
 				on:change={checkOauthId}
@@ -159,16 +158,16 @@
 		</div>
 		{#if payload.applicationType === 'group'}
 			<div class="grid grid-cols-2 items-center">
-				<label for="groupName">Group Name</label>
+				<label for="groupName">{$t('source.group_name')}</label>
 				<input name="groupName" id="groupName" required bind:value={payload.groupName} />
 			</div>
 		{/if}
 		<div class="grid grid-cols-2 items-center">
-			<label for="appId">Application ID</label>
+			<label for="appId">{$t('source.application_id')}</label>
 			<input name="appId" id="appId" required bind:value={payload.appId} />
 		</div>
 		<div class="grid grid-cols-2 items-center">
-			<label for="appSecret">Secret</label>
+			<label for="appSecret">{$t('index.secret')}</label>
 			<input
 				name="appSecret"
 				id="appSecret"
@@ -188,9 +187,11 @@
 						type="submit"
 						class:bg-orange-600={!loading}
 						class:hover:bg-orange-500={!loading}
-						disabled={loading}>{loading ? 'Saving...' : 'Save'}</button
+						disabled={loading}>{loading ? $t('forms.saving') : $t('forms.save')}</button
+					>
+					<button on:click|preventDefault={changeSettings}
+						>{$t('source.change_app_settings', { name: 'GitLab' })}</button
 					>
-					<button on:click|preventDefault={changeSettings}>Change GitLab App Settings</button>
 				{/if}
 			</div>
 			<div class="grid grid-flow-row gap-2 px-10">
diff --git a/src/routes/sources/[id]/__layout.svelte b/src/routes/sources/[id]/__layout.svelte
index 0f5139558..30df278a5 100644
--- a/src/routes/sources/[id]/__layout.svelte
+++ b/src/routes/sources/[id]/__layout.svelte
@@ -34,10 +34,11 @@
 	import { page, session } from '$app/stores';
 	import { errorNotification } from '$lib/form';
 	import DeleteIcon from '$lib/components/DeleteIcon.svelte';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 
 	async function deleteSource(name) {
-		const sure = confirm(`Are you sure you would like to delete '${name}'?`);
+		const sure = confirm($t('application.confirm_to_delete', { name: name }));
 		if (sure) {
 			const response = await fetch(`/sources/${id}.json`, {
 				method: 'delete'
@@ -55,14 +56,14 @@
 <nav class="nav-side">
 	<button
 		on:click={() => deleteSource(source.name)}
-		title="Delete Git Source"
+		title={$t('source.delete_git_source')}
 		type="submit"
 		disabled={!$session.isAdmin}
 		class:hover:text-red-500={$session.isAdmin}
 		class="icons tooltip-bottom bg-transparent text-sm"
 		data-tooltip={$session.isAdmin
-			? 'Delete Git Source'
-			: 'You do not have permission to delete a Git Source'}><DeleteIcon /></button
+			? $t('source.delete_git_source')
+			: $t('source.permission_denied')}><DeleteIcon /></button
 	>
 </nav>
 <slot />
diff --git a/src/routes/sources/[id]/check.json.ts b/src/routes/sources/[id]/check.json.ts
index fe7d8e9c0..89084fdd7 100644
--- a/src/routes/sources/[id]/check.json.ts
+++ b/src/routes/sources/[id]/check.json.ts
@@ -1,6 +1,7 @@
 import { getUserDetails } from '$lib/common';
 import * as db from '$lib/database';
 import { ErrorHandler } from '$lib/database';
+import { t } from '$lib/translations';
 import type { RequestHandler } from '@sveltejs/kit';
 
 export const post: RequestHandler = async (event) => {
@@ -11,7 +12,7 @@ export const post: RequestHandler = async (event) => {
 		const found = await db.prisma.gitlabApp.findFirst({ where: { oauthId: Number(oauthId) } });
 		if (found) {
 			throw {
-				message: `GitLab App is already configured.`
+				message: t.get('source.gitlab.already_configured')
 			};
 		}
 		return { status: 200 };
diff --git a/src/routes/sources/[id]/index.svelte b/src/routes/sources/[id]/index.svelte
index 83f171412..32db1d167 100644
--- a/src/routes/sources/[id]/index.svelte
+++ b/src/routes/sources/[id]/index.svelte
@@ -32,10 +32,11 @@
 	import type Prisma from '@prisma/client';
 	import Github from './_Github.svelte';
 	import Gitlab from './_Gitlab.svelte';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 p-6 px-6 text-2xl font-bold">
-	<div class="tracking-tight">Git Source</div>
+	<div class="tracking-tight">{$t('application.git_source')}</div>
 	<span class="arrow-right-applications px-1 text-orange-500">></span>
 	<span class="pr-2">{source.name}</span>
 </div>
diff --git a/src/routes/sources/[id]/newGithubApp.svelte b/src/routes/sources/[id]/newGithubApp.svelte
index c8cb4f6f3..e3215b380 100644
--- a/src/routes/sources/[id]/newGithubApp.svelte
+++ b/src/routes/sources/[id]/newGithubApp.svelte
@@ -31,6 +31,7 @@
 <script>
 	import { dev } from '$app/env';
 	import { getDomain, dashify } from '$lib/components/common';
+	import { t } from '$lib/translations';
 
 	export let source;
 	export let settings;
@@ -84,5 +85,5 @@
 </script>
 
 <div class="flex h-screen items-center justify-center text-3xl font-bold">
-	Redirecting to Github...
+	{$t('source.github.redirecting')}
 </div>
diff --git a/src/routes/sources/index.svelte b/src/routes/sources/index.svelte
index bd9039514..220df31c2 100644
--- a/src/routes/sources/index.svelte
+++ b/src/routes/sources/index.svelte
@@ -22,10 +22,11 @@
 <script lang="ts">
 	export let sources;
 	import { session } from '$app/stores';
+	import { t } from '$lib/translations';
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Git Sources</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('index.git_sources')}</div>
 	{#if $session.isAdmin}
 		<a href="/new/source" sveltekit:prefetch class="add-icon bg-orange-600 hover:bg-orange-500">
 			<svg
@@ -47,7 +48,7 @@
 <div class="flex justify-center">
 	{#if !sources || sources.length === 0}
 		<div class="flex-col">
-			<div class="text-center text-xl font-bold">No git sources found</div>
+			<div class="text-center text-xl font-bold">{$t('source.no_git_sources_found')}</div>
 		</div>
 	{:else}
 		<div class="flex flex-wrap justify-center">
@@ -62,7 +63,7 @@
 						<div class="font-bold text-xl text-center truncate">{source.name}</div>
 						{#if (source.type === 'gitlab' && !source.gitlabAppId) || (source.type === 'github' && !source.githubAppId && !source.githubApp?.installationId)}
 							<div class="font-bold text-center truncate text-red-500 group-hover:text-white">
-								Configuration missing
+								{$t('application.configuration.configuration_missing')}
 							</div>
 						{:else}
 							<div class="truncate text-center">{source.htmlUrl}</div>
diff --git a/src/routes/teams/[id]/index.svelte b/src/routes/teams/[id]/index.svelte
index 91d6cf38d..4216a9d77 100644
--- a/src/routes/teams/[id]/index.svelte
+++ b/src/routes/teams/[id]/index.svelte
@@ -27,6 +27,7 @@
 	import Explainer from '$lib/components/Explainer.svelte';
 	import { errorNotification } from '$lib/form';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 	const { id } = $page.params;
 	let invitation = {
 		teamName: team.name,
@@ -94,25 +95,22 @@
 </script>
 
 <div class="flex space-x-1 p-6 px-6 text-2xl font-bold">
-	<div class="tracking-tight">Team</div>
+	<div class="tracking-tight">{$t('index.team')}</div>
 	<span class="arrow-right-applications px-1 text-cyan-500">></span>
 	<span class="pr-2">{team.name}</span>
 </div>
 <div class="mx-auto max-w-4xl px-6">
 	<form on:submit|preventDefault={handleSubmit} class=" py-4">
 		<div class="flex space-x-1 pb-5">
-			<div class="title font-bold">Settings</div>
-			<button class="bg-cyan-600 hover:bg-cyan-500" type="submit">Save</button>
+			<div class="title font-bold">{$t('index.settings')}</div>
+			<button class="bg-cyan-600 hover:bg-cyan-500" type="submit">{$t('forms.save')}</button>
 		</div>
 		<div class="grid grid-flow-row gap-2 px-10">
 			<div class="mt-2 grid grid-cols-2">
 				<div class="flex-col">
 					<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 					{#if team.id === '0'}
-						<Explainer
-							customClass="w-full"
-							text="This is the <span class='text-red-500 font-bold'>root</span> team. That means members of this group can manage instance wide settings and have all the priviliges in Coolify (imagine like root user on Linux)."
-						/>
+						<Explainer customClass="w-full" text={$t('team.root_team_explainer')} />
 					{/if}
 				</div>
 				<input id="name" name="name" placeholder="name" bind:value={team.name} />
@@ -121,22 +119,23 @@
 	</form>
 
 	<div class="flex space-x-1 py-5 pt-10 font-bold">
-		<div class="title">Members</div>
+		<div class="title">{$t('team.members')}</div>
 	</div>
 	<div class="px-4 sm:px-6">
 		<table class="w-full border-separate text-left">
 			<thead>
 				<tr class="h-8 border-b border-coolgray-400">
-					<th scope="col">Email</th>
-					<th scope="col">Permission</th>
-					<th scope="col" class="text-center">Actions</th>
+					<th scope="col">{$t('forms.email')}</th>
+					<th scope="col">{$t('team.permission')}</th>
+					<th scope="col" class="text-center">{$t('forms.action')}</th>
 				</tr>
 			</thead>
 			{#each permissions as permission}
 				<tr class="text-xs">
 					<td class="py-4"
 						>{permission.user.email}
-						<span class="font-bold">{permission.user.id === $session.userId ? '(You)' : ''}</span
+						<span class="font-bold"
+							>{permission.user.id === $session.userId ? $t('team.you') : ''}</span
 						></td
 					>
 					<td class="py-4">{permission.permission}</td>
@@ -144,17 +143,21 @@
 						<td class="flex flex-col items-center justify-center space-y-2 py-4 text-center">
 							<button
 								class="w-52 bg-red-600 hover:bg-red-500"
-								on:click={() => removeFromTeam(permission.user.id)}>Remove</button
+								on:click={() => removeFromTeam(permission.user.id)}>{$t('forms.remove')}</button
 							>
 							<button
 								class="w-52"
 								on:click={() =>
 									changePermission(permission.user.id, permission.id, permission.permission)}
-								>Promote to {permission.permission === 'admin' ? 'read' : 'admin'}</button
+								>{$t('team.promote_to', {
+									grade: permission.permission === 'admin' ? 'read' : 'admin'
+								})}</button
 							>
 						</td>
 					{:else}
-						<td class="text-center py-4 flex-col space-y-2"> No actions available </td>
+						<td class="text-center py-4 flex-col space-y-2">
+							{$t('forms.no_actions_available')}
+						</td>
 					{/if}
 				</tr>
 			{/each}
@@ -167,11 +170,12 @@
 						<td class="flex-col space-y-2 py-4 text-center">
 							<button
 								class="w-52 bg-red-600 hover:bg-red-500"
-								on:click={() => revokeInvitation(invitation.id)}>Revoke invitation</button
+								on:click={() => revokeInvitation(invitation.id)}
+								>{$t('team.revoke_invitation')}</button
 							>
 						</td>
 					{:else}
-						<td class="text-center py-4 flex-col space-y-2">Pending invitation</td>
+						<td class="text-center py-4 flex-col space-y-2">{$t('team.pending_invitation')}</td>
 					{/if}
 				</tr>
 			{/each}
@@ -181,18 +185,18 @@
 		<form on:submit|preventDefault={sendInvitation} class="py-5 pt-10">
 			<div class="flex space-x-1">
 				<div class="flex space-x-1">
-					<div class="title font-bold">Invite new member</div>
-					<button class="bg-cyan-600 hover:bg-cyan-500" type="submit">Send invitation</button>
+					<div class="title font-bold">{$t('team.invite_new_member')}</div>
+					<button class="bg-cyan-600 hover:bg-cyan-500" type="submit"
+						>{$t('team.send_invitation')}</button
+					>
 				</div>
 			</div>
-			<Explainer
-				text="You can only invite registered users at the moment - will be extended soon."
-			/>
+			<Explainer text={$t('team.invite_only_register_explainer')} />
 			<div class="flex-col space-y-2 px-4 pt-5 sm:px-6">
 				<div class="flex space-x-0">
 					<input
 						bind:value={invitation.email}
-						placeholder="Email address"
+						placeholder={$t('forms.email')}
 						class="mr-2 w-full"
 						required
 					/>
@@ -202,14 +206,14 @@
 						class="rounded-none rounded-l border border-dashed border-transparent"
 						type="button"
 						class:border-coolgray-300={invitation.permission !== 'read'}
-						class:bg-pink-500={invitation.permission === 'read'}>Read</button
+						class:bg-pink-500={invitation.permission === 'read'}>{$t('team.read')}</button
 					>
 					<button
 						on:click={() => (invitation.permission = 'admin')}
 						class="rounded-none rounded-r border border-dashed border-transparent"
 						type="button"
 						class:border-coolgray-300={invitation.permission !== 'admin'}
-						class:bg-red-500={invitation.permission === 'admin'}>Admin</button
+						class:bg-red-500={invitation.permission === 'admin'}>{$t('team.admin')}</button
 					>
 				</div>
 			</div>
diff --git a/src/routes/teams/index.svelte b/src/routes/teams/index.svelte
index 05c020cdf..1814c1414 100644
--- a/src/routes/teams/index.svelte
+++ b/src/routes/teams/index.svelte
@@ -23,6 +23,7 @@
 	import { errorNotification } from '$lib/form';
 	import { session } from '$app/stores';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	export let teams;
 	export let invitations;
@@ -46,7 +47,7 @@
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
-	<div class="mr-4 text-2xl tracking-tight">Teams</div>
+	<div class="mr-4 text-2xl tracking-tight">{$t('index.teams')}</div>
 	{#if $session.isAdmin}
 		<a href="/new/team" class="add-icon bg-cyan-600 hover:bg-cyan-500">
 			<svg
@@ -69,22 +70,26 @@
 {#if invitations.length > 0}
 	<div class="mx-auto max-w-2xl pb-10">
 		<div class="flex space-x-1 p-6 font-bold">
-			<div class="title">Pending invitations</div>
+			<div class="title">{$t('team.pending_invitations')}</div>
 		</div>
 		<div class="text-center">
 			{#each invitations as invitation}
 				<div class="flex justify-center space-x-2">
 					<div>
-						Invited to <span class="font-bold text-pink-600">{invitation.teamName}</span> with
-						<span class="font-bold text-rose-600">{invitation.permission}</span> permission.
+						{@html $t('team.invited_with_permissions', {
+							teamName: invitation.teamName,
+							permission: invitation.permission
+						})}
 					</div>
 					<button
 						class="hover:bg-green-500"
-						on:click={() => acceptInvitation(invitation.id, invitation.teamId)}>Accept</button
+						on:click={() => acceptInvitation(invitation.id, invitation.teamId)}
+						>{$t('team.accept')}</button
 					>
 					<button
 						class="hover:bg-red-600"
-						on:click={() => revokeInvitation(invitation.id, invitation.teamId)}>Delete</button
+						on:click={() => revokeInvitation(invitation.id, invitation.teamId)}
+						>{$t('team.delete')}</button
 					>
 				</div>
 			{/each}
@@ -101,10 +106,10 @@
 			>
 				<div class="truncate text-center text-xl font-bold">
 					{team.team.name}
-					{team.team?.id === '0' ? '(root)' : ''}
+					{team.team?.id === '0' ? $t('team.root') : ''}
 				</div>
 
-				<div class="mt-1 text-center">{team.team._count.users} member(s)</div>
+				<div class="mt-1 text-center">{team.team._count.users} {$t('team.member')}</div>
 			</div>
 		</a>
 	{/each}

From a28492835287af626f6b46ecf38ef062406105f2 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sun, 3 Apr 2022 14:34:48 +0200
Subject: [PATCH 16/23] Patch flags and add french translation

---
 src/lib/locales/en.json          |  25 +--
 src/lib/locales/fr.json          | 309 +++++++++++++++++++++++++++++--
 src/routes/settings/index.svelte |   6 +-
 3 files changed, 311 insertions(+), 29 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index 58e368e6f..79822170b 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -61,7 +61,7 @@
 		"loading": "Loading...",
 		"version": "Version",
 		"host": "Host",
-		"already_used_for": "<span class=\"text-red-500\">{type}</span> already used for",
+		"already_used_for": "<span class=\"text-red-500\">{{type}}</span> already used for",
 		"configuration": "Configuration",
 		"engine": "Engine",
 		"network": "Network",
@@ -122,7 +122,7 @@
 			"no_branches_found": "No branches found",
 			"configure_build_pack": "Configure Build Pack",
 			"scanning_repository_suggest_build_pack": "Scanning repository to suggest a build pack for you...",
-			"found_lock_file": "Found lock file for <span class=\"font-bold text-orange-500 pl-1\">{packageManager}</span>. Using it for predefined commands commands.",
+			"found_lock_file": "Found lock file for <span class=\"font-bold text-orange-500 pl-1\">{{packageManager}}</span>. Using it for predefined commands commands.",
 			"configure_destination": "Configure Destination",
 			"no_configurable_destination": "No configurable Destination found",
 			"select_a_repository_project": "Select a Repository / Project",
@@ -160,7 +160,7 @@
 			"persistent_storage_explainer": "You can specify any folder that you want to be persistent across deployments. <br>This is useful for storing data such as a database (SQLite) or a cache."
 		},
 		"deployment_queued": "Deployment queued.",
-		"confirm_to_delete": "Are you sure you would like to delete '{name}'?",
+		"confirm_to_delete": "Are you sure you would like to delete '{{name}}'?",
 		"stop_application": "Stop application",
 		"permission_denied_stop_application": "You do not have permission to stop the application.",
 		"rebuild_application": "Rebuild application",
@@ -175,8 +175,8 @@
 		"build_logs": "Build Logs",
 		"delete_application": "Delete application",
 		"permission_denied_delete_application": "You do not have permission to delete this application",
-		"domain_already_in_use": "Domain {domain} is already used.",
-		"dns_not_set_error": "DNS not set or propogated for {domain}.<br><br>Please check your DNS settings.",
+		"domain_already_in_use": "Domain {{domain}} is already used.",
+		"dns_not_set_error": "DNS not set or propogated for {{domain}}.<br><br>Please check your DNS settings.",
 		"settings_saved": "Settings saved.",
 		"dns_not_set_partial_error": "DNS not set",
 		"git_source": "Git Source",
@@ -214,7 +214,7 @@
 		"warning_append_only": "Useful if you would like to restore redis data from a backup.<br><span class='font-bold text-white'>Database restart is required.</span>",
 		"select_database_type": "Select a Database type",
 		"select_database_version": "Select a Database version",
-		"confirm_stop": "Are you sure you would like to stop {name}?",
+		"confirm_stop": "Are you sure you would like to stop {{name}}?",
 		"stop_database": "Stop database",
 		"permission_denied_stop_database": "You do not have permission to stop the database.",
 		"start_database": "Start database",
@@ -235,7 +235,7 @@
 		"force_restart_proxy": "Force restart proxy",
 		"use_coolify_proxy": "Use Coolify Proxy?",
 		"no_destination_found": "No destination found",
-		"new_error_network_already_exists": "Network {network} already configured for another team!",
+		"new_error_network_already_exists": "Network {{network}} already configured for another team!",
 		"new": {
 			"saving_and_configuring_proxy": "Saving and configuring proxy...",
 			"install_proxy": "This will install a proxy on the destination to allow you to access your applications and services without any manual configuration (recommended for Docker).<br><br>Databases will have their own proxy.",
@@ -256,8 +256,8 @@
 		"no_git_sources_found": "No git sources found",
 		"delete_git_source": "Delete Git Source",
 		"permission_denied": "You do not have permission to delete a Git Source",
-		"create_new_app": "Create new {name} App",
-		"change_app_settings": "Change {name} App Settings",
+		"create_new_app": "Create new {{name}} App",
+		"change_app_settings": "Change {{name}} App Settings",
 		"install_repositories": "Install Repositories",
 		"application_id": "Application ID",
 		"group_name": "Group Name",
@@ -295,7 +295,8 @@
 		"must_remove_domain_before_changing": "Must remove the domain before you can change this setting.",
 		"registration_allowed": "Registration allowed?",
 		"registration_allowed_explainer": "Allow further registrations to the application. <br>It's turned off after the first registration.",
-		"coolify_proxy_settings": "Coolify Proxy Settings"
+		"coolify_proxy_settings": "Coolify Proxy Settings",
+		"credential_stat_explainer": "Credentials for <a class=\"text-white font-bold\" href=\"{{link}}\" target=\"_blank\">stats</a> page."
 	},
 	"team": {
 		"pending_invitations": "Pending invitations",
@@ -303,12 +304,12 @@
 		"delete": "Delete",
 		"member": "member(s)",
 		"root": "(root)",
-		"invited_with_permissions": "Invited to <span class=\"font-bold text-pink-600\">{teamName}</span> with <span class=\"font-bold text-rose-600\">{permission}</span> permission.",
+		"invited_with_permissions": "Invited to <span class=\"font-bold text-pink-600\">{{teamName}}</span> with <span class=\"font-bold text-rose-600\">{{permission}}</span> permission.",
 		"members": "Members",
 		"root_team_explainer": "This is the <span class='text-red-500 font-bold'>root</span> team. That means members of this group can manage instance wide settings and have all the priviliges in Coolify (imagine like root user on Linux).",
 		"permission": "Permission",
 		"you": "(You)",
-		"promote_to": "Promote to {grade}",
+		"promote_to": "Promote to {{grade}}",
 		"revoke_invitation": "Revoke invitation",
 		"pending_invitation": "Pending invitation",
 		"invite_new_member": "Invite new member",
diff --git a/src/lib/locales/fr.json b/src/lib/locales/fr.json
index a4a2cea1d..a56e93b96 100644
--- a/src/lib/locales/fr.json
+++ b/src/lib/locales/fr.json
@@ -1,29 +1,232 @@
 {
-	"index": {
-		"dashboard": "Tableau de bord",
-		"applications": "Applications",
-		"databases": "Bases de données",
-		"destinations": "Destinations",
-		"git_sources": "Sources Git",
-		"services": "Services",
-		"teams": "Équipes"
+	"application": {
+		"application": "Application",
+		"build": {
+			"build_logs_of": "Créer des journaux de",
+			"finished_in": "Fini en",
+			"load_more": "Charger plus",
+			"no_logs": "Aucun journal trouvé",
+			"queued": "En file d'attente",
+			"queued_waiting_exec": "En file d'attente et en attente d'exécution.",
+			"running": "Fonctionnement",
+			"waiting_logs": "En attendant les logs..."
+		},
+		"build_and_start_application": "Construire et démarrer l'application",
+		"build_command": "Construire la commande",
+		"build_logs": "Créer des journaux",
+		"build_pack": "Pack de construction",
+		"cant_activate_auto_deploy_without_repo": "Impossible d'activer les déploiements automatiques tant qu'une seule application n'est pas définie pour ce référentiel/branche.",
+		"configuration": {
+			"branch_already_in_use": "Cette branche est déjà utilisée par une autre application. \nLes webhooks ne fonctionneront pas dans ce cas pour les deux applications. \nÊtes-vous sûr de vouloir l'utiliser ?",
+			"buildpack": {
+				"choose_this_one": "Choisissez celui-ci..."
+			},
+			"configuration_missing": "Configuration manquante",
+			"configure_build_pack": "Configurer le pack de construction",
+			"configure_destination": "Configurer la destination",
+			"configure_it_now": "Configurez-le maintenant",
+			"found_lock_file": "Fichier de verrouillage trouvé pour <span class=\"font-bold text-orange-500 pl-1\">{{packageManager}}</span>. \nL'utiliser pour les commandes de commandes prédéfinies.",
+			"loading_branches": "Chargement des branches...",
+			"loading_groups": "Chargement des groupes...",
+			"loading_projects": "Chargement des projets...",
+			"loading_repositories": "Chargement des référentiels...",
+			"no_branches_found": "Aucune succursale trouvée",
+			"no_configurable_destination": "Aucune destination configurable trouvée",
+			"no_configurable_git": "Aucune source Git configurable trouvée",
+			"no_projects_found": "Aucun projet trouvé",
+			"no_repositories_configured": "Aucun référentiel configuré pour votre application Git.",
+			"scanning_repository_suggest_build_pack": "Analyse du référentiel pour vous suggérer un pack de construction...",
+			"select_a_branch": "Veuillez sélectionner une succursale",
+			"select_a_git_source": "Sélectionnez une source Git",
+			"select_a_group": "Veuillez sélectionner un groupe",
+			"select_a_project": "Veuillez sélectionner un projet",
+			"select_a_repository": "Veuillez sélectionner un dépôt",
+			"select_a_repository_first": "Veuillez d'abord sélectionner un référentiel",
+			"select_a_repository_project": "Sélectionnez un référentiel / projet"
+		},
+		"configurations": "Configurations",
+		"confirm_to_delete": "Voulez-vous vraiment supprimer '{{name}}'?",
+		"debug_logs": "Journaux de débogage",
+		"delete_application": "Supprimer la demande",
+		"deployment_queued": "Déploiement en file d'attente.",
+		"destination": "Destination",
+		"directory_to_use_explainer": "Répertoire à utiliser comme base pour toutes les commandes.<br>Pourrait être utile avec <span class='text-green-500 font-bold'>monorepos</span>.",
+		"dns_not_set_error": "DNS non défini ou propagé pour {{domain}}.<br><br>Veuillez vérifier vos paramètres DNS.",
+		"dns_not_set_partial_error": "DNS non défini",
+		"domain_already_in_use": "Le domaine {{domain}} est déjà utilisé.",
+		"domain_fqdn": "Domaine (FQDN)",
+		"enable_auto_deploy_webhooks": "Activez le déploiement automatique via des webhooks.",
+		"enable_automatic_deployment": "Activer le déploiement automatique",
+		"enable_debug_log_during_build": "Activez les journaux de débogage pendant la phase de construction.<br><span class='text-red-500 font-bold'>Les informations sensibles</span> peuvent être visibles et enregistrées dans les journaux.",
+		"enable_mr_pr_previews": "Activer les aperçus MR/PR",
+		"enable_preview_deploy_mr_pr_requests": "Activez les déploiements de prévisualisation à partir de demandes d'extraction ou de fusion.",
+		"features": "Caractéristiques",
+		"git_repository": "Référentiel Git",
+		"git_source": "Source Git",
+		"https_explainer": "Si vous spécifiez <span class='text-green-500 font-bold'>https</span>, l'application sera accessible uniquement via https. \nUn certificat SSL sera généré pour vous.<br>Si vous spécifiez <span class='text-green-500 font-bold'>www</span>, l'application sera redirigée (302) à partir de non-www et vice versa \n.<br><br>Pour modifier le domaine, vous devez d'abord arrêter l'application.<br><br><span class='text-white font-bold'>Vous devez configurer votre DNS pour pointer vers l'IP du serveur dans \navance.</span>",
+		"install_command": "Commande d'installation",
+		"logs": "Journaux des applications",
+		"no_applications_found": "Aucune application trouvée",
+		"permission_denied_build_and_start_application": "Vous n'êtes pas autorisé à créer et à démarrer l'application.",
+		"permission_denied_delete_application": "Vous n'êtes pas autorisé à supprimer cette application",
+		"permission_denied_rebuild_application": "Vous n'êtes pas autorisé à reconstruire l'application.",
+		"permission_denied_stop_application": "Vous n'êtes pas autorisé à arrêter l'application.",
+		"persistent_storage": "Stockage persistant",
+		"preview": {
+			"need_during_buildtime": "Besoin pendant la construction ?",
+			"no_previews_available": "Aucun aperçu disponible",
+			"redeploy": "Redéployer",
+			"setup_secret_app_first": "Vous pouvez ajouter des secrets aux déploiements PR/MR. \nVeuillez d'abord ajouter des secrets à l'application. \n<br>Utile pour créer des environnements <span class='text-green-500 font-bold'>de mise en scène</span>.",
+			"values_overwriting_app_secrets": "Ces valeurs remplacent les secrets d'application dans les déploiements PR/MR. \nUtile pour créer des environnements <span class='text-green-500 font-bold'>de mise en scène</span>."
+		},
+		"previews": "Aperçus",
+		"publish_directory_explainer": "Répertoire contenant tous les actifs à déployer. \n<br> Par exemple : <span class='text-green-500 font-bold'>dist</span>,<span class='text-green-500 font-bold'>_site</span> ou <span \nclass='text-green-500 font-bold'>public</span>.",
+		"rebuild_application": "Reconstruire l'application",
+		"secret": "secrets",
+		"secrets": {
+			"secret_saved": "Secret enregistré.",
+			"secrets_for": "secrets pour",
+			"use_isbuildsecret": "Utiliser isBuildSecret"
+		},
+		"settings_saved": "Paramètres sauvegardés.",
+		"ssl_explainer": "Il générera des certificats pour www et non-www. \n<br>Vous devez avoir <span class='font-bold text-green-500'>les deux entrées DNS</span> définies à l'avance.<br><br>Utile si vous prévoyez d'avoir des visiteurs sur les deux.",
+		"ssl_www_and_non_www": "Générer SSL pour www et non-www ?",
+		"start_command": "Démarrer la commande",
+		"stop_application": "Arrêter l'application",
+		"storage": {
+			"path_is_required": "Le chemin est requis.",
+			"persistent_storage_explainer": "Vous pouvez spécifier n'importe quel dossier que vous souhaitez conserver dans les déploiements. \n<br>Ceci est utile pour stocker des données telles qu'une base de données (SQLite) ou un cache.",
+			"storage_deleted": "Stockage supprimé.",
+			"storage_saved": "Stockage enregistré.",
+			"storage_updated": "Stockage mis à jour."
+		}
+	},
+	"database": {
+		"change_append_only_mode": "Changer le mode d'ajout uniquement",
+		"confirm_stop": "Êtes-vous sûr de vouloir arrêter {{name}} ?",
+		"connection_string": "Chaîne de connexion",
+		"default_database": "Base de données par défaut",
+		"delete_database": "Supprimer la base de données",
+		"generated_automatically_after_set_to_public": "Généré automatiquement après avoir été défini sur public",
+		"no_databases_found": "Aucune base de données trouvée",
+		"permission_denied_delete_database": "Vous n'êtes pas autorisé à supprimer une base de données",
+		"permission_denied_start_database": "Vous n'êtes pas autorisé à démarrer la base de données.",
+		"permission_denied_stop_database": "Vous n'êtes pas autorisé à arrêter la base de données.",
+		"select_database_type": "Sélectionnez un type de base de données",
+		"select_database_version": "Sélectionnez une version de la base de données",
+		"set_public": "Rendez-le public",
+		"start_database": "Démarrer la base de données",
+		"stop_database": "Arrêter la base de données",
+		"warning_append_only": "Utile si vous souhaitez restaurer des données Redis à partir d'une sauvegarde.<br><span class='font-bold text-white'>Le redémarrage de la base de données est nécessaire.</span>",
+		"warning_database_public": "Votre base de données sera accessible sur Internet. \n<br>Prenez la sécurité au sérieux dans ce cas !"
+	},
+	"destination": {
+		"add_to_coolify": "Ajouter pour refroidir",
+		"confirm_restart_proxy": "Voulez-vous vraiment redémarrer le proxy ? \nTout sera reconfiguré en ~10 secondes.",
+		"coolify_proxy_restarting": "Redémarrage de Coolify Proxy...",
+		"coolify_proxy_started": "Coolify Proxy a démarré !",
+		"coolify_proxy_stopped": "Coolify Proxy arrêté !",
+		"delete_destination": "Supprimer le destinataire",
+		"force_restart_proxy": "Forcer le redémarrage du proxy",
+		"new": {
+			"add_new_destination": "Ajouter une nouvelle destination",
+			"install_proxy": "Cela installera un proxy sur la destination pour vous permettre d'accéder à vos applications et services sans aucune configuration manuelle (recommandé pour Docker).<br><br>Les bases de données auront leur propre proxy.",
+			"predefined_destinations": "Destinations prédéfinies",
+			"saving_and_configuring_proxy": "Enregistrement et configuration du proxy..."
+		},
+		"new_error_network_already_exists": "Réseau {{network}} déjà configuré pour une autre équipe !",
+		"no_destination_found": "Aucune destination trouvée",
+		"permission_denied_delete_destination": "Vous n'êtes pas autorisé à supprimer cette destination",
+		"restarting_please_wait": "Redémarrage... veuillez patienter...",
+		"use_coolify_proxy": "Utiliser Coolify Proxy ?"
 	},
 	"error": {
 		"here": "ici",
+		"you_are_lost": "Oups vous êtes perdu ! \nMais n'ayez pas peur !",
 		"you_can_find_your_way_back": "Tu peux retrouver ton chemin"
 	},
 	"forms": {
-		"email": "E-mail",
+		"action": "action",
+		"add": "Ajouter",
+		"already_used_for": "<span class=\"text-red-500\">{{type}}</span> déjà utilisé pour",
+		"api_port": "Port API",
+		"api_url": "URL de l'API",
+		"base_directory": "Répertoire de base",
+		"configuration": "Configuration",
+		"confirm_continue": "Êtes-vous sûr de continuer ?",
+		"default": "défaut",
+		"default_email_address": "Adresse e-mail par défaut",
+		"default_password": "Mot de passe par défaut",
+		"eg": "par exemple",
+		"email": "Adresse e-mail",
+		"engine": "Moteur",
+		"extra_config": "Configuration supplémentaire",
+		"generated_automatically_after_start": "Généré automatiquement après le démarrage",
+		"host": "Héberger",
+		"html_url": "URLHTML",
+		"ip_address": "Adresse IP",
+		"is_required": "est requis.",
+		"loading": "Chargement...",
+		"must_be_stopped_to_modify": "Doit être arrêté pour modifier.",
+		"name": "Nom",
+		"network": "Réseau",
+		"new_password": "Nouveau mot de passe",
+		"no_actions_available": "Aucune action disponible",
+		"organization": "Organisation",
 		"password": "Mot de passe",
-		"password_again": "Retaper le mot de passe",
-		"passwords_not_match": "Les mots de passe ne correspondent pas."
+		"password_again": "Mot de passe à nouveau",
+		"passwords_not_match": "Les mots de passe ne correspondent pas.",
+		"path": "Chemin",
+		"port": "Port",
+		"public_port_range": "Gamme de ports publics",
+		"public_port_range_explainer": "Ports utilisés pour exposer les bases de données/services/services internes.<br> Ajoutez-les à votre pare-feu (le cas échéant).<br><br>Vous pouvez spécifier une plage de ports, par exemple : <span class='text-yellow-500 \nfont-bold'>9000-9100</span>",
+		"publish_directory": "Publier le répertoire",
+		"remove": "Retirer",
+		"remove_domain": "Supprimer le domaine",
+		"removing": "Suppression...",
+		"root_db_password": "Mot de passe de la base de données racine",
+		"root_db_user": "Utilisateur racine de la base de données",
+		"root_user": "Utilisateur racine",
+		"roots_password": "Mot de passe de la racine",
+		"save": "sauvegarder",
+		"saving": "Économie...",
+		"select_a_service": "Sélectionnez un service",
+		"select_a_service_version": "Sélectionnez une version de service",
+		"set": "Régler",
+		"ssh_private_key": "Clé privée SSH",
+		"submit": "Nous faire parvenir",
+		"super_secure_new_password": "Nouveau mot de passe super sécurisé",
+		"type": "Taper",
+		"user": "Utilisateur",
+		"username": "Nom d'utilisateur",
+		"value": "Évaluer",
+		"verify_emails_without_smtp": "Vérifier les e-mails sans SMTP",
+		"verifying": "Vérification",
+		"version": "Version"
+	},
+	"general": "Général",
+	"index": {
+		"applications": "Applications",
+		"dashboard": "Tableau de bord",
+		"database": "Base de données",
+		"databases": "Bases de données",
+		"destinations": "Destinations",
+		"git_sources": "Sources Git",
+		"global_settings": "Paramètres globaux",
+		"logout": "Se déconnecter",
+		"not_implemented_yet": "Pas encore mis en œuvre",
+		"secret": "Secret",
+		"services": "Services",
+		"settings": "Réglages",
+		"team": "Équipe",
+		"teams": "Équipes"
 	},
 	"layout": {
-		"new_version": "Nouvelle version disponible. \nActualisation...",
+		"new_version": "Nouvelle version accessible. \nRechargement...",
 		"switch_to_a_different_team": "Changer d'équipe...",
 		"update_available": "Mise à jour disponible",
 		"update_done": "Mise à jour terminée.",
-		"wait_new_version_startup": "Attente du lancement de la nouvelle version..."
+		"wait_new_version_startup": "En attendant le lancement de la nouvelle version..."
 	},
 	"login": {
 		"already_logged_in": "Déjà connecté...",
@@ -35,6 +238,84 @@
 		"register": "S'inscrire"
 	},
 	"reset": {
-		"reset_password": "Réinitialiser le mot de passe"
+		"find_path_secret_key": "Vous pouvez le trouver dans ~/coolify/.env (COOLIFY_SECRET_KEY)",
+		"invalid_secret_key": "Clé secrète invalide.",
+		"reset_password": "Réinitialiser",
+		"secret_key": "Clef secrète"
+	},
+	"service": {
+		"delete_service": "Supprimer le service",
+		"no_service": "Aucun service trouvé",
+		"permission_denied_delete_service": "Vous n'êtes pas autorisé à supprimer un service.",
+		"permission_denied_start_service": "Vous n'êtes pas autorisé à démarrer le service.",
+		"permission_denied_stop_service": "Vous n'êtes pas autorisé à arrêter le service.",
+		"start_service": "Démarrer le service",
+		"stop_service": "Aire d'autoroute"
+	},
+	"services": {
+		"all_email_verified": "Tous les e-mails vérifiés. \nVous pouvez vous connecter maintenant.",
+		"generate_www_non_www_ssl": "Il générera des certificats pour www et non-www. \n<br>Vous devez avoir <span class='font-bold text-pink-600'>les deux entrées DNS</span> définies à l'avance.<br><br>Le service doit être redémarré."
+	},
+	"setting": {
+		"coolify_proxy_settings": "Refroidir les paramètres proxy",
+		"credential_stat_explainer": "Identifiants pour la page <a class=\"text-white font-bold\" href=\"{{link}}\" target=\"_blank\">statistiques</a>.",
+		"domain_removed": "Domaine supprimé",
+		"must_remove_domain_before_changing": "Vous devez supprimer le domaine avant de pouvoir modifier ce paramètre.",
+		"permission_denied": "Vous n'avez pas la permission de faire cela. \n\\nDemandez à un administrateur de modifier vos autorisations.",
+		"registration_allowed": "Inscription autorisée ?",
+		"registration_allowed_explainer": "Autoriser d'autres inscriptions à l'application. \n<br>Il est désactivé après la première inscription.",
+		"ssl_explainer": "Si vous spécifiez <span class='text-yellow-500 font-bold'>https</span>, Coolify sera accessible uniquement via https. \nUn certificat SSL sera généré pour vous.<br>Si vous spécifiez <span class='text-yellow-500 font-bold'>www</span>, Coolify sera redirigé (302) à partir de non-www et vice versa."
+	},
+	"source": {
+		"application_id": "ID d'application",
+		"change_app_settings": "Modifier les paramètres de l'application {{name}}",
+		"create_new_app": "Créer une nouvelle application {{name}}",
+		"delete_git_source": "Supprimer la source Git",
+		"github": {
+			"redirecting": "Redirection vers Github..."
+		},
+		"gitlab": {
+			"already_configured": "L'application GitLab est déjà configurée.",
+			"gitlab_application_type": "Type d'application GitLab",
+			"group_owned": "Application détenue par le groupe",
+			"self_hosted": "Application à l'échelle de l'instance (auto-hébergée)",
+			"user_owned": "Application appartenant à l'utilisateur"
+		},
+		"group_name": "Nom de groupe",
+		"install_repositories": "Installer les référentiels",
+		"new": {
+			"git_source": "Ajouter une nouvelle source Git",
+			"official_providers": "Fournisseurs officiels"
+		},
+		"no_git_sources_found": "Aucune source git trouvée",
+		"oauth_id": "ID OAuth",
+		"oauth_id_explainer": "L'identifiant OAuth est l'identifiant unique de l'application GitLab. \n<br>Vous pouvez le trouver <span class='font-bold text-orange-600' >dans l'URL</span> de votre application GitLab OAuth.",
+		"permission_denied": "Vous n'êtes pas autorisé à supprimer une source Git",
+		"register_oauth_gitlab": "Enregistrer une nouvelle application OAuth sur GitLab"
+	},
+	"sources": {
+		"local_docker": "Docker local",
+		"organization_explainer": "Remplissez-le si vous souhaitez utiliser une organisation comme source Git. \nSinon, votre utilisateur sera utilisé.",
+		"remote_docker": "Station d'accueil à distance"
+	},
+	"team": {
+		"accept": "J'accepte",
+		"admin": "Administrateur",
+		"delete": "Supprimer",
+		"invite_new_member": "Inviter un nouveau membre",
+		"invite_only_register_explainer": "Vous ne pouvez inviter que des utilisateurs enregistrés pour le moment - sera bientôt prolongé.",
+		"invited_with_permissions": "Invité à <span class=\"font-bold text-pink-600\">{{teamName}}</span> avec <span class=\"font-bold text-rose-600\">{{permission}}</span \n> autorisation.",
+		"member": "membres)",
+		"members": "Membres",
+		"pending_invitation": "Invitation en attente",
+		"pending_invitations": "Invitations en attente",
+		"permission": "Autorisation",
+		"promote_to": "Promouvoir à {{grade}}",
+		"read": "Lire",
+		"revoke_invitation": "Révoquer l'invitation",
+		"root": "(racine)",
+		"root_team_explainer": "Il s'agit de l'équipe <span class='text-red-500 font-bold'>racine</span>. \nCela signifie que les membres de ce groupe peuvent gérer les paramètres à l'échelle de l'instance et avoir tous les privilèges dans Coolify (imaginez comme un utilisateur root sous Linux).",
+		"send_invitation": "Envoyer une invitation",
+		"you": "(Toi)"
 	}
 }
diff --git a/src/routes/settings/index.svelte b/src/routes/settings/index.svelte
index 1b3833803..bd859539c 100644
--- a/src/routes/settings/index.svelte
+++ b/src/routes/settings/index.svelte
@@ -188,14 +188,14 @@
 			<div class="title">{$t('setting.coolify_proxy_settings')}</div>
 		</div>
 		<Explainer
-			text={`Credentials for <a class="text-white font-bold" href=${
-				fqdn
+			text={$t('setting.credential_stat_explainer', {
+				link: fqdn
 					? `http://${settings.proxyUser}:${settings.proxyPassword}@` + getDomain(fqdn) + ':8404'
 					: browser &&
 					  `http://${settings.proxyUser}:${settings.proxyPassword}@` +
 							window.location.hostname +
 							':8404'
-			} target="_blank">stats</a> page.`}
+			})}
 		/>
 		<div class="space-y-2 px-10 py-5">
 			<div class="grid grid-cols-2 items-center">

From 8cd561b8ccdd38731384d4310d759a6225069054 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sun, 3 Apr 2022 19:58:10 +0200
Subject: [PATCH 17/23] Update french translations

---
 src/lib/locales/fr.json                       | 114 +++++++++---------
 src/routes/services/[id]/__layout.svelte      |   4 +-
 .../[id]/configuration/version.svelte         |   1 +
 3 files changed, 60 insertions(+), 59 deletions(-)

diff --git a/src/lib/locales/fr.json b/src/lib/locales/fr.json
index a56e93b96..4ec496f31 100644
--- a/src/lib/locales/fr.json
+++ b/src/lib/locales/fr.json
@@ -9,45 +9,45 @@
 			"queued": "En file d'attente",
 			"queued_waiting_exec": "En file d'attente et en attente d'exécution.",
 			"running": "Fonctionnement",
-			"waiting_logs": "En attendant les logs..."
+			"waiting_logs": "En attente des logs..."
 		},
-		"build_and_start_application": "Construire et démarrer l'application",
-		"build_command": "Construire la commande",
+		"build_and_start_application": "Build et démarrer l'application",
+		"build_command": "Commande Build",
 		"build_logs": "Créer des journaux",
-		"build_pack": "Pack de construction",
-		"cant_activate_auto_deploy_without_repo": "Impossible d'activer les déploiements automatiques tant qu'une seule application n'est pas définie pour ce référentiel/branche.",
+		"build_pack": "Pack de Build",
+		"cant_activate_auto_deploy_without_repo": "Impossible d'activer les déploiements automatiques tant qu'une seule application n'est pas définie pour ce dépôt/branche.",
 		"configuration": {
-			"branch_already_in_use": "Cette branche est déjà utilisée par une autre application. \nLes webhooks ne fonctionneront pas dans ce cas pour les deux applications. \nÊtes-vous sûr de vouloir l'utiliser ?",
+			"branch_already_in_use": "Cette branche est déjà utilisée par une autre application. \nLes webhooks ne fonctionneront pas dans ce cas pour les deux applications. \nÊtes-vous sûr de vouloir l'utiliser ?",
 			"buildpack": {
-				"choose_this_one": "Choisissez celui-ci..."
+				"choose_this_one": "Choisir celui-ci..."
 			},
 			"configuration_missing": "Configuration manquante",
-			"configure_build_pack": "Configurer le pack de construction",
+			"configure_build_pack": "Configurer le pack de build",
 			"configure_destination": "Configurer la destination",
 			"configure_it_now": "Configurez-le maintenant",
-			"found_lock_file": "Fichier de verrouillage trouvé pour <span class=\"font-bold text-orange-500 pl-1\">{{packageManager}}</span>. \nL'utiliser pour les commandes de commandes prédéfinies.",
+			"found_lock_file": "Fichier .lock trouvé pour <span class=\"font-bold text-orange-500 pl-1\">{{packageManager}}</span>. \nL'utiliser pour les commandes prédéfinies.",
 			"loading_branches": "Chargement des branches...",
 			"loading_groups": "Chargement des groupes...",
 			"loading_projects": "Chargement des projets...",
-			"loading_repositories": "Chargement des référentiels...",
-			"no_branches_found": "Aucune succursale trouvée",
+			"loading_repositories": "Chargement des dépôts Git...",
+			"no_branches_found": "Aucune branche trouvée",
 			"no_configurable_destination": "Aucune destination configurable trouvée",
 			"no_configurable_git": "Aucune source Git configurable trouvée",
 			"no_projects_found": "Aucun projet trouvé",
-			"no_repositories_configured": "Aucun référentiel configuré pour votre application Git.",
-			"scanning_repository_suggest_build_pack": "Analyse du référentiel pour vous suggérer un pack de construction...",
-			"select_a_branch": "Veuillez sélectionner une succursale",
+			"no_repositories_configured": "Aucun dépôt Git configuré pour votre application.",
+			"scanning_repository_suggest_build_pack": "Analyse du dépôt pour vous suggérer un pack de Build...",
+			"select_a_branch": "Veuillez sélectionner une branche",
 			"select_a_git_source": "Sélectionnez une source Git",
 			"select_a_group": "Veuillez sélectionner un groupe",
 			"select_a_project": "Veuillez sélectionner un projet",
 			"select_a_repository": "Veuillez sélectionner un dépôt",
-			"select_a_repository_first": "Veuillez d'abord sélectionner un référentiel",
-			"select_a_repository_project": "Sélectionnez un référentiel / projet"
+			"select_a_repository_first": "Veuillez d'abord sélectionner un dépôt",
+			"select_a_repository_project": "Sélectionnez un dépôt / projet"
 		},
 		"configurations": "Configurations",
 		"confirm_to_delete": "Voulez-vous vraiment supprimer '{{name}}'?",
 		"debug_logs": "Journaux de débogage",
-		"delete_application": "Supprimer la demande",
+		"delete_application": "Supprimer l'application",
 		"deployment_queued": "Déploiement en file d'attente.",
 		"destination": "Destination",
 		"directory_to_use_explainer": "Répertoire à utiliser comme base pour toutes les commandes.<br>Pourrait être utile avec <span class='text-green-500 font-bold'>monorepos</span>.",
@@ -57,31 +57,31 @@
 		"domain_fqdn": "Domaine (FQDN)",
 		"enable_auto_deploy_webhooks": "Activez le déploiement automatique via des webhooks.",
 		"enable_automatic_deployment": "Activer le déploiement automatique",
-		"enable_debug_log_during_build": "Activez les journaux de débogage pendant la phase de construction.<br><span class='text-red-500 font-bold'>Les informations sensibles</span> peuvent être visibles et enregistrées dans les journaux.",
+		"enable_debug_log_during_build": "Activez les journaux de débogage pendant la phase de build.<br><span class='text-red-500 font-bold'>Les informations sensibles</span> peuvent être visibles et enregistrées dans les journaux.",
 		"enable_mr_pr_previews": "Activer les aperçus MR/PR",
 		"enable_preview_deploy_mr_pr_requests": "Activez les déploiements de prévisualisation à partir de demandes d'extraction ou de fusion.",
 		"features": "Caractéristiques",
-		"git_repository": "Référentiel Git",
+		"git_repository": "Dépôt Git",
 		"git_source": "Source Git",
-		"https_explainer": "Si vous spécifiez <span class='text-green-500 font-bold'>https</span>, l'application sera accessible uniquement via https. \nUn certificat SSL sera généré pour vous.<br>Si vous spécifiez <span class='text-green-500 font-bold'>www</span>, l'application sera redirigée (302) à partir de non-www et vice versa \n.<br><br>Pour modifier le domaine, vous devez d'abord arrêter l'application.<br><br><span class='text-white font-bold'>Vous devez configurer votre DNS pour pointer vers l'IP du serveur dans \navance.</span>",
+		"https_explainer": "Si vous spécifiez <span class='text-green-500 font-bold'>https</span>, l'application sera accessible uniquement via https. \nUn certificat SSL sera généré pour vous.<br>Si vous spécifiez <span class='text-green-500 font-bold'>www</span>, l'application sera redirigée (302) à partir de non-www et vice versa \n.<br><br>Pour modifier le domaine, vous devez d'abord arrêter l'application.<br><br><span class='text-white font-bold'>Vous devez configurer, en avance, votre DNS pour pointer vers l'IP du serveur.</span>",
 		"install_command": "Commande d'installation",
 		"logs": "Journaux des applications",
 		"no_applications_found": "Aucune application trouvée",
 		"permission_denied_build_and_start_application": "Vous n'êtes pas autorisé à créer et à démarrer l'application.",
 		"permission_denied_delete_application": "Vous n'êtes pas autorisé à supprimer cette application",
-		"permission_denied_rebuild_application": "Vous n'êtes pas autorisé à reconstruire l'application.",
+		"permission_denied_rebuild_application": "Vous n'êtes pas autorisé à re-build l'application.",
 		"permission_denied_stop_application": "Vous n'êtes pas autorisé à arrêter l'application.",
 		"persistent_storage": "Stockage persistant",
 		"preview": {
-			"need_during_buildtime": "Besoin pendant la construction ?",
+			"need_during_buildtime": "Besoin pendant la build ?",
 			"no_previews_available": "Aucun aperçu disponible",
 			"redeploy": "Redéployer",
 			"setup_secret_app_first": "Vous pouvez ajouter des secrets aux déploiements PR/MR. \nVeuillez d'abord ajouter des secrets à l'application. \n<br>Utile pour créer des environnements <span class='text-green-500 font-bold'>de mise en scène</span>.",
 			"values_overwriting_app_secrets": "Ces valeurs remplacent les secrets d'application dans les déploiements PR/MR. \nUtile pour créer des environnements <span class='text-green-500 font-bold'>de mise en scène</span>."
 		},
 		"previews": "Aperçus",
-		"publish_directory_explainer": "Répertoire contenant tous les actifs à déployer. \n<br> Par exemple : <span class='text-green-500 font-bold'>dist</span>,<span class='text-green-500 font-bold'>_site</span> ou <span \nclass='text-green-500 font-bold'>public</span>.",
-		"rebuild_application": "Reconstruire l'application",
+		"publish_directory_explainer": "Répertoire contenant tous les actifs à déployer. \n<br> Par exemple : <span class='text-green-500 font-bold'>dist</span>,<span class='text-green-500 font-bold'>_site</span> ou <span \nclass='text-green-500 font-bold'>public</span>.",
+		"rebuild_application": "Re-build l'application",
 		"secret": "secrets",
 		"secrets": {
 			"secret_saved": "Secret enregistré.",
@@ -90,7 +90,7 @@
 		},
 		"settings_saved": "Paramètres sauvegardés.",
 		"ssl_explainer": "Il générera des certificats pour www et non-www. \n<br>Vous devez avoir <span class='font-bold text-green-500'>les deux entrées DNS</span> définies à l'avance.<br><br>Utile si vous prévoyez d'avoir des visiteurs sur les deux.",
-		"ssl_www_and_non_www": "Générer SSL pour www et non-www ?",
+		"ssl_www_and_non_www": "Générer SSL pour www et non-www ?",
 		"start_command": "Démarrer la commande",
 		"stop_application": "Arrêter l'application",
 		"storage": {
@@ -103,8 +103,8 @@
 	},
 	"database": {
 		"change_append_only_mode": "Changer le mode d'ajout uniquement",
-		"confirm_stop": "Êtes-vous sûr de vouloir arrêter {{name}} ?",
-		"connection_string": "Chaîne de connexion",
+		"confirm_stop": "Êtes-vous sûr de vouloir arrêter {{name}} ?",
+		"connection_string": "Connexion string",
 		"default_database": "Base de données par défaut",
 		"delete_database": "Supprimer la base de données",
 		"generated_automatically_after_set_to_public": "Généré automatiquement après avoir été défini sur public",
@@ -114,18 +114,18 @@
 		"permission_denied_stop_database": "Vous n'êtes pas autorisé à arrêter la base de données.",
 		"select_database_type": "Sélectionnez un type de base de données",
 		"select_database_version": "Sélectionnez une version de la base de données",
-		"set_public": "Rendez-le public",
+		"set_public": "Rendre public",
 		"start_database": "Démarrer la base de données",
 		"stop_database": "Arrêter la base de données",
 		"warning_append_only": "Utile si vous souhaitez restaurer des données Redis à partir d'une sauvegarde.<br><span class='font-bold text-white'>Le redémarrage de la base de données est nécessaire.</span>",
-		"warning_database_public": "Votre base de données sera accessible sur Internet. \n<br>Prenez la sécurité au sérieux dans ce cas !"
+		"warning_database_public": "Votre base de données sera accessible depuis Internet. \n<br>Prenez la sécurité au sérieux dans ce cas!"
 	},
 	"destination": {
-		"add_to_coolify": "Ajouter pour refroidir",
-		"confirm_restart_proxy": "Voulez-vous vraiment redémarrer le proxy ? \nTout sera reconfiguré en ~10 secondes.",
-		"coolify_proxy_restarting": "Redémarrage de Coolify Proxy...",
-		"coolify_proxy_started": "Coolify Proxy a démarré !",
-		"coolify_proxy_stopped": "Coolify Proxy arrêté !",
+		"add_to_coolify": "Ajouter à Coolify",
+		"confirm_restart_proxy": "Voulez-vous vraiment redémarrer le proxy? \nTout sera reconfiguré en ~10 secondes.",
+		"coolify_proxy_restarting": "Redémarrage du Proxy Coolify...",
+		"coolify_proxy_started": "Proxy Coolify démarré!",
+		"coolify_proxy_stopped": "Proxy Coolify arrêté!",
 		"delete_destination": "Supprimer le destinataire",
 		"force_restart_proxy": "Forcer le redémarrage du proxy",
 		"new": {
@@ -134,11 +134,11 @@
 			"predefined_destinations": "Destinations prédéfinies",
 			"saving_and_configuring_proxy": "Enregistrement et configuration du proxy..."
 		},
-		"new_error_network_already_exists": "Réseau {{network}} déjà configuré pour une autre équipe !",
+		"new_error_network_already_exists": "Réseau {{network}} déjà configuré pour une autre équipe !",
 		"no_destination_found": "Aucune destination trouvée",
 		"permission_denied_delete_destination": "Vous n'êtes pas autorisé à supprimer cette destination",
 		"restarting_please_wait": "Redémarrage... veuillez patienter...",
-		"use_coolify_proxy": "Utiliser Coolify Proxy ?"
+		"use_coolify_proxy": "Utiliser le Proxy Coolify ?"
 	},
 	"error": {
 		"here": "ici",
@@ -153,21 +153,21 @@
 		"api_url": "URL de l'API",
 		"base_directory": "Répertoire de base",
 		"configuration": "Configuration",
-		"confirm_continue": "Êtes-vous sûr de continuer ?",
+		"confirm_continue": "Êtes-vous sûr de continuer ?",
 		"default": "défaut",
 		"default_email_address": "Adresse e-mail par défaut",
 		"default_password": "Mot de passe par défaut",
-		"eg": "par exemple",
+		"eg": "ex",
 		"email": "Adresse e-mail",
 		"engine": "Moteur",
 		"extra_config": "Configuration supplémentaire",
 		"generated_automatically_after_start": "Généré automatiquement après le démarrage",
-		"host": "Héberger",
-		"html_url": "URLHTML",
+		"host": "Hôte",
+		"html_url": "URL HTML",
 		"ip_address": "Adresse IP",
 		"is_required": "est requis.",
 		"loading": "Chargement...",
-		"must_be_stopped_to_modify": "Doit être arrêté pour modifier.",
+		"must_be_stopped_to_modify": "Doit être arrêté pour être modifié.",
 		"name": "Nom",
 		"network": "Réseau",
 		"new_password": "Nouveau mot de passe",
@@ -179,17 +179,17 @@
 		"path": "Chemin",
 		"port": "Port",
 		"public_port_range": "Gamme de ports publics",
-		"public_port_range_explainer": "Ports utilisés pour exposer les bases de données/services/services internes.<br> Ajoutez-les à votre pare-feu (le cas échéant).<br><br>Vous pouvez spécifier une plage de ports, par exemple : <span class='text-yellow-500 \nfont-bold'>9000-9100</span>",
+		"public_port_range_explainer": "Ports utilisés pour exposer les bases de données/services/services internes.<br> Ajoutez-les à votre pare-feu (le cas échéant).<br><br>Vous pouvez spécifier une plage de ports, par exemple : <span class='text-yellow-500 \nfont-bold'>9000-9100</span>",
 		"publish_directory": "Publier le répertoire",
 		"remove": "Retirer",
 		"remove_domain": "Supprimer le domaine",
 		"removing": "Suppression...",
-		"root_db_password": "Mot de passe de la base de données racine",
-		"root_db_user": "Utilisateur racine de la base de données",
-		"root_user": "Utilisateur racine",
-		"roots_password": "Mot de passe de la racine",
+		"root_db_password": "Mot de passe root de la base de données",
+		"root_db_user": "Utilisateur root de la base de données",
+		"root_user": "Utilisateur root",
+		"roots_password": "Mot de passe de l'utilisateur root",
 		"save": "sauvegarder",
-		"saving": "Économie...",
+		"saving": "Sauvegarde...",
 		"select_a_service": "Sélectionnez un service",
 		"select_a_service_version": "Sélectionnez une version de service",
 		"set": "Régler",
@@ -199,7 +199,7 @@
 		"type": "Taper",
 		"user": "Utilisateur",
 		"username": "Nom d'utilisateur",
-		"value": "Évaluer",
+		"value": "Valeur",
 		"verify_emails_without_smtp": "Vérifier les e-mails sans SMTP",
 		"verifying": "Vérification",
 		"version": "Version"
@@ -214,7 +214,7 @@
 		"git_sources": "Sources Git",
 		"global_settings": "Paramètres globaux",
 		"logout": "Se déconnecter",
-		"not_implemented_yet": "Pas encore mis en œuvre",
+		"not_implemented_yet": "Pas encore implémenté",
 		"secret": "Secret",
 		"services": "Services",
 		"settings": "Réglages",
@@ -250,14 +250,14 @@
 		"permission_denied_start_service": "Vous n'êtes pas autorisé à démarrer le service.",
 		"permission_denied_stop_service": "Vous n'êtes pas autorisé à arrêter le service.",
 		"start_service": "Démarrer le service",
-		"stop_service": "Aire d'autoroute"
+		"stop_service": "Stopper le service"
 	},
 	"services": {
-		"all_email_verified": "Tous les e-mails vérifiés. \nVous pouvez vous connecter maintenant.",
-		"generate_www_non_www_ssl": "Il générera des certificats pour www et non-www. \n<br>Vous devez avoir <span class='font-bold text-pink-600'>les deux entrées DNS</span> définies à l'avance.<br><br>Le service doit être redémarré."
+		"all_email_verified": "Tous les e-mails sont vérifiés. \nVous pouvez vous connecter maintenant.",
+		"generate_www_non_www_ssl": "Il générera des certificats pour www et non-www. \n<br>Vous devez avoir <span class='font-bold text-pink-600'>les deux entrées DNS</span> définies à l'avance.<br><br>Le service devra être redémarré."
 	},
 	"setting": {
-		"coolify_proxy_settings": "Refroidir les paramètres proxy",
+		"coolify_proxy_settings": "Paramètres du proxy Coolify",
 		"credential_stat_explainer": "Identifiants pour la page <a class=\"text-white font-bold\" href=\"{{link}}\" target=\"_blank\">statistiques</a>.",
 		"domain_removed": "Domaine supprimé",
 		"must_remove_domain_before_changing": "Vous devez supprimer le domaine avant de pouvoir modifier ce paramètre.",
@@ -282,7 +282,7 @@
 			"user_owned": "Application appartenant à l'utilisateur"
 		},
 		"group_name": "Nom de groupe",
-		"install_repositories": "Installer les référentiels",
+		"install_repositories": "Installer les dépôts",
 		"new": {
 			"git_source": "Ajouter une nouvelle source Git",
 			"official_providers": "Fournisseurs officiels"
@@ -305,7 +305,7 @@
 		"invite_new_member": "Inviter un nouveau membre",
 		"invite_only_register_explainer": "Vous ne pouvez inviter que des utilisateurs enregistrés pour le moment - sera bientôt prolongé.",
 		"invited_with_permissions": "Invité à <span class=\"font-bold text-pink-600\">{{teamName}}</span> avec <span class=\"font-bold text-rose-600\">{{permission}}</span \n> autorisation.",
-		"member": "membres)",
+		"member": "membre(s)",
 		"members": "Membres",
 		"pending_invitation": "Invitation en attente",
 		"pending_invitations": "Invitations en attente",
@@ -313,8 +313,8 @@
 		"promote_to": "Promouvoir à {{grade}}",
 		"read": "Lire",
 		"revoke_invitation": "Révoquer l'invitation",
-		"root": "(racine)",
-		"root_team_explainer": "Il s'agit de l'équipe <span class='text-red-500 font-bold'>racine</span>. \nCela signifie que les membres de ce groupe peuvent gérer les paramètres à l'échelle de l'instance et avoir tous les privilèges dans Coolify (imaginez comme un utilisateur root sous Linux).",
+		"root": "(suprême)",
+		"root_team_explainer": "Il s'agit de l'équipe <span class='text-red-500 font-bold'>suprême</span>. \nCela signifie que les membres de ce groupe peuvent gérer les paramètres à l'échelle de l'instance et avoir tous les privilèges dans Coolify (imaginez comme un utilisateur root sous Linux).",
 		"send_invitation": "Envoyer une invitation",
 		"you": "(Toi)"
 	}
diff --git a/src/routes/services/[id]/__layout.svelte b/src/routes/services/[id]/__layout.svelte
index 593c5bc56..8463d5891 100644
--- a/src/routes/services/[id]/__layout.svelte
+++ b/src/routes/services/[id]/__layout.svelte
@@ -73,7 +73,7 @@
 	let loading = false;
 
 	async function deleteService() {
-		const sure = confirm(t.get('application.confirm_to_delete', { name: service.name }));
+		const sure = confirm($t('application.confirm_to_delete', { name: service.name }));
 		if (sure) {
 			loading = true;
 			try {
@@ -88,7 +88,7 @@
 		}
 	}
 	async function stopService() {
-		const sure = confirm(t.get('application.confirm_stop', { name: service.name }));
+		const sure = confirm($t('database.confirm_stop', { name: service.name }));
 		if (sure) {
 			loading = true;
 			try {
diff --git a/src/routes/services/[id]/configuration/version.svelte b/src/routes/services/[id]/configuration/version.svelte
index 00c9bc19d..d565c5dfa 100644
--- a/src/routes/services/[id]/configuration/version.svelte
+++ b/src/routes/services/[id]/configuration/version.svelte
@@ -31,6 +31,7 @@
 	import { errorNotification } from '$lib/form';
 	import { goto } from '$app/navigation';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');

From e4f701b148dc4ae963efefb478c5ff49a12bdfb5 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Sun, 3 Apr 2022 21:47:58 +0200
Subject: [PATCH 18/23] Add auto detect of locales files and contrib guide

---
 CONTRIBUTING.md         | 91 +++++++++++++++++++++++++++++++++--------
 src/lib/translations.ts | 39 ++++++++++--------
 svelte.config.js        |  5 +++
 3 files changed, 103 insertions(+), 32 deletions(-)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index ff57a6abd..95266cb84 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,14 +1,26 @@
-# Welcome
+# 👋 Welcome
 
-First of all, thank you for considering to contribute to my project! It means a lot 💜.
+First of all, thank you for considering contributing to my project! It means a lot 💜.
 
-# Technical skills required
+## 🙋 Want to help?
 
-- Node.js / Javascript
-- Svelte / SvelteKit
-- Prisma.io
+If you begin in GitHub contribution, you can find the [first contribution](https://github.com/firstcontributions/first-contributions) and follow this guide.
 
-# Recommended Pull Request Guideline
+Follow the [introduction](#introduction) to get started then start contributing!
+
+This is a little list of what you can do to help the project:
+
+- [🧑‍💻 Develop your own ideas](#developer-contribution)
+- [🌐 Translate the project](#translation)
+- [📄 Help sorting out the issues](#help-sorting-out-the-issues)
+- [🎯 Test Pull Requests](#test-pull-requests)
+- [✒️ Help with the documentation](#help-with-the-documentation)
+
+## 👋 Introduction
+
+🔴 At the moment, Coolify **doesn't support Windows**. You must use Linux or MacOS.
+
+#### Recommended Pull Request Guideline
 
 - Fork the project
 - Clone your fork repo to local
@@ -18,13 +30,7 @@ First of all, thank you for considering to contribute to my project! It means a
 - Write a proper description
 - Click "Change to draft"
 
-# How to start after you set up your local fork?
-
-This repository best with [pnpm](https://pnpm.io) due to the lock file. I recommend you should try and use `pnpm` as well, because it is cool and efficient!
-
-You need to have [Docker Engine](https://docs.docker.com/engine/install/) installed locally.
-
-## Setup development environment
+#### Setup a local development environment
 
 - Copy `.env.template` to `.env` and set the `COOLIFY_APP_ID` environment variable to something cool.
 - Install dependencies with `pnpm install`.
@@ -32,12 +38,65 @@ You need to have [Docker Engine](https://docs.docker.com/engine/install/) instal
   - This will apply all migrations and seed the database at `db/dev.db`.
 - You can start coding after starting `pnpm dev`.
 
-## Database migrations
+#### How to start after you set up your local fork?
+
+This repository works better with [pnpm](https://pnpm.io) due to the lock file. I recommend you to give it a try and use `pnpm` as well because it is cool and efficient!
+
+You need to have [Docker Engine](https://docs.docker.com/engine/install/) installed locally.
+
+## 🧑‍💻 Developer contribution
+
+### Technical skills required
+
+- **Languages**: Node.js / Javascript / Typescript
+- **Framework JS/TS**: Svelte / SvelteKit
+- **Database ORM**: Prisma.io
+
+### Database migrations
 
 During development, if you change the database layout, you need to run `pnpm db:push` to migrate the database and create types for Prisma. You also need to restart the development process.
 
 If the schema is finalized, you need to create a migration file with `pnpm db:migrate <nameOfMigration>` where `nameOfMigration` is given by you. Make it sense. :)
 
-## Tricky parts
+### Tricky parts
 
 - BullMQ, the queue system Coolify is using, cannot be hot reloaded. So if you change anything in the files related to it, you need to restart the development process. I'm actively looking of a different queue/scheduler library. I'm open for discussion!
+
+## 🌐 Translate the project
+
+The project use [sveltekit-i18n](https://github.com/sveltekit-i18n/lib) to translate the project.
+It follows the [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) to name languages.
+
+### Installation
+
+You must have gone throw all the [intro](#introduction) steps before you can start translating.
+
+It's only an advice, but I recommend you to use:
+
+- Visual Studio Code
+- [i18n Ally for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=Lokalise.i18n-ally): ideal to see the progress of the translation.
+- [Svelte for VS Code](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode): to get the syntax color for the project
+
+### Adding a language
+
+If your language doesn't appear in the [locales folder list](src/lib/locales/), follow the step below:
+
+1.  In `src/lib/locales/`, Copy paste `en.json` and rename it with your language (eg: `cz.json`).
+2.  In the [lang.json](src/lib/lang.json) file, add a line after the first bracket (`{`) with `"ISO of your language": "Language",` (eg: `"cz": "Czech",`).
+3.  Have fun translating!
+
+### Additionnal pull requests steps
+
+Please add the emoji 🌐 to your pull request title to indicate that it is a translation.
+
+## 📄 Help sorting out the issues
+
+ToDo
+
+## 🎯 Test Pull Requests
+
+ToDo
+
+## ✒️ Help with the documentation
+
+ToDo
diff --git a/src/lib/translations.ts b/src/lib/translations.ts
index 9d31f11bf..56e1cb5ff 100644
--- a/src/lib/translations.ts
+++ b/src/lib/translations.ts
@@ -1,25 +1,32 @@
 import i18n from 'sveltekit-i18n';
 import lang from './lang.json';
+import * as fs from 'fs';
+
+// Get all translations files
+const loaders = [];
+const translations = {};
+fs.readdir('src/lib/locales/', (err, files) => {
+	files.forEach((file) => {
+		if (file.endsWith('.json')) {
+			const lang_iso = file.replace('.json', '');
+
+			loaders.push({
+				locale: file.replace('.json', ''),
+				key: '',
+				/* @vite-ignore */
+				loader: async () => (await import(`./locales/${lang_iso}.json`)).default
+			});
+
+			translations[lang_iso] = { lang };
+		}
+	});
+});
 
 /** @type {import('sveltekit-i18n').Config} */
 const config = {
 	fallbackLocale: 'en',
-	translations: {
-		en: { lang },
-		fr: { lang }
-	},
-	loaders: [
-		{
-			locale: 'en',
-			key: '',
-			loader: async () => (await import('./locales/en.json')).default
-		},
-		{
-			locale: 'fr',
-			key: '',
-			loader: async () => (await import('./locales/fr.json')).default
-		}
-	]
+	translations: translations,
+	loaders: loaders
 };
 
 export const { t, loading, locales, locale, loadTranslations } = new i18n(config);
diff --git a/svelte.config.js b/svelte.config.js
index 4e8bc8966..352c3e330 100644
--- a/svelte.config.js
+++ b/svelte.config.js
@@ -12,6 +12,11 @@ const config = {
 		vite: {
 			optimizeDeps: {
 				exclude: ['svelte-kit-cookie-session']
+			},
+			server: {
+				fs: {
+					allow: ['./src/lib/locales/']
+				}
 			}
 		}
 	}

From 448611039c0c64e5db3d005c5701f36d0f567b5e Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Mon, 4 Apr 2022 11:50:54 +0200
Subject: [PATCH 19/23] Patch langs problems

---
 src/lib/locales/en.json                   | 1 +
 src/lib/locales/fr.json                   | 1 +
 src/routes/applications/[id]/index.svelte | 2 +-
 3 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index 79822170b..b7194cabc 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -184,6 +184,7 @@
 		"build_pack": "Build Pack",
 		"destination": "Destination",
 		"application": "Application",
+		"url_fqdn": "URL (FQDN)",
 		"domain_fqdn": "Domain (FQDN)",
 		"https_explainer": "If you specify <span class='text-green-500 font-bold'>https</span>, the application will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-green-500 font-bold'>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application.<br><br><span class='text-white font-bold'>You must set your DNS to point to the server IP in advance.</span>",
 		"ssl_www_and_non_www": "Generate SSL for www and non-www?",
diff --git a/src/lib/locales/fr.json b/src/lib/locales/fr.json
index 4ec496f31..36f10dfb4 100644
--- a/src/lib/locales/fr.json
+++ b/src/lib/locales/fr.json
@@ -55,6 +55,7 @@
 		"dns_not_set_partial_error": "DNS non défini",
 		"domain_already_in_use": "Le domaine {{domain}} est déjà utilisé.",
 		"domain_fqdn": "Domaine (FQDN)",
+		"url_fqdn": "URL (FQDN)",
 		"enable_auto_deploy_webhooks": "Activez le déploiement automatique via des webhooks.",
 		"enable_automatic_deployment": "Activer le déploiement automatique",
 		"enable_debug_log_during_build": "Activez les journaux de débogage pendant la phase de build.<br><span class='text-red-500 font-bold'>Les informations sensibles</span> peuvent être visibles et enregistrées dans les journaux.",
diff --git a/src/routes/applications/[id]/index.svelte b/src/routes/applications/[id]/index.svelte
index 835b96cfa..6f9554980 100644
--- a/src/routes/applications/[id]/index.svelte
+++ b/src/routes/applications/[id]/index.svelte
@@ -296,7 +296,7 @@
 			<div class="grid grid-cols-2">
 				<div class="flex-col">
 					<label for="fqdn" class="pt-2 text-base font-bold text-stone-100"
-						>{$t('application.domain_fqdn')}</label
+						>{$t('application.url_fqdn')}</label
 					>
 					{#if browser && window.location.hostname === 'demo.coolify.io'}
 						<Explainer

From d4c972584a6be3b1adade995ba194cb8ec6ed501 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Mon, 4 Apr 2022 12:30:22 +0200
Subject: [PATCH 20/23] Add english translation for register page

---
 src/lib/locales/en.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index b7194cabc..c8df380b7 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -93,6 +93,7 @@
 	},
 	"register": {
 		"register": "Register",
+		"registering": "Registering...",
 		"first_user": "You are registering the first user. It will be the administrator of your Coolify instance."
 	},
 	"reset": {

From bd15d85732ce27653131001f7351975a74a427d6 Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Mon, 4 Apr 2022 12:37:24 +0200
Subject: [PATCH 21/23] Add last translations for 2.3.0

---
 src/lib/locales/en.json                                   | 7 +++++--
 src/routes/applications/[id]/secrets/_BatchSecrets.svelte | 5 +++--
 src/routes/applications/[id]/secrets/_Secret.svelte       | 1 +
 src/routes/applications/[id]/secrets/utils.ts             | 7 ++++---
 src/routes/services/[id]/_Services/_MeiliSearch.svelte    | 3 ++-
 5 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json
index c8df380b7..20baecc8a 100644
--- a/src/lib/locales/en.json
+++ b/src/lib/locales/en.json
@@ -89,7 +89,8 @@
 		"remove_domain": "Remove domain",
 		"public_port_range": "Public Port Range",
 		"public_port_range_explainer": "Ports used to expose databases/services/internal services.<br> Add them to your firewall (if applicable).<br><br>You can specify a range of ports, eg: <span class='text-yellow-500 font-bold'>9000-9100</span>",
-		"no_actions_available": "No actions available"
+		"no_actions_available": "No actions available",
+		"admin_api_key": "Admin API key"
 	},
 	"register": {
 		"register": "Register",
@@ -203,7 +204,9 @@
 		"debug_logs": "Debug Logs",
 		"enable_debug_log_during_build": "Enable debug logs during build phase.<br><span class='text-red-500 font-bold'>Sensitive information</span> could be visible and saved in logs.",
 		"cant_activate_auto_deploy_without_repo": "Cannot activate automatic deployments until only one application is defined for this repository / branch.",
-		"no_applications_found": "No applications found"
+		"no_applications_found": "No applications found",
+		"secret__batch_dot_env": "Paste .env file",
+		"batch_secrets": "Batch add secrets"
 	},
 	"general": "General",
 	"database": {
diff --git a/src/routes/applications/[id]/secrets/_BatchSecrets.svelte b/src/routes/applications/[id]/secrets/_BatchSecrets.svelte
index 38af130c9..7e6cd737d 100644
--- a/src/routes/applications/[id]/secrets/_BatchSecrets.svelte
+++ b/src/routes/applications/[id]/secrets/_BatchSecrets.svelte
@@ -6,6 +6,7 @@
 	import { saveSecret } from './utils';
 	import pLimit from 'p-limit';
 	import { createEventDispatcher } from 'svelte';
+	import { t } from '$lib/translations';
 	const dispatch = createEventDispatcher();
 
 	let batchSecrets = '';
@@ -38,11 +39,11 @@
 	}
 </script>
 
-<h2 class="title my-6 font-bold">Paste .env file</h2>
+<h2 class="title my-6 font-bold">{$t('application.secret__batch_dot_env')}</h2>
 <form on:submit={getValues} class="mb-12 w-full">
 	<textarea value={batchSecrets} on:change={setBatchValue} class="mb-2 min-h-[200px] w-full" />
 	<button
 		class="bg-green-600 hover:bg-green-500 disabled:text-white disabled:opacity-40"
-		type="submit">Batch add secrets</button
+		type="submit">{$t('application.batch_secrets')}</button
 	>
 </form>
diff --git a/src/routes/applications/[id]/secrets/_Secret.svelte b/src/routes/applications/[id]/secrets/_Secret.svelte
index 109c7752a..8adc2726b 100644
--- a/src/routes/applications/[id]/secrets/_Secret.svelte
+++ b/src/routes/applications/[id]/secrets/_Secret.svelte
@@ -12,6 +12,7 @@
 	import { del } from '$lib/api';
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
 	import { errorNotification } from '$lib/form';
+	import { t } from '$lib/translations';
 	import { createEventDispatcher } from 'svelte';
 	import { saveSecret } from './utils';
 
diff --git a/src/routes/applications/[id]/secrets/utils.ts b/src/routes/applications/[id]/secrets/utils.ts
index a7d24a39e..94afe3b9e 100644
--- a/src/routes/applications/[id]/secrets/utils.ts
+++ b/src/routes/applications/[id]/secrets/utils.ts
@@ -1,6 +1,7 @@
 import { toast } from '@zerodevx/svelte-toast';
 import { errorNotification } from '$lib/form';
 import { post } from '$lib/api';
+import { t } from '$lib/translations';
 
 type Props = {
 	isNew: boolean;
@@ -23,8 +24,8 @@ export async function saveSecret({
 	applicationId,
 	dispatch
 }: Props): Promise<void> {
-	if (!name) return errorNotification('Name is required.');
-	if (!value) return errorNotification('Value is required.');
+	if (!name) return errorNotification(`${t.get('forms.name')} ${t.get('forms.is_required')}`);
+	if (!value) return errorNotification(`${t.get('forms.value')} ${t.get('forms.is_required')}`);
 	try {
 		await post(`/applications/${applicationId}/secrets.json`, {
 			name,
@@ -39,7 +40,7 @@ export async function saveSecret({
 			value = '';
 			isBuildSecret = false;
 		}
-		toast.push('Secret saved.');
+		toast.push(t.get('application.secrets.secret_saved'));
 	} catch ({ error }) {
 		return errorNotification(error);
 	}
diff --git a/src/routes/services/[id]/_Services/_MeiliSearch.svelte b/src/routes/services/[id]/_Services/_MeiliSearch.svelte
index ba0b360dd..383889bf2 100644
--- a/src/routes/services/[id]/_Services/_MeiliSearch.svelte
+++ b/src/routes/services/[id]/_Services/_MeiliSearch.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import { t } from '$lib/translations';
 	export let service;
 </script>
 
@@ -7,7 +8,7 @@
 	<div class="title">MeiliSearch</div>
 </div>
 <div class="grid grid-cols-2 items-center px-10">
-	<label for="masterKey">Admin API key</label>
+	<label for="masterKey">{$t('forms.admin_api_key')}</label>
 	<CopyPasswordField
 		id="masterKey"
 		isPasswordField

From 0ead17ab708ffd297fe06e08db3cc7f8e556594c Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Mon, 4 Apr 2022 17:06:03 +0200
Subject: [PATCH 22/23] Patch translation module not loaded

---
 src/routes/databases/[id]/configuration/type.svelte | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/routes/databases/[id]/configuration/type.svelte b/src/routes/databases/[id]/configuration/type.svelte
index 4a306383f..a73163058 100644
--- a/src/routes/databases/[id]/configuration/type.svelte
+++ b/src/routes/databases/[id]/configuration/type.svelte
@@ -42,6 +42,7 @@
 	import Redis from '$lib/components/svg/databases/Redis.svelte';
 	import { goto } from '$app/navigation';
 	import { post } from '$lib/api';
+	import { t } from '$lib/translations';
 	async function handleSubmit(type) {
 		try {
 			await post(`/databases/${id}/configuration/type.json`, { type });

From c39cb42601ba760bc99b8ee166087fa4717099df Mon Sep 17 00:00:00 2001
From: Restray <contact@restray.org>
Date: Mon, 4 Apr 2022 17:56:32 +0200
Subject: [PATCH 23/23] feat (i18n) : go back i18n loading json files

---
 src/lib/translations.ts | 44 +++++++++++++++++------------------------
 1 file changed, 18 insertions(+), 26 deletions(-)

diff --git a/src/lib/translations.ts b/src/lib/translations.ts
index 56e1cb5ff..dcda99dcb 100644
--- a/src/lib/translations.ts
+++ b/src/lib/translations.ts
@@ -1,34 +1,26 @@
 import i18n from 'sveltekit-i18n';
 import lang from './lang.json';
-import * as fs from 'fs';
-
-// Get all translations files
-const loaders = [];
-const translations = {};
-fs.readdir('src/lib/locales/', (err, files) => {
-	files.forEach((file) => {
-		if (file.endsWith('.json')) {
-			const lang_iso = file.replace('.json', '');
-
-			loaders.push({
-				locale: file.replace('.json', ''),
-				key: '',
-				/* @vite-ignore */
-				loader: async () => (await import(`./locales/${lang_iso}.json`)).default
-			});
-
-			translations[lang_iso] = { lang };
-		}
-	});
-});
 
 /** @type {import('sveltekit-i18n').Config} */
-const config = {
+export const config = {
 	fallbackLocale: 'en',
-	translations: translations,
-	loaders: loaders
+	translations: {
+		en: { lang },
+		fr: { lang }
+	},
+	loaders: [
+		{
+			locale: 'en',
+			key: '',
+			loader: async () => (await import('./locales/en.json')).default
+		},
+		{
+			locale: 'fr',
+			key: '',
+			loader: async () => (await import('./locales/fr.json')).default
+		}
+	]
 };
 
 export const { t, loading, locales, locale, loadTranslations } = new i18n(config);
-
-loading.subscribe(($loading) => $loading);
+loading.subscribe(($loading) => $loading && console.log('Loading translations...'));