Merge branch 'canary' into 1365-create-preview-deployment-using-api

- Add support for external preview deployments with optional GitHub comment handling
- Modify deployment services to conditionally update GitHub issue comments
- Update queue types and deployment worker to handle external deployment flag
- Refactor preview deployment creation to support external deployments
- Improve preview deployment router with more flexible deployment creation logic

.github/pull_request_template.md

@@ -1,21 +0,0 @@
-## What is this PR about?
-
-Please describe in a short paragraph what this PR is about.
-
-## Checklist
-
-Before submitting this PR, please make sure that:
-
-- [ ] You created a dedicated branch based on the `canary` branch.
-- [ ] You have read the suggestions in the CONTRIBUTING.md file https://github.com/Dokploy/dokploy/blob/canary/CONTRIBUTING.md#pull-request
-- [ ] You have tested this PR in your local instance.
-
-## Issues related (if applicable)
-
-Close automatically the related issues using the keywords: `closes #ISSUE_NUMBER`, `fixes #ISSUE_NUMBER`, `resolves #ISSUE_NUMBER`
-
-Example: `closes #123`
-
-## Screenshots (if applicable)
-
-If you include a video or screenshot, would be awesome so we can see the changes in action.

.github/workflows/create-pr.yml

@@ -19,14 +19,17 @@ jobs:
           fetch-depth: 0
 
       - name: Get version from package.json
+        id: package_version
         run: echo "VERSION=$(jq -r .version ./apps/dokploy/package.json)" >> $GITHUB_ENV
 
       - name: Get latest GitHub tag
+        id: latest_tag
         run: |
           LATEST_TAG=$(git ls-remote --tags origin | awk -F'/' '{print $3}' | sort -V | tail -n1)
           echo "LATEST_TAG=$LATEST_TAG" >> $GITHUB_ENV
           echo $LATEST_TAG
       - name: Compare versions
+        id: compare_versions
         run: |
           if [ "${{ env.VERSION }}" != "${{ env.LATEST_TAG }}" ]; then
             VERSION_CHANGED="true"
@@ -39,6 +42,7 @@ jobs:
           echo "Latest tag: ${{ env.LATEST_TAG }}"
           echo "Version changed: $VERSION_CHANGED"
       - name: Check if a PR already exists
+        id: check_pr
         run: |
           PR_EXISTS=$(gh pr list --state open --base main --head canary --json number --jq '. | length')
           echo "PR_EXISTS=$PR_EXISTS" >> $GITHUB_ENV

.github/workflows/deploy.yml

@@ -2,8 +2,7 @@ name: Build Docker images
 
 on:
   push:
-    branches: [main, canary]
-  workflow_dispatch:
+    branches: ["canary", "main", "feat/monitoring"]
 
 jobs:
   build-and-push-cloud-image:

.github/workflows/dokploy.yml

@@ -2,8 +2,7 @@ name: Dokploy Docker Build
 
 on:
   push:
-    branches: [main, canary]
-  workflow_dispatch:
+    branches: [main, canary, "1061-custom-docker-service-hostname"]
 
 env:
   IMAGE_NAME: dokploy/dokploy

.github/workflows/format.yml

@@ -11,12 +11,12 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v3
 
       - name: Setup biomeJs
         uses: biomejs/setup-biome@v2  
 
       - name: Run Biome formatter
-        run:  biome format --write
+        run:  biome format . --write
 
-      - uses: autofix-ci/action@635ffb0c9798bd160680f18fd73371e355b85f27 # v1.3.2
+      - uses: autofix-ci/action@551dded8c6cc8a1054039c8bc0b8b48c51dfc6ef

.github/workflows/pull-request.yml

@@ -4,15 +4,9 @@ on:
   pull_request:
     branches: [main, canary]
 
-permissions:
-  contents: read
-
 jobs:
-  pr-check:
+  lint-and-typecheck:
     runs-on: ubuntu-latest
-    strategy:
-      matrix:
-        job: [build, test, typecheck]
     steps:
       - uses: actions/checkout@v4
       - uses: pnpm/action-setup@v4
@@ -21,5 +15,32 @@ jobs:
           node-version: 20.16.0
           cache: "pnpm"
       - run: pnpm install --frozen-lockfile
-      - run: pnpm server:build
-      - run: pnpm ${{ matrix.job }}
+      - run: pnpm run server:build
+      - run: pnpm typecheck
+
+  build-and-test:
+    needs: lint-and-typecheck
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20.16.0
+          cache: "pnpm"
+      - run: pnpm install --frozen-lockfile
+      - run: pnpm run server:build
+      - run: pnpm build
+
+  parallel-tests:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20.16.0
+          cache: "pnpm"
+      - run: pnpm install --frozen-lockfile
+      - run: pnpm run server:build
+      - run: pnpm test

.vscode/extensions.json

@@ -1,3 +0,0 @@
-{
-	"recommendations": ["biomejs.biome"]
-}

.vscode/settings.json

@@ -1,8 +0,0 @@
-{
-	"editor.formatOnSave": true,
-	"editor.defaultFormatter": "biomejs.biome",
-	"editor.codeActionsOnSave": {
-		"source.fixAll.biome": "explicit",
-		"source.organizeImports.biome": "explicit"
-	}
-}

CONTRIBUTING.md

@@ -87,8 +87,7 @@ pnpm run dokploy:dev
 
 Go to http://localhost:3000 to see the development server
 
-> [!NOTE]
-> This project uses Biome. If your editor is configured to use another formatter such as Prettier, it's recommended to either change it to use Biome or turn it off.
+Note: this project uses Biome. If your editor is configured to use another formatter such as Prettier, it's recommended to either change it to use Biome or turn it off.
 
 ## Build
 
@@ -118,10 +117,10 @@ In the case you lost your password, you can reset it using the following command
 pnpm run reset-password
 ```
 
-If you want to test the webhooks on development mode using localtunnel, make sure to install [`localtunnel`](https://localtunnel.app/)
+If you want to test the webhooks on development mode using localtunnel, make sure to install `localtunnel`
 
 ```bash
-pnpm dlx localtunnel --port 3000
+bunx lt --port 3000
 ```
 
 If you run into permission issues of docker run the following command
@@ -153,7 +152,7 @@ curl -sSL "https://github.com/buildpacks/pack/releases/download/v0.35.0/pack-v0.
 
 ## Pull Request
 
-- The `canary` branch is the source of truth and should always reflect the latest stable release.
+- The `main` branch is the source of truth and should always reflect the latest stable release.
 - Create a new branch for each feature or bug fix.
 - Make sure to add tests for your changes.
 - Make sure to update the documentation for any changes Go to the [docs.dokploy.com](https://docs.dokploy.com) website to see the changes.
@@ -162,12 +161,6 @@ curl -sSL "https://github.com/buildpacks/pack/releases/download/v0.35.0/pack-v0.
 - If your pull request fixes an open issue, please reference the issue in the pull request description.
 - Once your pull request is merged, you will be automatically added as a contributor to the project.
 
-**Important Considerations for Pull Requests:**
-
-- **Focus and Scope:** Each Pull Request should ideally address a single, well-defined problem or introduce one new feature. This greatly facilitates review and reduces the chances of introducing unintended side effects.
-- **Avoid Unfocused Changes:** Please avoid submitting Pull Requests that contain only minor changes such as whitespace adjustments, IDE-generated formatting, or removal of unused variables, unless these are part of a larger, clearly defined refactor or a dedicated "cleanup" Pull Request that addresses a specific `good first issue` or maintenance task.
-- **Issue Association:** For any significant change, it's highly recommended to open an issue first to discuss the proposed solution with the community and maintainers. This ensures alignment and avoids duplicated effort. If your PR resolves an existing issue, please link it in the description (e.g., `Fixes #123`, `Closes #456`).
-
 Thank you for your contribution!
 
 ## Templates

Dockerfile

@@ -58,7 +58,7 @@ RUN curl -sSL https://nixpacks.com/install.sh -o install.sh \
     && pnpm install -g tsx
 
 # Install Railpack
-ARG RAILPACK_VERSION=0.2.2
+ARG RAILPACK_VERSION=0.0.64
 RUN curl -sSL https://railpack.com/install.sh | bash
 
 # Install buildpacks

README.md

@@ -1,6 +1,6 @@
 <div align="center">
   <a href="https://dokploy.com">
-    <img src=".github/sponsors/logo.png" alt="Dokploy - Open Source Alternative to Vercel, Heroku and Netlify." width="100%"  />
+    <img src=".github/sponsors/logo.png" alt="Dokploy - Open Source Alternative to Vercel, Heroku and Netlify." align="center" width="100%"  />
   </a>
   </br>
   </br>
@@ -13,7 +13,7 @@
 
 Dokploy is a free, self-hostable Platform as a Service (PaaS) that simplifies the deployment and management of applications and databases.
 
-## ✨ Features
+### Features
 
 Dokploy includes multiple features to make your life easier.
 
@@ -43,7 +43,7 @@ curl -sSL https://dokploy.com/install.sh | sh
 
 For detailed documentation, visit [docs.dokploy.com](https://docs.dokploy.com).
 
-## ♥️ Sponsors
+## Sponsors
 
 🙏 We're deeply grateful to all our sponsors who make Dokploy possible! Your support helps cover the costs of hosting, testing, and developing new features.
 
@@ -95,6 +95,7 @@ For detailed documentation, visit [docs.dokploy.com](https://docs.dokploy.com).
 
 ### Community Backers 🤝
 
+
 #### Organizations:
 
 [Sponsors on Open Collective](https://opencollective.com/dokploy)
@@ -106,15 +107,15 @@ For detailed documentation, visit [docs.dokploy.com](https://docs.dokploy.com).
 ### Contributors 🤝
 
 <a href="https://github.com/dokploy/dokploy/graphs/contributors">
-  <img src="https://contrib.rocks/image?repo=dokploy/dokploy" alt="Contributors" />
+  <img src="https://contrib.rocks/image?repo=dokploy/dokploy" />
 </a>
 
-## 📺 Video Tutorial
+## Video Tutorial
 
 <a href="https://youtu.be/mznYKPvhcfw">
   <img src="https://dokploy.com/banner.png" alt="Watch the video" width="400"/>
 </a>
 
-## 🤝 Contributing
+## Contributing
 
 Check out the [Contributing Guide](CONTRIBUTING.md) for more information.

apps/api/package.json

@@ -9,7 +9,6 @@
 		"typecheck": "tsc --noEmit"
 	},
 	"dependencies": {
-		"inngest": "3.40.1",
 		"@dokploy/server": "workspace:*",
 		"@hono/node-server": "^1.14.3",
 		"@hono/zod-validator": "0.3.0",
@@ -30,9 +29,5 @@
 		"tsx": "^4.16.2",
 		"typescript": "^5.8.3"
 	},
-	"packageManager": "pnpm@9.12.0",
-	"engines": {
-		"node": "^20.16.0",
-		"pnpm": ">=9.12.0"
-	}
+	"packageManager": "pnpm@9.5.0"
 }

apps/api/src/index.ts

@@ -2,79 +2,21 @@ import { serve } from "@hono/node-server";
 import { Hono } from "hono";
 import "dotenv/config";
 import { zValidator } from "@hono/zod-validator";
-import { Inngest } from "inngest";
-import { serve as serveInngest } from "inngest/hono";
+import { Queue } from "@nerimity/mimiqueue";
+import { createClient } from "redis";
 import { logger } from "./logger.js";
 import { type DeployJob, deployJobSchema } from "./schema.js";
 import { deploy } from "./utils.js";
 
 const app = new Hono();
-
-// Initialize Inngest client
-export const inngest = new Inngest({
-	id: "dokploy-deployments",
-	name: "Dokploy Deployment Service",
+const redisClient = createClient({
+	url: process.env.REDIS_URL,
 });
 
-export const deploymentFunction = inngest.createFunction(
-	{
-		id: "deploy-application",
-		name: "Deploy Application",
-		concurrency: [
-			{
-				key: "event.data.serverId",
-				limit: 1,
-			},
-		],
-		retries: 0,
-	},
-	{ event: "deployment/requested" },
-
-	async ({ event, step }) => {
-		const jobData = event.data as DeployJob;
-
-		return await step.run("execute-deployment", async () => {
-			logger.info("Deploying started");
-
-			try {
-				const result = await deploy(jobData);
-				logger.info("Deployment finished", result);
-
-				// Send success event
-				await inngest.send({
-					name: "deployment/completed",
-					data: {
-						...jobData,
-						result,
-						status: "success",
-					},
-				});
-
-				return result;
-			} catch (error) {
-				logger.error("Deployment failed", { jobData, error });
-
-				// Send failure event
-				await inngest.send({
-					name: "deployment/failed",
-					data: {
-						...jobData,
-						error: error instanceof Error ? error.message : String(error),
-						status: "failed",
-					},
-				});
-
-				throw error;
-			}
-		});
-	},
-);
-
 app.use(async (c, next) => {
-	if (c.req.path === "/health" || c.req.path === "/api/inngest") {
+	if (c.req.path === "/health") {
 		return next();
 	}
-
 	const authHeader = c.req.header("X-API-Key");
 
 	if (process.env.API_KEY !== authHeader) {
@@ -84,55 +26,36 @@ app.use(async (c, next) => {
 	return next();
 });
 
-app.post("/deploy", zValidator("json", deployJobSchema), async (c) => {
+app.post("/deploy", zValidator("json", deployJobSchema), (c) => {
 	const data = c.req.valid("json");
-	logger.info("Received deployment request", data);
-
-	try {
-		// Send event to Inngest instead of adding to Redis queue
-		await inngest.send({
-			name: "deployment/requested",
-			data,
-		});
-
-		logger.info("Deployment event sent to Inngest", {
-			serverId: data.serverId,
-		});
-
-		return c.json(
-			{
-				message: "Deployment Added to Inngest Queue",
-				serverId: data.serverId,
-			},
-			200,
-		);
-	} catch (error) {
-		console.log("error", error);
-		logger.error("Failed to send deployment event", error);
-		return c.json(
-			{
-				message: "Failed to queue deployment",
-				error: error instanceof Error ? error.message : String(error),
-			},
-			500,
-		);
-	}
+	queue.add(data, { groupName: data.serverId });
+	return c.json(
+		{
+			message: "Deployment Added",
+		},
+		200,
+	);
 });
 
 app.get("/health", async (c) => {
 	return c.json({ status: "ok" });
 });
 
-// Serve Inngest functions endpoint
-app.on(
-	["GET", "POST", "PUT"],
-	"/api/inngest",
-	serveInngest({
-		client: inngest,
-		functions: [deploymentFunction],
-	}),
-);
+const queue = new Queue({
+	name: "deployments",
+	process: async (job: DeployJob) => {
+		logger.info("Deploying job", job);
+		return await deploy(job);
+	},
+	redisClient,
+});
+
+(async () => {
+	await redisClient.connect();
+	await redisClient.flushAll();
+	logger.info("Redis Cleaned");
+})();
 
 const port = Number.parseInt(process.env.PORT || "3000");
-logger.info("Starting Deployments Server with Inngest ✅", port);
+logger.info("Starting Deployments Server ✅", port);
 serve({ fetch: app.fetch, port });

apps/api/src/utils.ts

@@ -64,7 +64,7 @@ export const deploy = async (job: DeployJob) => {
 				}
 			}
 		}
-	} catch (e) {
+	} catch (_) {
 		if (job.applicationType === "application") {
 			await updateApplicationStatus(job.applicationId, "error");
 		} else if (job.applicationType === "compose") {
@@ -76,8 +76,6 @@ export const deploy = async (job: DeployJob) => {
 				previewStatus: "error",
 			});
 		}
-
-		throw e;
 	}
 
 	return true;

apps/dokploy/__test__/compose/compose.test.ts

@@ -1,5 +1,5 @@
-import type { ComposeSpecification } from "@dokploy/server";
 import { addSuffixToAllProperties } from "@dokploy/server";
+import type { ComposeSpecification } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/config/config-root.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToConfigsRoot } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToConfigsRoot, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/config/config-service.test.ts

@@ -1,8 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToConfigsInServices } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import {
-	addSuffixToConfigsInServices,
-	generateRandomHash,
-} from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/config/config.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToAllConfigs } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToAllConfigs, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/domain/labels.test.ts

@@ -108,136 +108,4 @@ describe("createDomainLabels", () => {
 			"traefik.http.services.test-app-1-web.loadbalancer.server.port=3000",
 		);
 	});
-
-	it("should add stripPath middleware when stripPath is enabled", async () => {
-		const stripPathDomain = {
-			...baseDomain,
-			path: "/api",
-			stripPath: true,
-		};
-		const labels = await createDomainLabels(appName, stripPathDomain, "web");
-
-		expect(labels).toContain(
-			"traefik.http.middlewares.stripprefix-test-app-1.stripprefix.prefixes=/api",
-		);
-		expect(labels).toContain(
-			"traefik.http.routers.test-app-1-web.middlewares=stripprefix-test-app-1",
-		);
-	});
-
-	it("should add internalPath middleware when internalPath is set", async () => {
-		const internalPathDomain = {
-			...baseDomain,
-			internalPath: "/hello",
-		};
-		const webLabels = await createDomainLabels(
-			appName,
-			internalPathDomain,
-			"web",
-		);
-		const websecureLabels = await createDomainLabels(
-			appName,
-			internalPathDomain,
-			"websecure",
-		);
-
-		// Middleware definition should only appear in web entrypoint
-		expect(webLabels).toContain(
-			"traefik.http.middlewares.addprefix-test-app-1.addprefix.prefix=/hello",
-		);
-		expect(websecureLabels).not.toContain(
-			"traefik.http.middlewares.addprefix-test-app-1.addprefix.prefix=/hello",
-		);
-
-		// Both routers should reference the middleware
-		expect(webLabels).toContain(
-			"traefik.http.routers.test-app-1-web.middlewares=addprefix-test-app-1",
-		);
-		expect(websecureLabels).toContain(
-			"traefik.http.routers.test-app-1-websecure.middlewares=addprefix-test-app-1",
-		);
-	});
-
-	it("should combine HTTPS redirect with internalPath middleware in correct order", async () => {
-		const combinedDomain = {
-			...baseDomain,
-			https: true,
-			internalPath: "/hello",
-		};
-		const webLabels = await createDomainLabels(appName, combinedDomain, "web");
-		const websecureLabels = await createDomainLabels(
-			appName,
-			combinedDomain,
-			"websecure",
-		);
-
-		// Web entrypoint should have both middlewares with redirect first
-		expect(webLabels).toContain(
-			"traefik.http.routers.test-app-1-web.middlewares=redirect-to-https@file,addprefix-test-app-1",
-		);
-
-		// Websecure should only have the addprefix middleware
-		expect(websecureLabels).toContain(
-			"traefik.http.routers.test-app-1-websecure.middlewares=addprefix-test-app-1",
-		);
-
-		// Middleware definition should only appear once (in web)
-		expect(webLabels).toContain(
-			"traefik.http.middlewares.addprefix-test-app-1.addprefix.prefix=/hello",
-		);
-		expect(websecureLabels).not.toContain(
-			"traefik.http.middlewares.addprefix-test-app-1.addprefix.prefix=/hello",
-		);
-	});
-
-	it("should combine all middlewares in correct order", async () => {
-		const fullDomain = {
-			...baseDomain,
-			https: true,
-			path: "/api",
-			stripPath: true,
-			internalPath: "/hello",
-		};
-		const webLabels = await createDomainLabels(appName, fullDomain, "web");
-
-		// Should have all middleware definitions (only in web)
-		expect(webLabels).toContain(
-			"traefik.http.middlewares.stripprefix-test-app-1.stripprefix.prefixes=/api",
-		);
-		expect(webLabels).toContain(
-			"traefik.http.middlewares.addprefix-test-app-1.addprefix.prefix=/hello",
-		);
-
-		// Should have middlewares in correct order: redirect, stripprefix, addprefix
-		expect(webLabels).toContain(
-			"traefik.http.routers.test-app-1-web.middlewares=redirect-to-https@file,stripprefix-test-app-1,addprefix-test-app-1",
-		);
-	});
-
-	it("should not add middleware definitions for websecure entrypoint", async () => {
-		const internalPathDomain = {
-			...baseDomain,
-			path: "/api",
-			stripPath: true,
-			internalPath: "/hello",
-		};
-		const websecureLabels = await createDomainLabels(
-			appName,
-			internalPathDomain,
-			"websecure",
-		);
-
-		// Should not contain any middleware definitions
-		expect(websecureLabels).not.toContain(
-			"traefik.http.middlewares.stripprefix-test-app-1.stripprefix.prefixes=/api",
-		);
-		expect(websecureLabels).not.toContain(
-			"traefik.http.middlewares.addprefix-test-app-1.addprefix.prefix=/hello",
-		);
-
-		// But should reference the middlewares
-		expect(websecureLabels).toContain(
-			"traefik.http.routers.test-app-1-websecure.middlewares=stripprefix-test-app-1,addprefix-test-app-1",
-		);
-	});
 });

apps/dokploy/__test__/compose/network/network-root.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToNetworksRoot } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToNetworksRoot, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/network/network-service.test.ts

@@ -1,8 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToServiceNetworks } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import {
-	addSuffixToServiceNetworks,
-	generateRandomHash,
-} from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/network/network.test.ts

@@ -1,10 +1,10 @@
-import type { ComposeSpecification } from "@dokploy/server";
+import { generateRandomHash } from "@dokploy/server";
 import {
 	addSuffixToAllNetworks,
-	addSuffixToNetworksRoot,
 	addSuffixToServiceNetworks,
-	generateRandomHash,
 } from "@dokploy/server";
+import { addSuffixToNetworksRoot } from "@dokploy/server";
+import type { ComposeSpecification } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/secrets/secret-root.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToSecretsRoot } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToSecretsRoot, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/secrets/secret-services.test.ts

@@ -1,8 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToSecretsInServices } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import {
-	addSuffixToSecretsInServices,
-	generateRandomHash,
-} from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/secrets/secret.test.ts

@@ -1,5 +1,5 @@
-import type { ComposeSpecification } from "@dokploy/server";
 import { addSuffixToAllSecrets } from "@dokploy/server";
+import type { ComposeSpecification } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/service/service-container-name.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToServiceNames } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToServiceNames, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/service/service-depends-on.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToServiceNames } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToServiceNames, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/service/service-extends.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToServiceNames } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToServiceNames, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/service/service-links.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToServiceNames } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToServiceNames, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/service/service-names.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToServiceNames } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToServiceNames, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/service/service.test.ts

@@ -1,8 +1,8 @@
-import type { ComposeSpecification } from "@dokploy/server";
 import {
 	addSuffixToAllServiceNames,
 	addSuffixToServiceNames,
 } from "@dokploy/server";
+import type { ComposeSpecification } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/service/sevice-volumes-from.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToServiceNames } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToServiceNames, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/volume/volume-2.test.ts

@@ -1,9 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToAllVolumes, addSuffixToVolumesRoot } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import {
-	addSuffixToAllVolumes,
-	addSuffixToVolumesRoot,
-	generateRandomHash,
-} from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/volume/volume-root.test.ts

@@ -1,5 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToVolumesRoot } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { addSuffixToVolumesRoot, generateRandomHash } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/volume/volume-services.test.ts

@@ -1,8 +1,6 @@
+import { generateRandomHash } from "@dokploy/server";
+import { addSuffixToVolumesInServices } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import {
-	addSuffixToVolumesInServices,
-	generateRandomHash,
-} from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/compose/volume/volume.test.ts

@@ -1,5 +1,5 @@
-import type { ComposeSpecification } from "@dokploy/server";
 import { addSuffixToAllVolumes } from "@dokploy/server";
+import type { ComposeSpecification } from "@dokploy/server";
 import { load } from "js-yaml";
 import { expect, test } from "vitest";
 

apps/dokploy/__test__/deploy/github.test.ts

@@ -1,5 +1,5 @@
-import { describe, expect, it } from "vitest";
 import { extractCommitMessage } from "@/pages/api/deploy/[refreshToken]";
+import { describe, expect, it } from "vitest";
 
 describe("GitHub Webhook Skip CI", () => {
 	const mockGithubHeaders = {

apps/dokploy/__test__/drop/drop.test.test.ts

@@ -1,12 +1,12 @@
 import fs from "node:fs/promises";
 import path from "node:path";
+import { paths } from "@dokploy/server/constants";
+const { APPLICATIONS_PATH } = paths();
 import type { ApplicationNested } from "@dokploy/server";
 import { unzipDrop } from "@dokploy/server";
-import { paths } from "@dokploy/server/constants";
 import AdmZip from "adm-zip";
 import { afterAll, beforeAll, describe, expect, it, vi } from "vitest";
 
-const { APPLICATIONS_PATH } = paths();
 vi.mock("@dokploy/server/constants", async (importOriginal) => {
 	const actual = await importOriginal();
 	return {
@@ -25,12 +25,10 @@ if (typeof window === "undefined") {
 }
 
 const baseApp: ApplicationNested = {
-	railpackVersion: "0.2.2",
 	applicationId: "",
 	herokuVersion: "",
 	giteaBranch: "",
 	giteaBuildPath: "",
-	previewRequireCollaboratorPermissions: false,
 	giteaId: "",
 	giteaOwner: "",
 	giteaRepository: "",
@@ -143,7 +141,7 @@ describe("unzipDrop using real zip files", () => {
 			const outputPath = path.join(APPLICATIONS_PATH, baseApp.appName, "code");
 			const zip = new AdmZip("./__test__/drop/zips/single-file.zip");
 			console.log(`Output Path: ${outputPath}`);
-			const zipBuffer = zip.toBuffer() as Buffer<ArrayBuffer>;
+			const zipBuffer = zip.toBuffer();
 			const file = new File([zipBuffer], "single.zip");
 			await unzipDrop(file, baseApp);
 			const files = await fs.readdir(outputPath, { withFileTypes: true });

apps/dokploy/__test__/requests/request.test.ts

@@ -1,6 +1,5 @@
 import { parseRawConfig, processLogs } from "@dokploy/server";
 import { describe, expect, it } from "vitest";
-
 const sampleLogEntry = `{"ClientAddr":"172.19.0.1:56732","ClientHost":"172.19.0.1","ClientPort":"56732","ClientUsername":"-","DownstreamContentSize":0,"DownstreamStatus":304,"Duration":14729375,"OriginContentSize":0,"OriginDuration":14051833,"OriginStatus":304,"Overhead":677542,"RequestAddr":"s222-umami-c381af.traefik.me","RequestContentSize":0,"RequestCount":122,"RequestHost":"s222-umami-c381af.traefik.me","RequestMethod":"GET","RequestPath":"/dashboard?_rsc=1rugv","RequestPort":"-","RequestProtocol":"HTTP/1.1","RequestScheme":"http","RetryAttempts":0,"RouterName":"s222-umami-60e104-47-web@docker","ServiceAddr":"10.0.1.15:3000","ServiceName":"s222-umami-60e104-47-web@docker","ServiceURL":{"Scheme":"http","Opaque":"","User":null,"Host":"10.0.1.15:3000","Path":"","RawPath":"","ForceQuery":false,"RawQuery":"","Fragment":"","RawFragment":""},"StartLocal":"2024-08-25T04:34:37.306691884Z","StartUTC":"2024-08-25T04:34:37.306691884Z","entryPointName":"web","level":"info","msg":"","time":"2024-08-25T04:34:37Z"}`;
 
 describe("processLogs", () => {

apps/dokploy/__test__/traefik/traefik.test.ts

@@ -1,9 +1,10 @@
-import type { ApplicationNested, Domain, Redirect } from "@dokploy/server";
+import type { Domain } from "@dokploy/server";
+import type { Redirect } from "@dokploy/server";
+import type { ApplicationNested } from "@dokploy/server";
 import { createRouterConfig } from "@dokploy/server";
 import { expect, test } from "vitest";
 
 const baseApp: ApplicationNested = {
-	railpackVersion: "0.2.2",
 	rollbackActive: false,
 	applicationId: "",
 	herokuVersion: "",
@@ -17,7 +18,6 @@ const baseApp: ApplicationNested = {
 	appName: "",
 	autoDeploy: true,
 	enableSubmodules: false,
-	previewRequireCollaboratorPermissions: false,
 	serverId: "",
 	branch: null,
 	dockerBuildStage: "",

apps/dokploy/components/dashboard/application/advanced/cluster/modify-swarm-settings.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { HelpCircle, Settings } from "lucide-react";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Button } from "@/components/ui/button";
@@ -32,6 +26,12 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { HelpCircle, Settings } from "lucide-react";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const HealthCheckSwarmSchema = z
 	.object({
@@ -181,38 +181,21 @@ const addSwarmSettings = z.object({
 type AddSwarmSettings = z.infer<typeof addSwarmSettings>;
 
 interface Props {
-	id: string;
-	type: "postgres" | "mariadb" | "mongo" | "mysql" | "redis" | "application";
+	applicationId: string;
 }
 
-export const AddSwarmSettings = ({ id, type }: Props) => {
-	const queryMap = {
-		postgres: () =>
-			api.postgres.one.useQuery({ postgresId: id }, { enabled: !!id }),
-		redis: () => api.redis.one.useQuery({ redisId: id }, { enabled: !!id }),
-		mysql: () => api.mysql.one.useQuery({ mysqlId: id }, { enabled: !!id }),
-		mariadb: () =>
-			api.mariadb.one.useQuery({ mariadbId: id }, { enabled: !!id }),
-		application: () =>
-			api.application.one.useQuery({ applicationId: id }, { enabled: !!id }),
-		mongo: () => api.mongo.one.useQuery({ mongoId: id }, { enabled: !!id }),
-	};
-	const { data, refetch } = queryMap[type]
-		? queryMap[type]()
-		: api.mongo.one.useQuery({ mongoId: id }, { enabled: !!id });
+export const AddSwarmSettings = ({ applicationId }: Props) => {
+	const { data, refetch } = api.application.one.useQuery(
+		{
+			applicationId,
+		},
+		{
+			enabled: !!applicationId,
+		},
+	);
 
-	const mutationMap = {
-		postgres: () => api.postgres.update.useMutation(),
-		redis: () => api.redis.update.useMutation(),
-		mysql: () => api.mysql.update.useMutation(),
-		mariadb: () => api.mariadb.update.useMutation(),
-		application: () => api.application.update.useMutation(),
-		mongo: () => api.mongo.update.useMutation(),
-	};
-
-	const { mutateAsync, isError, error, isLoading } = mutationMap[type]
-		? mutationMap[type]()
-		: api.mongo.update.useMutation();
+	const { mutateAsync, isError, error, isLoading } =
+		api.application.update.useMutation();
 
 	const form = useForm<AddSwarmSettings>({
 		defaultValues: {
@@ -261,12 +244,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 
 	const onSubmit = async (data: AddSwarmSettings) => {
 		await mutateAsync({
-			applicationId: id || "",
-			postgresId: id || "",
-			redisId: id || "",
-			mysqlId: id || "",
-			mariadbId: id || "",
-			mongoId: id || "",
+			applicationId,
 			healthCheckSwarm: data.healthCheckSwarm,
 			restartPolicySwarm: data.restartPolicySwarm,
 			placementSwarm: data.placementSwarm,
@@ -292,7 +270,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 					Swarm Settings
 				</Button>
 			</DialogTrigger>
-			<DialogContent className="sm:max-w-5xl">
+			<DialogContent className="sm:max-w-5xl p-0">
 				<DialogHeader>
 					<DialogTitle>Swarm Settings</DialogTitle>
 					<DialogDescription>
@@ -300,10 +278,10 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 					</DialogDescription>
 				</DialogHeader>
 				{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
-				<div>
+				<div className="px-4">
 					<AlertBlock type="info">
-						Changing settings such as placements may cause the logs/monitoring,
-						backups and other features to be unavailable.
+						Changing settings such as placements may cause the logs/monitoring
+						to be unavailable.
 					</AlertBlock>
 				</div>
 
@@ -311,13 +289,13 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 					<form
 						id="hook-form-add-permissions"
 						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid  grid-cols-1 md:grid-cols-2  w-full gap-4 relative mt-4"
+						className="grid  grid-cols-1 md:grid-cols-2  w-full gap-4 relative"
 					>
 						<FormField
 							control={form.control}
 							name="healthCheckSwarm"
 							render={({ field }) => (
-								<FormItem className="relative ">
+								<FormItem className="relative max-lg:px-4 lg:pl-6 ">
 									<FormLabel>Health Check</FormLabel>
 									<TooltipProvider delayDuration={0}>
 										<Tooltip>
@@ -373,7 +351,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 							control={form.control}
 							name="restartPolicySwarm"
 							render={({ field }) => (
-								<FormItem className="relative ">
+								<FormItem className="relative  max-lg:px-4 lg:pr-6 ">
 									<FormLabel>Restart Policy</FormLabel>
 									<TooltipProvider delayDuration={0}>
 										<Tooltip>
@@ -427,7 +405,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 							control={form.control}
 							name="placementSwarm"
 							render={({ field }) => (
-								<FormItem className="relative ">
+								<FormItem className="relative   max-lg:px-4 lg:pl-6 ">
 									<FormLabel>Placement</FormLabel>
 									<TooltipProvider delayDuration={0}>
 										<Tooltip>
@@ -493,7 +471,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 							control={form.control}
 							name="updateConfigSwarm"
 							render={({ field }) => (
-								<FormItem className="relative ">
+								<FormItem className="relative  max-lg:px-4 lg:pr-6 ">
 									<FormLabel>Update Config</FormLabel>
 									<TooltipProvider delayDuration={0}>
 										<Tooltip>
@@ -551,7 +529,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 							control={form.control}
 							name="rollbackConfigSwarm"
 							render={({ field }) => (
-								<FormItem className="relative ">
+								<FormItem className="relative  max-lg:px-4 lg:pl-6 ">
 									<FormLabel>Rollback Config</FormLabel>
 									<TooltipProvider delayDuration={0}>
 										<Tooltip>
@@ -609,7 +587,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 							control={form.control}
 							name="modeSwarm"
 							render={({ field }) => (
-								<FormItem className="relative ">
+								<FormItem className="relative  max-lg:px-4 lg:pr-6 ">
 									<FormLabel>Mode</FormLabel>
 									<TooltipProvider delayDuration={0}>
 										<Tooltip>
@@ -672,7 +650,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 							control={form.control}
 							name="networkSwarm"
 							render={({ field }) => (
-								<FormItem className="relative ">
+								<FormItem className="relative max-lg:px-4 lg:pl-6 ">
 									<FormLabel>Network</FormLabel>
 									<TooltipProvider delayDuration={0}>
 										<Tooltip>
@@ -731,7 +709,7 @@ export const AddSwarmSettings = ({ id, type }: Props) => {
 							control={form.control}
 							name="labelsSwarm"
 							render={({ field }) => (
-								<FormItem className="relative ">
+								<FormItem className="relative max-lg:px-4 lg:pr-6 ">
 									<FormLabel>Labels</FormLabel>
 									<TooltipProvider delayDuration={0}>
 										<Tooltip>

apps/dokploy/components/dashboard/application/advanced/cluster/show-cluster-settings.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { Server } from "lucide-react";
-import Link from "next/link";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -33,57 +26,43 @@ import {
 	SelectValue,
 } from "@/components/ui/select";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Server } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 import { AddSwarmSettings } from "./modify-swarm-settings";
 
 interface Props {
-	id: string;
-	type: "postgres" | "mariadb" | "mongo" | "mysql" | "redis" | "application";
+	applicationId: string;
 }
 
 const AddRedirectchema = z.object({
 	replicas: z.number().min(1, "Replicas must be at least 1"),
-	registryId: z.string().optional(),
+	registryId: z.string(),
 });
 
 type AddCommand = z.infer<typeof AddRedirectchema>;
 
-export const ShowClusterSettings = ({ id, type }: Props) => {
-	const queryMap = {
-		postgres: () =>
-			api.postgres.one.useQuery({ postgresId: id }, { enabled: !!id }),
-		redis: () => api.redis.one.useQuery({ redisId: id }, { enabled: !!id }),
-		mysql: () => api.mysql.one.useQuery({ mysqlId: id }, { enabled: !!id }),
-		mariadb: () =>
-			api.mariadb.one.useQuery({ mariadbId: id }, { enabled: !!id }),
-		application: () =>
-			api.application.one.useQuery({ applicationId: id }, { enabled: !!id }),
-		mongo: () => api.mongo.one.useQuery({ mongoId: id }, { enabled: !!id }),
-	};
-	const { data, refetch } = queryMap[type]
-		? queryMap[type]()
-		: api.mongo.one.useQuery({ mongoId: id }, { enabled: !!id });
+export const ShowClusterSettings = ({ applicationId }: Props) => {
+	const { data } = api.application.one.useQuery(
+		{
+			applicationId,
+		},
+		{ enabled: !!applicationId },
+	);
+
 	const { data: registries } = api.registry.all.useQuery();
 
-	const mutationMap = {
-		postgres: () => api.postgres.update.useMutation(),
-		redis: () => api.redis.update.useMutation(),
-		mysql: () => api.mysql.update.useMutation(),
-		mariadb: () => api.mariadb.update.useMutation(),
-		application: () => api.application.update.useMutation(),
-		mongo: () => api.mongo.update.useMutation(),
-	};
+	const utils = api.useUtils();
 
-	const { mutateAsync, isLoading } = mutationMap[type]
-		? mutationMap[type]()
-		: api.mongo.update.useMutation();
+	const { mutateAsync, isLoading } = api.application.update.useMutation();
 
 	const form = useForm<AddCommand>({
 		defaultValues: {
-			...(type === "application" && data && "registryId" in data
-				? {
-						registryId: data?.registryId || "",
-					}
-				: {}),
+			registryId: data?.registryId || "",
 			replicas: data?.replicas || 1,
 		},
 		resolver: zodResolver(AddRedirectchema),
@@ -92,11 +71,7 @@ export const ShowClusterSettings = ({ id, type }: Props) => {
 	useEffect(() => {
 		if (data?.command) {
 			form.reset({
-				...(type === "application" && data && "registryId" in data
-					? {
-							registryId: data?.registryId || "",
-						}
-					: {}),
+				registryId: data?.registryId || "",
 				replicas: data?.replicas || 1,
 			});
 		}
@@ -104,25 +79,18 @@ export const ShowClusterSettings = ({ id, type }: Props) => {
 
 	const onSubmit = async (data: AddCommand) => {
 		await mutateAsync({
-			applicationId: id || "",
-			postgresId: id || "",
-			redisId: id || "",
-			mysqlId: id || "",
-			mariadbId: id || "",
-			mongoId: id || "",
-			...(type === "application"
-				? {
-						registryId:
-							data?.registryId === "none" || !data?.registryId
-								? null
-								: data?.registryId,
-					}
-				: {}),
+			applicationId,
+			registryId:
+				data?.registryId === "none" || !data?.registryId
+					? null
+					: data?.registryId,
 			replicas: data?.replicas,
 		})
 			.then(async () => {
 				toast.success("Command Updated");
-				await refetch();
+				await utils.application.one.invalidate({
+					applicationId,
+				});
 			})
 			.catch(() => {
 				toast.error("Error updating the command");
@@ -135,10 +103,10 @@ export const ShowClusterSettings = ({ id, type }: Props) => {
 				<div>
 					<CardTitle className="text-xl">Cluster Settings</CardTitle>
 					<CardDescription>
-						Modify swarm settings for the service.
+						Add the registry and the replicas of the application
 					</CardDescription>
 				</div>
-				<AddSwarmSettings id={id} type={type} />
+				<AddSwarmSettings applicationId={applicationId} />
 			</CardHeader>
 			<CardContent className="flex flex-col gap-4">
 				<AlertBlock type="info">
@@ -176,62 +144,58 @@ export const ShowClusterSettings = ({ id, type }: Props) => {
 							/>
 						</div>
 
-						{type === "application" && (
+						{registries && registries?.length === 0 ? (
+							<div className="pt-10">
+								<div className="flex flex-col items-center gap-3">
+									<Server className="size-8 text-muted-foreground" />
+									<span className="text-base text-muted-foreground">
+										To use a cluster feature, you need to configure at least a
+										registry first. Please, go to{" "}
+										<Link
+											href="/dashboard/settings/cluster"
+											className="text-foreground"
+										>
+											Settings
+										</Link>{" "}
+										to do so.
+									</span>
+								</div>
+							</div>
+						) : (
 							<>
-								{registries && registries?.length === 0 ? (
-									<div className="pt-10">
-										<div className="flex flex-col items-center gap-3">
-											<Server className="size-8 text-muted-foreground" />
-											<span className="text-base text-muted-foreground">
-												To use a cluster feature, you need to configure at least
-												a registry first. Please, go to{" "}
-												<Link
-													href="/dashboard/settings/cluster"
-													className="text-foreground"
-												>
-													Settings
-												</Link>{" "}
-												to do so.
-											</span>
-										</div>
-									</div>
-								) : (
-									<>
-										<FormField
-											control={form.control}
-											name="registryId"
-											render={({ field }) => (
-												<FormItem>
-													<FormLabel>Select a registry</FormLabel>
-													<Select
-														onValueChange={field.onChange}
-														defaultValue={field.value}
-													>
-														<SelectTrigger>
-															<SelectValue placeholder="Select a registry" />
-														</SelectTrigger>
-														<SelectContent>
-															<SelectGroup>
-																{registries?.map((registry) => (
-																	<SelectItem
-																		key={registry.registryId}
-																		value={registry.registryId}
-																	>
-																		{registry.registryName}
-																	</SelectItem>
-																))}
-																<SelectItem value={"none"}>None</SelectItem>
-																<SelectLabel>
-																	Registries ({registries?.length})
-																</SelectLabel>
-															</SelectGroup>
-														</SelectContent>
-													</Select>
-												</FormItem>
-											)}
-										/>
-									</>
-								)}
+								<FormField
+									control={form.control}
+									name="registryId"
+									render={({ field }) => (
+										<FormItem>
+											<FormLabel>Select a registry</FormLabel>
+											<Select
+												onValueChange={field.onChange}
+												defaultValue={field.value}
+											>
+												<SelectTrigger>
+													<SelectValue placeholder="Select a registry" />
+												</SelectTrigger>
+												<SelectContent>
+													<SelectGroup>
+														{registries?.map((registry) => (
+															<SelectItem
+																key={registry.registryId}
+																value={registry.registryId}
+															>
+																{registry.registryName}
+															</SelectItem>
+														))}
+														<SelectItem value={"none"}>None</SelectItem>
+														<SelectLabel>
+															Registries ({registries?.length})
+														</SelectLabel>
+													</SelectGroup>
+												</SelectContent>
+											</Select>
+										</FormItem>
+									)}
+								/>
 							</>
 						)}
 

apps/dokploy/components/dashboard/application/advanced/general/add-command.tsx

@@ -1,8 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { Button } from "@/components/ui/button";
 import {
 	Card,
@@ -21,7 +16,11 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
-
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 interface Props {
 	applicationId: string;
 }

apps/dokploy/components/dashboard/application/advanced/import/show-import.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { Code2, Globe2, HardDrive } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Button } from "@/components/ui/button";
@@ -33,6 +27,12 @@ import { ScrollArea } from "@/components/ui/scroll-area";
 import { Separator } from "@/components/ui/separator";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Code2, Globe2, HardDrive } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const ImportSchema = z.object({
 	base64: z.string(),

apps/dokploy/components/dashboard/application/advanced/ports/handle-ports.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { PenBoxIcon, PlusIcon } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm, useWatch } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -32,6 +26,12 @@ import {
 	SelectValue,
 } from "@/components/ui/select";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { PenBoxIcon, PlusIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const AddPortSchema = z.object({
 	publishedPort: z.number().int().min(1).max(65535),
@@ -80,11 +80,6 @@ export const HandlePorts = ({
 		resolver: zodResolver(AddPortSchema),
 	});
 
-	const publishMode = useWatch({
-		control: form.control,
-		name: "publishMode",
-	});
-
 	useEffect(() => {
 		form.reset({
 			publishedPort: data?.publishedPort ?? 0,
@@ -258,16 +253,6 @@ export const HandlePorts = ({
 						</div>
 					</form>
 
-					{publishMode === "host" && (
-						<AlertBlock type="warning" className="mt-4">
-							<strong>Host Mode Limitation:</strong> When using Host publish
-							mode, Docker Swarm has limitations that prevent proper container
-							updates during deployments. Old containers may not be replaced
-							automatically. Consider using Ingress mode instead, or be prepared
-							to manually stop/start the application after deployments.
-						</AlertBlock>
-					)}
-
 					<DialogFooter>
 						<Button
 							isLoading={isLoading}

apps/dokploy/components/dashboard/application/advanced/ports/show-port.tsx

@@ -1,5 +1,3 @@
-import { Rss, Trash2 } from "lucide-react";
-import { toast } from "sonner";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { DialogAction } from "@/components/shared/dialog-action";
 import { Button } from "@/components/ui/button";
@@ -11,8 +9,9 @@ import {
 	CardTitle,
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
+import { Rss, Trash2 } from "lucide-react";
+import { toast } from "sonner";
 import { HandlePorts } from "./handle-ports";
-
 interface Props {
 	applicationId: string;
 }

apps/dokploy/components/dashboard/application/advanced/redirects/handle-redirect.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { PenBoxIcon, PlusIcon } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -36,6 +30,12 @@ import {
 import { Separator } from "@/components/ui/separator";
 import { Switch } from "@/components/ui/switch";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { PenBoxIcon, PlusIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const AddRedirectchema = z.object({
 	regex: z.string().min(1, "Regex required"),

apps/dokploy/components/dashboard/application/advanced/redirects/show-redirects.tsx

@@ -1,5 +1,3 @@
-import { Split, Trash2 } from "lucide-react";
-import { toast } from "sonner";
 import { DialogAction } from "@/components/shared/dialog-action";
 import { Button } from "@/components/ui/button";
 import {
@@ -10,6 +8,8 @@ import {
 	CardTitle,
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
+import { Split, Trash2 } from "lucide-react";
+import { toast } from "sonner";
 import { HandleRedirect } from "./handle-redirect";
 
 interface Props {

apps/dokploy/components/dashboard/application/advanced/security/handle-security.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { PenBoxIcon, PlusIcon } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -25,6 +19,12 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { PenBoxIcon, PlusIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const AddSecuritychema = z.object({
 	username: z.string().min(1, "Username is required"),
@@ -151,7 +151,7 @@ export const HandleSecurity = ({
 									<FormItem>
 										<FormLabel>Password</FormLabel>
 										<FormControl>
-											<Input placeholder="test" type="password" {...field} />
+											<Input placeholder="test" {...field} />
 										</FormControl>
 
 										<FormMessage />

apps/dokploy/components/dashboard/application/advanced/security/show-security.tsx

@@ -1,7 +1,4 @@
-import { LockKeyhole, Trash2 } from "lucide-react";
-import { toast } from "sonner";
 import { DialogAction } from "@/components/shared/dialog-action";
-import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
 import { Button } from "@/components/ui/button";
 import {
 	Card,
@@ -10,9 +7,9 @@ import {
 	CardHeader,
 	CardTitle,
 } from "@/components/ui/card";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
+import { LockKeyhole, Trash2 } from "lucide-react";
+import { toast } from "sonner";
 import { HandleSecurity } from "./handle-security";
 
 interface Props {
@@ -61,18 +58,19 @@ export const ShowSecurity = ({ applicationId }: Props) => {
 						<div className="flex flex-col gap-6 ">
 							{data?.security.map((security) => (
 								<div key={security.securityId}>
-									<div className="flex w-full flex-col md:flex-row justify-between md:items-center gap-4 md:gap-10 border rounded-lg p-4">
-										<div className="grid grid-cols-1 md:grid-cols-2 flex-col gap-4 md:gap-8">
-											<div className="flex flex-col gap-2">
-												<Label>Username</Label>
-												<Input disabled value={security.username} />
+									<div className="flex w-full flex-col sm:flex-row justify-between sm:items-center gap-4 sm:gap-10 border rounded-lg p-4">
+										<div className="grid grid-cols-1 sm:grid-cols-2 flex-col gap-4 sm:gap-8">
+											<div className="flex flex-col gap-1">
+												<span className="font-medium">Username</span>
+												<span className="text-sm text-muted-foreground">
+													{security.username}
+												</span>
 											</div>
-											<div className="flex flex-col gap-2">
-												<Label>Password</Label>
-												<ToggleVisibilityInput
-													value={security.password}
-													disabled
-												/>
+											<div className="flex flex-col gap-1">
+												<span className="font-medium">Password</span>
+												<span className="text-sm text-muted-foreground">
+													{security.password}
+												</span>
 											</div>
 										</div>
 										<div className="flex flex-row gap-2">

apps/dokploy/components/dashboard/application/advanced/show-resources.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { InfoIcon } from "lucide-react";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -29,6 +23,12 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { InfoIcon } from "lucide-react";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const addResourcesSchema = z.object({
 	memoryReservation: z.string().optional(),

apps/dokploy/components/dashboard/application/advanced/traefik/show-traefik-config.tsx

@@ -1,4 +1,3 @@
-import { File, Loader2 } from "lucide-react";
 import { CodeEditor } from "@/components/shared/code-editor";
 import {
 	Card,
@@ -8,8 +7,8 @@ import {
 	CardTitle,
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
+import { File, Loader2 } from "lucide-react";
 import { UpdateTraefikConfig } from "./update-traefik-config";
-
 interface Props {
 	applicationId: string;
 }

apps/dokploy/components/dashboard/application/advanced/traefik/update-traefik-config.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import jsyaml from "js-yaml";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Button } from "@/components/ui/button";
@@ -25,6 +19,12 @@ import {
 	FormMessage,
 } from "@/components/ui/form";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import jsyaml from "js-yaml";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const UpdateTraefikConfigSchema = z.object({
 	traefikConfig: z.string(),

apps/dokploy/components/dashboard/application/advanced/volumes/add-volumes.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { PlusIcon } from "lucide-react";
-import type React from "react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Button } from "@/components/ui/button";
@@ -29,7 +22,13 @@ import { Label } from "@/components/ui/label";
 import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
-
+import { zodResolver } from "@hookform/resolvers/zod";
+import { PlusIcon } from "lucide-react";
+import type React from "react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 interface Props {
 	serviceId: string;
 	serviceType:

apps/dokploy/components/dashboard/application/advanced/volumes/show-volumes.tsx

@@ -1,5 +1,3 @@
-import { Package, Trash2 } from "lucide-react";
-import { toast } from "sonner";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { DialogAction } from "@/components/shared/dialog-action";
 import { Button } from "@/components/ui/button";
@@ -11,10 +9,11 @@ import {
 	CardTitle,
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
+import { Package, Trash2 } from "lucide-react";
+import { toast } from "sonner";
 import type { ServiceType } from "../show-resources";
 import { AddVolumes } from "./add-volumes";
 import { UpdateVolume } from "./update-volume";
-
 interface Props {
 	id: string;
 	type: ServiceType | "compose";
@@ -81,7 +80,7 @@ export const ShowVolumes = ({ id, type }: Props) => {
 										className="flex w-full flex-col sm:flex-row sm:items-center justify-between gap-4 sm:gap-10 border rounded-lg p-4"
 									>
 										{/* <Package className="size-8 self-center text-muted-foreground" /> */}
-										<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 flex-col gap-4 sm:gap-8">
+										<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 flex-col gap-4 sm:gap-8">
 											<div className="flex flex-col gap-1">
 												<span className="font-medium">Mount Type</span>
 												<span className="text-sm text-muted-foreground">
@@ -113,21 +112,21 @@ export const ShowVolumes = ({ id, type }: Props) => {
 													</span>
 												</div>
 											)}
-											{mount.type === "file" && (
+											{mount.type === "file" ? (
 												<div className="flex flex-col gap-1">
 													<span className="font-medium">File Path</span>
 													<span className="text-sm text-muted-foreground">
 														{mount.filePath}
 													</span>
 												</div>
+											) : (
+												<div className="flex flex-col gap-1">
+													<span className="font-medium">Mount Path</span>
+													<span className="text-sm text-muted-foreground">
+														{mount.mountPath}
+													</span>
+												</div>
 											)}
-
-											<div className="flex flex-col gap-1">
-												<span className="font-medium">Mount Path</span>
-												<span className="text-sm text-muted-foreground">
-													{mount.mountPath}
-												</span>
-											</div>
 										</div>
 										<div className="flex flex-row gap-1">
 											<UpdateVolume

apps/dokploy/components/dashboard/application/advanced/volumes/update-volume.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { PenBoxIcon } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Button } from "@/components/ui/button";
@@ -26,6 +20,12 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { PenBoxIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const mountSchema = z.object({
 	mountPath: z.string().min(1, "Mount path required"),

apps/dokploy/components/dashboard/application/build/show.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { Cog } from "lucide-react";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -21,6 +15,12 @@ import {
 import { Input } from "@/components/ui/input";
 import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Cog } from "lucide-react";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 export enum BuildType {
 	dockerfile = "dockerfile",
@@ -65,7 +65,6 @@ const mySchema = z.discriminatedUnion("buildType", [
 	}),
 	z.object({
 		buildType: z.literal(BuildType.railpack),
-		railpackVersion: z.string().nullable().default("0.2.2"),
 	}),
 	z.object({
 		buildType: z.literal(BuildType.static),
@@ -87,7 +86,6 @@ interface ApplicationData {
 	herokuVersion?: string | null;
 	publishDirectory?: string | null;
 	isStaticSpa?: boolean | null;
-	railpackVersion?: string | null | undefined;
 }
 
 function isValidBuildType(value: string): value is BuildType {
@@ -125,7 +123,6 @@ const resetData = (data: ApplicationData): AddTemplate => {
 		case BuildType.railpack:
 			return {
 				buildType: BuildType.railpack,
-				railpackVersion: data.railpackVersion || null,
 			};
 		default: {
 			const buildType = data.buildType as BuildType;
@@ -184,10 +181,6 @@ export const ShowBuildChooseForm = ({ applicationId }: Props) => {
 					: null,
 			isStaticSpa:
 				data.buildType === BuildType.static ? data.isStaticSpa : null,
-			railpackVersion:
-				data.buildType === BuildType.railpack
-					? data.railpackVersion || "0.2.2"
-					: null,
 		})
 			.then(async () => {
 				toast.success("Build type saved");
@@ -402,25 +395,6 @@ export const ShowBuildChooseForm = ({ applicationId }: Props) => {
 								)}
 							/>
 						)}
-						{buildType === BuildType.railpack && (
-							<FormField
-								control={form.control}
-								name="railpackVersion"
-								render={({ field }) => (
-									<FormItem>
-										<FormLabel>Railpack Version</FormLabel>
-										<FormControl>
-											<Input
-												placeholder="Railpack Version"
-												{...field}
-												value={field.value ?? ""}
-											/>
-										</FormControl>
-										<FormMessage />
-									</FormItem>
-								)}
-							/>
-						)}
 						<div className="flex w-full justify-end">
 							<Button isLoading={isLoading} type="submit">
 								Save

apps/dokploy/components/dashboard/application/deployments/cancel-queues.tsx

@@ -1,5 +1,3 @@
-import { Paintbrush } from "lucide-react";
-import { toast } from "sonner";
 import {
 	AlertDialog,
 	AlertDialogAction,
@@ -13,6 +11,8 @@ import {
 } from "@/components/ui/alert-dialog";
 import { Button } from "@/components/ui/button";
 import { api } from "@/utils/api";
+import { Paintbrush } from "lucide-react";
+import { toast } from "sonner";
 
 interface Props {
 	id: string;

apps/dokploy/components/dashboard/application/deployments/refresh-token.tsx

@@ -1,5 +1,3 @@
-import { RefreshCcw } from "lucide-react";
-import { toast } from "sonner";
 import {
 	AlertDialog,
 	AlertDialogAction,
@@ -12,6 +10,8 @@ import {
 	AlertDialogTrigger,
 } from "@/components/ui/alert-dialog";
 import { api } from "@/utils/api";
+import { RefreshCcw } from "lucide-react";
+import { toast } from "sonner";
 
 interface Props {
 	id: string;

apps/dokploy/components/dashboard/application/deployments/show-deployment.tsx

@@ -1,5 +1,3 @@
-import { Loader2 } from "lucide-react";
-import { useEffect, useRef, useState } from "react";
 import { Badge } from "@/components/ui/badge";
 import { Checkbox } from "@/components/ui/checkbox";
 import {
@@ -9,6 +7,8 @@ import {
 	DialogHeader,
 	DialogTitle,
 } from "@/components/ui/dialog";
+import { Loader2 } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
 import { TerminalLine } from "../../docker/logs/terminal-line";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
 

apps/dokploy/components/dashboard/application/deployments/show-deployments-modal.tsx

@@ -1,7 +1,8 @@
-import { useState } from "react";
 import { Button } from "@/components/ui/button";
 import { Dialog, DialogContent, DialogTrigger } from "@/components/ui/dialog";
+
 import type { RouterOutputs } from "@/utils/api";
+import { useState } from "react";
 import { ShowDeployment } from "../deployments/show-deployment";
 import { ShowDeployments } from "./show-deployments";
 

apps/dokploy/components/dashboard/application/deployments/show-deployments.tsx

@@ -1,8 +1,4 @@
-import { Clock, Loader2, RefreshCcw, RocketIcon, Settings } from "lucide-react";
-import React, { useEffect, useState } from "react";
-import { toast } from "sonner";
 import { DateTooltip } from "@/components/shared/date-tooltip";
-import { DialogAction } from "@/components/shared/dialog-action";
 import { StatusTooltip } from "@/components/shared/status-tooltip";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -13,11 +9,15 @@ import {
 	CardHeader,
 	CardTitle,
 } from "@/components/ui/card";
-import { api, type RouterOutputs } from "@/utils/api";
-import { ShowRollbackSettings } from "../rollbacks/show-rollback-settings";
+import { type RouterOutputs, api } from "@/utils/api";
+import { Clock, Loader2, RocketIcon, Settings, RefreshCcw } from "lucide-react";
+import React, { useEffect, useState } from "react";
 import { CancelQueues } from "./cancel-queues";
 import { RefreshToken } from "./refresh-token";
 import { ShowDeployment } from "./show-deployment";
+import { ShowRollbackSettings } from "../rollbacks/show-rollback-settings";
+import { DialogAction } from "@/components/shared/dialog-action";
+import { toast } from "sonner";
 
 interface Props {
 	id: string;

apps/dokploy/components/dashboard/application/domains/dns-helper-modal.tsx

@@ -1,5 +1,3 @@
-import { Copy, HelpCircle, Server } from "lucide-react";
-import { toast } from "sonner";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -10,6 +8,8 @@ import {
 	DialogTitle,
 	DialogTrigger,
 } from "@/components/ui/dialog";
+import { Copy, HelpCircle, Server } from "lucide-react";
+import { toast } from "sonner";
 
 interface Props {
 	domain: {

apps/dokploy/components/dashboard/application/domains/handle-domain.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { DatabaseZap, Dices, RefreshCw } from "lucide-react";
-import Link from "next/link";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import z from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -41,6 +34,14 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+
+import { zodResolver } from "@hookform/resolvers/zod";
+import { DatabaseZap, Dices, RefreshCw } from "lucide-react";
+import Link from "next/link";
+import z from "zod";
 
 export type CacheType = "fetch" | "cache";
 
@@ -122,7 +123,6 @@ interface Props {
 export const AddDomain = ({ id, type, domainId = "", children }: Props) => {
 	const [isOpen, setIsOpen] = useState(false);
 	const [cacheType, setCacheType] = useState<CacheType>("cache");
-	const [isManualInput, setIsManualInput] = useState(false);
 
 	const utils = api.useUtils();
 	const { data, refetch } = api.domain.one.useQuery(
@@ -325,126 +325,46 @@ export const AddDomain = ({ id, type, domainId = "", children }: Props) => {
 													<FormItem className="w-full">
 														<FormLabel>Service Name</FormLabel>
 														<div className="flex gap-2">
-															{isManualInput ? (
+															<Select
+																onValueChange={field.onChange}
+																defaultValue={field.value || ""}
+															>
 																<FormControl>
-																	<Input
-																		placeholder="Enter service name manually"
-																		{...field}
-																		className="w-full"
-																	/>
+																	<SelectTrigger>
+																		<SelectValue placeholder="Select a service name" />
+																	</SelectTrigger>
 																</FormControl>
-															) : (
-																<Select
-																	onValueChange={field.onChange}
-																	defaultValue={field.value || ""}
-																>
-																	<FormControl>
-																		<SelectTrigger>
-																			<SelectValue placeholder="Select a service name" />
-																		</SelectTrigger>
-																	</FormControl>
 
-																	<SelectContent>
-																		{services?.map((service, index) => (
-																			<SelectItem
-																				value={service}
-																				key={`${service}-${index}`}
-																			>
-																				{service}
-																			</SelectItem>
-																		))}
-																		<SelectItem value="none" disabled>
-																			Empty
+																<SelectContent>
+																	{services?.map((service, index) => (
+																		<SelectItem
+																			value={service}
+																			key={`${service}-${index}`}
+																		>
+																			{service}
 																		</SelectItem>
-																	</SelectContent>
-																</Select>
-															)}
-															{!isManualInput && (
-																<>
-																	<TooltipProvider delayDuration={0}>
-																		<Tooltip>
-																			<TooltipTrigger asChild>
-																				<Button
-																					variant="secondary"
-																					type="button"
-																					isLoading={isLoadingServices}
-																					onClick={() => {
-																						if (cacheType === "fetch") {
-																							refetchServices();
-																						} else {
-																							setCacheType("fetch");
-																						}
-																					}}
-																				>
-																					<RefreshCw className="size-4 text-muted-foreground" />
-																				</Button>
-																			</TooltipTrigger>
-																			<TooltipContent
-																				side="left"
-																				sideOffset={5}
-																				className="max-w-[10rem]"
-																			>
-																				<p>
-																					Fetch: Will clone the repository and
-																					load the services
-																				</p>
-																			</TooltipContent>
-																		</Tooltip>
-																	</TooltipProvider>
-																	<TooltipProvider delayDuration={0}>
-																		<Tooltip>
-																			<TooltipTrigger asChild>
-																				<Button
-																					variant="secondary"
-																					type="button"
-																					isLoading={isLoadingServices}
-																					onClick={() => {
-																						if (cacheType === "cache") {
-																							refetchServices();
-																						} else {
-																							setCacheType("cache");
-																						}
-																					}}
-																				>
-																					<DatabaseZap className="size-4 text-muted-foreground" />
-																				</Button>
-																			</TooltipTrigger>
-																			<TooltipContent
-																				side="left"
-																				sideOffset={5}
-																				className="max-w-[10rem]"
-																			>
-																				<p>
-																					Cache: If you previously deployed this
-																					compose, it will read the services
-																					from the last deployment/fetch from
-																					the repository
-																				</p>
-																			</TooltipContent>
-																		</Tooltip>
-																	</TooltipProvider>
-																</>
-															)}
+																	))}
+																	<SelectItem value="none" disabled>
+																		Empty
+																	</SelectItem>
+																</SelectContent>
+															</Select>
 															<TooltipProvider delayDuration={0}>
 																<Tooltip>
 																	<TooltipTrigger asChild>
 																		<Button
 																			variant="secondary"
 																			type="button"
+																			isLoading={isLoadingServices}
 																			onClick={() => {
-																				setIsManualInput(!isManualInput);
-																				if (!isManualInput) {
-																					field.onChange("");
+																				if (cacheType === "fetch") {
+																					refetchServices();
+																				} else {
+																					setCacheType("fetch");
 																				}
 																			}}
 																		>
-																			{isManualInput ? (
-																				<RefreshCw className="size-4 text-muted-foreground" />
-																			) : (
-																				<span className="text-xs text-muted-foreground">
-																					Manual
-																				</span>
-																			)}
+																			<RefreshCw className="size-4 text-muted-foreground" />
 																		</Button>
 																	</TooltipTrigger>
 																	<TooltipContent
@@ -453,9 +373,40 @@ export const AddDomain = ({ id, type, domainId = "", children }: Props) => {
 																		className="max-w-[10rem]"
 																	>
 																		<p>
-																			{isManualInput
-																				? "Switch to service selection"
-																				: "Enter service name manually"}
+																			Fetch: Will clone the repository and load
+																			the services
+																		</p>
+																	</TooltipContent>
+																</Tooltip>
+															</TooltipProvider>
+															<TooltipProvider delayDuration={0}>
+																<Tooltip>
+																	<TooltipTrigger asChild>
+																		<Button
+																			variant="secondary"
+																			type="button"
+																			isLoading={isLoadingServices}
+																			onClick={() => {
+																				if (cacheType === "cache") {
+																					refetchServices();
+																				} else {
+																					setCacheType("cache");
+																				}
+																			}}
+																		>
+																			<DatabaseZap className="size-4 text-muted-foreground" />
+																		</Button>
+																	</TooltipTrigger>
+																	<TooltipContent
+																		side="left"
+																		sideOffset={5}
+																		className="max-w-[10rem]"
+																	>
+																		<p>
+																			Cache: If you previously deployed this
+																			compose, it will read the services from
+																			the last deployment/fetch from the
+																			repository
 																		</p>
 																	</TooltipContent>
 																</Tooltip>

apps/dokploy/components/dashboard/application/domains/show-domains.tsx

@@ -1,18 +1,3 @@
-import {
-	CheckCircle2,
-	ExternalLink,
-	GlobeIcon,
-	InfoIcon,
-	Loader2,
-	PenBoxIcon,
-	RefreshCw,
-	Server,
-	Trash2,
-	XCircle,
-} from "lucide-react";
-import Link from "next/link";
-import { useState } from "react";
-import { toast } from "sonner";
 import { DialogAction } from "@/components/shared/dialog-action";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -30,6 +15,21 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import {
+	CheckCircle2,
+	ExternalLink,
+	GlobeIcon,
+	InfoIcon,
+	Loader2,
+	PenBoxIcon,
+	RefreshCw,
+	Server,
+	Trash2,
+	XCircle,
+} from "lucide-react";
+import Link from "next/link";
+import { useState } from "react";
+import { toast } from "sonner";
 import { DnsHelperModal } from "./dns-helper-modal";
 import { AddDomain } from "./handle-domain";
 

apps/dokploy/components/dashboard/application/environment/show-enviroment.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { EyeIcon, EyeOffIcon } from "lucide-react";
-import { type CSSProperties, useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Button } from "@/components/ui/button";
 import {
@@ -22,6 +16,12 @@ import {
 } from "@/components/ui/form";
 import { Toggle } from "@/components/ui/toggle";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { EyeIcon, EyeOffIcon } from "lucide-react";
+import { type CSSProperties, useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 import type { ServiceType } from "../advanced/show-resources";
 
 const addEnvironmentSchema = z.object({

apps/dokploy/components/dashboard/application/environment/show.tsx

@@ -1,13 +1,13 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
 import { Form } from "@/components/ui/form";
 import { Secrets } from "@/components/ui/secrets";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const addEnvironmentSchema = z.object({
 	env: z.string(),

apps/dokploy/components/dashboard/application/general/generic/save-bitbucket-provider.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, X } from "lucide-react";
-import Link from "next/link";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { BitbucketIcon } from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Badge } from "@/components/ui/badge";
@@ -47,6 +40,13 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CheckIcon, ChevronsUpDown, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const BitbucketProviderSchema = z.object({
 	buildPath: z.string().min(1, "Path is required").default("/"),

apps/dokploy/components/dashboard/application/general/generic/save-docker-provider.tsx

@@ -1,8 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { Button } from "@/components/ui/button";
 import {
 	Form,
@@ -14,6 +9,11 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const DockerProviderSchema = z.object({
 	dockerImage: z.string().min(1, {

apps/dokploy/components/dashboard/application/general/generic/save-drag-n-drop.tsx

@@ -1,8 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { TrashIcon } from "lucide-react";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
 import { Button } from "@/components/ui/button";
 import { Dropzone } from "@/components/ui/dropzone";
 import {
@@ -16,6 +11,11 @@ import {
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
 import { type UploadFile, uploadFileSchema } from "@/utils/schema";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { TrashIcon } from "lucide-react";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
 
 interface Props {
 	applicationId: string;

apps/dokploy/components/dashboard/application/general/generic/save-git-provider.tsx

@@ -1,13 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { KeyRoundIcon, LockIcon, X } from "lucide-react";
-import Link from "next/link";
-import { useRouter } from "next/router";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
-import { GitIcon } from "@/components/icons/data-tools-icons";
-import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import {
 	Form,
@@ -35,6 +25,17 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { KeyRoundIcon, LockIcon, X } from "lucide-react";
+import Link from "next/link";
+import { useRouter } from "next/router";
+
+import { GitIcon } from "@/components/icons/data-tools-icons";
+import { Badge } from "@/components/ui/badge";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const GitProviderSchema = z.object({
 	buildPath: z.string().min(1, "Path is required").default("/"),

apps/dokploy/components/dashboard/application/general/generic/save-gitea-provider.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, HelpCircle, Plus, X } from "lucide-react";
-import Link from "next/link";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { GiteaIcon } from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Badge } from "@/components/ui/badge";
@@ -47,6 +40,13 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CheckIcon, ChevronsUpDown, HelpCircle, Plus, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 interface GiteaRepository {
 	name: string;

apps/dokploy/components/dashboard/application/general/generic/save-github-provider.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, HelpCircle, Plus, X } from "lucide-react";
-import Link from "next/link";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { GithubIcon } from "@/components/icons/data-tools-icons";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -46,6 +39,13 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CheckIcon, ChevronsUpDown, HelpCircle, Plus, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const GithubProviderSchema = z.object({
 	buildPath: z.string().min(1, "Path is required").default("/"),

apps/dokploy/components/dashboard/application/general/generic/save-gitlab-provider.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, HelpCircle, Plus, X } from "lucide-react";
-import Link from "next/link";
-import { useEffect, useMemo } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { GitlabIcon } from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Badge } from "@/components/ui/badge";
@@ -47,6 +40,13 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CheckIcon, ChevronsUpDown, HelpCircle, Plus, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect, useMemo } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const GitlabProviderSchema = z.object({
 	buildPath: z.string().min(1, "Path is required").default("/"),

apps/dokploy/components/dashboard/application/general/generic/show.tsx

@@ -1,7 +1,3 @@
-import { GitBranch, Loader2, UploadCloud } from "lucide-react";
-import Link from "next/link";
-import { useState } from "react";
-import { toast } from "sonner";
 import { SaveDockerProvider } from "@/components/dashboard/application/general/generic/save-docker-provider";
 import { SaveGitProvider } from "@/components/dashboard/application/general/generic/save-git-provider";
 import { SaveGiteaProvider } from "@/components/dashboard/application/general/generic/save-gitea-provider";
@@ -9,14 +5,18 @@ import { SaveGithubProvider } from "@/components/dashboard/application/general/g
 import {
 	BitbucketIcon,
 	DockerIcon,
+	GitIcon,
 	GiteaIcon,
 	GithubIcon,
-	GitIcon,
 	GitlabIcon,
 } from "@/components/icons/data-tools-icons";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { api } from "@/utils/api";
+import { GitBranch, Loader2, UploadCloud } from "lucide-react";
+import Link from "next/link";
+import { useState } from "react";
+import { toast } from "sonner";
 import { SaveBitbucketProvider } from "./save-bitbucket-provider";
 import { SaveDragNDrop } from "./save-drag-n-drop";
 import { SaveGitlabProvider } from "./save-gitlab-provider";

apps/dokploy/components/dashboard/application/general/generic/unauthorized-git-provider.tsx

@@ -1,9 +1,8 @@
-import { AlertCircle, GitBranch, Unlink } from "lucide-react";
 import {
 	BitbucketIcon,
+	GitIcon,
 	GiteaIcon,
 	GithubIcon,
-	GitIcon,
 	GitlabIcon,
 } from "@/components/icons/data-tools-icons";
 import { DialogAction } from "@/components/shared/dialog-action";
@@ -11,6 +10,7 @@ import { Alert, AlertDescription } from "@/components/ui/alert";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import type { RouterOutputs } from "@/utils/api";
+import { AlertCircle, GitBranch, Unlink } from "lucide-react";
 
 interface Props {
 	service:

apps/dokploy/components/dashboard/application/general/show.tsx

@@ -1,14 +1,3 @@
-import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import {
-	Ban,
-	CheckCircle2,
-	Hammer,
-	RefreshCcw,
-	Rocket,
-	Terminal,
-} from "lucide-react";
-import { useRouter } from "next/router";
-import { toast } from "sonner";
 import { ShowBuildChooseForm } from "@/components/dashboard/application/build/show";
 import { ShowProviderForm } from "@/components/dashboard/application/general/generic/show";
 import { DialogAction } from "@/components/shared/dialog-action";
@@ -22,8 +11,18 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import {
+	Ban,
+	CheckCircle2,
+	Hammer,
+	RefreshCcw,
+	Rocket,
+	Terminal,
+} from "lucide-react";
+import { useRouter } from "next/router";
+import { toast } from "sonner";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";
-
 interface Props {
 	applicationId: string;
 }

apps/dokploy/components/dashboard/application/logs/show.tsx

@@ -1,6 +1,3 @@
-import { Loader2 } from "lucide-react";
-import dynamic from "next/dynamic";
-import { useEffect, useState } from "react";
 import { Badge } from "@/components/ui/badge";
 import {
 	Card,
@@ -21,6 +18,9 @@ import {
 } from "@/components/ui/select";
 import { Switch } from "@/components/ui/switch";
 import { api } from "@/utils/api";
+import { Loader2 } from "lucide-react";
+import dynamic from "next/dynamic";
+import { useEffect, useState } from "react";
 export const DockerLogs = dynamic(
 	() =>
 		import("@/components/dashboard/docker/logs/docker-logs-id").then(

apps/dokploy/components/dashboard/application/preview-deployments/add-preview-domain.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { Dices } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import type z from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -39,8 +33,15 @@ import {
 	TooltipProvider,
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
-import { domain } from "@/server/db/validations/domain";
 import { api } from "@/utils/api";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+
+import { domain } from "@/server/db/validations/domain";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Dices } from "lucide-react";
+import type z from "zod";
 
 type Domain = z.infer<typeof domain>;
 

apps/dokploy/components/dashboard/application/preview-deployments/show-preview-deployments.tsx

@@ -1,13 +1,3 @@
-import {
-	ExternalLink,
-	FileText,
-	GitPullRequest,
-	Loader2,
-	PenSquare,
-	RocketIcon,
-	Trash2,
-} from "lucide-react";
-import { toast } from "sonner";
 import { GithubIcon } from "@/components/icons/data-tools-icons";
 import { DateTooltip } from "@/components/shared/date-tooltip";
 import { DialogAction } from "@/components/shared/dialog-action";
@@ -23,6 +13,16 @@ import {
 } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
+import {
+	ExternalLink,
+	FileText,
+	GitPullRequest,
+	Loader2,
+	PenSquare,
+	RocketIcon,
+	Trash2,
+} from "lucide-react";
+import { toast } from "sonner";
 import { ShowModalLogs } from "../../settings/web-server/show-modal-logs";
 import { ShowDeploymentsModal } from "../deployments/show-deployments-modal";
 import { AddPreviewDomain } from "./add-preview-domain";

apps/dokploy/components/dashboard/application/preview-deployments/show-preview-settings.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { Settings2 } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { Button } from "@/components/ui/button";
 import {
 	Dialog,
@@ -34,6 +28,12 @@ import {
 } from "@/components/ui/select";
 import { Switch } from "@/components/ui/switch";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Settings2 } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const schema = z
 	.object({
@@ -46,7 +46,6 @@ const schema = z
 		previewPath: z.string(),
 		previewCertificateType: z.enum(["letsencrypt", "none", "custom"]),
 		previewCustomCertResolver: z.string().optional(),
-		previewRequireCollaboratorPermissions: z.boolean(),
 	})
 	.superRefine((input, ctx) => {
 		if (
@@ -84,7 +83,6 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 			previewHttps: false,
 			previewPath: "/",
 			previewCertificateType: "none",
-			previewRequireCollaboratorPermissions: true,
 		},
 		resolver: zodResolver(schema),
 	});
@@ -107,8 +105,6 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 				previewPath: data.previewPath || "/",
 				previewCertificateType: data.previewCertificateType || "none",
 				previewCustomCertResolver: data.previewCustomCertResolver || "",
-				previewRequireCollaboratorPermissions:
-					data.previewRequireCollaboratorPermissions || true,
 			});
 		}
 	}, [data]);
@@ -125,8 +121,6 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 			previewPath: formData.previewPath,
 			previewCertificateType: formData.previewCertificateType,
 			previewCustomCertResolver: formData.previewCustomCertResolver,
-			previewRequireCollaboratorPermissions:
-				formData.previewRequireCollaboratorPermissions,
 		})
 			.then(() => {
 				toast.success("Preview Deployments settings updated");
@@ -318,37 +312,6 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 									</div>
 								</div>
 
-								<div className="grid gap-4 lg:grid-cols-2">
-									<FormField
-										control={form.control}
-										name="previewRequireCollaboratorPermissions"
-										render={({ field }) => (
-											<FormItem className="flex flex-row items-center justify-between p-3 mt-4 border rounded-lg shadow-sm col-span-2">
-												<div className="space-y-0.5">
-													<FormLabel>
-														Require Collaborator Permissions
-													</FormLabel>
-													<FormDescription>
-														Require collaborator permissions to preview
-														deployments, valid roles are:
-														<ul>
-															<li>Admin</li>
-															<li>Maintain</li>
-															<li>Write</li>
-														</ul>
-													</FormDescription>
-												</div>
-												<FormControl>
-													<Switch
-														checked={field.value}
-														onCheckedChange={field.onChange}
-													/>
-												</FormControl>
-											</FormItem>
-										)}
-									/>
-								</div>
-
 								<FormField
 									control={form.control}
 									name="env"

apps/dokploy/components/dashboard/application/rollbacks/show-rollback-settings.tsx

@@ -1,8 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -23,6 +18,11 @@ import {
 } from "@/components/ui/form";
 import { Switch } from "@/components/ui/switch";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const formSchema = z.object({
 	rollbackActive: z.boolean(),

apps/dokploy/components/dashboard/application/schedules/handle-schedules.tsx

@@ -1,15 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import {
-	DatabaseZap,
-	Info,
-	PenBoxIcon,
-	PlusCircle,
-	RefreshCw,
-} from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Button } from "@/components/ui/button";
@@ -47,6 +35,18 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import {
+	DatabaseZap,
+	Info,
+	PenBoxIcon,
+	PlusCircle,
+	RefreshCw,
+} from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 import type { CacheType } from "../domains/handle-domain";
 
 export const commonCronExpressions = [

apps/dokploy/components/dashboard/application/schedules/show-schedules.tsx

@@ -1,12 +1,3 @@
-import {
-	ClipboardList,
-	Clock,
-	Loader2,
-	Play,
-	Terminal,
-	Trash2,
-} from "lucide-react";
-import { toast } from "sonner";
 import { DialogAction } from "@/components/shared/dialog-action";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -24,6 +15,15 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import {
+	ClipboardList,
+	Clock,
+	Loader2,
+	Play,
+	Terminal,
+	Trash2,
+} from "lucide-react";
+import { toast } from "sonner";
 import { ShowDeploymentsModal } from "../deployments/show-deployments-modal";
 import { HandleSchedules } from "./handle-schedules";
 

apps/dokploy/components/dashboard/application/update-application.tsx

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { PenBoxIcon } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -26,6 +20,12 @@ import {
 import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { PenBoxIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const updateApplicationSchema = z.object({
 	name: z.string().min(1, {

apps/dokploy/components/dashboard/application/volume-backups/handle-volume-backups.tsx

@@ -1,15 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import {
-	DatabaseZap,
-	Info,
-	PenBoxIcon,
-	PlusCircle,
-	RefreshCw,
-} from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -46,6 +34,18 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import {
+	DatabaseZap,
+	Info,
+	PenBoxIcon,
+	PlusCircle,
+	RefreshCw,
+} from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 import type { CacheType } from "../domains/handle-domain";
 import { commonCronExpressions } from "../schedules/handle-schedules";
 

apps/dokploy/components/dashboard/application/volume-backups/restore-volume-backups.tsx

@@ -1,12 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import copy from "copy-to-clipboard";
-import { debounce } from "lodash";
-import { CheckIcon, ChevronsUpDown, Copy, RotateCcw } from "lucide-react";
-import { useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
-import { AlertBlock } from "@/components/shared/alert-block";
 import { DrawerLogs } from "@/components/shared/drawer-logs";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -43,8 +34,17 @@ import {
 import { ScrollArea } from "@/components/ui/scroll-area";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
-import { formatBytes } from "../../database/backups/restore-backup";
+import { zodResolver } from "@hookform/resolvers/zod";
+import copy from "copy-to-clipboard";
+import { debounce } from "lodash";
+import { CheckIcon, ChevronsUpDown, Copy, RotateCcw } from "lucide-react";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
+import { formatBytes } from "../../database/backups/restore-backup";
+import { AlertBlock } from "@/components/shared/alert-block";
 
 interface Props {
 	id: string;

apps/dokploy/components/dashboard/application/volume-backups/show-volume-backups.tsx

@@ -1,11 +1,3 @@
-import {
-	ClipboardList,
-	DatabaseBackup,
-	Loader2,
-	Play,
-	Trash2,
-} from "lucide-react";
-import { toast } from "sonner";
 import { DialogAction } from "@/components/shared/dialog-action";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -23,8 +15,16 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
-import { ShowDeploymentsModal } from "../deployments/show-deployments-modal";
+import {
+	ClipboardList,
+	DatabaseBackup,
+	Loader2,
+	Play,
+	Trash2,
+} from "lucide-react";
+import { toast } from "sonner";
 import { HandleVolumeBackups } from "./handle-volume-backups";
+import { ShowDeploymentsModal } from "../deployments/show-deployments-modal";
 import { RestoreVolumeBackups } from "./restore-volume-backups";
 
 interface Props {

apps/dokploy/components/dashboard/compose/advanced/add-command.tsx

@@ -1,8 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -23,7 +18,11 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
-
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 interface Props {
 	composeId: string;
 }

apps/dokploy/components/dashboard/compose/advanced/add-isolation.tsx

@@ -1,241 +0,0 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { AlertTriangle, Loader2 } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
-import { AlertBlock } from "@/components/shared/alert-block";
-import { CodeEditor } from "@/components/shared/code-editor";
-import { Button } from "@/components/ui/button";
-import {
-	Card,
-	CardContent,
-	CardDescription,
-	CardHeader,
-	CardTitle,
-} from "@/components/ui/card";
-import {
-	Dialog,
-	DialogContent,
-	DialogDescription,
-	DialogHeader,
-	DialogTitle,
-} from "@/components/ui/dialog";
-import {
-	Form,
-	FormControl,
-	FormDescription,
-	FormField,
-	FormItem,
-	FormLabel,
-} from "@/components/ui/form";
-
-import { Switch } from "@/components/ui/switch";
-import { api } from "@/utils/api";
-
-interface Props {
-	composeId: string;
-}
-
-// Schema for Isolated Deployment
-const isolatedSchema = z.object({
-	isolatedDeployment: z.boolean().optional(),
-});
-
-type IsolatedSchema = z.infer<typeof isolatedSchema>;
-
-export const IsolatedDeploymentTab = ({ composeId }: Props) => {
-	const utils = api.useUtils();
-	const [compose, setCompose] = useState<string>("");
-	const [isPreviewLoading, setIsPreviewLoading] = useState<boolean>(false);
-	const { mutateAsync, error, isError } =
-		api.compose.isolatedDeployment.useMutation();
-
-	const [isOpenPreview, setIsOpenPreview] = useState<boolean>(false);
-
-	const { mutateAsync: updateCompose } = api.compose.update.useMutation();
-
-	const { data, refetch } = api.compose.one.useQuery(
-		{ composeId },
-		{ enabled: !!composeId },
-	);
-
-	const form = useForm<IsolatedSchema>({
-		defaultValues: {
-			isolatedDeployment: false,
-		},
-		resolver: zodResolver(isolatedSchema),
-	});
-
-	useEffect(() => {
-		if (data) {
-			form.reset({
-				isolatedDeployment: data?.isolatedDeployment || false,
-			});
-		}
-	}, [form, form.reset, form.formState.isSubmitSuccessful, data]);
-
-	const onSubmit = async (formData: IsolatedSchema) => {
-		await updateCompose({
-			composeId,
-			isolatedDeployment: formData?.isolatedDeployment || false,
-		})
-			.then(async (_data) => {
-				await refetch();
-				toast.success("Compose updated");
-			})
-			.catch(() => {
-				toast.error("Error updating the compose");
-			});
-	};
-
-	const generatePreview = async () => {
-		setIsOpenPreview(true);
-		setIsPreviewLoading(true);
-		try {
-			await mutateAsync({
-				composeId,
-				suffix: data?.appName || "",
-			}).then(async (data) => {
-				await utils.project.all.invalidate();
-				setCompose(data);
-			});
-		} catch {
-			toast.error("Error generating preview");
-			setIsOpenPreview(false);
-		} finally {
-			setIsPreviewLoading(false);
-		}
-	};
-
-	return (
-		<Card className="bg-background">
-			<CardHeader>
-				<CardTitle className="text-xl">Enable Isolated Deployment</CardTitle>
-				<CardDescription>
-					Configure isolated deployment to the compose file.
-					<div className="text-sm text-muted-foreground flex flex-col gap-2">
-						<span>
-							This feature creates an isolated environment for your deployment
-							by adding unique prefixes to all resources. It establishes a
-							dedicated network based on your compose file's name, ensuring your
-							services run in isolation. This prevents conflicts when running
-							multiple instances of the same template or services with identical
-							names.
-						</span>
-						<div className="space-y-4">
-							<div>
-								<h4 className="font-medium mb-2">
-									Resources that will be isolated:
-								</h4>
-								<ul className="list-disc list-inside">
-									<li>Docker networks</li>
-								</ul>
-							</div>
-						</div>
-					</div>
-				</CardDescription>
-			</CardHeader>
-			<CardContent>
-				<div className="space-y-4">
-					{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
-					<Form {...form}>
-						<form
-							onSubmit={form.handleSubmit(onSubmit)}
-							id="isolated-deployment-form"
-							className="grid w-full gap-4"
-						>
-							{isError && (
-								<div className="flex flex-row gap-4 rounded-lg items-center bg-red-50 p-2 dark:bg-red-950">
-									<AlertTriangle className="text-red-600 dark:text-red-400" />
-									<span className="text-sm text-red-600 dark:text-red-400">
-										{error?.message}
-									</span>
-								</div>
-							)}
-
-							<div className="flex flex-col lg:flex-col gap-4 w-full">
-								<div>
-									<FormField
-										control={form.control}
-										name="isolatedDeployment"
-										render={({ field }) => (
-											<FormItem className="mt-4 flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-												<div className="space-y-0.5">
-													<FormLabel>
-														Enable Isolated Deployment ({data?.appName})
-													</FormLabel>
-													<FormDescription>
-														Enable isolated deployment to the compose file.
-													</FormDescription>
-												</div>
-												<FormControl>
-													<Switch
-														checked={field.value}
-														onCheckedChange={field.onChange}
-													/>
-												</FormControl>
-											</FormItem>
-										)}
-									/>
-								</div>
-
-								<div className="flex flex-col lg:flex-row gap-4 w-full items-end justify-end">
-									<Button
-										form="isolated-deployment-form"
-										type="submit"
-										className="lg:w-fit"
-										isLoading={form.formState.isSubmitting}
-									>
-										Save
-									</Button>
-								</div>
-							</div>
-
-							<div className="flex flex-col lg:flex-row gap-4 w-full items-end justify-end">
-								<Button
-									onClick={generatePreview}
-									isLoading={isPreviewLoading}
-									variant="secondary"
-									className="lg:w-fit"
-								>
-									Preview Compose
-								</Button>
-								<Dialog open={isOpenPreview} onOpenChange={setIsOpenPreview}>
-									<DialogContent className="sm:max-w-6xl max-h-[80vh]">
-										<DialogHeader>
-											<DialogTitle>Isolated Deployment Preview</DialogTitle>
-											<DialogDescription>
-												Preview of the compose file with isolated deployment
-												configuration
-											</DialogDescription>
-										</DialogHeader>
-										<div className="flex flex-col gap-4 overflow-auto">
-											{isPreviewLoading ? (
-												<div className="flex flex-col items-center justify-center py-12 gap-4">
-													<Loader2 className="w-8 h-8 animate-spin text-muted-foreground" />
-													<p className="text-muted-foreground">
-														Generating compose preview...
-													</p>
-												</div>
-											) : (
-												<pre>
-													<CodeEditor
-														value={compose || ""}
-														language="yaml"
-														readOnly
-														height="60vh"
-													/>
-												</pre>
-											)}
-										</div>
-									</DialogContent>
-								</Dialog>
-							</div>
-						</form>
-					</Form>
-				</div>
-			</CardContent>
-		</Card>
-	);
-};

apps/dokploy/components/dashboard/compose/delete-service.tsx

@@ -1,12 +1,3 @@
-import type { ServiceType } from "@dokploy/server/db/schema";
-import { zodResolver } from "@hookform/resolvers/zod";
-import copy from "copy-to-clipboard";
-import { Copy, Trash2 } from "lucide-react";
-import { useRouter } from "next/router";
-import { useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Checkbox } from "@/components/ui/checkbox";
@@ -29,6 +20,15 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
+import type { ServiceType } from "@dokploy/server/db/schema";
+import { zodResolver } from "@hookform/resolvers/zod";
+import copy from "copy-to-clipboard";
+import { Copy, Trash2 } from "lucide-react";
+import { useRouter } from "next/router";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const deleteComposeSchema = z.object({
 	projectName: z.string().min(1, {

apps/dokploy/components/dashboard/compose/general/actions.tsx

@@ -1,7 +1,3 @@
-import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { Ban, CheckCircle2, RefreshCcw, Rocket, Terminal } from "lucide-react";
-import { useRouter } from "next/router";
-import { toast } from "sonner";
 import { DialogAction } from "@/components/shared/dialog-action";
 import { Button } from "@/components/ui/button";
 import { Switch } from "@/components/ui/switch";
@@ -12,6 +8,10 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import { Ban, CheckCircle2, RefreshCcw, Rocket, Terminal } from "lucide-react";
+import { useRouter } from "next/router";
+import { toast } from "sonner";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";
 
 interface Props {

apps/dokploy/components/dashboard/compose/general/compose-file-editor.tsx

@@ -1,8 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Button } from "@/components/ui/button";
 import {
@@ -13,7 +8,13 @@ import {
 	FormMessage,
 } from "@/components/ui/form";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 import { validateAndFormatYAML } from "../../application/advanced/traefik/update-traefik-config";
+import { ShowUtilities } from "./show-utilities";
 
 interface Props {
 	composeId: string;
@@ -141,7 +142,9 @@ services:
 					</form>
 				</Form>
 				<div className="flex justify-between flex-col lg:flex-row gap-2">
-					<div className="w-full flex flex-col lg:flex-row gap-4 items-end" />
+					<div className="w-full flex flex-col lg:flex-row gap-4 items-end">
+						<ShowUtilities composeId={composeId} />
+					</div>
 					<Button
 						type="submit"
 						form="hook-form-save-compose-file"

apps/dokploy/components/dashboard/compose/general/generic/save-bitbucket-provider-compose.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, X } from "lucide-react";
-import Link from "next/link";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { BitbucketIcon } from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Badge } from "@/components/ui/badge";
@@ -47,6 +40,13 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CheckIcon, ChevronsUpDown, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const BitbucketProviderSchema = z.object({
 	composePath: z.string().min(1),

apps/dokploy/components/dashboard/compose/general/generic/save-git-provider-compose.tsx

@@ -1,11 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { KeyRoundIcon, LockIcon, X } from "lucide-react";
-import Link from "next/link";
-import { useRouter } from "next/router";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { GitIcon } from "@/components/icons/data-tools-icons";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -35,6 +27,14 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { KeyRoundIcon, LockIcon, X } from "lucide-react";
+import Link from "next/link";
+import { useRouter } from "next/router";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const GitProviderSchema = z.object({
 	composePath: z.string().min(1),

apps/dokploy/components/dashboard/compose/general/generic/save-gitea-provider-compose.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, Plus, X } from "lucide-react";
-import Link from "next/link";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { GiteaIcon } from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Badge } from "@/components/ui/badge";
@@ -48,6 +41,13 @@ import {
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
 import type { Repository } from "@/utils/gitea-utils";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CheckIcon, ChevronsUpDown, Plus, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const GiteaProviderSchema = z.object({
 	composePath: z.string().min(1),

apps/dokploy/components/dashboard/compose/general/generic/save-github-provider-compose.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, HelpCircle, X } from "lucide-react";
-import Link from "next/link";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { GithubIcon } from "@/components/icons/data-tools-icons";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -46,6 +39,13 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CheckIcon, ChevronsUpDown, HelpCircle, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const GithubProviderSchema = z.object({
 	composePath: z.string().min(1),

apps/dokploy/components/dashboard/compose/general/generic/save-gitlab-provider-compose.tsx

@@ -1,10 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, X } from "lucide-react";
-import Link from "next/link";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { GitlabIcon } from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Badge } from "@/components/ui/badge";
@@ -47,6 +40,13 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CheckIcon, ChevronsUpDown, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const GitlabProviderSchema = z.object({
 	composePath: z.string().min(1),

apps/dokploy/components/dashboard/compose/general/generic/show.tsx

@@ -1,18 +1,16 @@
-import { CodeIcon, GitBranch, Loader2 } from "lucide-react";
-import Link from "next/link";
-import { useState } from "react";
-import { toast } from "sonner";
-import { UnauthorizedGitProvider } from "@/components/dashboard/application/general/generic/unauthorized-git-provider";
 import {
 	BitbucketIcon,
+	GitIcon,
 	GiteaIcon,
 	GithubIcon,
-	GitIcon,
 	GitlabIcon,
 } from "@/components/icons/data-tools-icons";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { api } from "@/utils/api";
+import { CodeIcon, GitBranch, Loader2 } from "lucide-react";
+import Link from "next/link";
+import { useState } from "react";
 import { ComposeFileEditor } from "../compose-file-editor";
 import { ShowConvertedCompose } from "../show-converted-compose";
 import { SaveBitbucketProviderCompose } from "./save-bitbucket-provider-compose";
@@ -20,6 +18,8 @@ import { SaveGitProviderCompose } from "./save-git-provider-compose";
 import { SaveGiteaProviderCompose } from "./save-gitea-provider-compose";
 import { SaveGithubProviderCompose } from "./save-github-provider-compose";
 import { SaveGitlabProviderCompose } from "./save-gitlab-provider-compose";
+import { UnauthorizedGitProvider } from "@/components/dashboard/application/general/generic/unauthorized-git-provider";
+import { toast } from "sonner";
 
 type TabState = "github" | "git" | "raw" | "gitlab" | "bitbucket" | "gitea";
 interface Props {

apps/dokploy/components/dashboard/compose/general/isolated-deployment.tsx

@@ -0,0 +1,188 @@
+import { AlertBlock } from "@/components/shared/alert-block";
+import { CodeEditor } from "@/components/shared/code-editor";
+import { Button } from "@/components/ui/button";
+import {
+	DialogDescription,
+	DialogHeader,
+	DialogTitle,
+} from "@/components/ui/dialog";
+import {
+	Form,
+	FormControl,
+	FormDescription,
+	FormField,
+	FormItem,
+	FormLabel,
+} from "@/components/ui/form";
+import { Label } from "@/components/ui/label";
+import { Switch } from "@/components/ui/switch";
+import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { AlertTriangle } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
+
+interface Props {
+	composeId: string;
+}
+
+const schema = z.object({
+	isolatedDeployment: z.boolean().optional(),
+});
+
+type Schema = z.infer<typeof schema>;
+
+export const IsolatedDeployment = ({ composeId }: Props) => {
+	const utils = api.useUtils();
+	const [compose, setCompose] = useState<string>("");
+	const { mutateAsync, error, isError } =
+		api.compose.isolatedDeployment.useMutation();
+
+	const { mutateAsync: updateCompose } = api.compose.update.useMutation();
+
+	const { data, refetch } = api.compose.one.useQuery(
+		{ composeId },
+		{ enabled: !!composeId },
+	);
+
+	console.log(data);
+
+	const form = useForm<Schema>({
+		defaultValues: {
+			isolatedDeployment: false,
+		},
+		resolver: zodResolver(schema),
+	});
+
+	useEffect(() => {
+		randomizeCompose();
+		if (data) {
+			form.reset({
+				isolatedDeployment: data?.isolatedDeployment || false,
+			});
+		}
+	}, [form, form.reset, form.formState.isSubmitSuccessful, data]);
+
+	const onSubmit = async (formData: Schema) => {
+		await updateCompose({
+			composeId,
+			isolatedDeployment: formData?.isolatedDeployment || false,
+		})
+			.then(async (_data) => {
+				await randomizeCompose();
+				await refetch();
+				toast.success("Compose updated");
+			})
+			.catch(() => {
+				toast.error("Error updating the compose");
+			});
+	};
+
+	const randomizeCompose = async () => {
+		await mutateAsync({
+			composeId,
+			suffix: data?.appName || "",
+		}).then(async (data) => {
+			await utils.project.all.invalidate();
+			setCompose(data);
+		});
+	};
+
+	return (
+		<>
+			<DialogHeader>
+				<DialogTitle>Isolate Deployment</DialogTitle>
+				<DialogDescription>
+					Use this option to isolate the deployment of this compose file.
+				</DialogDescription>
+			</DialogHeader>
+			<div className="text-sm text-muted-foreground flex flex-col gap-2">
+				<span>
+					This feature creates an isolated environment for your deployment by
+					adding unique prefixes to all resources. It establishes a dedicated
+					network based on your compose file's name, ensuring your services run
+					in isolation. This prevents conflicts when running multiple instances
+					of the same template or services with identical names.
+				</span>
+				<div className="space-y-4">
+					<div>
+						<h4 className="font-medium mb-2">
+							Resources that will be isolated:
+						</h4>
+						<ul className="list-disc list-inside">
+							<li>Docker volumes</li>
+							<li>Docker networks</li>
+						</ul>
+					</div>
+				</div>
+			</div>
+			{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
+			<Form {...form}>
+				<form
+					onSubmit={form.handleSubmit(onSubmit)}
+					id="hook-form-add-project"
+					className="grid w-full gap-4"
+				>
+					{isError && (
+						<div className="flex flex-row gap-4 rounded-lg items-center bg-red-50 p-2 dark:bg-red-950">
+							<AlertTriangle className="text-red-600 dark:text-red-400" />
+							<span className="text-sm text-red-600 dark:text-red-400">
+								{error?.message}
+							</span>
+						</div>
+					)}
+
+					<div className="flex flex-col lg:flex-col  gap-4 w-full ">
+						<div>
+							<FormField
+								control={form.control}
+								name="isolatedDeployment"
+								render={({ field }) => (
+									<FormItem className="mt-4 flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
+										<div className="space-y-0.5">
+											<FormLabel>
+												Enable Isolated Deployment ({data?.appName})
+											</FormLabel>
+											<FormDescription>
+												Enable isolated deployment to the compose file.
+											</FormDescription>
+										</div>
+										<FormControl>
+											<Switch
+												checked={field.value}
+												onCheckedChange={field.onChange}
+											/>
+										</FormControl>
+									</FormItem>
+								)}
+							/>
+						</div>
+
+						<div className="flex flex-col lg:flex-row  gap-4 w-full items-end justify-end">
+							<Button
+								form="hook-form-add-project"
+								type="submit"
+								className="lg:w-fit"
+							>
+								Save
+							</Button>
+						</div>
+					</div>
+					<div className="flex flex-col gap-4">
+						<Label>Preview</Label>
+						<pre>
+							<CodeEditor
+								value={compose || ""}
+								language="yaml"
+								readOnly
+								height="50rem"
+							/>
+						</pre>
+					</div>
+				</form>
+			</Form>
+		</>
+	);
+};