feat(applications): add support for Docker build secrets

- Implement build secrets functionality for Dockerfile builds
- Add new `buildSecrets` field to application schema
- Update UI and backend to handle build-time secrets
- Modify Docker build process to support secret injection during build

.github/workflows/dokploy.yml

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

.github/workflows/format.yml

@@ -1,22 +0,0 @@
-name: autofix.ci
-
-on:
-  push:
-    branches: [canary]
-  pull_request:
-    branches: [canary]
-
-jobs:
-  format:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v3
-
-      - name: Setup biomeJs
-        uses: biomejs/setup-biome@v2  
-
-      - name: Run Biome formatter
-        run:  biome format . --write
-
-      - uses: autofix-ci/action@551dded8c6cc8a1054039c8bc0b8b48c51dfc6ef

CONTRIBUTING.md

@@ -61,9 +61,9 @@ pnpm install
 cp apps/dokploy/.env.example apps/dokploy/.env
 ```
 
-## Requirements
+## Development
 
-- [Docker](/GUIDES.md#docker)
+Is required to have **Docker** installed on your machine.
 
 ### Setup
 
@@ -165,8 +165,86 @@ Thank you for your contribution!
 
 ## Templates
 
-To add a new template, go to `https://github.com/Dokploy/templates` repository and read the README.md file.
+To add a new template, go to `templates` folder and create a new folder with the name of the template.
 
+Let's take the example of `plausible` template.
+
+1. create a folder in `templates/plausible`
+2. create a `docker-compose.yml` file inside the folder with the content of compose.
+3. create a `index.ts` file inside the folder with the following code as base:
+4. When creating a pull request, please provide a video of the template working in action.
+
+```typescript
+// EXAMPLE
+import {
+  generateBase64,
+  generateHash,
+  generateRandomDomain,
+  type Template,
+  type Schema,
+  type DomainSchema,
+} from "../utils";
+
+export function generate(schema: Schema): Template {
+  // do your stuff here, like create a new domain, generate random passwords, mounts.
+  const mainServiceHash = generateHash(schema.projectName);
+  const mainDomain = generateRandomDomain(schema);
+  const secretBase = generateBase64(64);
+  const toptKeyBase = generateBase64(32);
+
+  const domains: DomainSchema[] = [
+    {
+      host: mainDomain,
+      port: 8000,
+      serviceName: "plausible",
+    },
+  ];
+
+  const envs = [
+    `BASE_URL=http://${mainDomain}`,
+    `SECRET_KEY_BASE=${secretBase}`,
+    `TOTP_VAULT_KEY=${toptKeyBase}`,
+    `HASH=${mainServiceHash}`,
+  ];
+
+  const mounts: Template["mounts"] = [
+    {
+      filePath: "./clickhouse/clickhouse-config.xml",
+      content: "some content......",
+    },
+  ];
+
+  return {
+    envs,
+    mounts,
+    domains,
+  };
+}
+```
+
+4. Now you need to add the information about the template to the `templates/templates.ts` is a object with the following properties:
+
+**Make sure the id of the template is the same as the folder name and don't have any spaces, only slugified names and lowercase.**
+
+```typescript
+{
+	id: "plausible",
+	name: "Plausible",
+	version: "v2.1.0",
+	description:
+		"Plausible is a open source, self-hosted web analytics platform that lets you track website traffic and user behavior.",
+	logo: "plausible.svg", // we defined the name and the extension of the logo
+	links: {
+		github: "https://github.com/plausible/plausible",
+		website: "https://plausible.io/",
+		docs: "https://plausible.io/docs",
+	},
+	tags: ["analytics"],
+	load: () => import("./plausible/index").then((m) => m.generate),
+},
+```
+
+5. Add the logo or image of the template to `public/templates/plausible.svg`
 
 ### Recommendations
 

GUIDES.md

@@ -1,49 +0,0 @@
-# Docker
-
-Here's how to install docker on different operating systems:
-
-## macOS
-
-1. Visit [Docker Desktop for Mac](https://www.docker.com/products/docker-desktop)
-2. Download the Docker Desktop installer
-3. Double-click the downloaded `.dmg` file
-4. Drag Docker to your Applications folder
-5. Open Docker Desktop from Applications
-6. Follow the onboarding tutorial if desired
-
-## Linux
-
-### Ubuntu
-
-```bash
-# Update package index
-sudo apt-get update
-
-# Install prerequisites
-sudo apt-get install \
-    apt-transport-https \
-    ca-certificates \
-    curl \
-    gnupg \
-    lsb-release
-
-# Add Docker's official GPG key
-curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg
-
-# Set up stable repository
-echo \
-  "deb [arch=amd64 signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu \
-  $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
-
-# Install Docker Engine
-sudo apt-get update
-sudo apt-get install docker-ce docker-ce-cli containerd.io
-```
-
-## Windows
-
-1. Enable WSL2 if not already enabled
-2. Visit [Docker Desktop for Windows](https://www.docker.com/products/docker-desktop)
-3. Download the installer
-4. Run the installer and follow the prompts
-5. Start Docker Desktop from the Start menu

apps/dokploy/CONTRIBUTING.md

@@ -0,0 +1,242 @@
+
+
+# Contributing
+
+Hey, thanks for your interest in contributing to Dokploy! We appreciate your help and taking your time to contribute.
+
+
+Before you start, please first discuss the feature/bug you want to add with the owners and comunity via github issues.
+
+We have a few guidelines to follow when contributing to this project:
+
+- [Commit Convention](#commit-convention)
+- [Setup](#setup)
+- [Development](#development)
+- [Build](#build)
+- [Pull Request](#pull-request)
+
+## Commit Convention
+
+Before you craete a Pull Request, please make sure your commit message follows the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) specification.
+
+### Commit Message Format
+```
+<type>[optional scope]: <description>
+
+[optional body]
+
+[optional footer(s)]
+```
+
+#### Type
+Must be one of the following:
+
+* **feat**: A new feature
+* **fix**: A bug fix
+* **docs**: Documentation only changes
+* **style**: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
+* **refactor**: A code change that neither fixes a bug nor adds a feature
+* **perf**: A code change that improves performance
+* **test**: Adding missing tests or correcting existing tests
+* **build**: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
+* **ci**: Changes to our CI configuration files and scripts (example scopes: Travis, Circle, BrowserStack, SauceLabs)
+* **chore**: Other changes that don't modify `src` or `test` files
+* **revert**: Reverts a previous commit
+
+Example:
+```
+feat: add new feature
+```
+
+
+
+
+## Setup
+
+Before you start, please make the clone based on the `canary` branch, since the `main` branch is the source of truth and should always reflect the latest stable release, also the PRs will be merged to the `canary` branch.
+
+```bash
+git clone https://github.com/dokploy/dokploy.git
+cd dokploy
+pnpm install
+cp .env.example .env
+```
+
+## Development
+
+Is required to have **Docker** installed on your machine.
+
+
+### Setup
+
+Run the command that will spin up all the required services and files.
+
+```bash
+pnpm run setup
+```
+
+Now run the development server.
+
+```bash
+pnpm run dev
+```
+
+
+Go to http://localhost:3000 to see the development server
+
+## Build
+
+```bash
+pnpm run build
+```
+
+## Docker
+
+To build the docker image
+```bash
+pnpm run docker:build
+```
+
+To push the docker image
+```bash
+pnpm run docker:push
+```
+
+## Password Reset
+
+In the case you lost your password, you can reset it using the following command
+
+```bash
+pnpm run reset-password
+```
+
+If you want to test the webhooks on development mode using localtunnel, make sure to install `localtunnel`
+
+```bash
+bunx lt --port 3000
+```
+
+If you run into permission issues of docker run the following command
+
+```bash
+sudo chown -R USERNAME dokploy or sudo chown -R $(whoami) ~/.docker
+```
+
+## Application deploy
+
+In case you want to deploy the application on your machine and you selected nixpacks or buildpacks, you need to install first.
+
+```bash
+# Install Nixpacks
+curl -sSL https://nixpacks.com/install.sh -o install.sh \
+    && chmod +x install.sh \
+    && ./install.sh
+```
+
+```bash
+# Install Buildpacks
+curl -sSL "https://github.com/buildpacks/pack/releases/download/v0.32.1/pack-v0.32.1-linux.tgz" | tar -C /usr/local/bin/ --no-same-owner -xzv pack
+```
+
+
+## Pull Request
+
+- 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.
+- When creating a pull request, please provide a clear and concise description of the changes made.
+- If you include a video or screenshot, would be awesome so we can see the changes in action.
+- 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.
+
+Thank you for your contribution!
+
+
+
+
+
+## Templates
+
+To add a new template, go to `templates` folder and create a new folder with the name of the template.
+
+Let's take the example of `plausible` template.
+
+1. create a folder in `templates/plausible`
+2. create a `docker-compose.yml` file inside the folder with the content of compose.
+3. create a `index.ts` file inside the folder with the following code as base:
+4. When creating a pull request, please provide a video of the template working in action.
+
+```typescript
+// EXAMPLE
+import {
+	generateHash,
+	generateRandomDomain,
+	type Template,
+	type Schema,
+} from "../utils";
+
+
+export function generate(schema: Schema): Template {
+
+	// do your stuff here, like create a new domain, generate random passwords, mounts.
+	const mainServiceHash = generateHash(schema.projectName);
+	const randomDomain = generateRandomDomain(schema);
+	const secretBase = generateBase64(64);
+	const toptKeyBase = generateBase64(32);
+
+	const envs = [
+// If you want to show a domain in the UI, please add the prefix _HOST at the end of the variable name.
+		`PLAUSIBLE_HOST=${randomDomain}`,
+		"PLAUSIBLE_PORT=8000",
+		`BASE_URL=http://${randomDomain}`,
+		`SECRET_KEY_BASE=${secretBase}`,
+		`TOTP_VAULT_KEY=${toptKeyBase}`,
+		`HASH=${mainServiceHash}`,
+	];
+
+    const mounts: Template["mounts"] = [
+		{
+			mountPath: "./clickhouse/clickhouse-config.xml",
+			content: `some content......`,
+		},
+	];
+
+	return {
+		envs,
+        mounts,
+	};
+}
+```
+
+4. Now you need to add the information about the template to the `templates/templates.ts` is a object with the following properties:
+
+**Make sure the id of the template is the same as the folder name and don't have any spaces, only slugified names and lowercase.**
+
+```typescript
+{
+	id: "plausible",
+	name: "Plausible",
+	version: "v2.1.0",
+	description:
+		"Plausible is a open source, self-hosted web analytics platform that lets you track website traffic and user behavior.",
+	logo: "plausible.svg", // we defined the name and the extension of the logo
+	links: {
+		github: "https://github.com/plausible/plausible",
+		website: "https://plausible.io/",
+		docs: "https://plausible.io/docs",
+	},
+	tags: ["analytics"],
+	load: () => import("./plausible/index").then((m) => m.generate),
+},
+```
+
+5. Add the logo or image of the template to `public/templates/plausible.svg`
+
+
+### Recomendations
+- Use the same name of the folder as the id of the template.
+- The logo should be in the public folder.
+- If you want to show a domain in the UI, please add the prefix _HOST at the end of the variable name.
+- Test first on a vps or a server to make sure the template works.
+

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

@@ -9,7 +9,6 @@ describe("createDomainLabels", () => {
 		port: 8080,
 		https: false,
 		uniqueConfigKey: 1,
-		customCertResolver: null,
 		certificateType: "none",
 		applicationId: "",
 		composeId: "",

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

@@ -27,8 +27,6 @@ if (typeof window === "undefined") {
 const baseApp: ApplicationNested = {
 	applicationId: "",
 	herokuVersion: "",
-	cleanCache: false,
-	watchPaths: [],
 	applicationStatus: "done",
 	appName: "",
 	autoDeploy: true,
@@ -39,7 +37,6 @@ const baseApp: ApplicationNested = {
 	isPreviewDeploymentsActive: false,
 	previewBuildArgs: null,
 	previewCertificateType: "none",
-	previewCustomCertResolver: null,
 	previewEnv: null,
 	previewHttps: false,
 	previewPath: "/",

apps/dokploy/__test__/templates/config.template.test.ts

@@ -1,425 +0,0 @@
-import { describe, expect, it } from "vitest";
-import type { CompleteTemplate } from "@dokploy/server/templates/processors";
-import { processTemplate } from "@dokploy/server/templates/processors";
-import type { Schema } from "@dokploy/server/templates";
-
-describe("processTemplate", () => {
-	// Mock schema for testing
-	const mockSchema: Schema = {
-		projectName: "test",
-		serverIp: "127.0.0.1",
-	};
-
-	describe("variables processing", () => {
-		it("should process basic variables with utility functions", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {
-					main_domain: "${domain}",
-					secret_base: "${base64:64}",
-					totp_key: "${base64:32}",
-					password: "${password:32}",
-					hash: "${hash:16}",
-				},
-				config: {
-					domains: [],
-					env: {},
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.envs).toHaveLength(0);
-			expect(result.domains).toHaveLength(0);
-			expect(result.mounts).toHaveLength(0);
-		});
-
-		it("should allow referencing variables in other variables", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {
-					main_domain: "${domain}",
-					api_domain: "api.${main_domain}",
-				},
-				config: {
-					domains: [],
-					env: {},
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.envs).toHaveLength(0);
-			expect(result.domains).toHaveLength(0);
-			expect(result.mounts).toHaveLength(0);
-		});
-	});
-
-	describe("domains processing", () => {
-		it("should process domains with explicit host", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {
-					main_domain: "${domain}",
-				},
-				config: {
-					domains: [
-						{
-							serviceName: "plausible",
-							port: 8000,
-							host: "${main_domain}",
-						},
-					],
-					env: {},
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.domains).toHaveLength(1);
-			const domain = result.domains[0];
-			expect(domain).toBeDefined();
-			if (!domain) return;
-			expect(domain).toMatchObject({
-				serviceName: "plausible",
-				port: 8000,
-			});
-			expect(domain.host).toBeDefined();
-			expect(domain.host).toContain(mockSchema.projectName);
-		});
-
-		it("should generate random domain if host is not specified", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {},
-				config: {
-					domains: [
-						{
-							serviceName: "plausible",
-							port: 8000,
-						},
-					],
-					env: {},
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.domains).toHaveLength(1);
-			const domain = result.domains[0];
-			expect(domain).toBeDefined();
-			if (!domain || !domain.host) return;
-			expect(domain.host).toBeDefined();
-			expect(domain.host).toContain(mockSchema.projectName);
-		});
-
-		it("should allow using ${domain} directly in host", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {},
-				config: {
-					domains: [
-						{
-							serviceName: "plausible",
-							port: 8000,
-							host: "${domain}",
-						},
-					],
-					env: {},
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.domains).toHaveLength(1);
-			const domain = result.domains[0];
-			expect(domain).toBeDefined();
-			if (!domain || !domain.host) return;
-			expect(domain.host).toBeDefined();
-			expect(domain.host).toContain(mockSchema.projectName);
-		});
-	});
-
-	describe("environment variables processing", () => {
-		it("should process env vars with variable references", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {
-					main_domain: "${domain}",
-					secret_base: "${base64:64}",
-				},
-				config: {
-					domains: [],
-					env: {
-						BASE_URL: "http://${main_domain}",
-						SECRET_KEY_BASE: "${secret_base}",
-					},
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.envs).toHaveLength(2);
-			const baseUrl = result.envs.find((env: string) =>
-				env.startsWith("BASE_URL="),
-			);
-			const secretKey = result.envs.find((env: string) =>
-				env.startsWith("SECRET_KEY_BASE="),
-			);
-
-			expect(baseUrl).toBeDefined();
-			expect(secretKey).toBeDefined();
-			if (!baseUrl || !secretKey) return;
-
-			expect(baseUrl).toContain(mockSchema.projectName);
-			const base64Value = secretKey.split("=")[1];
-			expect(base64Value).toBeDefined();
-			if (!base64Value) return;
-			expect(base64Value).toMatch(/^[A-Za-z0-9+/]+={0,2}$/);
-			expect(base64Value.length).toBeGreaterThanOrEqual(86);
-			expect(base64Value.length).toBeLessThanOrEqual(88);
-		});
-
-		it("should process env vars when provided as an array", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {},
-				config: {
-					domains: [],
-					env: [
-						'CLOUDFLARE_TUNNEL_TOKEN="<INSERT TOKEN>"',
-						'ANOTHER_VAR="some value"',
-						"DOMAIN=${domain}",
-					],
-					mounts: [],
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.envs).toHaveLength(3);
-
-			// Should preserve exact format for static values
-			expect(result.envs[0]).toBe('CLOUDFLARE_TUNNEL_TOKEN="<INSERT TOKEN>"');
-			expect(result.envs[1]).toBe('ANOTHER_VAR="some value"');
-
-			// Should process variables in array items
-			expect(result.envs[2]).toContain(mockSchema.projectName);
-		});
-
-		it("should allow using utility functions directly in env vars", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {},
-				config: {
-					domains: [],
-					env: {
-						RANDOM_DOMAIN: "${domain}",
-						SECRET_KEY: "${base64:32}",
-					},
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.envs).toHaveLength(2);
-			const randomDomainEnv = result.envs.find((env: string) =>
-				env.startsWith("RANDOM_DOMAIN="),
-			);
-			const secretKeyEnv = result.envs.find((env: string) =>
-				env.startsWith("SECRET_KEY="),
-			);
-			expect(randomDomainEnv).toBeDefined();
-			expect(secretKeyEnv).toBeDefined();
-			if (!randomDomainEnv || !secretKeyEnv) return;
-
-			expect(randomDomainEnv).toContain(mockSchema.projectName);
-			const base64Value = secretKeyEnv.split("=")[1];
-			expect(base64Value).toBeDefined();
-			if (!base64Value) return;
-			expect(base64Value).toMatch(/^[A-Za-z0-9+/]+={0,2}$/);
-			expect(base64Value.length).toBeGreaterThanOrEqual(42);
-			expect(base64Value.length).toBeLessThanOrEqual(44);
-		});
-	});
-
-	describe("mounts processing", () => {
-		it("should process mounts with variable references", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {
-					config_path: "/etc/config",
-					secret_key: "${base64:32}",
-				},
-				config: {
-					domains: [],
-					env: {},
-					mounts: [
-						{
-							filePath: "${config_path}/config.xml",
-							content: "secret_key=${secret_key}",
-						},
-					],
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.mounts).toHaveLength(1);
-			const mount = result.mounts[0];
-			expect(mount).toBeDefined();
-			if (!mount) return;
-			expect(mount.filePath).toContain("/etc/config");
-			expect(mount.content).toMatch(/secret_key=[A-Za-z0-9+/]{32}/);
-		});
-
-		it("should allow using utility functions directly in mount content", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {},
-				config: {
-					domains: [],
-					env: {},
-					mounts: [
-						{
-							filePath: "/config/secrets.txt",
-							content: "random_domain=${domain}\nsecret=${base64:32}",
-						},
-					],
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.mounts).toHaveLength(1);
-			const mount = result.mounts[0];
-			expect(mount).toBeDefined();
-			if (!mount) return;
-			expect(mount.content).toContain(mockSchema.projectName);
-			expect(mount.content).toMatch(/secret=[A-Za-z0-9+/]{32}/);
-		});
-	});
-
-	describe("complex template processing", () => {
-		it("should process a complete template with all features", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {
-					main_domain: "${domain}",
-					secret_base: "${base64:64}",
-					totp_key: "${base64:32}",
-				},
-				config: {
-					domains: [
-						{
-							serviceName: "plausible",
-							port: 8000,
-							host: "${main_domain}",
-						},
-						{
-							serviceName: "api",
-							port: 3000,
-							host: "api.${main_domain}",
-						},
-					],
-					env: {
-						BASE_URL: "http://${main_domain}",
-						SECRET_KEY_BASE: "${secret_base}",
-						TOTP_VAULT_KEY: "${totp_key}",
-					},
-					mounts: [
-						{
-							filePath: "/config/app.conf",
-							content: `
-                domain=\${main_domain}
-                secret=\${secret_base}
-                totp=\${totp_key}
-              `,
-						},
-					],
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-
-			// Check domains
-			expect(result.domains).toHaveLength(2);
-			const [domain1, domain2] = result.domains;
-			expect(domain1).toBeDefined();
-			expect(domain2).toBeDefined();
-			if (!domain1 || !domain2) return;
-			expect(domain1.host).toBeDefined();
-			expect(domain1.host).toContain(mockSchema.projectName);
-			expect(domain2.host).toContain("api.");
-			expect(domain2.host).toContain(mockSchema.projectName);
-
-			// Check env vars
-			expect(result.envs).toHaveLength(3);
-			const baseUrl = result.envs.find((env: string) =>
-				env.startsWith("BASE_URL="),
-			);
-			const secretKey = result.envs.find((env: string) =>
-				env.startsWith("SECRET_KEY_BASE="),
-			);
-			const totpKey = result.envs.find((env: string) =>
-				env.startsWith("TOTP_VAULT_KEY="),
-			);
-
-			expect(baseUrl).toBeDefined();
-			expect(secretKey).toBeDefined();
-			expect(totpKey).toBeDefined();
-			if (!baseUrl || !secretKey || !totpKey) return;
-
-			expect(baseUrl).toContain(mockSchema.projectName);
-
-			// Check base64 lengths and format
-			const secretKeyValue = secretKey.split("=")[1];
-			const totpKeyValue = totpKey.split("=")[1];
-
-			expect(secretKeyValue).toBeDefined();
-			expect(totpKeyValue).toBeDefined();
-			if (!secretKeyValue || !totpKeyValue) return;
-
-			expect(secretKeyValue).toMatch(/^[A-Za-z0-9+/]+={0,2}$/);
-			expect(secretKeyValue.length).toBeGreaterThanOrEqual(86);
-			expect(secretKeyValue.length).toBeLessThanOrEqual(88);
-
-			expect(totpKeyValue).toMatch(/^[A-Za-z0-9+/]+={0,2}$/);
-			expect(totpKeyValue.length).toBeGreaterThanOrEqual(42);
-			expect(totpKeyValue.length).toBeLessThanOrEqual(44);
-
-			// Check mounts
-			expect(result.mounts).toHaveLength(1);
-			const mount = result.mounts[0];
-			expect(mount).toBeDefined();
-			if (!mount) return;
-			expect(mount.content).toContain(mockSchema.projectName);
-			expect(mount.content).toMatch(/secret=[A-Za-z0-9+/]{86,88}/);
-			expect(mount.content).toMatch(/totp=[A-Za-z0-9+/]{42,44}/);
-		});
-	});
-
-	describe("Should populate envs, domains and mounts in the case we didn't used any variable", () => {
-		it("should populate envs, domains and mounts in the case we didn't used any variable", () => {
-			const template: CompleteTemplate = {
-				metadata: {} as any,
-				variables: {},
-				config: {
-					domains: [
-						{
-							serviceName: "plausible",
-							port: 8000,
-							host: "${hash}",
-						},
-					],
-					env: {
-						BASE_URL: "http://${domain}",
-						SECRET_KEY_BASE: "${password:32}",
-						TOTP_VAULT_KEY: "${base64:128}",
-					},
-					mounts: [
-						{
-							filePath: "/config/secrets.txt",
-							content: "random_domain=${domain}\nsecret=${password:32}",
-						},
-					],
-				},
-			};
-
-			const result = processTemplate(template, mockSchema);
-			expect(result.envs).toHaveLength(3);
-			expect(result.domains).toHaveLength(1);
-			expect(result.mounts).toHaveLength(1);
-		});
-	});
-});

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

@@ -7,7 +7,6 @@ import { expect, test } from "vitest";
 const baseApp: ApplicationNested = {
 	applicationId: "",
 	herokuVersion: "",
-	cleanCache: false,
 	applicationStatus: "done",
 	appName: "",
 	autoDeploy: true,
@@ -15,7 +14,6 @@ const baseApp: ApplicationNested = {
 	branch: null,
 	dockerBuildStage: "",
 	registryUrl: "",
-	watchPaths: [],
 	buildArgs: null,
 	isPreviewDeploymentsActive: false,
 	previewBuildArgs: null,
@@ -25,7 +23,6 @@ const baseApp: ApplicationNested = {
 	previewPath: "/",
 	previewPort: 3000,
 	previewLimit: 0,
-	previewCustomCertResolver: null,
 	previewWildcard: "",
 	project: {
 		env: "",
@@ -106,7 +103,6 @@ const baseDomain: Domain = {
 	port: null,
 	serviceName: "",
 	composeId: "",
-	customCertResolver: null,
 	domainType: "application",
 	uniqueConfigKey: 1,
 	previewDeploymentId: "",

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

@@ -40,7 +40,7 @@ interface Props {
 }
 
 const AddRedirectchema = z.object({
-	replicas: z.number().min(1, "Replicas must be at least 1"),
+	replicas: z.number(),
 	registryId: z.string(),
 });
 
@@ -130,11 +130,9 @@ export const ShowClusterSettings = ({ applicationId }: Props) => {
 												placeholder="1"
 												{...field}
 												onChange={(e) => {
-													const value = e.target.value;
-													field.onChange(value === "" ? 0 : Number(value));
+													field.onChange(Number(e.target.value));
 												}}
 												type="number"
-												value={field.value || ""}
 											/>
 										</FormControl>
 

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

@@ -1,347 +0,0 @@
-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,
-	FormField,
-	FormItem,
-	FormLabel,
-	FormMessage,
-} from "@/components/ui/form";
-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";
-import { AlertBlock } from "@/components/shared/alert-block";
-
-const ImportSchema = z.object({
-	base64: z.string(),
-});
-
-type ImportType = z.infer<typeof ImportSchema>;
-
-interface Props {
-	composeId: string;
-}
-
-export const ShowImport = ({ composeId }: Props) => {
-	const [showModal, setShowModal] = useState(false);
-	const [showMountContent, setShowMountContent] = useState(false);
-	const [selectedMount, setSelectedMount] = useState<{
-		filePath: string;
-		content: string;
-	} | null>(null);
-	const [templateInfo, setTemplateInfo] = useState<{
-		compose: string;
-		template: {
-			domains: Array<{
-				serviceName: string;
-				port: number;
-				path?: string;
-				host?: string;
-			}>;
-			envs: string[];
-			mounts: Array<{
-				filePath: string;
-				content: string;
-			}>;
-		};
-	} | null>(null);
-
-	const utils = api.useUtils();
-	const { mutateAsync: processTemplate, isLoading: isLoadingTemplate } =
-		api.compose.processTemplate.useMutation();
-	const {
-		mutateAsync: importTemplate,
-		isLoading: isImporting,
-		isSuccess: isImportSuccess,
-	} = api.compose.import.useMutation();
-
-	const form = useForm<ImportType>({
-		defaultValues: {
-			base64: "",
-		},
-		resolver: zodResolver(ImportSchema),
-	});
-
-	useEffect(() => {
-		form.reset({
-			base64: "",
-		});
-	}, [isImportSuccess]);
-
-	const onSubmit = async () => {
-		const base64 = form.getValues("base64");
-		if (!base64) {
-			toast.error("Please enter a base64 template");
-			return;
-		}
-
-		try {
-			await importTemplate({
-				composeId,
-				base64,
-			});
-			toast.success("Template imported successfully");
-			await utils.compose.one.invalidate({
-				composeId,
-			});
-			setShowModal(false);
-		} catch (_error) {
-			toast.error("Error importing template");
-		}
-	};
-
-	const handleLoadTemplate = async () => {
-		const base64 = form.getValues("base64");
-		if (!base64) {
-			toast.error("Please enter a base64 template");
-			return;
-		}
-
-		try {
-			const result = await processTemplate({
-				composeId,
-				base64,
-			});
-			setTemplateInfo(result);
-			setShowModal(true);
-		} catch (_error) {
-			toast.error("Error processing template");
-		}
-	};
-
-	const handleShowMountContent = (mount: {
-		filePath: string;
-		content: string;
-	}) => {
-		setSelectedMount(mount);
-		setShowMountContent(true);
-	};
-
-	return (
-		<>
-			<Card className="bg-background">
-				<CardHeader>
-					<CardTitle className="text-xl">Import</CardTitle>
-					<CardDescription>Import your Template configuration</CardDescription>
-				</CardHeader>
-				<CardContent className="flex flex-col gap-4">
-					<AlertBlock type="warning">
-						Warning: Importing a template will remove all existing environment
-						variables, mounts, and domains from this service.
-					</AlertBlock>
-					<Form {...form}>
-						<form
-							onSubmit={form.handleSubmit(onSubmit)}
-							className="grid w-full gap-4"
-						>
-							<FormField
-								control={form.control}
-								name="base64"
-								render={({ field }) => (
-									<FormItem>
-										<FormLabel>Configuration (Base64)</FormLabel>
-										<FormControl>
-											<Textarea
-												placeholder="Enter your Base64 configuration here..."
-												className="font-mono min-h-[200px]"
-												{...field}
-											/>
-										</FormControl>
-										<FormMessage />
-									</FormItem>
-								)}
-							/>
-							<div className="flex justify-end gap-2">
-								<Button
-									type="button"
-									className="w-fit"
-									variant="outline"
-									isLoading={isLoadingTemplate}
-									onClick={handleLoadTemplate}
-								>
-									Load
-								</Button>
-							</div>
-							<Dialog open={showModal} onOpenChange={setShowModal}>
-								<DialogContent className="max-h-[80vh] max-w-[50vw] overflow-y-auto">
-									<DialogHeader>
-										<DialogTitle className="text-2xl font-bold">
-											Template Information
-										</DialogTitle>
-										<DialogDescription className="space-y-2">
-											<p>Review the template information before importing</p>
-											<AlertBlock type="warning">
-												Warning: This will remove all existing environment
-												variables, mounts, and domains from this service.
-											</AlertBlock>
-										</DialogDescription>
-									</DialogHeader>
-
-									<div className="flex flex-col gap-6">
-										<div className="space-y-4">
-											<div className="flex items-center gap-2">
-												<Code2 className="h-5 w-5 text-primary" />
-												<h3 className="text-lg font-semibold">
-													Docker Compose
-												</h3>
-											</div>
-											<CodeEditor
-												language="yaml"
-												value={templateInfo?.compose || ""}
-												className="font-mono"
-												readOnly
-											/>
-										</div>
-
-										<Separator />
-
-										{templateInfo?.template.domains &&
-											templateInfo.template.domains.length > 0 && (
-												<div className="space-y-4">
-													<div className="flex items-center gap-2">
-														<Globe2 className="h-5 w-5 text-primary" />
-														<h3 className="text-lg font-semibold">Domains</h3>
-													</div>
-													<div className="grid grid-cols-1 gap-3">
-														{templateInfo.template.domains.map(
-															(domain, index) => (
-																<div
-																	key={index}
-																	className="rounded-lg border bg-card p-3 text-card-foreground shadow-sm"
-																>
-																	<div className="font-medium">
-																		{domain.serviceName}
-																	</div>
-																	<div className="text-sm text-muted-foreground space-y-1">
-																		<div>Port: {domain.port}</div>
-																		{domain.host && (
-																			<div>Host: {domain.host}</div>
-																		)}
-																		{domain.path && (
-																			<div>Path: {domain.path}</div>
-																		)}
-																	</div>
-																</div>
-															),
-														)}
-													</div>
-												</div>
-											)}
-
-										{templateInfo?.template.envs &&
-											templateInfo.template.envs.length > 0 && (
-												<div className="space-y-4">
-													<div className="flex items-center gap-2">
-														<Code2 className="h-5 w-5 text-primary" />
-														<h3 className="text-lg font-semibold">
-															Environment Variables
-														</h3>
-													</div>
-													<div className="grid grid-cols-1 gap-2">
-														{templateInfo.template.envs.map((env, index) => (
-															<div
-																key={index}
-																className="rounded-lg border bg-card p-2 font-mono text-sm"
-															>
-																{env}
-															</div>
-														))}
-													</div>
-												</div>
-											)}
-
-										{templateInfo?.template.mounts &&
-											templateInfo.template.mounts.length > 0 && (
-												<div className="space-y-4">
-													<div className="flex items-center gap-2">
-														<HardDrive className="h-5 w-5 text-primary" />
-														<h3 className="text-lg font-semibold">Mounts</h3>
-													</div>
-													<div className="grid grid-cols-1 gap-2">
-														{templateInfo.template.mounts.map(
-															(mount, index) => (
-																<div
-																	key={index}
-																	className="rounded-lg border bg-card p-2 font-mono text-sm hover:bg-accent cursor-pointer transition-colors"
-																	onClick={() => handleShowMountContent(mount)}
-																>
-																	{mount.filePath}
-																</div>
-															),
-														)}
-													</div>
-												</div>
-											)}
-									</div>
-
-									<div className="flex justify-end gap-2 pt-4">
-										<Button
-											variant="outline"
-											onClick={() => setShowModal(false)}
-										>
-											Cancel
-										</Button>
-										<Button
-											isLoading={isImporting}
-											type="submit"
-											onClick={form.handleSubmit(onSubmit)}
-											className="w-fit"
-										>
-											Import
-										</Button>
-									</div>
-								</DialogContent>
-							</Dialog>
-						</form>
-					</Form>
-				</CardContent>
-			</Card>
-
-			<Dialog open={showMountContent} onOpenChange={setShowMountContent}>
-				<DialogContent className="max-w-[50vw]">
-					<DialogHeader>
-						<DialogTitle className="text-xl font-bold">
-							{selectedMount?.filePath}
-						</DialogTitle>
-						<DialogDescription>Mount File Content</DialogDescription>
-					</DialogHeader>
-
-					<ScrollArea className="h-[25vh] pr-4">
-						<CodeEditor
-							language="yaml"
-							value={selectedMount?.content || ""}
-							className="font-mono"
-							readOnly
-						/>
-					</ScrollArea>
-
-					<div className="flex justify-end gap-2 pt-4">
-						<Button onClick={() => setShowMountContent(false)}>Close</Button>
-					</div>
-				</DialogContent>
-			</Dialog>
-		</>
-	);
-};

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

@@ -42,7 +42,6 @@ import { domain } from "@/server/db/validations/domain";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { Dices } from "lucide-react";
 import type z from "zod";
-import Link from "next/link";
 
 type Domain = z.infer<typeof domain>;
 
@@ -84,29 +83,10 @@ export const AddDomain = ({
 	const { mutateAsync: generateDomain, isLoading: isLoadingGenerate } =
 		api.domain.generateDomain.useMutation();
 
-	const { data: canGenerateTraefikMeDomains } =
-		api.domain.canGenerateTraefikMeDomains.useQuery({
-			serverId: application?.serverId || "",
-		});
-
-	console.log("canGenerateTraefikMeDomains", canGenerateTraefikMeDomains);
-
 	const form = useForm<Domain>({
 		resolver: zodResolver(domain),
-		defaultValues: {
-			host: "",
-			path: undefined,
-			port: undefined,
-			https: false,
-			certificateType: undefined,
-			customCertResolver: undefined,
-		},
-		mode: "onChange",
 	});
 
-	const certificateType = form.watch("certificateType");
-	const https = form.watch("https");
-
 	useEffect(() => {
 		if (data) {
 			form.reset({
@@ -114,29 +94,13 @@ export const AddDomain = ({
 				/* Convert null to undefined */
 				path: data?.path || undefined,
 				port: data?.port || undefined,
-				certificateType: data?.certificateType || undefined,
-				customCertResolver: data?.customCertResolver || undefined,
 			});
 		}
 
 		if (!domainId) {
-			form.reset({
-				host: "",
-				path: undefined,
-				port: undefined,
-				https: false,
-				certificateType: undefined,
-				customCertResolver: undefined,
-			});
+			form.reset({});
 		}
-	}, [form, data, isLoading, domainId]);
-
-	// Separate effect for handling custom cert resolver validation
-	useEffect(() => {
-		if (certificateType === "custom") {
-			form.trigger("customCertResolver");
-		}
-	}, [certificateType, form]);
+	}, [form, form.reset, data, isLoading]);
 
 	const dictionary = {
 		success: domainId ? "Domain Updated" : "Domain Created",
@@ -194,21 +158,6 @@ export const AddDomain = ({
 									name="host"
 									render={({ field }) => (
 										<FormItem>
-											{!canGenerateTraefikMeDomains &&
-												field.value.includes("traefik.me") && (
-													<AlertBlock type="warning">
-														You need to set an IP address in your{" "}
-														<Link
-															href="/dashboard/settings/server"
-															className="text-primary"
-														>
-															{application?.serverId
-																? "Remote Servers -> Server -> Edit Server -> Update IP Address"
-																: "Web Server -> Server -> Update Server IP"}
-														</Link>{" "}
-														to make your traefik.me domain work.
-													</AlertBlock>
-												)}
 											<FormLabel>Host</FormLabel>
 											<div className="flex gap-2">
 												<FormControl>
@@ -307,73 +256,34 @@ export const AddDomain = ({
 									)}
 								/>
 
-								{https && (
-									<>
-										<FormField
-											control={form.control}
-											name="certificateType"
-											render={({ field }) => {
-												return (
-													<FormItem>
-														<FormLabel>Certificate Provider</FormLabel>
-														<Select
-															onValueChange={(value) => {
-																field.onChange(value);
-																if (value !== "custom") {
-																	form.setValue(
-																		"customCertResolver",
-																		undefined,
-																	);
-																}
-															}}
-															value={field.value}
-														>
-															<FormControl>
-																<SelectTrigger>
-																	<SelectValue placeholder="Select a certificate provider" />
-																</SelectTrigger>
-															</FormControl>
-															<SelectContent>
-																<SelectItem value={"none"}>None</SelectItem>
-																<SelectItem value={"letsencrypt"}>
-																	Let's Encrypt
-																</SelectItem>
-																<SelectItem value={"custom"}>Custom</SelectItem>
-															</SelectContent>
-														</Select>
-														<FormMessage />
-													</FormItem>
-												);
-											}}
-										/>
+								{form.getValues().https && (
+									<FormField
+										control={form.control}
+										name="certificateType"
+										render={({ field }) => (
+											<FormItem className="col-span-2">
+												<FormLabel>Certificate Provider</FormLabel>
+												<Select
+													onValueChange={field.onChange}
+													defaultValue={field.value || ""}
+												>
+													<FormControl>
+														<SelectTrigger>
+															<SelectValue placeholder="Select a certificate provider" />
+														</SelectTrigger>
+													</FormControl>
 
-										{certificateType === "custom" && (
-											<FormField
-												control={form.control}
-												name="customCertResolver"
-												render={({ field }) => {
-													return (
-														<FormItem>
-															<FormLabel>Custom Certificate Resolver</FormLabel>
-															<FormControl>
-																<Input
-																	className="w-full"
-																	placeholder="Enter your custom certificate resolver"
-																	{...field}
-																	value={field.value || ""}
-																	onChange={(e) => {
-																		field.onChange(e);
-																		form.trigger("customCertResolver");
-																	}}
-																/>
-															</FormControl>
-															<FormMessage />
-														</FormItem>
-													);
-												}}
-											/>
+													<SelectContent>
+														<SelectItem value="none">None</SelectItem>
+														<SelectItem value={"letsencrypt"}>
+															Let's Encrypt
+														</SelectItem>
+													</SelectContent>
+												</Select>
+												<FormMessage />
+											</FormItem>
 										)}
-									</>
+									/>
 								)}
 							</div>
 						</div>

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

@@ -71,19 +71,15 @@ export const ShowEnvironment = ({ id, type }: Props) => {
 		resolver: zodResolver(addEnvironmentSchema),
 	});
 
-	// Watch form value
-	const currentEnvironment = form.watch("environment");
-	const hasChanges = currentEnvironment !== (data?.env || "");
-
 	useEffect(() => {
 		if (data) {
 			form.reset({
 				environment: data.env || "",
 			});
 		}
-	}, [data, form]);
+	}, [form.reset, data, form]);
 
-	const onSubmit = async (formData: EnvironmentSchema) => {
+	const onSubmit = async (data: EnvironmentSchema) => {
 		mutateAsync({
 			mongoId: id || "",
 			postgresId: id || "",
@@ -91,7 +87,7 @@ export const ShowEnvironment = ({ id, type }: Props) => {
 			mysqlId: id || "",
 			mariadbId: id || "",
 			composeId: id || "",
-			env: formData.environment,
+			env: data.environment,
 		})
 			.then(async () => {
 				toast.success("Environments Added");
@@ -102,12 +98,6 @@ export const ShowEnvironment = ({ id, type }: Props) => {
 			});
 	};
 
-	const handleCancel = () => {
-		form.reset({
-			environment: data?.env || "",
-		});
-	};
-
 	return (
 		<div className="flex w-full flex-col gap-5 ">
 			<Card className="bg-background">
@@ -116,11 +106,6 @@ export const ShowEnvironment = ({ id, type }: Props) => {
 						<CardTitle className="text-xl">Environment Settings</CardTitle>
 						<CardDescription>
 							You can add environment variables to your resource.
-							{hasChanges && (
-								<span className="text-yellow-500 ml-2">
-									(You have unsaved changes)
-								</span>
-							)}
 						</CardDescription>
 					</div>
 
@@ -170,22 +155,8 @@ PORT=3000
 								)}
 							/>
 
-							<div className="flex flex-row justify-end gap-2">
-								{hasChanges && (
-									<Button
-										type="button"
-										variant="outline"
-										onClick={handleCancel}
-									>
-										Cancel
-									</Button>
-								)}
-								<Button
-									isLoading={isLoading}
-									className="w-fit"
-									type="submit"
-									disabled={!hasChanges}
-								>
+							<div className="flex flex-row justify-end">
+								<Button isLoading={isLoading} className="w-fit" type="submit">
 									Save
 								</Button>
 							</div>

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

@@ -7,11 +7,11 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
-import { useEffect } from "react";
 
 const addEnvironmentSchema = z.object({
 	env: z.string(),
 	buildArgs: z.string(),
+	buildSecrets: z.record(z.string(), z.string()),
 });
 
 type EnvironmentSchema = z.infer<typeof addEnvironmentSchema>;
@@ -35,32 +35,18 @@ export const ShowEnvironment = ({ applicationId }: Props) => {
 
 	const form = useForm<EnvironmentSchema>({
 		defaultValues: {
-			env: "",
-			buildArgs: "",
+			env: data?.env || "",
+			buildArgs: data?.buildArgs || "",
+			buildSecrets: data?.buildSecrets || {},
 		},
 		resolver: zodResolver(addEnvironmentSchema),
 	});
 
-	// Watch form values
-	const currentEnv = form.watch("env");
-	const currentBuildArgs = form.watch("buildArgs");
-	const hasChanges =
-		currentEnv !== (data?.env || "") ||
-		currentBuildArgs !== (data?.buildArgs || "");
-
-	useEffect(() => {
-		if (data) {
-			form.reset({
-				env: data.env || "",
-				buildArgs: data.buildArgs || "",
-			});
-		}
-	}, [data, form]);
-
-	const onSubmit = async (formData: EnvironmentSchema) => {
+	const onSubmit = async (data: EnvironmentSchema) => {
 		mutateAsync({
-			env: formData.env,
-			buildArgs: formData.buildArgs,
+			env: data.env,
+			buildArgs: data.buildArgs,
+			buildSecrets: data.buildSecrets,
 			applicationId,
 		})
 			.then(async () => {
@@ -72,13 +58,6 @@ export const ShowEnvironment = ({ applicationId }: Props) => {
 			});
 	};
 
-	const handleCancel = () => {
-		form.reset({
-			env: data?.env || "",
-			buildArgs: data?.buildArgs || "",
-		});
-	};
-
 	return (
 		<Card className="bg-background px-6 pb-6">
 			<Form {...form}>
@@ -89,51 +68,70 @@ export const ShowEnvironment = ({ applicationId }: Props) => {
 					<Secrets
 						name="env"
 						title="Environment Settings"
-						description={
-							<span>
-								You can add environment variables to your resource.
-								{hasChanges && (
-									<span className="text-yellow-500 ml-2">
-										(You have unsaved changes)
-									</span>
-								)}
-							</span>
-						}
+						description="You can add environment variables to your resource."
 						placeholder={["NODE_ENV=production", "PORT=3000"].join("\n")}
 					/>
 					{data?.buildType === "dockerfile" && (
-						<Secrets
-							name="buildArgs"
-							title="Build-time Variables"
-							description={
-								<span>
-									Available only at build-time. See documentation&nbsp;
-									<a
-										className="text-primary"
-										href="https://docs.docker.com/build/guide/build-args/"
-										target="_blank"
-										rel="noopener noreferrer"
-									>
-										here
-									</a>
-									.
-								</span>
-							}
-							placeholder="NPM_TOKEN=xyz"
-						/>
+						<>
+							<Secrets
+								name="buildArgs"
+								title="Build-time Variables"
+								description={
+									<span>
+										Available only at build-time. See documentation&nbsp;
+										<a
+											className="text-primary"
+											href="https://docs.docker.com/build/guide/build-args/"
+											target="_blank"
+											rel="noopener noreferrer"
+										>
+											here
+										</a>
+										.
+									</span>
+								}
+								placeholder="NPM_TOKEN=xyz"
+							/>
+							<Secrets
+								name="buildSecrets"
+								title="Build Secrets"
+								description={
+									<span>
+										Secrets available only during build-time and not in the
+										final image. See documentation&nbsp;
+										<a
+											className="text-primary"
+											href="https://docs.docker.com/build/building/secrets/"
+											target="_blank"
+											rel="noopener noreferrer"
+										>
+											here
+										</a>
+										.
+									</span>
+								}
+								placeholder="API_TOKEN=xyz"
+								transformValue={(value) => {
+									// Convert the string format to object
+									const lines = value.split("\n").filter((line) => line.trim());
+									return Object.fromEntries(
+										lines.map((line) => {
+											const [key, ...valueParts] = line.split("=");
+											return [key.trim(), valueParts.join("=").trim()];
+										}),
+									);
+								}}
+								formatValue={(value) => {
+									// Convert the object back to string format
+									return Object.entries(value as Record<string, string>)
+										.map(([key, val]) => `${key}=${val}`)
+										.join("\n");
+								}}
+							/>
+						</>
 					)}
-					<div className="flex flex-row justify-end gap-2">
-						{hasChanges && (
-							<Button type="button" variant="outline" onClick={handleCancel}>
-								Cancel
-							</Button>
-						)}
-						<Button
-							isLoading={isLoading}
-							className="w-fit"
-							type="submit"
-							disabled={!hasChanges}
-						>
+					<div className="flex flex-row justify-end">
+						<Button isLoading={isLoading} className="w-fit" type="submit">
 							Save
 						</Button>
 					</div>

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

@@ -29,23 +29,14 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} 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 { CheckIcon, ChevronsUpDown } from "lucide-react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
-import { Badge } from "@/components/ui/badge";
-import { BitbucketIcon } from "@/components/icons/data-tools-icons";
-import Link from "next/link";
 
 const BitbucketProviderSchema = z.object({
 	buildPath: z.string().min(1, "Path is required").default("/"),
@@ -57,7 +48,6 @@ const BitbucketProviderSchema = z.object({
 		.required(),
 	branch: z.string().min(1, "Branch is required"),
 	bitbucketId: z.string().min(1, "Bitbucket Provider is required"),
-	watchPaths: z.array(z.string()).optional(),
 });
 
 type BitbucketProvider = z.infer<typeof BitbucketProviderSchema>;
@@ -83,7 +73,6 @@ export const SaveBitbucketProvider = ({ applicationId }: Props) => {
 			},
 			bitbucketId: "",
 			branch: "",
-			watchPaths: [],
 		},
 		resolver: zodResolver(BitbucketProviderSchema),
 	});
@@ -129,7 +118,6 @@ export const SaveBitbucketProvider = ({ applicationId }: Props) => {
 				},
 				buildPath: data.bitbucketBuildPath || "/",
 				bitbucketId: data.bitbucketId || "",
-				watchPaths: data.watchPaths || [],
 			});
 		}
 	}, [form.reset, data, form]);
@@ -142,7 +130,6 @@ export const SaveBitbucketProvider = ({ applicationId }: Props) => {
 			bitbucketBuildPath: data.buildPath,
 			bitbucketId: data.bitbucketId,
 			applicationId,
-			watchPaths: data.watchPaths || [],
 		})
 			.then(async () => {
 				toast.success("Service Provided Saved");
@@ -208,20 +195,7 @@ export const SaveBitbucketProvider = ({ applicationId }: Props) => {
 							name="repository"
 							render={({ field }) => (
 								<FormItem className="md:col-span-2 flex flex-col">
-									<div className="flex items-center justify-between">
-										<FormLabel>Repository</FormLabel>
-										{field.value.owner && field.value.repo && (
-											<Link
-												href={`https://bitbucket.org/${field.value.owner}/${field.value.repo}`}
-												target="_blank"
-												rel="noopener noreferrer"
-												className="flex items-center gap-1 text-sm text-muted-foreground hover:text-primary"
-											>
-												<BitbucketIcon className="h-4 w-4" />
-												<span>View Repository</span>
-											</Link>
-										)}
-									</div>
+									<FormLabel>Repository</FormLabel>
 									<Popover>
 										<PopoverTrigger asChild>
 											<FormControl>
@@ -389,84 +363,6 @@ export const SaveBitbucketProvider = ({ applicationId }: Props) => {
 								</FormItem>
 							)}
 						/>
-						<FormField
-							control={form.control}
-							name="watchPaths"
-							render={({ field }) => (
-								<FormItem className="md:col-span-2">
-									<div className="flex items-center gap-2">
-										<FormLabel>Watch Paths</FormLabel>
-										<TooltipProvider>
-											<Tooltip>
-												<TooltipTrigger>
-													<div className="size-4 rounded-full bg-muted flex items-center justify-center text-[10px] font-bold">
-														?
-													</div>
-												</TooltipTrigger>
-												<TooltipContent>
-													<p>
-														Add paths to watch for changes. When files in these
-														paths change, a new deployment will be triggered.
-													</p>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
-									</div>
-									<div className="flex flex-wrap gap-2 mb-2">
-										{field.value?.map((path, index) => (
-											<Badge key={index} variant="secondary">
-												{path}
-												<X
-													className="ml-1 size-3 cursor-pointer"
-													onClick={() => {
-														const newPaths = [...(field.value || [])];
-														newPaths.splice(index, 1);
-														form.setValue("watchPaths", newPaths);
-													}}
-												/>
-											</Badge>
-										))}
-									</div>
-									<FormControl>
-										<div className="flex gap-2">
-											<Input
-												placeholder="Enter a path to watch (e.g., src/*, dist/*)"
-												onKeyDown={(e) => {
-													if (e.key === "Enter") {
-														e.preventDefault();
-														const input = e.currentTarget;
-														const value = input.value.trim();
-														if (value) {
-															const newPaths = [...(field.value || []), value];
-															form.setValue("watchPaths", newPaths);
-															input.value = "";
-														}
-													}
-												}}
-											/>
-											<Button
-												type="button"
-												variant="secondary"
-												onClick={() => {
-													const input = document.querySelector(
-														'input[placeholder="Enter a path to watch (e.g., src/*, dist/*)"]',
-													) as HTMLInputElement;
-													const value = input.value.trim();
-													if (value) {
-														const newPaths = [...(field.value || []), value];
-														form.setValue("watchPaths", newPaths);
-														input.value = "";
-													}
-												}}
-											>
-												Add
-											</Button>
-										</div>
-									</FormControl>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
 					</div>
 					<div className="flex w-full justify-end">
 						<Button

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

@@ -115,11 +115,7 @@ export const SaveDockerProvider = ({ applicationId }: Props) => {
 								<FormItem>
 									<FormLabel>Username</FormLabel>
 									<FormControl>
-										<Input
-											placeholder="Username"
-											autoComplete="username"
-											{...field}
-										/>
+										<Input placeholder="username" {...field} />
 									</FormControl>
 									<FormMessage />
 								</FormItem>
@@ -134,12 +130,7 @@ export const SaveDockerProvider = ({ applicationId }: Props) => {
 								<FormItem>
 									<FormLabel>Password</FormLabel>
 									<FormControl>
-										<Input
-											placeholder="Password"
-											autoComplete="one-time-code"
-											{...field}
-											type="password"
-										/>
+										<Input placeholder="Password" {...field} type="password" />
 									</FormControl>
 									<FormMessage />
 								</FormItem>

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

@@ -17,33 +17,23 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { KeyRoundIcon, LockIcon, X } from "lucide-react";
+import { KeyRoundIcon, LockIcon } from "lucide-react";
 import { useRouter } from "next/router";
-import Link from "next/link";
 
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
-import { Badge } from "@/components/ui/badge";
-import { GitIcon } from "@/components/icons/data-tools-icons";
 
 const GitProviderSchema = z.object({
-	buildPath: z.string().min(1, "Path is required").default("/"),
 	repositoryURL: z.string().min(1, {
 		message: "Repository URL is required",
 	}),
 	branch: z.string().min(1, "Branch required"),
+	buildPath: z.string().min(1, "Build Path required"),
 	sshKey: z.string().optional(),
-	watchPaths: z.array(z.string()).optional(),
 });
 
 type GitProvider = z.infer<typeof GitProviderSchema>;
@@ -66,7 +56,6 @@ export const SaveGitProvider = ({ applicationId }: Props) => {
 			buildPath: "/",
 			repositoryURL: "",
 			sshKey: undefined,
-			watchPaths: [],
 		},
 		resolver: zodResolver(GitProviderSchema),
 	});
@@ -78,7 +67,6 @@ export const SaveGitProvider = ({ applicationId }: Props) => {
 				branch: data.customGitBranch || "",
 				buildPath: data.customGitBuildPath || "/",
 				repositoryURL: data.customGitUrl || "",
-				watchPaths: data.watchPaths || [],
 			});
 		}
 	}, [form.reset, data, form]);
@@ -90,7 +78,6 @@ export const SaveGitProvider = ({ applicationId }: Props) => {
 			customGitUrl: values.repositoryURL,
 			customGitSSHKeyId: values.sshKey === "none" ? null : values.sshKey,
 			applicationId,
-			watchPaths: values.watchPaths || [],
 		})
 			.then(async () => {
 				toast.success("Git Provider Saved");
@@ -115,22 +102,9 @@ export const SaveGitProvider = ({ applicationId }: Props) => {
 								name="repositoryURL"
 								render={({ field }) => (
 									<FormItem>
-										<div className="flex items-center justify-between">
-											<FormLabel>Repository URL</FormLabel>
-											{field.value?.startsWith("https://") && (
-												<Link
-													href={field.value}
-													target="_blank"
-													rel="noopener noreferrer"
-													className="flex items-center gap-1 text-sm text-muted-foreground hover:text-primary"
-												>
-													<GitIcon className="h-4 w-4" />
-													<span>View Repository</span>
-												</Link>
-											)}
-										</div>
+										<FormLabel>Repository URL</FormLabel>
 										<FormControl>
-											<Input placeholder="Repository URL" {...field} />
+											<Input placeholder="git@bitbucket.org" {...field} />
 										</FormControl>
 										<FormMessage />
 									</FormItem>
@@ -186,22 +160,19 @@ export const SaveGitProvider = ({ applicationId }: Props) => {
 							</Button>
 						)}
 					</div>
-					<div className="space-y-4">
-						<FormField
-							control={form.control}
-							name="branch"
-							render={({ field }) => (
-								<FormItem>
-									<FormLabel>Branch</FormLabel>
-									<FormControl>
-										<Input placeholder="Branch" {...field} />
-									</FormControl>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
-					</div>
-
+					<FormField
+						control={form.control}
+						name="branch"
+						render={({ field }) => (
+							<FormItem>
+								<FormLabel>Branch</FormLabel>
+								<FormControl>
+									<Input placeholder="Branch" {...field} />
+								</FormControl>
+								<FormMessage />
+							</FormItem>
+						)}
+					/>
 					<FormField
 						control={form.control}
 						name="buildPath"
@@ -215,85 +186,6 @@ export const SaveGitProvider = ({ applicationId }: Props) => {
 							</FormItem>
 						)}
 					/>
-					<FormField
-						control={form.control}
-						name="watchPaths"
-						render={({ field }) => (
-							<FormItem className="md:col-span-2">
-								<div className="flex items-center gap-2">
-									<FormLabel>Watch Paths</FormLabel>
-									<TooltipProvider>
-										<Tooltip>
-											<TooltipTrigger>
-												<div className="size-4 rounded-full bg-muted flex items-center justify-center text-[10px] font-bold">
-													?
-												</div>
-											</TooltipTrigger>
-											<TooltipContent className="max-w-[300px]">
-												<p>
-													Add paths to watch for changes. When files in these
-													paths change, a new deployment will be triggered. This
-													will work only when manual webhook is setup.
-												</p>
-											</TooltipContent>
-										</Tooltip>
-									</TooltipProvider>
-								</div>
-								<div className="flex flex-wrap gap-2 mb-2">
-									{field.value?.map((path, index) => (
-										<Badge key={index} variant="secondary">
-											{path}
-											<X
-												className="ml-1 size-3 cursor-pointer"
-												onClick={() => {
-													const newPaths = [...(field.value || [])];
-													newPaths.splice(index, 1);
-													form.setValue("watchPaths", newPaths);
-												}}
-											/>
-										</Badge>
-									))}
-								</div>
-								<FormControl>
-									<div className="flex gap-2">
-										<Input
-											placeholder="Enter a path to watch (e.g., src/*, dist/*)"
-											onKeyDown={(e) => {
-												if (e.key === "Enter") {
-													e.preventDefault();
-													const input = e.currentTarget;
-													const value = input.value.trim();
-													if (value) {
-														const newPaths = [...(field.value || []), value];
-														form.setValue("watchPaths", newPaths);
-														input.value = "";
-													}
-												}
-											}}
-										/>
-										<Button
-											type="button"
-											variant="secondary"
-											onClick={() => {
-												const input = document.querySelector(
-													'input[placeholder="Enter a path to watch (e.g., src/*, dist/*)"]',
-												) as HTMLInputElement;
-												const value = input.value.trim();
-												if (value) {
-													const newPaths = [...(field.value || []), value];
-													form.setValue("watchPaths", newPaths);
-													input.value = "";
-												}
-											}}
-										>
-											Add
-										</Button>
-									</div>
-								</FormControl>
-								<FormMessage />
-							</FormItem>
-						)}
-					/>
 				</div>
 
 				<div className="flex flex-row justify-end">

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

@@ -28,23 +28,14 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} from "@/components/ui/tooltip";
-import { Badge } from "@/components/ui/badge";
 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 { CheckIcon, ChevronsUpDown } from "lucide-react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
-import Link from "next/link";
-import { GithubIcon } from "@/components/icons/data-tools-icons";
 
 const GithubProviderSchema = z.object({
 	buildPath: z.string().min(1, "Path is required").default("/"),
@@ -56,7 +47,6 @@ const GithubProviderSchema = z.object({
 		.required(),
 	branch: z.string().min(1, "Branch is required"),
 	githubId: z.string().min(1, "Github Provider is required"),
-	watchPaths: z.array(z.string()).optional(),
 });
 
 type GithubProvider = z.infer<typeof GithubProviderSchema>;
@@ -123,7 +113,6 @@ export const SaveGithubProvider = ({ applicationId }: Props) => {
 				},
 				buildPath: data.buildPath || "/",
 				githubId: data.githubId || "",
-				watchPaths: data.watchPaths || [],
 			});
 		}
 	}, [form.reset, data, form]);
@@ -136,7 +125,6 @@ export const SaveGithubProvider = ({ applicationId }: Props) => {
 			owner: data.repository.owner,
 			buildPath: data.buildPath,
 			githubId: data.githubId,
-			watchPaths: data.watchPaths || [],
 		})
 			.then(async () => {
 				toast.success("Service Provided Saved");
@@ -199,20 +187,7 @@ export const SaveGithubProvider = ({ applicationId }: Props) => {
 							name="repository"
 							render={({ field }) => (
 								<FormItem className="md:col-span-2 flex flex-col">
-									<div className="flex items-center justify-between">
-										<FormLabel>Repository</FormLabel>
-										{field.value.owner && field.value.repo && (
-											<Link
-												href={`https://github.com/${field.value.owner}/${field.value.repo}`}
-												target="_blank"
-												rel="noopener noreferrer"
-												className="flex items-center gap-1 text-sm text-muted-foreground hover:text-primary"
-											>
-												<GithubIcon className="h-4 w-4" />
-												<span>View Repository</span>
-											</Link>
-										)}
-									</div>
+									<FormLabel>Repository</FormLabel>
 									<Popover>
 										<PopoverTrigger asChild>
 											<FormControl>
@@ -375,85 +350,7 @@ export const SaveGithubProvider = ({ applicationId }: Props) => {
 									<FormControl>
 										<Input placeholder="/" {...field} />
 									</FormControl>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="watchPaths"
-							render={({ field }) => (
-								<FormItem className="md:col-span-2">
-									<div className="flex items-center gap-2">
-										<FormLabel>Watch Paths</FormLabel>
-										<TooltipProvider>
-											<Tooltip>
-												<TooltipTrigger asChild>
-													<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
-												</TooltipTrigger>
-												<TooltipContent>
-													<p>
-														Add paths to watch for changes. When files in these
-														paths change, a new deployment will be triggered.
-													</p>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
-									</div>
-									<div className="flex flex-wrap gap-2 mb-2">
-										{field.value?.map((path, index) => (
-											<Badge
-												key={index}
-												variant="secondary"
-												className="flex items-center gap-1"
-											>
-												{path}
-												<X
-													className="size-3 cursor-pointer hover:text-destructive"
-													onClick={() => {
-														const newPaths = [...(field.value || [])];
-														newPaths.splice(index, 1);
-														field.onChange(newPaths);
-													}}
-												/>
-											</Badge>
-										))}
-									</div>
-									<div className="flex gap-2">
-										<FormControl>
-											<Input
-												placeholder="Enter a path to watch (e.g., src/*, dist/*)"
-												onKeyDown={(e) => {
-													if (e.key === "Enter") {
-														e.preventDefault();
-														const input = e.currentTarget;
-														const path = input.value.trim();
-														if (path) {
-															field.onChange([...(field.value || []), path]);
-															input.value = "";
-														}
-													}
-												}}
-											/>
-										</FormControl>
-										<Button
-											type="button"
-											variant="outline"
-											size="icon"
-											onClick={() => {
-												const input = document.querySelector(
-													'input[placeholder*="Enter a path"]',
-												) as HTMLInputElement;
-												const path = input.value.trim();
-												if (path) {
-													field.onChange([...(field.value || []), path]);
-													input.value = "";
-												}
-											}}
-										>
-											<Plus className="size-4" />
-										</Button>
-									</div>
+
 									<FormMessage />
 								</FormItem>
 							)}

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

@@ -29,23 +29,14 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} from "@/components/ui/tooltip";
-import { Badge } from "@/components/ui/badge";
 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 { CheckIcon, ChevronsUpDown } from "lucide-react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
-import Link from "next/link";
-import { GitlabIcon } from "@/components/icons/data-tools-icons";
 
 const GitlabProviderSchema = z.object({
 	buildPath: z.string().min(1, "Path is required").default("/"),
@@ -59,7 +50,6 @@ const GitlabProviderSchema = z.object({
 		.required(),
 	branch: z.string().min(1, "Branch is required"),
 	gitlabId: z.string().min(1, "Gitlab Provider is required"),
-	watchPaths: z.array(z.string()).optional(),
 });
 
 type GitlabProvider = z.infer<typeof GitlabProviderSchema>;
@@ -134,7 +124,6 @@ export const SaveGitlabProvider = ({ applicationId }: Props) => {
 				},
 				buildPath: data.gitlabBuildPath || "/",
 				gitlabId: data.gitlabId || "",
-				watchPaths: data.watchPaths || [],
 			});
 		}
 	}, [form.reset, data, form]);
@@ -149,7 +138,6 @@ export const SaveGitlabProvider = ({ applicationId }: Props) => {
 			applicationId,
 			gitlabProjectId: data.repository.id,
 			gitlabPathNamespace: data.repository.gitlabPathNamespace,
-			watchPaths: data.watchPaths || [],
 		})
 			.then(async () => {
 				toast.success("Service Provided Saved");
@@ -215,20 +203,7 @@ export const SaveGitlabProvider = ({ applicationId }: Props) => {
 							name="repository"
 							render={({ field }) => (
 								<FormItem className="md:col-span-2 flex flex-col">
-									<div className="flex items-center justify-between">
-										<FormLabel>Repository</FormLabel>
-										{field.value.owner && field.value.repo && (
-											<Link
-												href={`https://gitlab.com/${field.value.owner}/${field.value.repo}`}
-												target="_blank"
-												rel="noopener noreferrer"
-												className="flex items-center gap-1 text-sm text-muted-foreground hover:text-primary"
-											>
-												<GitlabIcon className="h-4 w-4" />
-												<span>View Repository</span>
-											</Link>
-										)}
-									</div>
+									<FormLabel>Repository</FormLabel>
 									<Popover>
 										<PopoverTrigger asChild>
 											<FormControl>
@@ -400,85 +375,7 @@ export const SaveGitlabProvider = ({ applicationId }: Props) => {
 									<FormControl>
 										<Input placeholder="/" {...field} />
 									</FormControl>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="watchPaths"
-							render={({ field }) => (
-								<FormItem className="md:col-span-2">
-									<div className="flex items-center gap-2">
-										<FormLabel>Watch Paths</FormLabel>
-										<TooltipProvider>
-											<Tooltip>
-												<TooltipTrigger asChild>
-													<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
-												</TooltipTrigger>
-												<TooltipContent>
-													<p>
-														Add paths to watch for changes. When files in these
-														paths change, a new deployment will be triggered.
-													</p>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
-									</div>
-									<div className="flex flex-wrap gap-2 mb-2">
-										{field.value?.map((path, index) => (
-											<Badge
-												key={index}
-												variant="secondary"
-												className="flex items-center gap-1"
-											>
-												{path}
-												<X
-													className="size-3 cursor-pointer hover:text-destructive"
-													onClick={() => {
-														const newPaths = [...(field.value || [])];
-														newPaths.splice(index, 1);
-														field.onChange(newPaths);
-													}}
-												/>
-											</Badge>
-										))}
-									</div>
-									<div className="flex gap-2">
-										<FormControl>
-											<Input
-												placeholder="Enter a path to watch (e.g., src/*, dist/*)"
-												onKeyDown={(e) => {
-													if (e.key === "Enter") {
-														e.preventDefault();
-														const input = e.currentTarget;
-														const path = input.value.trim();
-														if (path) {
-															field.onChange([...(field.value || []), path]);
-															input.value = "";
-														}
-													}
-												}}
-											/>
-										</FormControl>
-										<Button
-											type="button"
-											variant="outline"
-											size="icon"
-											onClick={() => {
-												const input = document.querySelector(
-													'input[placeholder*="Enter a path"]',
-												) as HTMLInputElement;
-												const path = input.value.trim();
-												if (path) {
-													field.onChange([...(field.value || []), path]);
-													input.value = "";
-												}
-											}}
-										>
-											<Plus className="size-4" />
-										</Button>
-									</div>
+
 									<FormMessage />
 								</FormItem>
 							)}

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

@@ -10,14 +10,14 @@ import {
 	TooltipProvider,
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
-import { api } from "@/utils/api";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import { api } from "@/utils/api";
 import {
 	Ban,
 	CheckCircle2,
 	Hammer,
+	HelpCircle,
 	RefreshCcw,
-	Rocket,
 	Terminal,
 } from "lucide-react";
 import { useRouter } from "next/router";
@@ -55,7 +55,7 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 					<CardTitle className="text-xl">Deploy Settings</CardTitle>
 				</CardHeader>
 				<CardContent className="flex flex-row gap-4 flex-wrap">
-					<TooltipProvider delayDuration={0} disableHoverableContent={false}>
+					<TooltipProvider delayDuration={0}>
 						<DialogAction
 							title="Deploy Application"
 							description="Are you sure you want to deploy this application?"
@@ -79,14 +79,12 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 							<Button
 								variant="default"
 								isLoading={data?.applicationStatus === "running"}
-								className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+								className="flex items-center gap-1.5"
 							>
+								Deploy
 								<Tooltip>
 									<TooltipTrigger asChild>
-										<div className="flex items-center">
-											<Rocket className="size-4 mr-1" />
-											Deploy
-										</div>
+										<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 									</TooltipTrigger>
 									<TooltipPrimitive.Portal>
 										<TooltipContent sideOffset={5} className="z-[60]">
@@ -116,24 +114,9 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 									});
 							}}
 						>
-							<Button
-								variant="secondary"
-								isLoading={isReloading}
-								className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
-							>
-								<Tooltip>
-									<TooltipTrigger asChild>
-										<div className="flex items-center">
-											<RefreshCcw className="size-4 mr-1" />
-											Reload
-										</div>
-									</TooltipTrigger>
-									<TooltipPrimitive.Portal>
-										<TooltipContent sideOffset={5} className="z-[60]">
-											<p>Reload the application without rebuilding it</p>
-										</TooltipContent>
-									</TooltipPrimitive.Portal>
-								</Tooltip>
+							<Button variant="secondary" isLoading={isReloading}>
+								Reload
+								<RefreshCcw className="size-4" />
 							</Button>
 						</DialogAction>
 						<DialogAction
@@ -156,14 +139,13 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 							<Button
 								variant="secondary"
 								isLoading={data?.applicationStatus === "running"}
-								className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+								className="flex items-center gap-1.5"
 							>
+								Rebuild
+								<Hammer className="size-4" />
 								<Tooltip>
 									<TooltipTrigger asChild>
-										<div className="flex items-center">
-											<Hammer className="size-4 mr-1" />
-											Rebuild
-										</div>
+										<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 									</TooltipTrigger>
 									<TooltipPrimitive.Portal>
 										<TooltipContent sideOffset={5} className="z-[60]">
@@ -198,14 +180,13 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 								<Button
 									variant="secondary"
 									isLoading={isStarting}
-									className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Start
+									<CheckCircle2 className="size-4" />
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<CheckCircle2 className="size-4 mr-1" />
-												Start
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -238,14 +219,13 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 								<Button
 									variant="destructive"
 									isLoading={isStopping}
-									className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Stop
+									<Ban className="size-4" />
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<Ban className="size-4 mr-1" />
-												Stop
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -261,18 +241,15 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 						appName={data?.appName || ""}
 						serverId={data?.serverId || ""}
 					>
-						<Button
-							variant="outline"
-							className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
-						>
-							<Terminal className="size-4 mr-1" />
+						<Button variant="outline">
+							<Terminal />
 							Open Terminal
 						</Button>
 					</DockerTerminalModal>
 					<div className="flex flex-row items-center gap-2 rounded-md px-4 py-2 border">
 						<span className="text-sm font-medium">Autodeploy</span>
 						<Switch
-							aria-label="Toggle autodeploy"
+							aria-label="Toggle italic"
 							checked={data?.autoDeploy || false}
 							onCheckedChange={async (enabled) => {
 								await update({
@@ -287,29 +264,7 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 										toast.error("Error updating Auto Deploy");
 									});
 							}}
-							className="flex flex-row gap-2 items-center data-[state=checked]:bg-primary"
-						/>
-					</div>
-
-					<div className="flex flex-row items-center gap-2 rounded-md px-4 py-2 border">
-						<span className="text-sm font-medium">Clean Cache</span>
-						<Switch
-							aria-label="Toggle clean cache"
-							checked={data?.cleanCache || false}
-							onCheckedChange={async (enabled) => {
-								await update({
-									applicationId,
-									cleanCache: enabled,
-								})
-									.then(async () => {
-										toast.success("Clean Cache Updated");
-										await refetch();
-									})
-									.catch(() => {
-										toast.error("Error updating Clean Cache");
-									});
-							}}
-							className="flex flex-row gap-2 items-center data-[state=checked]:bg-primary"
+							className="flex flex-row gap-2 items-center"
 						/>
 					</div>
 				</CardContent>

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

@@ -94,7 +94,6 @@ export const AddPreviewDomain = ({
 				/* Convert null to undefined */
 				path: data?.path || undefined,
 				port: data?.port || undefined,
-				customCertResolver: data?.customCertResolver || undefined,
 			});
 		}
 

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

@@ -35,30 +35,16 @@ import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
 
-const schema = z
-	.object({
-		env: z.string(),
-		buildArgs: z.string(),
-		wildcardDomain: z.string(),
-		port: z.number(),
-		previewLimit: z.number(),
-		previewHttps: z.boolean(),
-		previewPath: z.string(),
-		previewCertificateType: z.enum(["letsencrypt", "none", "custom"]),
-		previewCustomCertResolver: z.string().optional(),
-	})
-	.superRefine((input, ctx) => {
-		if (
-			input.previewCertificateType === "custom" &&
-			!input.previewCustomCertResolver
-		) {
-			ctx.addIssue({
-				code: z.ZodIssueCode.custom,
-				path: ["previewCustomCertResolver"],
-				message: "Required",
-			});
-		}
-	});
+const schema = z.object({
+	env: z.string(),
+	buildArgs: z.string(),
+	wildcardDomain: z.string(),
+	port: z.number(),
+	previewLimit: z.number(),
+	previewHttps: z.boolean(),
+	previewPath: z.string(),
+	previewCertificateType: z.enum(["letsencrypt", "none"]),
+});
 
 type Schema = z.infer<typeof schema>;
 
@@ -104,7 +90,6 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 				previewHttps: data.previewHttps || false,
 				previewPath: data.previewPath || "/",
 				previewCertificateType: data.previewCertificateType || "none",
-				previewCustomCertResolver: data.previewCustomCertResolver || "",
 			});
 		}
 	}, [data]);
@@ -120,7 +105,6 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 			previewHttps: formData.previewHttps,
 			previewPath: formData.previewPath,
 			previewCertificateType: formData.previewCertificateType,
-			previewCustomCertResolver: formData.previewCustomCertResolver,
 		})
 			.then(() => {
 				toast.success("Preview Deployments settings updated");
@@ -200,6 +184,10 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 										render={({ field }) => (
 											<FormItem>
 												<FormLabel>Preview Limit</FormLabel>
+												{/* <FormDescription>
+													Set the limit of preview deployments that can be
+													created for this app.
+												</FormDescription> */}
 												<FormControl>
 													<NumberInput placeholder="3000" {...field} />
 												</FormControl>
@@ -250,7 +238,6 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 															<SelectItem value={"letsencrypt"}>
 																Let's Encrypt
 															</SelectItem>
-															<SelectItem value={"custom"}>Custom</SelectItem>
 														</SelectContent>
 													</Select>
 													<FormMessage />
@@ -258,25 +245,6 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 											)}
 										/>
 									)}
-
-									{form.watch("previewCertificateType") === "custom" && (
-										<FormField
-											control={form.control}
-											name="previewCustomCertResolver"
-											render={({ field }) => (
-												<FormItem>
-													<FormLabel>Certificate Provider</FormLabel>
-													<FormControl>
-														<Input
-															placeholder="my-custom-resolver"
-															{...field}
-														/>
-													</FormControl>
-													<FormMessage />
-												</FormItem>
-											)}
-										/>
-									)}
 								</div>
 								<div className="grid gap-4 lg:grid-cols-2">
 									<div className="flex flex-row items-center justify-between rounded-lg border p-4 col-span-2">

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

@@ -121,7 +121,7 @@ export const UpdateApplication = ({ applicationId }: Props) => {
 										<FormItem>
 											<FormLabel>Name</FormLabel>
 											<FormControl>
-												<Input placeholder="Vandelay Industries" {...field} />
+												<Input placeholder="Tesla" {...field} />
 											</FormControl>
 
 											<FormMessage />

apps/dokploy/components/dashboard/compose/domains/add-domain.tsx

@@ -42,7 +42,6 @@ import { domainCompose } from "@/server/db/validations/domain";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { DatabaseZap, Dices, RefreshCw } from "lucide-react";
 import type z from "zod";
-import Link from "next/link";
 
 type Domain = z.infer<typeof domainCompose>;
 
@@ -103,22 +102,8 @@ export const AddDomainCompose = ({
 		? api.domain.update.useMutation()
 		: api.domain.create.useMutation();
 
-	const { data: canGenerateTraefikMeDomains } =
-		api.domain.canGenerateTraefikMeDomains.useQuery({
-			serverId: compose?.serverId || "",
-		});
-
 	const form = useForm<Domain>({
 		resolver: zodResolver(domainCompose),
-		defaultValues: {
-			host: "",
-			path: undefined,
-			port: undefined,
-			https: false,
-			certificateType: undefined,
-			customCertResolver: undefined,
-			serviceName: "",
-		},
 	});
 
 	const https = form.watch("https");
@@ -131,21 +116,11 @@ export const AddDomainCompose = ({
 				path: data?.path || undefined,
 				port: data?.port || undefined,
 				serviceName: data?.serviceName || undefined,
-				certificateType: data?.certificateType || undefined,
-				customCertResolver: data?.customCertResolver || undefined,
 			});
 		}
 
 		if (!domainId) {
-			form.reset({
-				host: "",
-				path: undefined,
-				port: undefined,
-				https: false,
-				certificateType: undefined,
-				customCertResolver: undefined,
-				serviceName: "",
-			});
+			form.reset({});
 		}
 	}, [form, form.reset, data, isLoading]);
 
@@ -319,21 +294,6 @@ export const AddDomainCompose = ({
 									name="host"
 									render={({ field }) => (
 										<FormItem>
-											{!canGenerateTraefikMeDomains &&
-												field.value.includes("traefik.me") && (
-													<AlertBlock type="warning">
-														You need to set an IP address in your{" "}
-														<Link
-															href="/dashboard/settings/server"
-															className="text-primary"
-														>
-															{compose?.serverId
-																? "Remote Servers -> Server -> Edit Server -> Update IP Address"
-																: "Web Server -> Server -> Update Server IP"}
-														</Link>{" "}
-														to make your traefik.me domain work.
-													</AlertBlock>
-												)}
 											<FormLabel>Host</FormLabel>
 											<div className="flex gap-2">
 												<FormControl>
@@ -433,55 +393,33 @@ export const AddDomainCompose = ({
 								/>
 
 								{https && (
-									<>
-										<FormField
-											control={form.control}
-											name="certificateType"
-											render={({ field }) => (
-												<FormItem className="col-span-2">
-													<FormLabel>Certificate Provider</FormLabel>
-													<Select
-														onValueChange={field.onChange}
-														defaultValue={field.value || ""}
-													>
-														<FormControl>
-															<SelectTrigger>
-																<SelectValue placeholder="Select a certificate provider" />
-															</SelectTrigger>
-														</FormControl>
+									<FormField
+										control={form.control}
+										name="certificateType"
+										render={({ field }) => (
+											<FormItem className="col-span-2">
+												<FormLabel>Certificate Provider</FormLabel>
+												<Select
+													onValueChange={field.onChange}
+													defaultValue={field.value || ""}
+												>
+													<FormControl>
+														<SelectTrigger>
+															<SelectValue placeholder="Select a certificate provider" />
+														</SelectTrigger>
+													</FormControl>
 
-														<SelectContent>
-															<SelectItem value="none">None</SelectItem>
-															<SelectItem value={"letsencrypt"}>
-																Let's Encrypt
-															</SelectItem>
-															<SelectItem value={"custom"}>Custom</SelectItem>
-														</SelectContent>
-													</Select>
-													<FormMessage />
-												</FormItem>
-											)}
-										/>
-
-										{form.getValues().certificateType === "custom" && (
-											<FormField
-												control={form.control}
-												name="customCertResolver"
-												render={({ field }) => (
-													<FormItem className="col-span-2">
-														<FormLabel>Custom Certificate Resolver</FormLabel>
-														<FormControl>
-															<Input
-																placeholder="Enter your custom certificate resolver"
-																{...field}
-															/>
-														</FormControl>
-														<FormMessage />
-													</FormItem>
-												)}
-											/>
+													<SelectContent>
+														<SelectItem value="none">None</SelectItem>
+														<SelectItem value={"letsencrypt"}>
+															Let's Encrypt
+														</SelectItem>
+													</SelectContent>
+												</Select>
+												<FormMessage />
+											</FormItem>
 										)}
-									</>
+									/>
 								)}
 							</div>
 						</div>

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

@@ -7,9 +7,9 @@ import {
 	TooltipProvider,
 	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 { api } from "@/utils/api";
+import { Ban, CheckCircle2, Hammer, HelpCircle, Terminal } from "lucide-react";
 import { useRouter } from "next/router";
 import { toast } from "sonner";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";
@@ -34,7 +34,7 @@ export const ComposeActions = ({ composeId }: Props) => {
 		api.compose.stop.useMutation();
 	return (
 		<div className="flex flex-row gap-4 w-full flex-wrap ">
-			<TooltipProvider delayDuration={0} disableHoverableContent={false}>
+			<TooltipProvider delayDuration={0}>
 				<DialogAction
 					title="Deploy Compose"
 					description="Are you sure you want to deploy this compose?"
@@ -58,14 +58,12 @@ export const ComposeActions = ({ composeId }: Props) => {
 					<Button
 						variant="default"
 						isLoading={data?.composeStatus === "running"}
-						className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+						className="flex items-center gap-1.5"
 					>
+						Deploy
 						<Tooltip>
 							<TooltipTrigger asChild>
-								<div className="flex items-center">
-									<Rocket className="size-4 mr-1" />
-									Deploy
-								</div>
+								<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 							</TooltipTrigger>
 							<TooltipPrimitive.Portal>
 								<TooltipContent sideOffset={5} className="z-[60]">
@@ -76,37 +74,36 @@ export const ComposeActions = ({ composeId }: Props) => {
 					</Button>
 				</DialogAction>
 				<DialogAction
-					title="Reload Compose"
-					description="Are you sure you want to reload this compose?"
+					title="Rebuild Compose"
+					description="Are you sure you want to rebuild this compose?"
 					type="default"
 					onClick={async () => {
 						await redeploy({
 							composeId: composeId,
 						})
 							.then(() => {
-								toast.success("Compose reloaded successfully");
+								toast.success("Compose rebuilt successfully");
 								refetch();
 							})
 							.catch(() => {
-								toast.error("Error reloading compose");
+								toast.error("Error rebuilding compose");
 							});
 					}}
 				>
 					<Button
 						variant="secondary"
 						isLoading={data?.composeStatus === "running"}
-						className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+						className="flex items-center gap-1.5"
 					>
+						Rebuild
+						<Hammer className="size-4" />
 						<Tooltip>
 							<TooltipTrigger asChild>
-								<div className="flex items-center">
-									<RefreshCcw className="size-4 mr-1" />
-									Reload
-								</div>
+								<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 							</TooltipTrigger>
 							<TooltipPrimitive.Portal>
 								<TooltipContent sideOffset={5} className="z-[60]">
-									<p>Reload the compose without rebuilding it</p>
+									<p>Only rebuilds the compose without downloading new code</p>
 								</TooltipContent>
 							</TooltipPrimitive.Portal>
 						</Tooltip>
@@ -134,14 +131,13 @@ export const ComposeActions = ({ composeId }: Props) => {
 						<Button
 							variant="secondary"
 							isLoading={isStarting}
-							className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+							className="flex items-center gap-1.5"
 						>
+							Start
+							<CheckCircle2 className="size-4" />
 							<Tooltip>
 								<TooltipTrigger asChild>
-									<div className="flex items-center">
-										<CheckCircle2 className="size-4 mr-1" />
-										Start
-									</div>
+									<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 								</TooltipTrigger>
 								<TooltipPrimitive.Portal>
 									<TooltipContent sideOffset={5} className="z-[60]">
@@ -173,14 +169,13 @@ export const ComposeActions = ({ composeId }: Props) => {
 						<Button
 							variant="destructive"
 							isLoading={isStopping}
-							className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+							className="flex items-center gap-1.5"
 						>
+							Stop
+							<Ban className="size-4" />
 							<Tooltip>
 								<TooltipTrigger asChild>
-									<div className="flex items-center">
-										<Ban className="size-4 mr-1" />
-										Stop
-									</div>
+									<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 								</TooltipTrigger>
 								<TooltipPrimitive.Portal>
 									<TooltipContent sideOffset={5} className="z-[60]">
@@ -196,18 +191,15 @@ export const ComposeActions = ({ composeId }: Props) => {
 				appName={data?.appName || ""}
 				serverId={data?.serverId || ""}
 			>
-				<Button
-					variant="outline"
-					className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
-				>
-					<Terminal className="size-4 mr-1" />
+				<Button variant="outline">
+					<Terminal />
 					Open Terminal
 				</Button>
 			</DockerTerminalModal>
 			<div className="flex flex-row items-center gap-2 rounded-md px-4 py-2 border">
 				<span className="text-sm font-medium">Autodeploy</span>
 				<Switch
-					aria-label="Toggle autodeploy"
+					aria-label="Toggle italic"
 					checked={data?.autoDeploy || false}
 					onCheckedChange={async (enabled) => {
 						await update({
@@ -222,7 +214,7 @@ export const ComposeActions = ({ composeId }: Props) => {
 								toast.error("Error updating Auto Deploy");
 							});
 					}}
-					className="flex flex-row gap-2 items-center data-[state=checked]:bg-primary"
+					className="flex flex-row gap-2 items-center"
 				/>
 			</div>
 		</div>

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

@@ -97,7 +97,6 @@ export const ComposeFileEditor = ({ composeId }: Props) => {
 										<div className="flex flex-col gap-4 w-full outline-none focus:outline-none overflow-auto">
 											<CodeEditor
 												// disabled
-												language="yaml"
 												value={field.value}
 												className="font-mono"
 												wrapperClassName="compose-file-editor"

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

@@ -29,23 +29,14 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} 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 { CheckIcon, ChevronsUpDown } from "lucide-react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
-import { Badge } from "@/components/ui/badge";
-import { BitbucketIcon } from "@/components/icons/data-tools-icons";
-import Link from "next/link";
 
 const BitbucketProviderSchema = z.object({
 	composePath: z.string().min(1),
@@ -57,7 +48,6 @@ const BitbucketProviderSchema = z.object({
 		.required(),
 	branch: z.string().min(1, "Branch is required"),
 	bitbucketId: z.string().min(1, "Bitbucket Provider is required"),
-	watchPaths: z.array(z.string()).optional(),
 });
 
 type BitbucketProvider = z.infer<typeof BitbucketProviderSchema>;
@@ -83,7 +73,6 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 			},
 			bitbucketId: "",
 			branch: "",
-			watchPaths: [],
 		},
 		resolver: zodResolver(BitbucketProviderSchema),
 	});
@@ -129,7 +118,6 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 				},
 				composePath: data.composePath,
 				bitbucketId: data.bitbucketId || "",
-				watchPaths: data.watchPaths || [],
 			});
 		}
 	}, [form.reset, data, form]);
@@ -144,7 +132,6 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 			composeId,
 			sourceType: "bitbucket",
 			composeStatus: "idle",
-			watchPaths: data.watchPaths,
 		})
 			.then(async () => {
 				toast.success("Service Provided Saved");
@@ -210,20 +197,7 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 							name="repository"
 							render={({ field }) => (
 								<FormItem className="md:col-span-2 flex flex-col">
-									<div className="flex items-center justify-between">
-										<FormLabel>Repository</FormLabel>
-										{field.value.owner && field.value.repo && (
-											<Link
-												href={`https://bitbucket.org/${field.value.owner}/${field.value.repo}`}
-												target="_blank"
-												rel="noopener noreferrer"
-												className="flex items-center gap-1 text-sm text-muted-foreground hover:text-primary"
-											>
-												<BitbucketIcon className="h-4 w-4" />
-												<span>View Repository</span>
-											</Link>
-										)}
-									</div>
+									<FormLabel>Repository</FormLabel>
 									<Popover>
 										<PopoverTrigger asChild>
 											<FormControl>
@@ -391,84 +365,6 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 								</FormItem>
 							)}
 						/>
-						<FormField
-							control={form.control}
-							name="watchPaths"
-							render={({ field }) => (
-								<FormItem className="md:col-span-2">
-									<div className="flex items-center gap-2">
-										<FormLabel>Watch Paths</FormLabel>
-										<TooltipProvider>
-											<Tooltip>
-												<TooltipTrigger>
-													<div className="size-4 rounded-full bg-muted flex items-center justify-center text-[10px] font-bold">
-														?
-													</div>
-												</TooltipTrigger>
-												<TooltipContent>
-													<p>
-														Add paths to watch for changes. When files in these
-														paths change, a new deployment will be triggered.
-													</p>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
-									</div>
-									<div className="flex flex-wrap gap-2 mb-2">
-										{field.value?.map((path, index) => (
-											<Badge key={index} variant="secondary">
-												{path}
-												<X
-													className="ml-1 size-3 cursor-pointer"
-													onClick={() => {
-														const newPaths = [...(field.value || [])];
-														newPaths.splice(index, 1);
-														form.setValue("watchPaths", newPaths);
-													}}
-												/>
-											</Badge>
-										))}
-									</div>
-									<FormControl>
-										<div className="flex gap-2">
-											<Input
-												placeholder="Enter a path to watch (e.g., src/*, dist/*)"
-												onKeyDown={(e) => {
-													if (e.key === "Enter") {
-														e.preventDefault();
-														const input = e.currentTarget;
-														const value = input.value.trim();
-														if (value) {
-															const newPaths = [...(field.value || []), value];
-															form.setValue("watchPaths", newPaths);
-															input.value = "";
-														}
-													}
-												}}
-											/>
-											<Button
-												type="button"
-												variant="secondary"
-												onClick={() => {
-													const input = document.querySelector(
-														'input[placeholder="Enter a path to watch (e.g., src/*, dist/*)"]',
-													) as HTMLInputElement;
-													const value = input.value.trim();
-													if (value) {
-														const newPaths = [...(field.value || []), value];
-														form.setValue("watchPaths", newPaths);
-														input.value = "";
-													}
-												}}
-											>
-												Add
-											</Button>
-										</div>
-									</FormControl>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
 					</div>
 					<div className="flex w-full justify-end">
 						<Button

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

@@ -1,4 +1,3 @@
-import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import {
 	Form,
@@ -18,22 +17,14 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { KeyRoundIcon, LockIcon, X } from "lucide-react";
+import { KeyRoundIcon, LockIcon } from "lucide-react";
 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 Link from "next/link";
 
 const GitProviderSchema = z.object({
 	composePath: z.string().min(1),
@@ -42,7 +33,6 @@ const GitProviderSchema = z.object({
 	}),
 	branch: z.string().min(1, "Branch required"),
 	sshKey: z.string().optional(),
-	watchPaths: z.array(z.string()).optional(),
 });
 
 type GitProvider = z.infer<typeof GitProviderSchema>;
@@ -64,7 +54,6 @@ export const SaveGitProviderCompose = ({ composeId }: Props) => {
 			repositoryURL: "",
 			composePath: "./docker-compose.yml",
 			sshKey: undefined,
-			watchPaths: [],
 		},
 		resolver: zodResolver(GitProviderSchema),
 	});
@@ -76,7 +65,6 @@ export const SaveGitProviderCompose = ({ composeId }: Props) => {
 				branch: data.customGitBranch || "",
 				repositoryURL: data.customGitUrl || "",
 				composePath: data.composePath,
-				watchPaths: data.watchPaths || [],
 			});
 		}
 	}, [form.reset, data, form]);
@@ -89,8 +77,6 @@ export const SaveGitProviderCompose = ({ composeId }: Props) => {
 			composeId,
 			sourceType: "git",
 			composePath: values.composePath,
-			composeStatus: "idle",
-			watchPaths: values.watchPaths || [],
 		})
 			.then(async () => {
 				toast.success("Git Provider Saved");
@@ -115,22 +101,11 @@ export const SaveGitProviderCompose = ({ composeId }: Props) => {
 								name="repositoryURL"
 								render={({ field }) => (
 									<FormItem>
-										<div className="flex items-center justify-between">
-											<FormLabel>Repository URL</FormLabel>
-											{field.value?.startsWith("https://") && (
-												<Link
-													href={field.value}
-													target="_blank"
-													rel="noopener noreferrer"
-													className="flex items-center gap-1 text-sm text-muted-foreground hover:text-primary"
-												>
-													<GitIcon className="h-4 w-4" />
-													<span>View Repository</span>
-												</Link>
-											)}
-										</div>
+										<FormLabel className="flex flex-row justify-between">
+											Repository URL
+										</FormLabel>
 										<FormControl>
-											<Input placeholder="Repository URL" {...field} />
+											<Input placeholder="git@bitbucket.org" {...field} />
 										</FormControl>
 										<FormMessage />
 									</FormItem>
@@ -216,85 +191,6 @@ export const SaveGitProviderCompose = ({ composeId }: Props) => {
 							</FormItem>
 						)}
 					/>
-					<FormField
-						control={form.control}
-						name="watchPaths"
-						render={({ field }) => (
-							<FormItem className="md:col-span-2">
-								<div className="flex items-center gap-2">
-									<FormLabel>Watch Paths</FormLabel>
-									<TooltipProvider>
-										<Tooltip>
-											<TooltipTrigger>
-												<div className="size-4 rounded-full bg-muted flex items-center justify-center text-[10px] font-bold">
-													?
-												</div>
-											</TooltipTrigger>
-											<TooltipContent className="max-w-[300px]">
-												<p>
-													Add paths to watch for changes. When files in these
-													paths change, a new deployment will be triggered. This
-													will work only when manual webhook is setup.
-												</p>
-											</TooltipContent>
-										</Tooltip>
-									</TooltipProvider>
-								</div>
-								<div className="flex flex-wrap gap-2 mb-2">
-									{field.value?.map((path, index) => (
-										<Badge key={index} variant="secondary">
-											{path}
-											<X
-												className="ml-1 size-3 cursor-pointer"
-												onClick={() => {
-													const newPaths = [...(field.value || [])];
-													newPaths.splice(index, 1);
-													form.setValue("watchPaths", newPaths);
-												}}
-											/>
-										</Badge>
-									))}
-								</div>
-								<FormControl>
-									<div className="flex gap-2">
-										<Input
-											placeholder="Enter a path to watch (e.g., src/*, dist/*)"
-											onKeyDown={(e) => {
-												if (e.key === "Enter") {
-													e.preventDefault();
-													const input = e.currentTarget;
-													const value = input.value.trim();
-													if (value) {
-														const newPaths = [...(field.value || []), value];
-														form.setValue("watchPaths", newPaths);
-														input.value = "";
-													}
-												}
-											}}
-										/>
-										<Button
-											type="button"
-											variant="secondary"
-											onClick={() => {
-												const input = document.querySelector(
-													'input[placeholder="Enter a path to watch (e.g., src/*, dist/*)"]',
-												) as HTMLInputElement;
-												const value = input.value.trim();
-												if (value) {
-													const newPaths = [...(field.value || []), value];
-													form.setValue("watchPaths", newPaths);
-													input.value = "";
-												}
-											}}
-										>
-											Add
-										</Button>
-									</div>
-								</FormControl>
-								<FormMessage />
-							</FormItem>
-						)}
-					/>
 				</div>
 
 				<div className="flex flex-row justify-end">

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

@@ -1,4 +1,3 @@
-import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import {
 	Command,
@@ -29,22 +28,14 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} 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 { CheckIcon, ChevronsUpDown } from "lucide-react";
 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 Link from "next/link";
 
 const GithubProviderSchema = z.object({
 	composePath: z.string().min(1),
@@ -56,7 +47,6 @@ const GithubProviderSchema = z.object({
 		.required(),
 	branch: z.string().min(1, "Branch is required"),
 	githubId: z.string().min(1, "Github Provider is required"),
-	watchPaths: z.array(z.string()).optional(),
 });
 
 type GithubProvider = z.infer<typeof GithubProviderSchema>;
@@ -81,7 +71,6 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 			},
 			githubId: "",
 			branch: "",
-			watchPaths: [],
 		},
 		resolver: zodResolver(GithubProviderSchema),
 	});
@@ -124,7 +113,6 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 				},
 				composePath: data.composePath,
 				githubId: data.githubId || "",
-				watchPaths: data.watchPaths || [],
 			});
 		}
 	}, [form.reset, data, form]);
@@ -139,7 +127,6 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 			githubId: data.githubId,
 			sourceType: "github",
 			composeStatus: "idle",
-			watchPaths: data.watchPaths,
 		})
 			.then(async () => {
 				toast.success("Service Provided Saved");
@@ -196,25 +183,13 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 								</FormItem>
 							)}
 						/>
+
 						<FormField
 							control={form.control}
 							name="repository"
 							render={({ field }) => (
 								<FormItem className="md:col-span-2 flex flex-col">
-									<div className="flex items-center justify-between">
-										<FormLabel>Repository</FormLabel>
-										{field.value.owner && field.value.repo && (
-											<Link
-												href={`https://github.com/${field.value.owner}/${field.value.repo}`}
-												target="_blank"
-												rel="noopener noreferrer"
-												className="flex items-center gap-1 text-sm text-muted-foreground hover:text-primary"
-											>
-												<GithubIcon className="h-4 w-4" />
-												<span>View Repository</span>
-											</Link>
-										)}
-									</div>
+									<FormLabel>Repository</FormLabel>
 									<Popover>
 										<PopoverTrigger asChild>
 											<FormControl>
@@ -382,84 +357,6 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 								</FormItem>
 							)}
 						/>
-						<FormField
-							control={form.control}
-							name="watchPaths"
-							render={({ field }) => (
-								<FormItem className="md:col-span-2">
-									<div className="flex items-center gap-2">
-										<FormLabel>Watch Paths</FormLabel>
-										<TooltipProvider>
-											<Tooltip>
-												<TooltipTrigger>
-													<div className="size-4 rounded-full bg-muted flex items-center justify-center text-[10px] font-bold">
-														?
-													</div>
-												</TooltipTrigger>
-												<TooltipContent>
-													<p>
-														Add paths to watch for changes. When files in these
-														paths change, a new deployment will be triggered.
-													</p>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
-									</div>
-									<div className="flex flex-wrap gap-2 mb-2">
-										{field.value?.map((path, index) => (
-											<Badge key={index} variant="secondary">
-												{path}
-												<X
-													className="ml-1 size-3 cursor-pointer"
-													onClick={() => {
-														const newPaths = [...(field.value || [])];
-														newPaths.splice(index, 1);
-														form.setValue("watchPaths", newPaths);
-													}}
-												/>
-											</Badge>
-										))}
-									</div>
-									<FormControl>
-										<div className="flex gap-2">
-											<Input
-												placeholder="Enter a path to watch (e.g., src/*, dist/*)"
-												onKeyDown={(e) => {
-													if (e.key === "Enter") {
-														e.preventDefault();
-														const input = e.currentTarget;
-														const value = input.value.trim();
-														if (value) {
-															const newPaths = [...(field.value || []), value];
-															form.setValue("watchPaths", newPaths);
-															input.value = "";
-														}
-													}
-												}}
-											/>
-											<Button
-												type="button"
-												variant="secondary"
-												onClick={() => {
-													const input = document.querySelector(
-														'input[placeholder="Enter a path to watch (e.g., src/*, dist/*)"]',
-													) as HTMLInputElement;
-													const value = input.value.trim();
-													if (value) {
-														const newPaths = [...(field.value || []), value];
-														form.setValue("watchPaths", newPaths);
-														input.value = "";
-													}
-												}}
-											>
-												Add
-											</Button>
-										</div>
-									</FormControl>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
 					</div>
 					<div className="flex w-full justify-end">
 						<Button

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

@@ -29,23 +29,14 @@ import {
 	SelectTrigger,
 	SelectValue,
 } from "@/components/ui/select";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} 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 { CheckIcon, ChevronsUpDown } from "lucide-react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
-import { Badge } from "@/components/ui/badge";
-import { GitlabIcon } from "@/components/icons/data-tools-icons";
-import Link from "next/link";
 
 const GitlabProviderSchema = z.object({
 	composePath: z.string().min(1),
@@ -59,7 +50,6 @@ const GitlabProviderSchema = z.object({
 		.required(),
 	branch: z.string().min(1, "Branch is required"),
 	gitlabId: z.string().min(1, "Gitlab Provider is required"),
-	watchPaths: z.array(z.string()).optional(),
 });
 
 type GitlabProvider = z.infer<typeof GitlabProviderSchema>;
@@ -86,7 +76,6 @@ export const SaveGitlabProviderCompose = ({ composeId }: Props) => {
 			},
 			gitlabId: "",
 			branch: "",
-			watchPaths: [],
 		},
 		resolver: zodResolver(GitlabProviderSchema),
 	});
@@ -135,7 +124,6 @@ export const SaveGitlabProviderCompose = ({ composeId }: Props) => {
 				},
 				composePath: data.composePath,
 				gitlabId: data.gitlabId || "",
-				watchPaths: data.watchPaths || [],
 			});
 		}
 	}, [form.reset, data, form]);
@@ -152,7 +140,6 @@ export const SaveGitlabProviderCompose = ({ composeId }: Props) => {
 			gitlabPathNamespace: data.repository.gitlabPathNamespace,
 			sourceType: "gitlab",
 			composeStatus: "idle",
-			watchPaths: data.watchPaths,
 		})
 			.then(async () => {
 				toast.success("Service Provided Saved");
@@ -212,25 +199,13 @@ export const SaveGitlabProviderCompose = ({ composeId }: Props) => {
 								</FormItem>
 							)}
 						/>
+
 						<FormField
 							control={form.control}
 							name="repository"
 							render={({ field }) => (
 								<FormItem className="md:col-span-2 flex flex-col">
-									<div className="flex items-center justify-between">
-										<FormLabel>Repository</FormLabel>
-										{field.value.owner && field.value.repo && (
-											<Link
-												href={`https://gitlab.com/${field.value.owner}/${field.value.repo}`}
-												target="_blank"
-												rel="noopener noreferrer"
-												className="flex items-center gap-1 text-sm text-muted-foreground hover:text-primary"
-											>
-												<GitlabIcon className="h-4 w-4" />
-												<span>View Repository</span>
-											</Link>
-										)}
-									</div>
+									<FormLabel>Repository</FormLabel>
 									<Popover>
 										<PopoverTrigger asChild>
 											<FormControl>
@@ -407,84 +382,6 @@ export const SaveGitlabProviderCompose = ({ composeId }: Props) => {
 								</FormItem>
 							)}
 						/>
-						<FormField
-							control={form.control}
-							name="watchPaths"
-							render={({ field }) => (
-								<FormItem className="md:col-span-2">
-									<div className="flex items-center gap-2">
-										<FormLabel>Watch Paths</FormLabel>
-										<TooltipProvider>
-											<Tooltip>
-												<TooltipTrigger>
-													<div className="size-4 rounded-full bg-muted flex items-center justify-center text-[10px] font-bold">
-														?
-													</div>
-												</TooltipTrigger>
-												<TooltipContent>
-													<p>
-														Add paths to watch for changes. When files in these
-														paths change, a new deployment will be triggered.
-													</p>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
-									</div>
-									<div className="flex flex-wrap gap-2 mb-2">
-										{field.value?.map((path, index) => (
-											<Badge key={index} variant="secondary">
-												{path}
-												<X
-													className="ml-1 size-3 cursor-pointer"
-													onClick={() => {
-														const newPaths = [...(field.value || [])];
-														newPaths.splice(index, 1);
-														form.setValue("watchPaths", newPaths);
-													}}
-												/>
-											</Badge>
-										))}
-									</div>
-									<FormControl>
-										<div className="flex gap-2">
-											<Input
-												placeholder="Enter a path to watch (e.g., src/*, dist/*)"
-												onKeyDown={(e) => {
-													if (e.key === "Enter") {
-														e.preventDefault();
-														const input = e.currentTarget;
-														const value = input.value.trim();
-														if (value) {
-															const newPaths = [...(field.value || []), value];
-															form.setValue("watchPaths", newPaths);
-															input.value = "";
-														}
-													}
-												}}
-											/>
-											<Button
-												type="button"
-												variant="secondary"
-												onClick={() => {
-													const input = document.querySelector(
-														'input[placeholder="Enter a path to watch (e.g., src/*, dist/*)"]',
-													) as HTMLInputElement;
-													const value = input.value.trim();
-													if (value) {
-														const newPaths = [...(field.value || []), value];
-														form.setValue("watchPaths", newPaths);
-														input.value = "";
-													}
-												}}
-											>
-												Add
-											</Button>
-										</div>
-									</FormControl>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
 					</div>
 					<div className="flex w-full justify-end">
 						<Button

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

@@ -147,11 +147,9 @@ export const IsolatedDeployment = ({ composeId }: Props) => {
 								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>
+											<FormLabel>Enable Randomize ({data?.appName})</FormLabel>
 											<FormDescription>
-												Enable isolated deployment to the compose file.
+												Enable randomize to the compose file.
 											</FormDescription>
 										</div>
 										<FormControl>

apps/dokploy/components/dashboard/compose/general/show-converted-compose.tsx

@@ -62,11 +62,6 @@ export const ShowConvertedCompose = ({ composeId }: Props) => {
 				</DialogHeader>
 				{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
 
-				<AlertBlock type="info">
-					Preview your docker-compose file with added domains. Note: At least
-					one domain must be specified for this conversion to take effect.
-				</AlertBlock>
-
 				<div className="flex flex-row gap-2 justify-end">
 					<Button
 						variant="secondary"

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

@@ -121,7 +121,7 @@ export const UpdateCompose = ({ composeId }: Props) => {
 										<FormItem>
 											<FormLabel>Name</FormLabel>
 											<FormControl>
-												<Input placeholder="Vandelay Industries" {...field} />
+												<Input placeholder="Tesla" {...field} />
 											</FormControl>
 
 											<FormMessage />

apps/dokploy/components/dashboard/database/backups/add-backup.tsx

@@ -54,7 +54,6 @@ const AddPostgresBackup1Schema = z.object({
 	prefix: z.string().min(1, "Prefix required"),
 	enabled: z.boolean(),
 	database: z.string().min(1, "Database required"),
-	keepLatestCount: z.coerce.number().optional(),
 });
 
 type AddPostgresBackup = z.infer<typeof AddPostgresBackup1Schema>;
@@ -78,7 +77,6 @@ export const AddBackup = ({ databaseId, databaseType, refetch }: Props) => {
 			enabled: true,
 			prefix: "/",
 			schedule: "",
-			keepLatestCount: undefined,
 		},
 		resolver: zodResolver(AddPostgresBackup1Schema),
 	});
@@ -90,7 +88,6 @@ export const AddBackup = ({ databaseId, databaseType, refetch }: Props) => {
 			enabled: true,
 			prefix: "/",
 			schedule: "",
-			keepLatestCount: undefined,
 		});
 	}, [form, form.reset, form.formState.isSubmitSuccessful]);
 
@@ -120,7 +117,6 @@ export const AddBackup = ({ databaseId, databaseType, refetch }: Props) => {
 			schedule: data.schedule,
 			enabled: data.enabled,
 			database: data.database,
-			keepLatestCount: data.keepLatestCount,
 			databaseType,
 			...getDatabaseId,
 		})
@@ -269,7 +265,7 @@ export const AddBackup = ({ databaseId, databaseType, refetch }: Props) => {
 												<Input placeholder={"dokploy/"} {...field} />
 											</FormControl>
 											<FormDescription>
-												Use if you want to back up in a specific path of your
+												Use if you want to storage in a specific path of your
 												destination/bucket
 											</FormDescription>
 
@@ -278,29 +274,6 @@ export const AddBackup = ({ databaseId, databaseType, refetch }: Props) => {
 									);
 								}}
 							/>
-							<FormField
-								control={form.control}
-								name="keepLatestCount"
-								render={({ field }) => {
-									return (
-										<FormItem>
-											<FormLabel>Keep the latest</FormLabel>
-											<FormControl>
-												<Input
-													type="number"
-													placeholder={"keeps all the backups if left empty"}
-													{...field}
-												/>
-											</FormControl>
-											<FormDescription>
-												Optional. If provided, only keeps the latest N backups
-												in the cloud.
-											</FormDescription>
-											<FormMessage />
-										</FormItem>
-									);
-								}}
-							/>
 							<FormField
 								control={form.control}
 								name="enabled"

apps/dokploy/components/dashboard/database/backups/restore-backup.tsx

@@ -1,375 +0,0 @@
-import { Button } from "@/components/ui/button";
-import {
-	Command,
-	CommandEmpty,
-	CommandGroup,
-	CommandInput,
-	CommandItem,
-} from "@/components/ui/command";
-import {
-	Dialog,
-	DialogContent,
-	DialogDescription,
-	DialogFooter,
-	DialogHeader,
-	DialogTitle,
-	DialogTrigger,
-} from "@/components/ui/dialog";
-import {
-	Form,
-	FormControl,
-	FormField,
-	FormItem,
-	FormLabel,
-	FormMessage,
-} from "@/components/ui/form";
-import {
-	Popover,
-	PopoverContent,
-	PopoverTrigger,
-} from "@/components/ui/popover";
-import { ScrollArea } from "@/components/ui/scroll-area";
-import { cn } from "@/lib/utils";
-import { api } from "@/utils/api";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, Copy, RotateCcw } from "lucide-react";
-import { useState } from "react";
-import { useForm } from "react-hook-form";
-import { z } from "zod";
-import type { ServiceType } from "../../application/advanced/show-resources";
-import { debounce } from "lodash";
-import { Input } from "@/components/ui/input";
-import { type LogLine, parseLogs } from "../../docker/logs/utils";
-import { DrawerLogs } from "@/components/shared/drawer-logs";
-import { Badge } from "@/components/ui/badge";
-import copy from "copy-to-clipboard";
-import { toast } from "sonner";
-
-interface Props {
-	databaseId: string;
-	databaseType: Exclude<ServiceType, "application" | "redis">;
-	serverId: string | null;
-}
-
-const RestoreBackupSchema = z.object({
-	destinationId: z
-		.string({
-			required_error: "Please select a destination",
-		})
-		.min(1, {
-			message: "Destination is required",
-		}),
-	backupFile: z
-		.string({
-			required_error: "Please select a backup file",
-		})
-		.min(1, {
-			message: "Backup file is required",
-		}),
-	databaseName: z
-		.string({
-			required_error: "Please enter a database name",
-		})
-		.min(1, {
-			message: "Database name is required",
-		}),
-});
-
-type RestoreBackup = z.infer<typeof RestoreBackupSchema>;
-
-export const RestoreBackup = ({
-	databaseId,
-	databaseType,
-	serverId,
-}: Props) => {
-	const [isOpen, setIsOpen] = useState(false);
-	const [search, setSearch] = useState("");
-
-	const { data: destinations = [] } = api.destination.all.useQuery();
-
-	const form = useForm<RestoreBackup>({
-		defaultValues: {
-			destinationId: "",
-			backupFile: "",
-			databaseName: "",
-		},
-		resolver: zodResolver(RestoreBackupSchema),
-	});
-
-	const destionationId = form.watch("destinationId");
-
-	const debouncedSetSearch = debounce((value: string) => {
-		setSearch(value);
-	}, 300);
-
-	const { data: files = [], isLoading } = api.backup.listBackupFiles.useQuery(
-		{
-			destinationId: destionationId,
-			search,
-			serverId: serverId ?? "",
-		},
-		{
-			enabled: isOpen && !!destionationId,
-		},
-	);
-
-	const [isDrawerOpen, setIsDrawerOpen] = useState(false);
-	const [filteredLogs, setFilteredLogs] = useState<LogLine[]>([]);
-	const [isDeploying, setIsDeploying] = useState(false);
-
-	// const { mutateAsync: restore, isLoading: isRestoring } =
-	// 	api.backup.restoreBackup.useMutation();
-
-	api.backup.restoreBackupWithLogs.useSubscription(
-		{
-			databaseId,
-			databaseType,
-			databaseName: form.watch("databaseName"),
-			backupFile: form.watch("backupFile"),
-			destinationId: form.watch("destinationId"),
-		},
-		{
-			enabled: isDeploying,
-			onData(log) {
-				if (!isDrawerOpen) {
-					setIsDrawerOpen(true);
-				}
-
-				if (log === "Restore completed successfully!") {
-					setIsDeploying(false);
-				}
-				const parsedLogs = parseLogs(log);
-				setFilteredLogs((prev) => [...prev, ...parsedLogs]);
-			},
-			onError(error) {
-				console.error("Restore logs error:", error);
-				setIsDeploying(false);
-			},
-		},
-	);
-
-	const onSubmit = async (_data: RestoreBackup) => {
-		setIsDeploying(true);
-	};
-
-	return (
-		<Dialog open={isOpen} onOpenChange={setIsOpen}>
-			<DialogTrigger asChild>
-				<Button variant="outline">
-					<RotateCcw className="mr-2 size-4" />
-					Restore Backup
-				</Button>
-			</DialogTrigger>
-			<DialogContent className="sm:max-w-lg">
-				<DialogHeader>
-					<DialogTitle className="flex items-center">
-						<RotateCcw className="mr-2 size-4" />
-						Restore Backup
-					</DialogTitle>
-					<DialogDescription>
-						Select a destination and search for backup files
-					</DialogDescription>
-				</DialogHeader>
-
-				<Form {...form}>
-					<form
-						id="hook-form-restore-backup"
-						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid w-full gap-4"
-					>
-						<FormField
-							control={form.control}
-							name="destinationId"
-							render={({ field }) => (
-								<FormItem className="">
-									<FormLabel>Destination</FormLabel>
-									<Popover>
-										<PopoverTrigger asChild>
-											<FormControl>
-												<Button
-													variant="outline"
-													className={cn(
-														"w-full justify-between !bg-input",
-														!field.value && "text-muted-foreground",
-													)}
-												>
-													{field.value
-														? destinations.find(
-																(d) => d.destinationId === field.value,
-															)?.name
-														: "Select Destination"}
-													<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
-												</Button>
-											</FormControl>
-										</PopoverTrigger>
-										<PopoverContent className="p-0" align="start">
-											<Command>
-												<CommandInput
-													placeholder="Search destinations..."
-													className="h-9"
-												/>
-												<CommandEmpty>No destinations found.</CommandEmpty>
-												<ScrollArea className="h-64">
-													<CommandGroup>
-														{destinations.map((destination) => (
-															<CommandItem
-																value={destination.destinationId}
-																key={destination.destinationId}
-																onSelect={() => {
-																	form.setValue(
-																		"destinationId",
-																		destination.destinationId,
-																	);
-																}}
-															>
-																{destination.name}
-																<CheckIcon
-																	className={cn(
-																		"ml-auto h-4 w-4",
-																		destination.destinationId === field.value
-																			? "opacity-100"
-																			: "opacity-0",
-																	)}
-																/>
-															</CommandItem>
-														))}
-													</CommandGroup>
-												</ScrollArea>
-											</Command>
-										</PopoverContent>
-									</Popover>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
-
-						<FormField
-							control={form.control}
-							name="backupFile"
-							render={({ field }) => (
-								<FormItem className="">
-									<FormLabel className="flex items-center justify-between">
-										Search Backup Files
-										{field.value && (
-											<Badge variant="outline">
-												{field.value}
-												<Copy
-													className="ml-2 size-4 cursor-pointer"
-													onClick={(e) => {
-														e.stopPropagation();
-														e.preventDefault();
-														copy(field.value);
-														toast.success("Backup file copied to clipboard");
-													}}
-												/>
-											</Badge>
-										)}
-									</FormLabel>
-									<Popover>
-										<PopoverTrigger asChild>
-											<FormControl>
-												<Button
-													variant="outline"
-													className={cn(
-														"w-full justify-between !bg-input",
-														!field.value && "text-muted-foreground",
-													)}
-												>
-													{field.value || "Search and select a backup file"}
-													<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
-												</Button>
-											</FormControl>
-										</PopoverTrigger>
-										<PopoverContent className="p-0" align="start">
-											<Command>
-												<CommandInput
-													placeholder="Search backup files..."
-													onValueChange={debouncedSetSearch}
-													className="h-9"
-												/>
-												{isLoading ? (
-													<div className="py-6 text-center text-sm">
-														Loading backup files...
-													</div>
-												) : files.length === 0 && search ? (
-													<div className="py-6 text-center text-sm text-muted-foreground">
-														No backup files found for "{search}"
-													</div>
-												) : files.length === 0 ? (
-													<div className="py-6 text-center text-sm text-muted-foreground">
-														No backup files available
-													</div>
-												) : (
-													<ScrollArea className="h-64">
-														<CommandGroup>
-															{files.map((file) => (
-																<CommandItem
-																	value={file}
-																	key={file}
-																	onSelect={() => {
-																		form.setValue("backupFile", file);
-																	}}
-																>
-																	<div className="flex w-full justify-between">
-																		<span>{file}</span>
-																	</div>
-																	<CheckIcon
-																		className={cn(
-																			"ml-auto h-4 w-4",
-																			file === field.value
-																				? "opacity-100"
-																				: "opacity-0",
-																		)}
-																	/>
-																</CommandItem>
-															))}
-														</CommandGroup>
-													</ScrollArea>
-												)}
-											</Command>
-										</PopoverContent>
-									</Popover>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="databaseName"
-							render={({ field }) => (
-								<FormItem className="">
-									<FormLabel>Database Name</FormLabel>
-									<FormControl>
-										<Input {...field} placeholder="Enter database name" />
-									</FormControl>
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
-						<DialogFooter>
-							<Button
-								isLoading={isDeploying}
-								form="hook-form-restore-backup"
-								type="submit"
-								disabled={!form.watch("backupFile")}
-							>
-								Restore
-							</Button>
-						</DialogFooter>
-					</form>
-				</Form>
-
-				<DrawerLogs
-					isOpen={isDrawerOpen}
-					onClose={() => {
-						setIsDrawerOpen(false);
-						setFilteredLogs([]);
-						setIsDeploying(false);
-						// refetch();
-					}}
-					filteredLogs={filteredLogs}
-				/>
-			</DialogContent>
-		</Dialog>
-	);
-};

apps/dokploy/components/dashboard/database/backups/show-backups.tsx

@@ -20,17 +20,12 @@ import { toast } from "sonner";
 import type { ServiceType } from "../../application/advanced/show-resources";
 import { AddBackup } from "./add-backup";
 import { UpdateBackup } from "./update-backup";
-import { RestoreBackup } from "./restore-backup";
-import { useState } from "react";
 
 interface Props {
 	id: string;
 	type: Exclude<ServiceType, "application" | "redis">;
 }
 export const ShowBackups = ({ id, type }: Props) => {
-	const [activeManualBackup, setActiveManualBackup] = useState<
-		string | undefined
-	>();
 	const queryMap = {
 		postgres: () =>
 			api.postgres.one.useQuery({ postgresId: id }, { enabled: !!id }),
@@ -72,14 +67,7 @@ export const ShowBackups = ({ id, type }: Props) => {
 				</div>
 
 				{postgres && postgres?.backups?.length > 0 && (
-					<div className="flex flex-col lg:flex-row gap-4 w-full lg:w-auto">
-						<AddBackup databaseId={id} databaseType={type} refetch={refetch} />
-						<RestoreBackup
-							databaseId={id}
-							databaseType={type}
-							serverId={postgres.serverId}
-						/>
-					</div>
+					<AddBackup databaseId={id} databaseType={type} refetch={refetch} />
 				)}
 			</CardHeader>
 			<CardContent className="flex flex-col gap-4">
@@ -106,18 +94,11 @@ export const ShowBackups = ({ id, type }: Props) => {
 								<span className="text-base text-muted-foreground">
 									No backups configured
 								</span>
-								<div className="flex flex-col sm:flex-row gap-4 w-full sm:w-auto">
-									<AddBackup
-										databaseId={id}
-										databaseType={type}
-										refetch={refetch}
-									/>
-									<RestoreBackup
-										databaseId={id}
-										databaseType={type}
-										serverId={postgres.serverId}
-									/>
-								</div>
+								<AddBackup
+									databaseId={id}
+									databaseType={type}
+									refetch={refetch}
+								/>
 							</div>
 						) : (
 							<div className="flex flex-col pt-2">
@@ -125,7 +106,7 @@ export const ShowBackups = ({ id, type }: Props) => {
 									{postgres?.backups.map((backup) => (
 										<div key={backup.backupId}>
 											<div className="flex w-full flex-col md:flex-row md:items-center justify-between gap-4 md:gap-10 border rounded-lg p-4">
-												<div className="grid grid-cols-1 md:grid-cols-3 xl:grid-cols-6 flex-col gap-8">
+												<div className="grid grid-cols-1 md:grid-cols-3 xl:grid-cols-5 flex-col gap-8">
 													<div className="flex flex-col gap-1">
 														<span className="font-medium">Destination</span>
 														<span className="text-sm text-muted-foreground">
@@ -156,12 +137,6 @@ export const ShowBackups = ({ id, type }: Props) => {
 															{backup.enabled ? "Yes" : "No"}
 														</span>
 													</div>
-													<div className="flex flex-col gap-1">
-														<span className="font-medium">Keep Latest</span>
-														<span className="text-sm text-muted-foreground">
-															{backup.keepLatestCount || "All"}
-														</span>
-													</div>
 												</div>
 												<div className="flex flex-row gap-4">
 													<TooltipProvider delayDuration={0}>
@@ -170,12 +145,8 @@ export const ShowBackups = ({ id, type }: Props) => {
 																<Button
 																	type="button"
 																	variant="ghost"
-																	isLoading={
-																		isManualBackup &&
-																		activeManualBackup === backup.backupId
-																	}
+																	isLoading={isManualBackup}
 																	onClick={async () => {
-																		setActiveManualBackup(backup.backupId);
 																		await manualBackup({
 																			backupId: backup.backupId as string,
 																		})
@@ -189,7 +160,6 @@ export const ShowBackups = ({ id, type }: Props) => {
 																					"Error creating the manual backup",
 																				);
 																			});
-																		setActiveManualBackup(undefined);
 																	}}
 																>
 																	<Play className="size-5  text-muted-foreground" />
@@ -198,7 +168,6 @@ export const ShowBackups = ({ id, type }: Props) => {
 															<TooltipContent>Run Manual Backup</TooltipContent>
 														</Tooltip>
 													</TooltipProvider>
-
 													<UpdateBackup
 														backupId={backup.backupId}
 														refetch={refetch}

apps/dokploy/components/dashboard/database/backups/update-backup.tsx

@@ -47,7 +47,6 @@ const UpdateBackupSchema = z.object({
 	prefix: z.string().min(1, "Prefix required"),
 	enabled: z.boolean(),
 	database: z.string().min(1, "Database required"),
-	keepLatestCount: z.coerce.number().optional(),
 });
 
 type UpdateBackup = z.infer<typeof UpdateBackupSchema>;
@@ -79,7 +78,6 @@ export const UpdateBackup = ({ backupId, refetch }: Props) => {
 			enabled: true,
 			prefix: "/",
 			schedule: "",
-			keepLatestCount: undefined,
 		},
 		resolver: zodResolver(UpdateBackupSchema),
 	});
@@ -92,9 +90,6 @@ export const UpdateBackup = ({ backupId, refetch }: Props) => {
 				enabled: backup.enabled || false,
 				prefix: backup.prefix,
 				schedule: backup.schedule,
-				keepLatestCount: backup.keepLatestCount
-					? Number(backup.keepLatestCount)
-					: undefined,
 			});
 		}
 	}, [form, form.reset, backup]);
@@ -107,7 +102,6 @@ export const UpdateBackup = ({ backupId, refetch }: Props) => {
 			schedule: data.schedule,
 			enabled: data.enabled,
 			database: data.database,
-			keepLatestCount: data.keepLatestCount as number | null,
 		})
 			.then(async () => {
 				toast.success("Backup Updated");
@@ -259,7 +253,7 @@ export const UpdateBackup = ({ backupId, refetch }: Props) => {
 												<Input placeholder={"dokploy/"} {...field} />
 											</FormControl>
 											<FormDescription>
-												Use if you want to back up in a specific path of your
+												Use if you want to storage in a specific path of your
 												destination/bucket
 											</FormDescription>
 
@@ -268,29 +262,6 @@ export const UpdateBackup = ({ backupId, refetch }: Props) => {
 									);
 								}}
 							/>
-							<FormField
-								control={form.control}
-								name="keepLatestCount"
-								render={({ field }) => {
-									return (
-										<FormItem>
-											<FormLabel>Keep the latest</FormLabel>
-											<FormControl>
-												<Input
-													type="number"
-													placeholder={"keeps all the backups if left empty"}
-													{...field}
-												/>
-											</FormControl>
-											<FormDescription>
-												Optional. If provided, only keeps the latest N backups
-												in the cloud.
-											</FormDescription>
-											<FormMessage />
-										</FormItem>
-									);
-								}}
-							/>
 							<FormField
 								control={form.control}
 								name="enabled"

apps/dokploy/components/dashboard/docker/logs/docker-logs-id.tsx

@@ -119,6 +119,7 @@ export const DockerLogsId: React.FC<Props> = ({
 		const wsUrl = `${protocol}//${
 			window.location.host
 		}/docker-container-logs?${params.toString()}`;
+		console.log("Connecting to WebSocket:", wsUrl);
 		const ws = new WebSocket(wsUrl);
 
 		const resetNoDataTimeout = () => {
@@ -135,6 +136,7 @@ export const DockerLogsId: React.FC<Props> = ({
 				ws.close();
 				return;
 			}
+			console.log("WebSocket connected");
 			resetNoDataTimeout();
 		};
 

apps/dokploy/components/dashboard/mariadb/general/show-external-mariadb-credentials.tsx

@@ -1,4 +1,3 @@
-import { AlertBlock } from "@/components/shared/alert-block";
 import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
 import { Button } from "@/components/ui/button";
 import {
@@ -20,7 +19,6 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import Link from "next/link";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -108,20 +106,6 @@ export const ShowExternalMariadbCredentials = ({ mariadbId }: Props) => {
 						</CardDescription>
 					</CardHeader>
 					<CardContent className="flex w-full flex-col gap-4">
-						{!getIp && (
-							<AlertBlock type="warning">
-								You need to set an IP address in your{" "}
-								<Link
-									href="/dashboard/settings/server"
-									className="text-primary"
-								>
-									{data?.serverId
-										? "Remote Servers -> Server -> Edit Server -> Update IP Address"
-										: "Web Server -> Server -> Update Server IP"}
-								</Link>{" "}
-								to fix the database url connection.
-							</AlertBlock>
-						)}
 						<Form {...form}>
 							<form
 								onSubmit={form.handleSubmit(onSubmit)}

apps/dokploy/components/dashboard/mariadb/general/show-general-mariadb.tsx

@@ -8,9 +8,15 @@ import {
 	TooltipProvider,
 	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 { api } from "@/utils/api";
+import {
+	Ban,
+	CheckCircle2,
+	HelpCircle,
+	RefreshCcw,
+	Terminal,
+} from "lucide-react";
 import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
@@ -86,14 +92,12 @@ export const ShowGeneralMariadb = ({ mariadbId }: Props) => {
 								<Button
 									variant="default"
 									isLoading={data?.applicationStatus === "running"}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Deploy
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<Rocket className="size-4 mr-1" />
-												Deploy
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -103,8 +107,6 @@ export const ShowGeneralMariadb = ({ mariadbId }: Props) => {
 									</Tooltip>
 								</Button>
 							</DialogAction>
-						</TooltipProvider>
-						<TooltipProvider delayDuration={0}>
 							<DialogAction
 								title="Reload Mariadb"
 								description="Are you sure you want to reload this mariadb?"
@@ -126,14 +128,13 @@ export const ShowGeneralMariadb = ({ mariadbId }: Props) => {
 								<Button
 									variant="secondary"
 									isLoading={isReloading}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Reload
+									<RefreshCcw className="size-4" />
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<RefreshCcw className="size-4 mr-1" />
-												Reload
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -143,9 +144,7 @@ export const ShowGeneralMariadb = ({ mariadbId }: Props) => {
 									</Tooltip>
 								</Button>
 							</DialogAction>
-						</TooltipProvider>
-						{data?.applicationStatus === "idle" ? (
-							<TooltipProvider delayDuration={0}>
+							{data?.applicationStatus === "idle" ? (
 								<DialogAction
 									title="Start Mariadb"
 									description="Are you sure you want to start this mariadb?"
@@ -166,14 +165,13 @@ export const ShowGeneralMariadb = ({ mariadbId }: Props) => {
 									<Button
 										variant="secondary"
 										isLoading={isStarting}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Start
+										<CheckCircle2 className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<CheckCircle2 className="size-4 mr-1" />
-													Start
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -186,9 +184,7 @@ export const ShowGeneralMariadb = ({ mariadbId }: Props) => {
 										</Tooltip>
 									</Button>
 								</DialogAction>
-							</TooltipProvider>
-						) : (
-							<TooltipProvider delayDuration={0}>
+							) : (
 								<DialogAction
 									title="Stop Mariadb"
 									description="Are you sure you want to stop this mariadb?"
@@ -208,14 +204,13 @@ export const ShowGeneralMariadb = ({ mariadbId }: Props) => {
 									<Button
 										variant="destructive"
 										isLoading={isStopping}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Stop
+										<Ban className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<Ban className="size-4 mr-1" />
-													Stop
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -225,29 +220,15 @@ export const ShowGeneralMariadb = ({ mariadbId }: Props) => {
 										</Tooltip>
 									</Button>
 								</DialogAction>
-							</TooltipProvider>
-						)}
+							)}
+						</TooltipProvider>
 						<DockerTerminalModal
 							appName={data?.appName || ""}
 							serverId={data?.serverId || ""}
 						>
-							<Button
-								variant="outline"
-								className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
-							>
-								<Tooltip>
-									<TooltipTrigger asChild>
-										<div className="flex items-center">
-											<Terminal className="size-4 mr-1" />
-											Open Terminal
-										</div>
-									</TooltipTrigger>
-									<TooltipPrimitive.Portal>
-										<TooltipContent sideOffset={5} className="z-[60]">
-											<p>Open a terminal to the MariaDB container</p>
-										</TooltipContent>
-									</TooltipPrimitive.Portal>
-								</Tooltip>
+							<Button variant="outline">
+								<Terminal />
+								Open Terminal
 							</Button>
 						</DockerTerminalModal>
 					</CardContent>

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

@@ -119,7 +119,7 @@ export const UpdateMariadb = ({ mariadbId }: Props) => {
 										<FormItem>
 											<FormLabel>Name</FormLabel>
 											<FormControl>
-												<Input placeholder="Vandelay Industries" {...field} />
+												<Input placeholder="Tesla" {...field} />
 											</FormControl>
 
 											<FormMessage />

apps/dokploy/components/dashboard/mongo/general/show-external-mongo-credentials.tsx

@@ -1,4 +1,3 @@
-import { AlertBlock } from "@/components/shared/alert-block";
 import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
 import { Button } from "@/components/ui/button";
 import {
@@ -20,7 +19,6 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import Link from "next/link";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -108,20 +106,6 @@ export const ShowExternalMongoCredentials = ({ mongoId }: Props) => {
 						</CardDescription>
 					</CardHeader>
 					<CardContent className="flex w-full flex-col gap-4">
-						{!getIp && (
-							<AlertBlock type="warning">
-								You need to set an IP address in your{" "}
-								<Link
-									href="/dashboard/settings/server"
-									className="text-primary"
-								>
-									{data?.serverId
-										? "Remote Servers -> Server -> Edit Server -> Update IP Address"
-										: "Web Server -> Server -> Update Server IP"}
-								</Link>{" "}
-								to fix the database url connection.
-							</AlertBlock>
-						)}
 						<Form {...form}>
 							<form
 								onSubmit={form.handleSubmit(onSubmit)}

apps/dokploy/components/dashboard/mongo/general/show-general-mongo.tsx

@@ -8,9 +8,15 @@ import {
 	TooltipProvider,
 	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 { api } from "@/utils/api";
+import {
+	Ban,
+	CheckCircle2,
+	HelpCircle,
+	RefreshCcw,
+	Terminal,
+} from "lucide-react";
 import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
@@ -85,14 +91,12 @@ export const ShowGeneralMongo = ({ mongoId }: Props) => {
 								<Button
 									variant="default"
 									isLoading={data?.applicationStatus === "running"}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Deploy
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<Rocket className="size-4 mr-1" />
-												Deploy
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -123,14 +127,13 @@ export const ShowGeneralMongo = ({ mongoId }: Props) => {
 								<Button
 									variant="secondary"
 									isLoading={isReloading}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Reload
+									<RefreshCcw className="size-4" />
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<RefreshCcw className="size-4 mr-1" />
-												Reload
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -161,14 +164,13 @@ export const ShowGeneralMongo = ({ mongoId }: Props) => {
 									<Button
 										variant="secondary"
 										isLoading={isStarting}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Start
+										<CheckCircle2 className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<CheckCircle2 className="size-4 mr-1" />
-													Start
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -201,14 +203,13 @@ export const ShowGeneralMongo = ({ mongoId }: Props) => {
 									<Button
 										variant="destructive"
 										isLoading={isStopping}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Stop
+										<Ban className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<Ban className="size-4 mr-1" />
-													Stop
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -224,23 +225,9 @@ export const ShowGeneralMongo = ({ mongoId }: Props) => {
 							appName={data?.appName || ""}
 							serverId={data?.serverId || ""}
 						>
-							<Button
-								variant="outline"
-								className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
-							>
-								<Tooltip>
-									<TooltipTrigger asChild>
-										<div className="flex items-center">
-											<Terminal className="size-4 mr-1" />
-											Open Terminal
-										</div>
-									</TooltipTrigger>
-									<TooltipPrimitive.Portal>
-										<TooltipContent sideOffset={5} className="z-[60]">
-											<p>Open a terminal to the MongoDB container</p>
-										</TooltipContent>
-									</TooltipPrimitive.Portal>
-								</Tooltip>
+							<Button variant="outline">
+								<Terminal />
+								Open Terminal
 							</Button>
 						</DockerTerminalModal>
 					</CardContent>

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

@@ -121,7 +121,7 @@ export const UpdateMongo = ({ mongoId }: Props) => {
 										<FormItem>
 											<FormLabel>Name</FormLabel>
 											<FormControl>
-												<Input placeholder="Vandelay Industries" {...field} />
+												<Input placeholder="Tesla" {...field} />
 											</FormControl>
 
 											<FormMessage />

apps/dokploy/components/dashboard/monitoring/free/container/show-free-container-monitoring.tsx

@@ -218,7 +218,7 @@ export const ContainerFreeMonitoring = ({
 					<CardContent>
 						<div className="flex flex-col gap-2 w-full">
 							<span className="text-sm text-muted-foreground">
-								Used: {currentData.cpu.value}
+								Used: {currentData.cpu.value}%
 							</span>
 							<Progress value={currentData.cpu.value} className="w-[100%]" />
 							<DockerCpuChart acummulativeData={acummulativeData.cpu} />

apps/dokploy/components/dashboard/mysql/general/show-external-mysql-credentials.tsx

@@ -1,4 +1,3 @@
-import { AlertBlock } from "@/components/shared/alert-block";
 import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
 import { Button } from "@/components/ui/button";
 import {
@@ -20,7 +19,6 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import Link from "next/link";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -108,20 +106,6 @@ export const ShowExternalMysqlCredentials = ({ mysqlId }: Props) => {
 						</CardDescription>
 					</CardHeader>
 					<CardContent className="flex w-full flex-col gap-4">
-						{!getIp && (
-							<AlertBlock type="warning">
-								You need to set an IP address in your{" "}
-								<Link
-									href="/dashboard/settings/server"
-									className="text-primary"
-								>
-									{data?.serverId
-										? "Remote Servers -> Server -> Edit Server -> Update IP Address"
-										: "Web Server -> Server -> Update Server IP"}
-								</Link>{" "}
-								to fix the database url connection.
-							</AlertBlock>
-						)}
 						<Form {...form}>
 							<form
 								onSubmit={form.handleSubmit(onSubmit)}

apps/dokploy/components/dashboard/mysql/general/show-general-mysql.tsx

@@ -8,9 +8,15 @@ import {
 	TooltipProvider,
 	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 { api } from "@/utils/api";
+import {
+	Ban,
+	CheckCircle2,
+	HelpCircle,
+	RefreshCcw,
+	Terminal,
+} from "lucide-react";
 import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
@@ -71,7 +77,7 @@ export const ShowGeneralMysql = ({ mysqlId }: Props) => {
 					<CardContent className="flex flex-row gap-4 flex-wrap">
 						<TooltipProvider delayDuration={0}>
 							<DialogAction
-								title="Deploy MySQL"
+								title="Deploy Mysql"
 								description="Are you sure you want to deploy this mysql?"
 								type="default"
 								onClick={async () => {
@@ -83,14 +89,12 @@ export const ShowGeneralMysql = ({ mysqlId }: Props) => {
 								<Button
 									variant="default"
 									isLoading={data?.applicationStatus === "running"}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Deploy
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<Rocket className="size-4 mr-1" />
-												Deploy
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -101,7 +105,7 @@ export const ShowGeneralMysql = ({ mysqlId }: Props) => {
 								</Button>
 							</DialogAction>
 							<DialogAction
-								title="Reload MySQL"
+								title="Reload Mysql"
 								description="Are you sure you want to reload this mysql?"
 								type="default"
 								onClick={async () => {
@@ -110,25 +114,24 @@ export const ShowGeneralMysql = ({ mysqlId }: Props) => {
 										appName: data?.appName || "",
 									})
 										.then(() => {
-											toast.success("MySQL reloaded successfully");
+											toast.success("Mysql reloaded successfully");
 											refetch();
 										})
 										.catch(() => {
-											toast.error("Error reloading MySQL");
+											toast.error("Error reloading Mysql");
 										});
 								}}
 							>
 								<Button
 									variant="secondary"
 									isLoading={isReloading}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Reload
+									<RefreshCcw className="size-4" />
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<RefreshCcw className="size-4 mr-1" />
-												Reload
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -140,7 +143,7 @@ export const ShowGeneralMysql = ({ mysqlId }: Props) => {
 							</DialogAction>
 							{data?.applicationStatus === "idle" ? (
 								<DialogAction
-									title="Start MySQL"
+									title="Start Mysql"
 									description="Are you sure you want to start this mysql?"
 									type="default"
 									onClick={async () => {
@@ -148,25 +151,24 @@ export const ShowGeneralMysql = ({ mysqlId }: Props) => {
 											mysqlId: mysqlId,
 										})
 											.then(() => {
-												toast.success("MySQL started successfully");
+												toast.success("Mysql started successfully");
 												refetch();
 											})
 											.catch(() => {
-												toast.error("Error starting MySQL");
+												toast.error("Error starting Mysql");
 											});
 									}}
 								>
 									<Button
 										variant="secondary"
 										isLoading={isStarting}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Start
+										<CheckCircle2 className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<CheckCircle2 className="size-4 mr-1" />
-													Start
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -181,32 +183,31 @@ export const ShowGeneralMysql = ({ mysqlId }: Props) => {
 								</DialogAction>
 							) : (
 								<DialogAction
-									title="Stop MySQL"
+									title="Stop Mysql"
 									description="Are you sure you want to stop this mysql?"
 									onClick={async () => {
 										await stop({
 											mysqlId: mysqlId,
 										})
 											.then(() => {
-												toast.success("MySQL stopped successfully");
+												toast.success("Mysql stopped successfully");
 												refetch();
 											})
 											.catch(() => {
-												toast.error("Error stopping MySQL");
+												toast.error("Error stopping Mysql");
 											});
 									}}
 								>
 									<Button
 										variant="destructive"
 										isLoading={isStopping}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Stop
+										<Ban className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<Ban className="size-4 mr-1" />
-													Stop
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -222,23 +223,9 @@ export const ShowGeneralMysql = ({ mysqlId }: Props) => {
 							appName={data?.appName || ""}
 							serverId={data?.serverId || ""}
 						>
-							<Button
-								variant="outline"
-								className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
-							>
-								<Tooltip>
-									<TooltipTrigger asChild>
-										<div className="flex items-center">
-											<Terminal className="size-4 mr-1" />
-											Open Terminal
-										</div>
-									</TooltipTrigger>
-									<TooltipPrimitive.Portal>
-										<TooltipContent sideOffset={5} className="z-[60]">
-											<p>Open a terminal to the MySQL container</p>
-										</TooltipContent>
-									</TooltipPrimitive.Portal>
-								</Tooltip>
+							<Button variant="outline">
+								<Terminal />
+								Open Terminal
 							</Button>
 						</DockerTerminalModal>
 					</CardContent>

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

@@ -119,7 +119,7 @@ export const UpdateMysql = ({ mysqlId }: Props) => {
 										<FormItem>
 											<FormLabel>Name</FormLabel>
 											<FormControl>
-												<Input placeholder="Vandelay Industries" {...field} />
+												<Input placeholder="Tesla" {...field} />
 											</FormControl>
 
 											<FormMessage />

apps/dokploy/components/dashboard/postgres/general/show-external-postgres-credentials.tsx

@@ -1,4 +1,3 @@
-import { AlertBlock } from "@/components/shared/alert-block";
 import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
 import { Button } from "@/components/ui/button";
 import {
@@ -20,7 +19,6 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import Link from "next/link";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -110,20 +108,6 @@ export const ShowExternalPostgresCredentials = ({ postgresId }: Props) => {
 						</CardDescription>
 					</CardHeader>
 					<CardContent className="flex w-full flex-col gap-4">
-						{!getIp && (
-							<AlertBlock type="warning">
-								You need to set an IP address in your{" "}
-								<Link
-									href="/dashboard/settings/server"
-									className="text-primary"
-								>
-									{data?.serverId
-										? "Remote Servers -> Server -> Edit Server -> Update IP Address"
-										: "Web Server -> Server -> Update Server IP"}
-								</Link>{" "}
-								to fix the database url connection.
-							</AlertBlock>
-						)}
 						<Form {...form}>
 							<form
 								onSubmit={form.handleSubmit(onSubmit)}

apps/dokploy/components/dashboard/postgres/general/show-general-postgres.tsx

@@ -8,9 +8,15 @@ import {
 	TooltipProvider,
 	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 { api } from "@/utils/api";
+import {
+	Ban,
+	CheckCircle2,
+	HelpCircle,
+	RefreshCcw,
+	Terminal,
+} from "lucide-react";
 import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
@@ -72,9 +78,9 @@ export const ShowGeneralPostgres = ({ postgresId }: Props) => {
 						<CardTitle className="text-xl">Deploy Settings</CardTitle>
 					</CardHeader>
 					<CardContent className="flex flex-row gap-4 flex-wrap">
-						<TooltipProvider disableHoverableContent={false}>
+						<TooltipProvider delayDuration={0}>
 							<DialogAction
-								title="Deploy PostgreSQL"
+								title="Deploy Postgres"
 								description="Are you sure you want to deploy this postgres?"
 								type="default"
 								onClick={async () => {
@@ -86,14 +92,12 @@ export const ShowGeneralPostgres = ({ postgresId }: Props) => {
 								<Button
 									variant="default"
 									isLoading={data?.applicationStatus === "running"}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Deploy
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<Rocket className="size-4 mr-1" />
-												Deploy
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -104,7 +108,7 @@ export const ShowGeneralPostgres = ({ postgresId }: Props) => {
 								</Button>
 							</DialogAction>
 							<DialogAction
-								title="Reload PostgreSQL"
+								title="Reload Postgres"
 								description="Are you sure you want to reload this postgres?"
 								type="default"
 								onClick={async () => {
@@ -113,25 +117,24 @@ export const ShowGeneralPostgres = ({ postgresId }: Props) => {
 										appName: data?.appName || "",
 									})
 										.then(() => {
-											toast.success("PostgreSQL reloaded successfully");
+											toast.success("Postgres reloaded successfully");
 											refetch();
 										})
 										.catch(() => {
-											toast.error("Error reloading PostgreSQL");
+											toast.error("Error reloading Postgres");
 										});
 								}}
 							>
 								<Button
 									variant="secondary"
 									isLoading={isReloading}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Reload
+									<RefreshCcw className="size-4" />
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<RefreshCcw className="size-4 mr-1" />
-												Reload
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -143,7 +146,7 @@ export const ShowGeneralPostgres = ({ postgresId }: Props) => {
 							</DialogAction>
 							{data?.applicationStatus === "idle" ? (
 								<DialogAction
-									title="Start PostgreSQL"
+									title="Start Postgres"
 									description="Are you sure you want to start this postgres?"
 									type="default"
 									onClick={async () => {
@@ -151,25 +154,24 @@ export const ShowGeneralPostgres = ({ postgresId }: Props) => {
 											postgresId: postgresId,
 										})
 											.then(() => {
-												toast.success("PostgreSQL started successfully");
+												toast.success("Postgres started successfully");
 												refetch();
 											})
 											.catch(() => {
-												toast.error("Error starting PostgreSQL");
+												toast.error("Error starting Postgres");
 											});
 									}}
 								>
 									<Button
 										variant="secondary"
 										isLoading={isStarting}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Start
+										<CheckCircle2 className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<CheckCircle2 className="size-4 mr-1" />
-													Start
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -184,32 +186,31 @@ export const ShowGeneralPostgres = ({ postgresId }: Props) => {
 								</DialogAction>
 							) : (
 								<DialogAction
-									title="Stop PostgreSQL"
+									title="Stop Postgres"
 									description="Are you sure you want to stop this postgres?"
 									onClick={async () => {
 										await stop({
 											postgresId: postgresId,
 										})
 											.then(() => {
-												toast.success("PostgreSQL stopped successfully");
+												toast.success("Postgres stopped successfully");
 												refetch();
 											})
 											.catch(() => {
-												toast.error("Error stopping PostgreSQL");
+												toast.error("Error stopping Postgres");
 											});
 									}}
 								>
 									<Button
 										variant="destructive"
 										isLoading={isStopping}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Stop
+										<Ban className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<Ban className="size-4 mr-1" />
-													Stop
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -225,23 +226,9 @@ export const ShowGeneralPostgres = ({ postgresId }: Props) => {
 							appName={data?.appName || ""}
 							serverId={data?.serverId || ""}
 						>
-							<Button
-								variant="outline"
-								className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
-							>
-								<Tooltip>
-									<TooltipTrigger asChild>
-										<div className="flex items-center">
-											<Terminal className="size-4 mr-1" />
-											Open Terminal
-										</div>
-									</TooltipTrigger>
-									<TooltipPrimitive.Portal>
-										<TooltipContent sideOffset={5} className="z-[60]">
-											<p>Open a terminal to the PostgreSQL container</p>
-										</TooltipContent>
-									</TooltipPrimitive.Portal>
-								</Tooltip>
+							<Button variant="outline">
+								<Terminal />
+								Open Terminal
 							</Button>
 						</DockerTerminalModal>
 					</CardContent>

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

@@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { PenBox } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -94,9 +94,9 @@ export const UpdatePostgres = ({ postgresId }: Props) => {
 				<Button
 					variant="ghost"
 					size="icon"
-					className="group hover:bg-blue-500/10 focus-visible:ring-2 focus-visible:ring-offset-2"
+					className="group hover:bg-blue-500/10 "
 				>
-					<PenBox className="size-3.5 text-primary group-hover:text-blue-500" />
+					<PenBoxIcon className="size-3.5  text-primary group-hover:text-blue-500" />
 				</Button>
 			</DialogTrigger>
 			<DialogContent className="max-h-screen overflow-y-auto sm:max-w-lg">
@@ -121,7 +121,7 @@ export const UpdatePostgres = ({ postgresId }: Props) => {
 										<FormItem>
 											<FormLabel>Name</FormLabel>
 											<FormControl>
-												<Input placeholder="Vandelay Industries" {...field} />
+												<Input placeholder="Tesla" {...field} />
 											</FormControl>
 
 											<FormMessage />
@@ -151,7 +151,6 @@ export const UpdatePostgres = ({ postgresId }: Props) => {
 										isLoading={isLoading}
 										form="hook-form-update-postgres"
 										type="submit"
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
 									>
 										Update
 									</Button>

apps/dokploy/components/dashboard/project/add-database.tsx

@@ -494,7 +494,7 @@ export const AddDatabase = ({ projectId, projectName }: Props) => {
 												<Input
 													type="password"
 													placeholder="******************"
-													autoComplete="one-time-code"
+													autoComplete="off"
 													{...field}
 												/>
 											</FormControl>

apps/dokploy/components/dashboard/project/add-template.tsx

@@ -1,4 +1,3 @@
-import { GithubIcon } from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import {
 	AlertDialog,
@@ -58,67 +57,32 @@ import {
 	BookText,
 	CheckIcon,
 	ChevronsUpDown,
+	Github,
 	Globe,
 	HelpCircle,
 	LayoutGrid,
 	List,
-	Loader2,
 	PuzzleIcon,
 	SearchIcon,
 } from "lucide-react";
 import Link from "next/link";
-import { useState, useEffect } from "react";
+import { useState } from "react";
 import { toast } from "sonner";
 
-const TEMPLATE_BASE_URL_KEY = "dokploy_template_base_url";
-
 interface Props {
 	projectId: string;
-	baseUrl?: string;
 }
 
-export const AddTemplate = ({ projectId, baseUrl }: Props) => {
+export const AddTemplate = ({ projectId }: Props) => {
 	const [query, setQuery] = useState("");
 	const [open, setOpen] = useState(false);
 	const [viewMode, setViewMode] = useState<"detailed" | "icon">("detailed");
 	const [selectedTags, setSelectedTags] = useState<string[]>([]);
-	const [customBaseUrl, setCustomBaseUrl] = useState<string | undefined>(() => {
-		// Try to get from props first, then localStorage
-		if (baseUrl) return baseUrl;
-		if (typeof window !== "undefined") {
-			return localStorage.getItem(TEMPLATE_BASE_URL_KEY) || undefined;
-		}
-		return undefined;
-	});
-
-	// Save to localStorage when customBaseUrl changes
-	useEffect(() => {
-		if (customBaseUrl) {
-			localStorage.setItem(TEMPLATE_BASE_URL_KEY, customBaseUrl);
-		} else {
-			localStorage.removeItem(TEMPLATE_BASE_URL_KEY);
-		}
-	}, [customBaseUrl]);
-
-	const {
-		data,
-		isLoading: isLoadingTemplates,
-		error: errorTemplates,
-		isError: isErrorTemplates,
-	} = api.compose.templates.useQuery(
-		{ baseUrl: customBaseUrl },
-		{
-			enabled: open,
-		},
-	);
+	const { data } = api.compose.templates.useQuery();
 	const { data: isCloud } = api.settings.isCloud.useQuery();
 	const { data: servers } = api.server.withSSHKey.useQuery();
-	const { data: tags, isLoading: isLoadingTags } = api.compose.getTags.useQuery(
-		{ baseUrl: customBaseUrl },
-		{
-			enabled: open,
-		},
-	);
+	const { data: tags, isLoading: isLoadingTags } =
+		api.compose.getTags.useQuery();
 	const utils = api.useUtils();
 
 	const [serverId, setServerId] = useState<string | undefined>(undefined);
@@ -165,14 +129,6 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 									className="w-full sm:w-[200px]"
 									value={query}
 								/>
-								<Input
-									placeholder="Base URL (optional)"
-									onChange={(e) =>
-										setCustomBaseUrl(e.target.value || undefined)
-									}
-									className="w-full sm:w-[300px]"
-									value={customBaseUrl || ""}
-								/>
 								<Popover modal={true}>
 									<PopoverTrigger asChild>
 										<Button
@@ -276,20 +232,7 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 							</AlertBlock>
 						)}
 
-						{isErrorTemplates && (
-							<AlertBlock type="error" className="mb-4">
-								{errorTemplates?.message}
-							</AlertBlock>
-						)}
-
-						{isLoadingTemplates ? (
-							<div className="flex justify-center items-center w-full h-full flex-row gap-4">
-								<Loader2 className="size-8 text-muted-foreground animate-spin min-h-[60vh]" />
-								<div className="text-lg font-medium text-muted-foreground">
-									Loading templates...
-								</div>
-							</div>
-						) : templates.length === 0 ? (
+						{templates.length === 0 ? (
 							<div className="flex justify-center items-center w-full gap-2 min-h-[50vh]">
 								<SearchIcon className="text-muted-foreground size-6" />
 								<div className="text-xl font-medium text-muted-foreground">
@@ -305,9 +248,9 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 										: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6",
 								)}
 							>
-								{templates?.map((template) => (
+								{templates?.map((template, index) => (
 									<div
-										key={template.id}
+										key={`template-${index}`}
 										className={cn(
 											"flex flex-col border rounded-lg overflow-hidden relative",
 											viewMode === "icon" && "h-[200px]",
@@ -317,6 +260,7 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 										<Badge className="absolute top-2 right-2" variant="blue">
 											{template.version}
 										</Badge>
+										{/* Template Header */}
 										<div
 											className={cn(
 												"flex-none p-6 pb-3 flex flex-col items-center gap-4 bg-muted/30",
@@ -324,7 +268,7 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 											)}
 										>
 											<img
-												src={`${customBaseUrl || "https://templates.dokploy.com/"}/blueprints/${template.id}/${template.logo}`}
+												src={`/templates/${template.logo}`}
 												className={cn(
 													"object-contain",
 													viewMode === "detailed" ? "size-24" : "size-16",
@@ -377,7 +321,7 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 														target="_blank"
 														className="text-muted-foreground hover:text-foreground transition-colors"
 													>
-														<GithubIcon className="size-5" />
+														<Github className="size-5" />
 													</Link>
 													{template.links.website && (
 														<Link
@@ -439,9 +383,8 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 																		side="top"
 																	>
 																		<span>
-																			If no server is selected, the application
-																			will be deployed on the server where the
-																			user is logged in.
+																			If no server is selected, the application will be
+																			deployed on the server where the user is logged in.
 																		</span>
 																	</TooltipContent>
 																</Tooltip>
@@ -487,19 +430,18 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 																	projectId,
 																	serverId: serverId || undefined,
 																	id: template.id,
-																	baseUrl: customBaseUrl,
 																});
 																toast.promise(promise, {
 																	loading: "Setting up...",
-																	success: () => {
+																	success: (_data) => {
 																		utils.project.one.invalidate({
 																			projectId,
 																		});
 																		setOpen(false);
 																		return `${template.name} template created successfully`;
 																	},
-																	error: () => {
-																		return `An error occurred deploying ${template.name} template`;
+																	error: (_err) => {
+																		return `An error ocurred deploying ${template.name} template`;
 																	},
 																});
 															}}

apps/dokploy/components/dashboard/projects/handle-project.tsx

@@ -148,7 +148,7 @@ export const HandleProject = ({ projectId }: Props) => {
 									<FormItem>
 										<FormLabel>Name</FormLabel>
 										<FormControl>
-											<Input placeholder="Vandelay Industries" {...field} />
+											<Input placeholder="Tesla" {...field} />
 										</FormControl>
 
 										<FormMessage />

apps/dokploy/components/dashboard/projects/show.tsx

@@ -115,7 +115,7 @@ export const ShowProjects = () => {
 											</span>
 										</div>
 									)}
-									<div className="w-full grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-4 3xl:grid-cols-5 flex-wrap gap-5">
+									<div className="w-full  grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-4 flex-wrap gap-5">
 										{filteredProjects?.map((project) => {
 											const emptyServices =
 												project?.mariadb.length === 0 &&
@@ -186,9 +186,7 @@ export const ShowProjects = () => {
 																										target="_blank"
 																										href={`${domain.https ? "https" : "http"}://${domain.host}${domain.path}`}
 																									>
-																										<span className="truncate">
-																											{domain.host}
-																										</span>
+																										<span>{domain.host}</span>
 																										<ExternalLinkIcon className="size-4 shrink-0" />
 																									</Link>
 																								</DropdownMenuItem>
@@ -224,9 +222,7 @@ export const ShowProjects = () => {
 																										target="_blank"
 																										href={`${domain.https ? "https" : "http"}://${domain.host}${domain.path}`}
 																									>
-																										<span className="truncate">
-																											{domain.host}
-																										</span>
+																										<span>{domain.host}</span>
 																										<ExternalLinkIcon className="size-4 shrink-0" />
 																									</Link>
 																								</DropdownMenuItem>

apps/dokploy/components/dashboard/redis/general/show-external-redis-credentials.tsx

@@ -1,4 +1,3 @@
-import { AlertBlock } from "@/components/shared/alert-block";
 import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
 import { Button } from "@/components/ui/button";
 import {
@@ -20,7 +19,6 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import Link from "next/link";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -102,20 +100,6 @@ export const ShowExternalRedisCredentials = ({ redisId }: Props) => {
 						</CardDescription>
 					</CardHeader>
 					<CardContent className="flex w-full flex-col gap-4">
-						{!getIp && (
-							<AlertBlock type="warning">
-								You need to set an IP address in your{" "}
-								<Link
-									href="/dashboard/settings/server"
-									className="text-primary"
-								>
-									{data?.serverId
-										? "Remote Servers -> Server -> Edit Server -> Update IP Address"
-										: "Web Server -> Server -> Update Server IP"}
-								</Link>{" "}
-								to fix the database url connection.
-							</AlertBlock>
-						)}
 						<Form {...form}>
 							<form
 								onSubmit={form.handleSubmit(onSubmit)}

apps/dokploy/components/dashboard/redis/general/show-general-redis.tsx

@@ -8,9 +8,15 @@ import {
 	TooltipProvider,
 	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 { api } from "@/utils/api";
+import {
+	Ban,
+	CheckCircle2,
+	HelpCircle,
+	RefreshCcw,
+	Terminal,
+} from "lucide-react";
 import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
@@ -85,14 +91,12 @@ export const ShowGeneralRedis = ({ redisId }: Props) => {
 								<Button
 									variant="default"
 									isLoading={data?.applicationStatus === "running"}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Deploy
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<Rocket className="size-4 mr-1" />
-												Deploy
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -123,14 +127,13 @@ export const ShowGeneralRedis = ({ redisId }: Props) => {
 								<Button
 									variant="secondary"
 									isLoading={isReloading}
-									className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+									className="flex items-center gap-1.5"
 								>
+									Reload
+									<RefreshCcw className="size-4" />
 									<Tooltip>
 										<TooltipTrigger asChild>
-											<div className="flex items-center">
-												<RefreshCcw className="size-4 mr-1" />
-												Reload
-											</div>
+											<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 										</TooltipTrigger>
 										<TooltipPrimitive.Portal>
 											<TooltipContent sideOffset={5} className="z-[60]">
@@ -161,14 +164,13 @@ export const ShowGeneralRedis = ({ redisId }: Props) => {
 									<Button
 										variant="secondary"
 										isLoading={isStarting}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Start
+										<CheckCircle2 className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<CheckCircle2 className="size-4 mr-1" />
-													Start
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -201,14 +203,13 @@ export const ShowGeneralRedis = ({ redisId }: Props) => {
 									<Button
 										variant="destructive"
 										isLoading={isStopping}
-										className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
+										className="flex items-center gap-1.5"
 									>
+										Stop
+										<Ban className="size-4" />
 										<Tooltip>
 											<TooltipTrigger asChild>
-												<div className="flex items-center">
-													<Ban className="size-4 mr-1" />
-													Stop
-												</div>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipPrimitive.Portal>
 												<TooltipContent sideOffset={5} className="z-[60]">
@@ -224,23 +225,9 @@ export const ShowGeneralRedis = ({ redisId }: Props) => {
 							appName={data?.appName || ""}
 							serverId={data?.serverId || ""}
 						>
-							<Button
-								variant="outline"
-								className="flex items-center gap-1.5 focus-visible:ring-2 focus-visible:ring-offset-2"
-							>
-								<Tooltip>
-									<TooltipTrigger asChild>
-										<div className="flex items-center">
-											<Terminal className="size-4 mr-1" />
-											Open Terminal
-										</div>
-									</TooltipTrigger>
-									<TooltipPrimitive.Portal>
-										<TooltipContent sideOffset={5} className="z-[60]">
-											<p>Open a terminal to the Redis container</p>
-										</TooltipContent>
-									</TooltipPrimitive.Portal>
-								</Tooltip>
+							<Button variant="outline">
+								<Terminal />
+								Open Terminal
 							</Button>
 						</DockerTerminalModal>
 					</CardContent>

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

@@ -119,7 +119,7 @@ export const UpdateRedis = ({ redisId }: Props) => {
 										<FormItem>
 											<FormLabel>Name</FormLabel>
 											<FormControl>
-												<Input placeholder="Vandelay Industries" {...field} />
+												<Input placeholder="Tesla" {...field} />
 											</FormControl>
 
 											<FormMessage />

apps/dokploy/components/dashboard/settings/api/add-api-key.tsx

@@ -31,8 +31,6 @@ import {
 	FormDescription,
 } from "@/components/ui/form";
 import { Switch } from "@/components/ui/switch";
-import copy from "copy-to-clipboard";
-import { CodeEditor } from "@/components/shared/code-editor";
 
 const formSchema = z.object({
 	name: z.string().min(1, "Name is required"),
@@ -443,16 +441,13 @@ export const AddApiKey = () => {
 						</DialogDescription>
 					</DialogHeader>
 					<div className="mt-4 space-y-4">
-						<CodeEditor
-							className="font-mono text-sm break-all"
-							language="properties"
-							value={newApiKey}
-							readOnly
-						/>
+						<div className="rounded-md bg-muted p-4 font-mono text-sm break-all">
+							{newApiKey}
+						</div>
 						<div className="flex justify-end gap-3">
 							<Button
 								onClick={() => {
-									copy(newApiKey);
+									navigator.clipboard.writeText(newApiKey);
 									toast.success("API key copied to clipboard");
 								}}
 							>

apps/dokploy/components/dashboard/settings/cluster/nodes/add-node.tsx

@@ -12,13 +12,8 @@ import { ExternalLink, PlusIcon } from "lucide-react";
 import Link from "next/link";
 import { AddManager } from "./manager/add-manager";
 import { AddWorker } from "./workers/add-worker";
-import { AlertBlock } from "@/components/shared/alert-block";
 
-interface Props {
-	serverId?: string;
-}
-
-export const AddNode = ({ serverId }: Props) => {
+export const AddNode = () => {
 	return (
 		<Dialog>
 			<DialogTrigger asChild>
@@ -49,10 +44,6 @@ export const AddNode = ({ serverId }: Props) => {
 							Architecture
 							<ExternalLink className="h-4 w-4" />
 						</Link>
-						<AlertBlock type="warning">
-							Make sure you use the same architecture as the node you are
-							adding.
-						</AlertBlock>
 					</DialogDescription>
 				</DialogHeader>
 				<div className="flex flex-col gap-2">
@@ -61,11 +52,11 @@ export const AddNode = ({ serverId }: Props) => {
 							<TabsTrigger value="worker">Worker</TabsTrigger>
 							<TabsTrigger value="manager">Manager</TabsTrigger>
 						</TabsList>
-						<TabsContent value="worker" className="pt-4 overflow-hidden">
-							<AddWorker serverId={serverId} />
+						<TabsContent value="worker" className="pt-4">
+							<AddWorker />
 						</TabsContent>
-						<TabsContent value="manager" className="pt-4 overflow-hidden">
-							<AddManager serverId={serverId} />
+						<TabsContent value="manager" className="pt-4">
+							<AddManager />
 						</TabsContent>
 					</Tabs>
 				</div>

apps/dokploy/components/dashboard/settings/cluster/nodes/manager/add-manager.tsx

@@ -1,4 +1,3 @@
-import { AlertBlock } from "@/components/shared/alert-block";
 import { CardContent } from "@/components/ui/card";
 import {
 	DialogDescription,
@@ -7,74 +6,60 @@ import {
 } from "@/components/ui/dialog";
 import { api } from "@/utils/api";
 import copy from "copy-to-clipboard";
-import { CopyIcon, Loader2 } from "lucide-react";
+import { CopyIcon } from "lucide-react";
 import { toast } from "sonner";
 
-interface Props {
-	serverId?: string;
-}
-
-export const AddManager = ({ serverId }: Props) => {
-	const { data, isLoading, error, isError } = api.cluster.addManager.useQuery({
-		serverId,
-	});
+export const AddManager = () => {
+	const { data } = api.cluster.addManager.useQuery();
 
 	return (
 		<>
-			<CardContent className="sm:max-w-4xl  flex flex-col gap-4 px-0">
-				<DialogHeader>
-					<DialogTitle>Add a new manager</DialogTitle>
-					<DialogDescription>Add a new manager</DialogDescription>
-				</DialogHeader>
-				{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
-				{isLoading ? (
-					<Loader2 className="w-full animate-spin text-muted-foreground" />
-				) : (
-					<>
-						<div className="flex flex-col gap-2.5 text-sm">
-							<span>
-								1. Go to your new server and run the following command
-							</span>
-							<span className="bg-muted rounded-lg p-2 flex justify-between">
-								curl https://get.docker.com | sh -s -- --version {data?.version}
-								<button
-									type="button"
-									className="self-center"
-									onClick={() => {
-										copy(
-											`curl https://get.docker.com | sh -s -- --version ${data?.version}`,
-										);
-										toast.success("Copied to clipboard");
-									}}
-								>
-									<CopyIcon className="h-4 w-4 cursor-pointer" />
-								</button>
-							</span>
-						</div>
+			<div>
+				<CardContent className="sm:max-w-4xl max-h-screen overflow-y-auto flex flex-col gap-4 px-0">
+					<DialogHeader>
+						<DialogTitle>Add a new manager</DialogTitle>
+						<DialogDescription>Add a new manager</DialogDescription>
+					</DialogHeader>
+					<div className="flex flex-col gap-2.5 text-sm">
+						<span>1. Go to your new server and run the following command</span>
+						<span className="bg-muted rounded-lg p-2 flex justify-between">
+							curl https://get.docker.com | sh -s -- --version {data?.version}
+							<button
+								type="button"
+								className="self-center"
+								onClick={() => {
+									copy(
+										`curl https://get.docker.com | sh -s -- --version ${data?.version}`,
+									);
+									toast.success("Copied to clipboard");
+								}}
+							>
+								<CopyIcon className="h-4 w-4 cursor-pointer" />
+							</button>
+						</span>
+					</div>
 
-						<div className="flex flex-col gap-2.5 text-sm">
-							<span>
-								2. Run the following command to add the node(manager) to your
-								cluster
-							</span>
-
-							<span className="bg-muted rounded-lg p-2  flex">
-								{data?.command}
-								<button
-									type="button"
-									className="self-start"
-									onClick={() => {
-										copy(data?.command || "");
-										toast.success("Copied to clipboard");
-									}}
-								>
-									<CopyIcon className="h-4 w-4 cursor-pointer" />
-								</button>
-							</span>
-						</div>
-					</>
-				)}
-			</CardContent>
+					<div className="flex flex-col gap-2.5 text-sm">
+						<span>
+							2. Run the following command to add the node(manager) to your
+							cluster
+						</span>
+						<span className="bg-muted rounded-lg p-2  flex">
+							{data?.command}
+							<button
+								type="button"
+								className="self-start"
+								onClick={() => {
+									copy(data?.command || "");
+									toast.success("Copied to clipboard");
+								}}
+							>
+								<CopyIcon className="h-4 w-4 cursor-pointer" />
+							</button>
+						</span>
+					</div>
+				</CardContent>
+			</div>
 		</>
 	);
 };

apps/dokploy/components/dashboard/settings/cluster/nodes/show-nodes-modal.tsx

@@ -1,30 +0,0 @@
-import { Dialog, DialogContent, DialogTrigger } from "@/components/ui/dialog";
-import { DropdownMenuItem } from "@/components/ui/dropdown-menu";
-import { useState } from "react";
-import { ShowNodes } from "./show-nodes";
-
-interface Props {
-	serverId: string;
-}
-
-export const ShowNodesModal = ({ serverId }: Props) => {
-	const [isOpen, setIsOpen] = useState(false);
-
-	return (
-		<Dialog open={isOpen} onOpenChange={setIsOpen}>
-			<DialogTrigger asChild>
-				<DropdownMenuItem
-					className="w-full cursor-pointer "
-					onSelect={(e) => e.preventDefault()}
-				>
-					Show Swarm Nodes
-				</DropdownMenuItem>
-			</DialogTrigger>
-			<DialogContent className="sm:max-w-5xl  overflow-y-auto max-h-screen ">
-				<div className="grid w-full gap-1">
-					<ShowNodes serverId={serverId} />
-				</div>
-			</DialogContent>
-		</Dialog>
-	);
-};

apps/dokploy/components/dashboard/settings/cluster/nodes/show-nodes.tsx

@@ -32,25 +32,13 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
-import {
-	Boxes,
-	HelpCircle,
-	LockIcon,
-	MoreHorizontal,
-	Loader2,
-} from "lucide-react";
+import { Boxes, HelpCircle, LockIcon, MoreHorizontal } from "lucide-react";
 import { toast } from "sonner";
 import { AddNode } from "./add-node";
 import { ShowNodeData } from "./show-node-data";
 
-interface Props {
-	serverId?: string;
-}
-
-export const ShowNodes = ({ serverId }: Props) => {
-	const { data, isLoading, refetch } = api.cluster.getNodes.useQuery({
-		serverId,
-	});
+export const ShowNodes = () => {
+	const { data, isLoading, refetch } = api.cluster.getNodes.useQuery();
 	const { data: registry } = api.registry.all.useQuery();
 
 	const { mutateAsync: deleteNode } = api.cluster.removeWorker.useMutation();
@@ -70,17 +58,14 @@ export const ShowNodes = ({ serverId }: Props) => {
 						</div>
 						{haveAtLeastOneRegistry && (
 							<div className="flex flex-row gap-2">
-								<AddNode serverId={serverId} />
+								<AddNode />
 							</div>
 						)}
 					</CardHeader>
 					<CardContent className="space-y-2 py-8 border-t min-h-[35vh]">
-						{isLoading ? (
-							<div className="flex items-center justify-center w-full h-[40vh]">
-								<Loader2 className="size-8 animate-spin text-muted-foreground" />
-							</div>
-						) : haveAtLeastOneRegistry ? (
+						{haveAtLeastOneRegistry ? (
 							<div className="grid md:grid-cols-1 gap-4">
+								{isLoading && <div>Loading...</div>}
 								<Table>
 									<TableCaption>
 										A list of your managers / workers.
@@ -144,7 +129,7 @@ export const ShowNodes = ({ serverId }: Props) => {
 															<DropdownMenuContent align="end">
 																<DropdownMenuLabel>Actions</DropdownMenuLabel>
 																<ShowNodeData data={node} />
-																{!node?.ManagerStatus?.Leader && (
+																{node?.ManagerStatus?.Leader && (
 																	<DialogAction
 																		title="Delete Node"
 																		description="Are you sure you want to delete this node from the cluster?"
@@ -152,7 +137,6 @@ export const ShowNodes = ({ serverId }: Props) => {
 																		onClick={async () => {
 																			await deleteNode({
 																				nodeId: node.ID,
-																				serverId,
 																			})
 																				.then(() => {
 																					refetch();

apps/dokploy/components/dashboard/settings/cluster/nodes/workers/add-worker.tsx

@@ -1,4 +1,3 @@
-import { AlertBlock } from "@/components/shared/alert-block";
 import { CardContent } from "@/components/ui/card";
 import {
 	DialogDescription,
@@ -7,70 +6,58 @@ import {
 } from "@/components/ui/dialog";
 import { api } from "@/utils/api";
 import copy from "copy-to-clipboard";
-import { CopyIcon, Loader2 } from "lucide-react";
+import { CopyIcon } from "lucide-react";
 import { toast } from "sonner";
 
-interface Props {
-	serverId?: string;
-}
-
-export const AddWorker = ({ serverId }: Props) => {
-	const { data, isLoading, error, isError } = api.cluster.addWorker.useQuery({
-		serverId,
-	});
+export const AddWorker = () => {
+	const { data } = api.cluster.addWorker.useQuery();
 
 	return (
-		<CardContent className="sm:max-w-4xl   flex flex-col gap-4 px-0">
-			<DialogHeader>
-				<DialogTitle>Add a new worker</DialogTitle>
-				<DialogDescription>Add a new worker</DialogDescription>
-			</DialogHeader>
-			{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
-			{isLoading ? (
-				<Loader2 className="w-full animate-spin text-muted-foreground" />
-			) : (
-				<>
-					<div className="flex flex-col gap-2.5 text-sm">
-						<span>1. Go to your new server and run the following command</span>
-						<span className="bg-muted rounded-lg p-2 flex justify-between">
-							curl https://get.docker.com | sh -s -- --version {data?.version}
-							<button
-								type="button"
-								className="self-center"
-								onClick={() => {
-									copy(
-										`curl https://get.docker.com | sh -s -- --version ${data?.version}`,
-									);
-									toast.success("Copied to clipboard");
-								}}
-							>
-								<CopyIcon className="h-4 w-4 cursor-pointer" />
-							</button>
-						</span>
-					</div>
+		<div>
+			<CardContent className="sm:max-w-4xl max-h-screen overflow-y-auto flex flex-col gap-4 px-0">
+				<DialogHeader>
+					<DialogTitle>Add a new worker</DialogTitle>
+					<DialogDescription>Add a new worker</DialogDescription>
+				</DialogHeader>
+				<div className="flex flex-col gap-2.5 text-sm">
+					<span>1. Go to your new server and run the following command</span>
+					<span className="bg-muted rounded-lg p-2 flex justify-between">
+						curl https://get.docker.com | sh -s -- --version {data?.version}
+						<button
+							type="button"
+							className="self-center"
+							onClick={() => {
+								copy(
+									`curl https://get.docker.com | sh -s -- --version ${data?.version}`,
+								);
+								toast.success("Copied to clipboard");
+							}}
+						>
+							<CopyIcon className="h-4 w-4 cursor-pointer" />
+						</button>
+					</span>
+				</div>
 
-					<div className="flex flex-col gap-2.5 text-sm">
-						<span>
-							2. Run the following command to add the node(worker) to your
-							cluster
-						</span>
+				<div className="flex flex-col gap-2.5 text-sm">
+					<span>
+						2. Run the following command to add the node(worker) to your cluster
+					</span>
 
-						<span className="bg-muted rounded-lg p-2  flex">
-							{data?.command}
-							<button
-								type="button"
-								className="self-start"
-								onClick={() => {
-									copy(data?.command || "");
-									toast.success("Copied to clipboard");
-								}}
-							>
-								<CopyIcon className="h-4 w-4 cursor-pointer" />
-							</button>
-						</span>
-					</div>
-				</>
-			)}
-		</CardContent>
+					<span className="bg-muted rounded-lg p-2  flex">
+						{data?.command}
+						<button
+							type="button"
+							className="self-start"
+							onClick={() => {
+								copy(data?.command || "");
+								toast.success("Copied to clipboard");
+							}}
+						>
+							<CopyIcon className="h-4 w-4 cursor-pointer" />
+						</button>
+					</span>
+				</div>
+			</CardContent>
+		</div>
 	);
 };

apps/dokploy/components/dashboard/settings/cluster/registry/handle-registry.tsx

@@ -207,7 +207,7 @@ export const HandleRegistry = ({ registryId }: Props) => {
 										<FormControl>
 											<Input
 												placeholder="Username"
-												autoComplete="username"
+												autoComplete="off"
 												{...field}
 											/>
 										</FormControl>
@@ -227,7 +227,7 @@ export const HandleRegistry = ({ registryId }: Props) => {
 										<FormControl>
 											<Input
 												placeholder="Password"
-												autoComplete="one-time-code"
+												autoComplete="off"
 												{...field}
 												type="password"
 											/>

apps/dokploy/components/dashboard/settings/notifications/handle-notifications.tsx

@@ -663,16 +663,13 @@ export const HandleNotifications = ({ notificationId }: Props) => {
 																{...field}
 																onChange={(e) => {
 																	const value = e.target.value;
-																	if (value === "") {
-																		field.onChange(undefined);
-																	} else {
+																	if (value) {
 																		const port = Number.parseInt(value);
 																		if (port > 0 && port < 65536) {
 																			field.onChange(port);
 																		}
 																	}
 																}}
-																value={field.value || ""}
 																type="number"
 															/>
 														</FormControl>

apps/dokploy/components/dashboard/settings/profile/enable-2fa.tsx

@@ -64,12 +64,12 @@ export const Enable2FA = () => {
 	const handlePasswordSubmit = async (formData: PasswordForm) => {
 		setIsPasswordLoading(true);
 		try {
-			const { data: enableData, error } = await authClient.twoFactor.enable({
+			const { data: enableData } = await authClient.twoFactor.enable({
 				password: formData.password,
 			});
 
 			if (!enableData) {
-				throw new Error(error?.message || "Error enabling 2FA");
+				throw new Error("No data received from server");
 			}
 
 			if (enableData.backupCodes) {
@@ -95,8 +95,7 @@ export const Enable2FA = () => {
 				error instanceof Error ? error.message : "Error setting up 2FA",
 			);
 			passwordForm.setError("password", {
-				message:
-					error instanceof Error ? error.message : "Error setting up 2FA",
+				message: "Error verifying password",
 			});
 		} finally {
 			setIsPasswordLoading(false);

apps/dokploy/components/dashboard/settings/servers/actions/show-traefik-actions.tsx

@@ -59,17 +59,15 @@ export const ShowTraefikActions = ({ serverId }: Props) => {
 								.then(async () => {
 									toast.success("Traefik Reloaded");
 								})
-								.catch(() => {});
+								.catch(() => {
+									toast.error("Error reloading Traefik");
+								});
 						}}
 						className="cursor-pointer"
 					>
 						<span>{t("settings.server.webServer.reload")}</span>
 					</DropdownMenuItem>
-					<ShowModalLogs
-						appName="dokploy-traefik"
-						serverId={serverId}
-						type="standalone"
-					>
+					<ShowModalLogs appName="dokploy-traefik" serverId={serverId}>
 						<DropdownMenuItem
 							onSelect={(e) => e.preventDefault()}
 							className="cursor-pointer"
@@ -110,6 +108,15 @@ export const ShowTraefikActions = ({ serverId }: Props) => {
 							{haveTraefikDashboardPortEnabled ? "Disable" : "Enable"} Dashboard
 						</span>
 					</DropdownMenuItem>
+					{/* 
+								<DockerTerminalModal appName="dokploy-traefik">
+									<DropdownMenuItem
+										className="w-full cursor-pointer space-x-3"
+										onSelect={(e) => e.preventDefault()}
+									>
+										<span>Enter the terminal</span>
+									</DropdownMenuItem>
+								</DockerTerminalModal> */}
 					<ManageTraefikPorts serverId={serverId}>
 						<DropdownMenuItem
 							onSelect={(e) => e.preventDefault()}

apps/dokploy/components/dashboard/settings/servers/show-servers.tsx

@@ -42,7 +42,6 @@ import { ShowMonitoringModal } from "./show-monitoring-modal";
 import { ShowSwarmOverviewModal } from "./show-swarm-overview-modal";
 import { ShowTraefikFileSystemModal } from "./show-traefik-file-system-modal";
 import { WelcomeSuscription } from "./welcome-stripe/welcome-suscription";
-import { ShowNodesModal } from "../cluster/nodes/show-nodes-modal";
 
 export const ShowServers = () => {
 	const { t } = useTranslation("settings");
@@ -329,9 +328,6 @@ export const ShowServers = () => {
 																						<ShowSwarmOverviewModal
 																							serverId={server.serverId}
 																						/>
-																						<ShowNodesModal
-																							serverId={server.serverId}
-																						/>
 																					</>
 																				)}
 																			</DropdownMenuContent>

apps/dokploy/components/dashboard/settings/ssh-keys/handle-ssh-keys.tsx

@@ -112,17 +112,15 @@ export const HandleSSHKeys = ({ sshKeyId }: Props) => {
 				toast.error("Error generating the SSH Key");
 			});
 
-	const downloadKey = (content: string, keyType: "private" | "public") => {
+	const downloadKey = (
+		content: string,
+		defaultFilename: string,
+		keyType: "private" | "public",
+	) => {
 		const keyName = form.watch("name");
-		const publicKey = form.watch("publicKey");
-
-		// Extract algorithm type from public key
-		const isEd25519 = publicKey.startsWith("ssh-ed25519");
-		const defaultName = isEd25519 ? "id_ed25519" : "id_rsa";
-
 		const filename = keyName
-			? `${keyName}${sshKeyId ? `_${sshKeyId}` : ""}_${keyType}_${defaultName}${keyType === "public" ? ".pub" : ""}`
-			: `${defaultName}${keyType === "public" ? ".pub" : ""}`;
+			? `${keyName}${sshKeyId ? `_${sshKeyId}` : ""}_${keyType}_${defaultFilename}`
+			: `${keyType}_${defaultFilename}`;
 		const blob = new Blob([content], { type: "text/plain" });
 		const url = window.URL.createObjectURL(blob);
 		const a = document.createElement("a");
@@ -275,7 +273,7 @@ export const HandleSSHKeys = ({ sshKeyId }: Props) => {
 										variant="outline"
 										size="default"
 										onClick={() =>
-											downloadKey(form.watch("privateKey"), "private")
+											downloadKey(form.watch("privateKey"), "id_rsa", "private")
 										}
 										className="flex items-center gap-2"
 									>
@@ -289,7 +287,11 @@ export const HandleSSHKeys = ({ sshKeyId }: Props) => {
 										variant="outline"
 										size="default"
 										onClick={() =>
-											downloadKey(form.watch("publicKey"), "public")
+											downloadKey(
+												form.watch("publicKey"),
+												"id_rsa.pub",
+												"public",
+											)
 										}
 										className="flex items-center gap-2"
 									>

apps/dokploy/components/dashboard/settings/web-domain.tsx

@@ -35,7 +35,7 @@ const addServerDomain = z
 	.object({
 		domain: z.string().min(1, { message: "URL is required" }),
 		letsEncryptEmail: z.string(),
-		certificateType: z.enum(["letsencrypt", "none", "custom"]),
+		certificateType: z.enum(["letsencrypt", "none"]),
 	})
 	.superRefine((data, ctx) => {
 		if (data.certificateType === "letsencrypt" && !data.letsEncryptEmail) {
@@ -193,7 +193,6 @@ export const WebDomain = () => {
 										);
 									}}
 								/>
-
 								<div className="flex w-full justify-end col-span-2">
 									<Button isLoading={isLoading} type="submit">
 										{t("settings.common.save")}

apps/dokploy/components/dashboard/settings/web-server/docker-terminal-modal.tsx

@@ -1,4 +1,3 @@
-import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import {
 	Dialog,
@@ -24,7 +23,6 @@ import { Loader2 } from "lucide-react";
 import dynamic from "next/dynamic";
 import type React from "react";
 import { useEffect, useState } from "react";
-import { badgeStateColor } from "../../application/logs/show";
 
 const Terminal = dynamic(
 	() =>
@@ -111,10 +109,7 @@ export const DockerTerminalModal = ({ children, appName, serverId }: Props) => {
 									key={container.containerId}
 									value={container.containerId}
 								>
-									{container.name} ({container.containerId}){" "}
-									<Badge variant={badgeStateColor(container.state)}>
-										{container.state}
-									</Badge>
+									{container.name} ({container.containerId}) {container.state}
 								</SelectItem>
 							))}
 							<SelectLabel>Containers ({data?.length})</SelectLabel>

apps/dokploy/components/dashboard/settings/web-server/manage-traefik-ports.tsx

@@ -19,6 +19,13 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { ScrollArea } from "@/components/ui/scroll-area";
+import {
+	Select,
+	SelectContent,
+	SelectItem,
+	SelectTrigger,
+	SelectValue,
+} from "@/components/ui/select";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { ArrowRightLeft, Plus, Trash2 } from "lucide-react";
@@ -37,6 +44,7 @@ interface Props {
 const PortSchema = z.object({
 	targetPort: z.number().min(1, "Target port is required"),
 	publishedPort: z.number().min(1, "Published port is required"),
+	publishMode: z.enum(["ingress", "host"]),
 });
 
 const TraefikPortsSchema = z.object({
@@ -80,7 +88,7 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 	}, [currentPorts, form]);
 
 	const handleAddPort = () => {
-		append({ targetPort: 0, publishedPort: 0 });
+		append({ targetPort: 0, publishedPort: 0, publishMode: "host" });
 	};
 
 	const onSubmit = async (data: TraefikPortsForm) => {
@@ -91,7 +99,9 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 			});
 			toast.success(t("settings.server.webServer.traefik.portsUpdated"));
 			setOpen(false);
-		} catch (_error) {}
+		} catch (_error) {
+			toast.error(t("settings.server.webServer.traefik.portsUpdateError"));
+		}
 	};
 
 	return (
@@ -144,7 +154,7 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 										<div className="grid gap-4">
 											{fields.map((field, index) => (
 												<Card key={field.id}>
-													<CardContent className="grid grid-cols-[1fr_1fr_auto] gap-4 p-4 transparent">
+													<CardContent className="grid grid-cols-[1fr_1fr_1.5fr_auto] gap-4 p-4 transparent">
 														<FormField
 															control={form.control}
 															name={`ports.${index}.targetPort`}
@@ -159,15 +169,9 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 																		<Input
 																			type="number"
 																			{...field}
-																			onChange={(e) => {
-																				const value = e.target.value;
-																				field.onChange(
-																					value === ""
-																						? undefined
-																						: Number(value),
-																				);
-																			}}
-																			value={field.value || ""}
+																			onChange={(e) =>
+																				field.onChange(Number(e.target.value))
+																			}
 																			className="w-full dark:bg-black"
 																			placeholder="e.g. 8080"
 																		/>
@@ -191,15 +195,9 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 																		<Input
 																			type="number"
 																			{...field}
-																			onChange={(e) => {
-																				const value = e.target.value;
-																				field.onChange(
-																					value === ""
-																						? undefined
-																						: Number(value),
-																				);
-																			}}
-																			value={field.value || ""}
+																			onChange={(e) =>
+																				field.onChange(Number(e.target.value))
+																			}
 																			className="w-full dark:bg-black"
 																			placeholder="e.g. 80"
 																		/>
@@ -209,6 +207,39 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 															)}
 														/>
 
+														<FormField
+															control={form.control}
+															name={`ports.${index}.publishMode`}
+															render={({ field }) => (
+																<FormItem>
+																	<FormLabel className="text-sm font-medium text-muted-foreground">
+																		{t(
+																			"settings.server.webServer.traefik.publishMode",
+																		)}
+																	</FormLabel>
+																	<Select
+																		onValueChange={field.onChange}
+																		value={field.value}
+																	>
+																		<FormControl>
+																			<SelectTrigger className="dark:bg-black">
+																				<SelectValue />
+																			</SelectTrigger>
+																		</FormControl>
+																		<SelectContent>
+																			<SelectItem value="host">
+																				Host Mode
+																			</SelectItem>
+																			<SelectItem value="ingress">
+																				Ingress Mode
+																			</SelectItem>
+																		</SelectContent>
+																	</Select>
+																	<FormMessage />
+																</FormItem>
+															)}
+														/>
+
 														<div className="flex items-end">
 															<Button
 																onClick={() => remove(index)}
@@ -232,23 +263,30 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 											<span className="text-sm">
 												<strong>
 													Each port mapping defines how external traffic reaches
-													your containers through Traefik.
+													your containers.
 												</strong>
 												<ul className="pt-2">
 													<li>
-														<strong>Target Port:</strong> The port inside your
-														container that the service is listening on.
+														<strong>Host Mode:</strong> Directly binds the port
+														to the host machine.
+														<ul className="p-2 list-inside list-disc">
+															<li>
+																Best for single-node deployments or when you
+																need guaranteed port availability.
+															</li>
+														</ul>
 													</li>
 													<li>
-														<strong>Published Port:</strong> The port on your
-														host machine that will be mapped to the target port.
+														<strong>Ingress Mode:</strong> Routes through Docker
+														Swarm's load balancer.
+														<ul className="p-2 list-inside list-disc">
+															<li>
+																Recommended for multi-node deployments and
+																better scalability.
+															</li>
+														</ul>
 													</li>
 												</ul>
-												<p className="mt-2">
-													All ports are bound directly to the host machine,
-													allowing Traefik to handle incoming traffic and route
-													it appropriately to your services.
-												</p>
 											</span>
 										</div>
 									</AlertBlock>

apps/dokploy/components/dashboard/settings/web-server/show-modal-logs.tsx

@@ -21,8 +21,6 @@ import { Loader2 } from "lucide-react";
 import dynamic from "next/dynamic";
 import type React from "react";
 import { useEffect, useState } from "react";
-import { badgeStateColor } from "../../application/logs/show";
-import { Badge } from "@/components/ui/badge";
 
 export const DockerLogsId = dynamic(
 	() =>
@@ -38,20 +36,13 @@ interface Props {
 	appName: string;
 	children?: React.ReactNode;
 	serverId?: string;
-	type?: "standalone" | "swarm";
 }
 
-export const ShowModalLogs = ({
-	appName,
-	children,
-	serverId,
-	type = "swarm",
-}: Props) => {
+export const ShowModalLogs = ({ appName, children, serverId }: Props) => {
 	const { data, isLoading } = api.docker.getContainersByAppLabel.useQuery(
 		{
 			appName,
 			serverId,
-			type,
 		},
 		{
 			enabled: !!appName,
@@ -92,10 +83,7 @@ export const ShowModalLogs = ({
 										key={container.containerId}
 										value={container.containerId}
 									>
-										{container.name} ({container.containerId}){" "}
-										<Badge variant={badgeStateColor(container.state)}>
-											{container.state}
-										</Badge>
+										{container.name} ({container.containerId}) {container.state}
 									</SelectItem>
 								))}
 								<SelectLabel>Containers ({data?.length})</SelectLabel>

apps/dokploy/components/dashboard/shared/rebuild-database.tsx

@@ -1,119 +0,0 @@
-import {
-	AlertDialog,
-	AlertDialogAction,
-	AlertDialogCancel,
-	AlertDialogContent,
-	AlertDialogDescription,
-	AlertDialogFooter,
-	AlertDialogHeader,
-	AlertDialogTitle,
-	AlertDialogTrigger,
-} from "@/components/ui/alert-dialog";
-import { Button } from "@/components/ui/button";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
-import { api } from "@/utils/api";
-import { DatabaseIcon, AlertTriangle } from "lucide-react";
-import { toast } from "sonner";
-
-interface Props {
-	id: string;
-	type: "postgres" | "mysql" | "mariadb" | "mongo" | "redis";
-}
-
-export const RebuildDatabase = ({ id, type }: Props) => {
-	const utils = api.useUtils();
-
-	const mutationMap = {
-		postgres: () => api.postgres.rebuild.useMutation(),
-		mysql: () => api.mysql.rebuild.useMutation(),
-		mariadb: () => api.mariadb.rebuild.useMutation(),
-		mongo: () => api.mongo.rebuild.useMutation(),
-		redis: () => api.redis.rebuild.useMutation(),
-	};
-
-	const { mutateAsync, isLoading } = mutationMap[type]();
-
-	const handleRebuild = async () => {
-		try {
-			await mutateAsync({
-				postgresId: type === "postgres" ? id : "",
-				mysqlId: type === "mysql" ? id : "",
-				mariadbId: type === "mariadb" ? id : "",
-				mongoId: type === "mongo" ? id : "",
-				redisId: type === "redis" ? id : "",
-			});
-			toast.success("Database rebuilt successfully");
-			await utils.invalidate();
-		} catch (error) {
-			toast.error("Error rebuilding database", {
-				description: error instanceof Error ? error.message : "Unknown error",
-			});
-		}
-	};
-
-	return (
-		<Card className="bg-background border-destructive/50">
-			<CardHeader>
-				<CardTitle className="text-xl flex items-center gap-2">
-					<AlertTriangle className="h-5 w-5 text-destructive" />
-					Danger Zone
-				</CardTitle>
-			</CardHeader>
-			<CardContent>
-				<div className="flex flex-col gap-4">
-					<div className="flex flex-col gap-2">
-						<h3 className="text-base font-semibold">Rebuild Database</h3>
-						<p className="text-sm text-muted-foreground">
-							This action will completely reset your database to its initial
-							state. All data, tables, and configurations will be removed.
-						</p>
-					</div>
-					<AlertDialog>
-						<AlertDialogTrigger asChild>
-							<Button
-								isLoading={isLoading}
-								variant="outline"
-								className="w-full border-destructive/50 hover:bg-destructive/10 hover:text-destructive text-destructive"
-							>
-								<DatabaseIcon className="mr-2 h-4 w-4" />
-								Rebuild Database
-							</Button>
-						</AlertDialogTrigger>
-						<AlertDialogContent>
-							<AlertDialogHeader>
-								<AlertDialogTitle className="flex items-center gap-2">
-									<AlertTriangle className="h-5 w-5 text-destructive" />
-									Are you absolutely sure?
-								</AlertDialogTitle>
-								<AlertDialogDescription className="space-y-2">
-									<p>This action will:</p>
-									<ul className="list-disc list-inside space-y-1">
-										<li>Stop the current database service</li>
-										<li>Delete all existing data and volumes</li>
-										<li>Reset to the default configuration</li>
-										<li>Restart the service with a clean state</li>
-									</ul>
-									<p className="font-medium text-destructive mt-4">
-										This action cannot be undone.
-									</p>
-								</AlertDialogDescription>
-							</AlertDialogHeader>
-							<AlertDialogFooter>
-								<AlertDialogCancel>Cancel</AlertDialogCancel>
-								<AlertDialogAction
-									onClick={handleRebuild}
-									className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
-									asChild
-								>
-									<Button isLoading={isLoading} type="submit">
-										Yes, rebuild database
-									</Button>
-								</AlertDialogAction>
-							</AlertDialogFooter>
-						</AlertDialogContent>
-					</AlertDialog>
-				</div>
-			</CardContent>
-		</Card>
-	);
-};

apps/dokploy/components/dashboard/shared/show-database-advanced-settings.tsx

@@ -1,20 +0,0 @@
-import { ShowCustomCommand } from "@/components/dashboard/postgres/advanced/show-custom-command";
-import { ShowResources } from "@/components/dashboard/application/advanced/show-resources";
-import { ShowVolumes } from "@/components/dashboard/application/advanced/volumes/show-volumes";
-import { RebuildDatabase } from "./rebuild-database";
-
-interface Props {
-	id: string;
-	type: "postgres" | "mysql" | "mariadb" | "mongo" | "redis";
-}
-
-export const ShowDatabaseAdvancedSettings = ({ id, type }: Props) => {
-	return (
-		<div className="flex w-full flex-col gap-5">
-			<ShowCustomCommand id={id} type={type} />
-			<ShowVolumes id={id} type={type} />
-			<ShowResources id={id} type={type} />
-			<RebuildDatabase id={id} type={type} />
-		</div>
-	);
-};

apps/dokploy/components/dashboard/swarm/monitoring-card.tsx

@@ -176,7 +176,7 @@ export default function SwarmMonitorCard({ serverId }: Props) {
 					</Card>
 				</div>
 
-				<div className="grid grid-cols-1 xl:grid-cols-2 2xl:grid-cols-3 gap-4">
+				<div className="flex flex-row gap-4">
 					{nodes.map((node) => (
 						<NodeCard key={node.ID} node={node} serverId={serverId} />
 					))}

apps/dokploy/components/layouts/side.tsx

@@ -496,6 +496,7 @@ function SidebarLogo() {
 	const { state } = useSidebar();
 	const { data: isCloud } = api.settings.isCloud.useQuery();
 	const { data: user } = api.user.get.useQuery();
+	// const { data: dokployVersion } = api.settings.getDokployVersion.useQuery();
 	const { data: session } = authClient.useSession();
 
 	const {
@@ -771,7 +772,6 @@ export default function Page({ children }: Props) {
 	const pathname = usePathname();
 	const _currentPath = router.pathname;
 	const { data: auth } = api.user.get.useQuery();
-	const { data: dokployVersion } = api.settings.getDokployVersion.useQuery();
 
 	const includesProjects = pathname?.includes("/dashboard/project");
 	const { data: isCloud } = api.settings.isCloud.useQuery();
@@ -908,7 +908,7 @@ export default function Page({ children }: Props) {
 					</SidebarGroup>
 					<SidebarGroup>
 						<SidebarGroupLabel>Settings</SidebarGroupLabel>
-						<SidebarMenu className="gap-1">
+						<SidebarMenu className="gap-2">
 							{filteredSettings.map((item) => {
 								const isSingle = item.isSingle !== false;
 								const isActive = isSingle
@@ -1028,16 +1028,6 @@ export default function Page({ children }: Props) {
 						<SidebarMenuItem>
 							<UserNav />
 						</SidebarMenuItem>
-						{dokployVersion && (
-							<>
-								<div className="px-3 text-xs text-muted-foreground text-center group-data-[collapsible=icon]:hidden">
-									Version {dokployVersion}
-								</div>
-								<div className="hidden text-xs text-muted-foreground text-center group-data-[collapsible=icon]:block">
-									{dokployVersion}
-								</div>
-							</>
-						)}
 					</SidebarMenu>
 				</SidebarFooter>
 				<SidebarRail />
@@ -1068,7 +1058,7 @@ export default function Page({ children }: Props) {
 					</header>
 				)}
 
-				<div className="flex flex-col w-full p-4 pt-0">{children}</div>
+				<div className="flex flex-col w-full gap-4 p-4 pt-0">{children}</div>
 			</SidebarInset>
 		</SidebarProvider>
 	);

apps/dokploy/components/shared/breadcrumb-sidebar.tsx

@@ -37,9 +37,7 @@ export const BreadcrumbSidebar = ({ list }: Props) => {
 											)}
 										</BreadcrumbLink>
 									</BreadcrumbItem>
-									{_index + 1 < list.length && (
-										<BreadcrumbSeparator className="block" />
-									)}
+									{_index + 1 < list.length && <BreadcrumbSeparator className="block" />}
 								</Fragment>
 							))}
 						</BreadcrumbList>

apps/dokploy/components/shared/code-editor.tsx

@@ -9,116 +9,6 @@ import { EditorView } from "@codemirror/view";
 import { githubDark, githubLight } from "@uiw/codemirror-theme-github";
 import CodeMirror, { type ReactCodeMirrorProps } from "@uiw/react-codemirror";
 import { useTheme } from "next-themes";
-import {
-	autocompletion,
-	type CompletionContext,
-	type CompletionResult,
-	type Completion,
-} from "@codemirror/autocomplete";
-
-// Docker Compose completion options
-const dockerComposeServices = [
-	{ label: "services", type: "keyword", info: "Define services" },
-	{ label: "version", type: "keyword", info: "Specify compose file version" },
-	{ label: "volumes", type: "keyword", info: "Define volumes" },
-	{ label: "networks", type: "keyword", info: "Define networks" },
-	{ label: "configs", type: "keyword", info: "Define configuration files" },
-	{ label: "secrets", type: "keyword", info: "Define secrets" },
-].map((opt) => ({
-	...opt,
-	apply: (view: EditorView, completion: Completion) => {
-		const insert = `${completion.label}:`;
-		view.dispatch({
-			changes: {
-				from: view.state.selection.main.from,
-				to: view.state.selection.main.to,
-				insert,
-			},
-			selection: { anchor: view.state.selection.main.from + insert.length },
-		});
-	},
-}));
-
-const dockerComposeServiceOptions = [
-	{
-		label: "image",
-		type: "keyword",
-		info: "Specify the image to start the container from",
-	},
-	{ label: "build", type: "keyword", info: "Build configuration" },
-	{ label: "command", type: "keyword", info: "Override the default command" },
-	{ label: "container_name", type: "keyword", info: "Custom container name" },
-	{
-		label: "depends_on",
-		type: "keyword",
-		info: "Express dependency between services",
-	},
-	{ label: "environment", type: "keyword", info: "Add environment variables" },
-	{
-		label: "env_file",
-		type: "keyword",
-		info: "Add environment variables from a file",
-	},
-	{
-		label: "expose",
-		type: "keyword",
-		info: "Expose ports without publishing them",
-	},
-	{ label: "ports", type: "keyword", info: "Expose ports" },
-	{
-		label: "volumes",
-		type: "keyword",
-		info: "Mount host paths or named volumes",
-	},
-	{ label: "restart", type: "keyword", info: "Restart policy" },
-	{ label: "networks", type: "keyword", info: "Networks to join" },
-].map((opt) => ({
-	...opt,
-	apply: (view: EditorView, completion: Completion) => {
-		const insert = `${completion.label}: `;
-		view.dispatch({
-			changes: {
-				from: view.state.selection.main.from,
-				to: view.state.selection.main.to,
-				insert,
-			},
-			selection: { anchor: view.state.selection.main.from + insert.length },
-		});
-	},
-}));
-
-function dockerComposeComplete(
-	context: CompletionContext,
-): CompletionResult | null {
-	const word = context.matchBefore(/\w*/);
-	if (!word) return null;
-
-	if (!word.text && !context.explicit) return null;
-
-	// Check if we're at the root level
-	const line = context.state.doc.lineAt(context.pos);
-	const indentation = /^\s*/.exec(line.text)?.[0].length || 0;
-
-	if (indentation === 0) {
-		return {
-			from: word.from,
-			options: dockerComposeServices,
-			validFor: /^\w*$/,
-		};
-	}
-
-	// If we're inside a service definition
-	if (indentation === 4) {
-		return {
-			from: word.from,
-			options: dockerComposeServiceOptions,
-			validFor: /^\w*$/,
-		};
-	}
-
-	return null;
-}
-
 interface Props extends ReactCodeMirrorProps {
 	wrapperClassName?: string;
 	disabled?: boolean;
@@ -155,11 +45,6 @@ export const CodeEditor = ({
 								? StreamLanguage.define(shell)
 								: StreamLanguage.define(properties),
 					props.lineWrapping ? EditorView.lineWrapping : [],
-					language === "yaml"
-						? autocompletion({
-								override: [dockerComposeComplete],
-							})
-						: [],
 				]}
 				{...props}
 				editable={!props.disabled}
@@ -170,7 +55,7 @@ export const CodeEditor = ({
 				)}
 			/>
 			{props.disabled && (
-				<div className="absolute top-0 rounded-md left-0 w-full h-full  flex items-center justify-center z-[10] [background:var(--overlay)] h-full" />
+				<div className="absolute top-0 rounded-md left-0 w-full h-full  flex items-center justify-center z-[10] [background:var(--overlay)]" />
 			)}
 		</div>
 	);

apps/dokploy/components/ui/switch.tsx

@@ -11,7 +11,7 @@ const Switch = React.forwardRef<
 >(({ className, ...props }, ref) => (
 	<SwitchPrimitives.Root
 		className={cn(
-			"peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-muted-foreground/80",
+			"peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
 			className,
 		)}
 		{...props}

apps/dokploy/drizzle/0072_green_susan_delgado.sql

@@ -1,2 +0,0 @@
-ALTER TYPE "public"."certificateType" ADD VALUE 'custom';--> statement-breakpoint
-ALTER TABLE "domain" ADD COLUMN "customCertResolver" text;--> statement-breakpoint

apps/dokploy/drizzle/0072_milky_lyja.sql

@@ -0,0 +1,2 @@
+ALTER TABLE "application" ADD COLUMN "buildSecrets" text;--> statement-breakpoint
+ALTER TABLE "user_temp" DROP COLUMN "enableLogRotation";

apps/dokploy/drizzle/0073_hot_domino.sql

@@ -1 +0,0 @@
-ALTER TABLE "application" ADD COLUMN "previewCertificateProvider" text;

apps/dokploy/drizzle/0074_black_quasar.sql

@@ -1 +0,0 @@
-ALTER TABLE "application" RENAME COLUMN "previewCertificateProvider" TO "previewCustomCertResolver";

apps/dokploy/drizzle/0075_young_typhoid_mary.sql

@@ -1 +0,0 @@
-ALTER TABLE "application" ADD COLUMN "watchPaths" text[];

apps/dokploy/drizzle/0076_young_sharon_ventura.sql

@@ -1 +0,0 @@
-ALTER TABLE "compose" ADD COLUMN "watchPaths" text[];

apps/dokploy/drizzle/0077_chemical_dreadnoughts.sql

@@ -1 +0,0 @@
-ALTER TABLE "backup" ADD COLUMN "keepLatestCount" integer;

apps/dokploy/drizzle/0078_uneven_omega_sentinel.sql

@@ -1 +0,0 @@
-ALTER TABLE "application" ADD COLUMN "cleanCache" boolean DEFAULT false;

apps/dokploy/drizzle/meta/0072_snapshot.json

@@ -1,5 +1,5 @@
 {
-  "id": "ad43c733-01c3-4841-b600-252421350fb9",
+  "id": "296e7d9b-f8fb-4375-86b2-474fd1b5d53a",
   "prevId": "44cb886c-d31a-4b3d-b70e-da306c74dcf5",
   "version": "7",
   "dialect": "postgresql",
@@ -105,6 +105,12 @@
           "primaryKey": false,
           "notNull": false
         },
+        "buildSecrets": {
+          "name": "buildSecrets",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
         "memoryReservation": {
           "name": "memoryReservation",
           "type": "text",
@@ -1090,12 +1096,6 @@
           "primaryKey": false,
           "notNull": true,
           "default": "'none'"
-        },
-        "customCertResolver": {
-          "name": "customCertResolver",
-          "type": "text",
-          "primaryKey": false,
-          "notNull": false
         }
       },
       "indexes": {},
@@ -5059,8 +5059,7 @@
       "schema": "public",
       "values": [
         "letsencrypt",
-        "none",
-        "custom"
+        "none"
       ]
     },
     "public.composeType": {

apps/dokploy/drizzle/meta/_journal.json

@@ -509,50 +509,8 @@
     {
       "idx": 72,
       "version": "7",
-      "when": 1741487009559,
-      "tag": "0072_green_susan_delgado",
-      "breakpoints": true
-    },
-    {
-      "idx": 73,
-      "version": "7",
-      "when": 1741489681190,
-      "tag": "0073_hot_domino",
-      "breakpoints": true
-    },
-    {
-      "idx": 74,
-      "version": "7",
-      "when": 1741490064139,
-      "tag": "0074_black_quasar",
-      "breakpoints": true
-    },
-    {
-      "idx": 75,
-      "version": "7",
-      "when": 1741491527516,
-      "tag": "0075_young_typhoid_mary",
-      "breakpoints": true
-    },
-    {
-      "idx": 76,
-      "version": "7",
-      "when": 1741493754270,
-      "tag": "0076_young_sharon_ventura",
-      "breakpoints": true
-    },
-    {
-      "idx": 77,
-      "version": "7",
-      "when": 1741510086231,
-      "tag": "0077_chemical_dreadnoughts",
-      "breakpoints": true
-    },
-    {
-      "idx": 78,
-      "version": "7",
-      "when": 1742112194375,
-      "tag": "0078_uneven_omega_sentinel",
+      "when": 1741481694393,
+      "tag": "0072_milky_lyja",
       "breakpoints": true
     }
   ]

apps/dokploy/middleware.ts

@@ -0,0 +1,32 @@
+// middleware.ts
+import { verifyRequestOrigin } from "lucia";
+import { NextResponse } from "next/server";
+import type { NextRequest } from "next/server";
+
+export async function middleware(request: NextRequest): Promise<NextResponse> {
+	if (request.method === "GET") {
+		return NextResponse.next();
+	}
+	const originHeader = request.headers.get("Origin");
+	const hostHeader = request.headers.get("Host");
+
+	if (
+		!originHeader ||
+		!hostHeader ||
+		!verifyRequestOrigin(originHeader, [hostHeader])
+	) {
+		return new NextResponse(null, {
+			status: 403,
+		});
+	}
+	return NextResponse.next();
+}
+
+export const config = {
+	matcher: [
+		// Don't handle HMR requests for the dev server we rewrite to
+		"/settings",
+		"/dashboard/(.*)",
+		"/invitation",
+	],
+};

apps/dokploy/next.config.mjs

@@ -3,6 +3,12 @@
  * for Docker builds.
  */
 
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import CopyWebpackPlugin from "copy-webpack-plugin";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 /** @type {import("next").NextConfig} */
 const nextConfig = {
 	reactStrictMode: true,
@@ -13,6 +19,29 @@ const nextConfig = {
 		ignoreBuildErrors: true,
 	},
 	transpilePackages: ["@dokploy/server"],
+	webpack: (config) => {
+		config.plugins.push(
+			new CopyWebpackPlugin({
+				patterns: [
+					{
+						from: path.resolve(__dirname, "templates/**/*.yml"),
+						to: ({ context, absoluteFilename }) => {
+							const relativePath = path.relative(
+								path.resolve(__dirname, "templates"),
+								absoluteFilename || context,
+							);
+							return path.join(__dirname, ".next", "templates", relativePath);
+						},
+						globOptions: {
+							ignore: ["**/node_modules/**"],
+						},
+					},
+				],
+			}),
+		);
+		return config;
+	},
+
 	/**
 	 * If you are using `appDir` then you must comment the below `i18n` config out.
 	 *