refactor: simplify role management by removing unused role schema and related logic; update user role checks in context and procedures

- Replaced the existing invitation creation logic with a new mutation that integrates role and organization checks.
- Updated the invitation form to handle errors more effectively, displaying error messages directly from the API response.
- Introduced a new `member_role` table to manage user roles with associated permissions, ensuring better role management.
- Enhanced SQL migration scripts to create default roles for organizations and update existing member roles accordingly.
- Improved the user router to include a new `createInvitation` procedure for streamlined invitation management.

.github/workflows/deploy.yml

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

.github/workflows/dokploy.yml

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

.github/workflows/format.yml

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

.vscode/extensions.json

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

.vscode/settings.json

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

Dockerfile

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

README.md

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

apps/api/package.json

@@ -29,9 +29,5 @@
 		"tsx": "^4.16.2",
 		"typescript": "^5.8.3"
 	},
-	"packageManager": "pnpm@9.12.0",
-	"engines": {
-		"node": "^20.16.0",
-		"pnpm": ">=9.12.0"
-	}
+	"packageManager": "pnpm@9.5.0"
 }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

apps/dokploy/__test__/traefik/server/update-server-config.test.ts

@@ -5,7 +5,8 @@ vi.mock("node:fs", () => ({
 	default: fs,
 }));
 
-import type { FileConfig, User } from "@dokploy/server";
+import type { FileConfig } from "@dokploy/server";
+import type { WebServer } from "@dokploy/server/db/schema";
 import {
 	createDefaultServerTraefikConfig,
 	loadOrCreateConfig,
@@ -13,11 +14,8 @@ import {
 } from "@dokploy/server";
 import { beforeEach, expect, test, vi } from "vitest";
 
-const baseAdmin: User = {
+const baseAdmin: WebServer = {
 	https: false,
-	enablePaidFeatures: false,
-	allowImpersonation: false,
-	role: "user",
 	metricsConfig: {
 		containers: {
 			refreshRate: 20,
@@ -40,10 +38,6 @@ const baseAdmin: User = {
 			urlCallback: "",
 		},
 	},
-	cleanupCacheApplications: false,
-	cleanupCacheOnCompose: false,
-	cleanupCacheOnPreviews: false,
-	createdAt: new Date(),
 	serverIp: null,
 	certificateType: "none",
 	host: null,
@@ -51,22 +45,7 @@ const baseAdmin: User = {
 	sshPrivateKey: null,
 	enableDockerCleanup: false,
 	logCleanupCron: null,
-	serversQuantity: 0,
-	stripeCustomerId: "",
-	stripeSubscriptionId: "",
-	banExpires: new Date(),
-	banned: true,
-	banReason: "",
-	email: "",
-	expirationDate: "",
-	id: "",
-	isRegistered: false,
-	name: "",
-	createdAt2: new Date().toISOString(),
-	emailVerified: false,
-	image: "",
-	updatedAt: new Date(),
-	twoFactorEnabled: false,
+	webServerId: "1",
 };
 
 beforeEach(() => {
@@ -85,8 +64,6 @@ test("Should apply redirect-to-https", () => {
 	updateServerTraefik(
 		{
 			...baseAdmin,
-			https: true,
-			certificateType: "letsencrypt",
 		},
 		"example.com",
 	);

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

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

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

@@ -151,7 +151,7 @@ export const HandleSecurity = ({
 									<FormItem>
 										<FormLabel>Password</FormLabel>
 										<FormControl>
-											<Input placeholder="test" type="password" {...field} />
+											<Input placeholder="test" {...field} />
 										</FormControl>
 
 										<FormMessage />

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

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

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

@@ -48,7 +48,7 @@ export const ShowTraefikConfig = ({ applicationId }: Props) => {
 					</div>
 				) : (
 					<div className="flex flex-col pt-2 relative">
-						<div className="flex flex-col gap-6 max-h-[35rem] min-h-[10rem] overflow-y-auto">
+						<div className="flex flex-col gap-6 max-h-[35rem] min-h-[10rem]">
 							<CodeEditor
 								lineWrapping
 								value={data || "Empty"}

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

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

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

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

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

@@ -158,7 +158,7 @@ export const ShowDeployment = ({
 				<div
 					ref={scrollRef}
 					onScroll={handleScroll}
-					className="h-[720px] overflow-y-auto space-y-0 border p-4 bg-[#fafafa] dark:bg-[#050506] rounded custom-logs-scrollbar"
+					className="h-[720px] space-y-0 border p-4 bg-[#fafafa] dark:bg-[#050506] rounded custom-logs-scrollbar"
 				>
 					{" "}
 					{filteredLogs.length > 0 ? (

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

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

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

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

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

@@ -71,7 +71,7 @@ export const ShowDomains = ({ id, type }: Props) => {
 	const [validationStates, setValidationStates] = useState<ValidationStates>(
 		{},
 	);
-	const { data: ip } = api.settings.getIp.useQuery();
+	const { data: webServer } = api.webServer.get.useQuery();
 
 	const {
 		data,
@@ -110,7 +110,9 @@ export const ShowDomains = ({ id, type }: Props) => {
 			const result = await validateDomain({
 				domain: host,
 				serverIp:
-					application?.server?.ipAddress?.toString() || ip?.toString() || "",
+					application?.server?.ipAddress?.toString() ||
+					webServer?.serverIp?.toString() ||
+					"",
 			});
 
 			setValidationStates((prev) => ({
@@ -210,7 +212,7 @@ export const ShowDomains = ({ id, type }: Props) => {
 																}}
 																serverIp={
 																	application?.server?.ipAddress?.toString() ||
-																	ip?.toString()
+																	webServer?.serverIp?.toString()
 																}
 															/>
 														)}

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

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

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

@@ -1,4 +1,3 @@
-import { AlertBlock } from "@/components/shared/alert-block";
 import { DrawerLogs } from "@/components/shared/drawer-logs";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -43,8 +42,9 @@ import { useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
-import { formatBytes } from "../../database/backups/restore-backup";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
+import { formatBytes } from "../../database/backups/restore-backup";
+import { AlertBlock } from "@/components/shared/alert-block";
 
 interface Props {
 	id: string;

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

@@ -23,8 +23,8 @@ import {
 	Trash2,
 } from "lucide-react";
 import { toast } from "sonner";
-import { ShowDeploymentsModal } from "../deployments/show-deployments-modal";
 import { HandleVolumeBackups } from "./handle-volume-backups";
+import { ShowDeploymentsModal } from "../deployments/show-deployments-modal";
 import { RestoreVolumeBackups } from "./restore-volume-backups";
 
 interface Props {

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

@@ -1,4 +1,3 @@
-import { UnauthorizedGitProvider } from "@/components/dashboard/application/general/generic/unauthorized-git-provider";
 import {
 	BitbucketIcon,
 	GitIcon,
@@ -12,7 +11,6 @@ import { api } from "@/utils/api";
 import { CodeIcon, GitBranch, Loader2 } from "lucide-react";
 import Link from "next/link";
 import { useState } from "react";
-import { toast } from "sonner";
 import { ComposeFileEditor } from "../compose-file-editor";
 import { ShowConvertedCompose } from "../show-converted-compose";
 import { SaveBitbucketProviderCompose } from "./save-bitbucket-provider-compose";
@@ -20,6 +18,8 @@ import { SaveGitProviderCompose } from "./save-git-provider-compose";
 import { SaveGiteaProviderCompose } from "./save-gitea-provider-compose";
 import { SaveGithubProviderCompose } from "./save-github-provider-compose";
 import { SaveGitlabProviderCompose } from "./save-gitlab-provider-compose";
+import { UnauthorizedGitProvider } from "@/components/dashboard/application/general/generic/unauthorized-git-provider";
+import { toast } from "sonner";
 
 type TabState = "github" | "git" | "raw" | "gitlab" | "bitbucket" | "gitea";
 interface Props {

apps/dokploy/components/dashboard/docker/config/show-container-config.tsx

@@ -42,7 +42,7 @@ export const ShowContainerConfig = ({ containerId, serverId }: Props) => {
 						See in detail the config of this container
 					</DialogDescription>
 				</DialogHeader>
-				<div className="text-wrap rounded-lg border p-4 overflow-y-auto text-sm bg-card max-h-[80vh]">
+				<div className="text-wrap rounded-lg border p-4 text-sm bg-card max-h-[80vh]">
 					<code>
 						<pre className="whitespace-pre-wrap break-words">
 							<CodeEditor

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

@@ -274,7 +274,7 @@ export const DockerLogsId: React.FC<Props> = ({
 					<div
 						ref={scrollRef}
 						onScroll={handleScroll}
-						className="h-[720px] overflow-y-auto space-y-0 border p-4 bg-[#fafafa] dark:bg-[#050506] rounded custom-logs-scrollbar"
+						className="h-[720px] space-y-0 border p-4 bg-[#fafafa] dark:bg-[#050506] rounded custom-logs-scrollbar"
 					>
 						{filteredLogs.length > 0 ? (
 							filteredLogs.map((filteredLog: LogLine, index: number) => (

apps/dokploy/components/dashboard/docker/logs/line-count-filter.tsx

@@ -138,7 +138,7 @@ export function LineCountFilter({
 							}}
 						/>
 					</div>
-					<CommandPrimitive.List className="max-h-[300px] overflow-y-auto overflow-x-hidden">
+					<CommandPrimitive.List className="max-h-[300px] overflow-x-hidden">
 						<CommandPrimitive.Group className="px-2 py-1.5">
 							{lineCountOptions.map((option) => {
 								const isSelected = value === option.value;

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

@@ -46,11 +46,11 @@ interface Props {
 	mariadbId: string;
 }
 export const ShowExternalMariadbCredentials = ({ mariadbId }: Props) => {
-	const { data: ip } = api.settings.getIp.useQuery();
+	const { data: webServer } = api.webServer.get.useQuery();
 	const { data, refetch } = api.mariadb.one.useQuery({ mariadbId });
 	const { mutateAsync, isLoading } = api.mariadb.saveExternalPort.useMutation();
 	const [connectionUrl, setConnectionUrl] = useState("");
-	const getIp = data?.server?.ipAddress || ip;
+	const getIp = data?.server?.ipAddress || webServer?.serverIp;
 	const form = useForm<DockerProvider>({
 		defaultValues: {},
 		resolver: zodResolver(DockerProviderSchema),

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

@@ -46,11 +46,11 @@ interface Props {
 	mongoId: string;
 }
 export const ShowExternalMongoCredentials = ({ mongoId }: Props) => {
-	const { data: ip } = api.settings.getIp.useQuery();
+	const { data: webServer } = api.webServer.get.useQuery();
 	const { data, refetch } = api.mongo.one.useQuery({ mongoId });
 	const { mutateAsync, isLoading } = api.mongo.saveExternalPort.useMutation();
 	const [connectionUrl, setConnectionUrl] = useState("");
-	const getIp = data?.server?.ipAddress || ip;
+	const getIp = data?.server?.ipAddress || webServer?.serverIp;
 	const form = useForm<DockerProvider>({
 		defaultValues: {},
 		resolver: zodResolver(DockerProviderSchema),

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

@@ -46,11 +46,11 @@ interface Props {
 	mysqlId: string;
 }
 export const ShowExternalMysqlCredentials = ({ mysqlId }: Props) => {
-	const { data: ip } = api.settings.getIp.useQuery();
+	const { data: webServer } = api.webServer.get.useQuery();
 	const { data, refetch } = api.mysql.one.useQuery({ mysqlId });
 	const { mutateAsync, isLoading } = api.mysql.saveExternalPort.useMutation();
 	const [connectionUrl, setConnectionUrl] = useState("");
-	const getIp = data?.server?.ipAddress || ip;
+	const getIp = data?.server?.ipAddress || webServer?.serverIp;
 	const form = useForm<DockerProvider>({
 		defaultValues: {},
 		resolver: zodResolver(DockerProviderSchema),

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

@@ -46,11 +46,11 @@ interface Props {
 	postgresId: string;
 }
 export const ShowExternalPostgresCredentials = ({ postgresId }: Props) => {
-	const { data: ip } = api.settings.getIp.useQuery();
+	const { data: webServer } = api.webServer.get.useQuery();
 	const { data, refetch } = api.postgres.one.useQuery({ postgresId });
 	const { mutateAsync, isLoading } =
 		api.postgres.saveExternalPort.useMutation();
-	const getIp = data?.server?.ipAddress || ip;
+	const getIp = data?.server?.ipAddress || webServer?.serverIp;
 	const [connectionUrl, setConnectionUrl] = useState("");
 
 	const form = useForm<DockerProvider>({

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

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { Folder, HelpCircle } from "lucide-react";
-import { useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -43,6 +37,12 @@ import {
 } from "@/components/ui/tooltip";
 import { slugify } from "@/lib/slug";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Folder, HelpCircle } from "lucide-react";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const AddTemplateSchema = z.object({
 	name: z.string().min(1, {
@@ -75,8 +75,6 @@ export const AddApplication = ({ projectId, projectName }: Props) => {
 	const slug = slugify(projectName);
 	const { data: servers } = api.server.withSSHKey.useQuery();
 
-	const hasServers = servers && servers.length > 0;
-
 	const { mutateAsync, isLoading, error, isError } =
 		api.application.create.useMutation();
 
@@ -157,84 +155,68 @@ export const AddApplication = ({ projectId, projectName }: Props) => {
 								</FormItem>
 							)}
 						/>
-						{hasServers && (
-							<FormField
-								control={form.control}
-								name="serverId"
-								render={({ field }) => (
-									<FormItem>
-										<TooltipProvider delayDuration={0}>
-											<Tooltip>
-												<TooltipTrigger asChild>
-													<FormLabel className="break-all w-fit flex flex-row gap-1 items-center">
-														Select a Server {!isCloud ? "(Optional)" : ""}
-														<HelpCircle className="size-4 text-muted-foreground" />
-													</FormLabel>
-												</TooltipTrigger>
-												<TooltipContent
-													className="z-[999] w-[300px]"
-													align="start"
-													side="top"
-												>
-													<span>
-														If no server is selected, the application will be
-														deployed on the server where the user is logged in.
-													</span>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
+						<FormField
+							control={form.control}
+							name="serverId"
+							render={({ field }) => (
+								<FormItem>
+									<TooltipProvider delayDuration={0}>
+										<Tooltip>
+											<TooltipTrigger asChild>
+												<FormLabel className="break-all w-fit flex flex-row gap-1 items-center">
+													Select a Server {!isCloud ? "(Optional)" : ""}
+													<HelpCircle className="size-4 text-muted-foreground" />
+												</FormLabel>
+											</TooltipTrigger>
+											<TooltipContent
+												className="z-[999] w-[300px]"
+												align="start"
+												side="top"
+											>
+												<span>
+													If no server is selected, the application will be
+													deployed on the server where the user is logged in.
+												</span>
+											</TooltipContent>
+										</Tooltip>
+									</TooltipProvider>
 
-										<Select
-											onValueChange={field.onChange}
-											defaultValue={field.value}
-										>
-											<SelectTrigger>
-												<SelectValue placeholder="Select a Server" />
-											</SelectTrigger>
-											<SelectContent>
-												<SelectGroup>
-													{servers?.map((server) => (
-														<SelectItem
-															key={server.serverId}
-															value={server.serverId}
-														>
-															<span className="flex items-center gap-2 justify-between w-full">
-																<span>{server.name}</span>
-																<span className="text-muted-foreground text-xs self-center">
-																	{server.ipAddress}
-																</span>
+									<Select
+										onValueChange={field.onChange}
+										defaultValue={field.value}
+									>
+										<SelectTrigger>
+											<SelectValue placeholder="Select a Server" />
+										</SelectTrigger>
+										<SelectContent>
+											<SelectGroup>
+												{servers?.map((server) => (
+													<SelectItem
+														key={server.serverId}
+														value={server.serverId}
+													>
+														<span className="flex items-center gap-2 justify-between w-full">
+															<span>{server.name}</span>
+															<span className="text-muted-foreground text-xs self-center">
+																{server.ipAddress}
 															</span>
-														</SelectItem>
-													))}
-													<SelectLabel>Servers ({servers?.length})</SelectLabel>
-												</SelectGroup>
-											</SelectContent>
-										</Select>
-										<FormMessage />
-									</FormItem>
-								)}
-							/>
-						)}
+														</span>
+													</SelectItem>
+												))}
+												<SelectLabel>Servers ({servers?.length})</SelectLabel>
+											</SelectGroup>
+										</SelectContent>
+									</Select>
+									<FormMessage />
+								</FormItem>
+							)}
+						/>
 						<FormField
 							control={form.control}
 							name="appName"
 							render={({ field }) => (
 								<FormItem>
-									<FormLabel className="flex items-center gap-2">
-										App Name
-										<TooltipProvider delayDuration={0}>
-											<Tooltip>
-												<TooltipTrigger asChild>
-													<HelpCircle className="size-4 text-muted-foreground" />
-												</TooltipTrigger>
-												<TooltipContent side="right">
-													<p>
-														This will be the name of the Docker Swarm service
-													</p>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
-									</FormLabel>
+									<FormLabel>App Name</FormLabel>
 									<FormControl>
 										<Input placeholder="my-app" {...field} />
 									</FormControl>

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

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { CircuitBoard, HelpCircle } from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -43,6 +37,12 @@ import {
 } from "@/components/ui/tooltip";
 import { slugify } from "@/lib/slug";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { CircuitBoard, HelpCircle } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const AddComposeSchema = z.object({
 	composeType: z.enum(["docker-compose", "stack"]).optional(),
@@ -78,8 +78,6 @@ export const AddCompose = ({ projectId, projectName }: Props) => {
 	const { mutateAsync, isLoading, error, isError } =
 		api.compose.create.useMutation();
 
-	const hasServers = servers && servers.length > 0;
-
 	const form = useForm<AddCompose>({
 		defaultValues: {
 			name: "",
@@ -165,64 +163,62 @@ export const AddCompose = ({ projectId, projectName }: Props) => {
 								)}
 							/>
 						</div>
-						{hasServers && (
-							<FormField
-								control={form.control}
-								name="serverId"
-								render={({ field }) => (
-									<FormItem>
-										<TooltipProvider delayDuration={0}>
-											<Tooltip>
-												<TooltipTrigger asChild>
-													<FormLabel className="break-all w-fit flex flex-row gap-1 items-center">
-														Select a Server {!isCloud ? "(Optional)" : ""}
-														<HelpCircle className="size-4 text-muted-foreground" />
-													</FormLabel>
-												</TooltipTrigger>
-												<TooltipContent
-													className="z-[999] w-[300px]"
-													align="start"
-													side="top"
-												>
-													<span>
-														If no server is selected, the application will be
-														deployed on the server where the user is logged in.
-													</span>
-												</TooltipContent>
-											</Tooltip>
-										</TooltipProvider>
+						<FormField
+							control={form.control}
+							name="serverId"
+							render={({ field }) => (
+								<FormItem>
+									<TooltipProvider delayDuration={0}>
+										<Tooltip>
+											<TooltipTrigger asChild>
+												<FormLabel className="break-all w-fit flex flex-row gap-1 items-center">
+													Select a Server {!isCloud ? "(Optional)" : ""}
+													<HelpCircle className="size-4 text-muted-foreground" />
+												</FormLabel>
+											</TooltipTrigger>
+											<TooltipContent
+												className="z-[999] w-[300px]"
+												align="start"
+												side="top"
+											>
+												<span>
+													If no server is selected, the application will be
+													deployed on the server where the user is logged in.
+												</span>
+											</TooltipContent>
+										</Tooltip>
+									</TooltipProvider>
 
-										<Select
-											onValueChange={field.onChange}
-											defaultValue={field.value}
-										>
-											<SelectTrigger>
-												<SelectValue placeholder="Select a Server" />
-											</SelectTrigger>
-											<SelectContent>
-												<SelectGroup>
-													{servers?.map((server) => (
-														<SelectItem
-															key={server.serverId}
-															value={server.serverId}
-														>
-															<span className="flex items-center gap-2 justify-between w-full">
-																<span>{server.name}</span>
-																<span className="text-muted-foreground text-xs self-center">
-																	{server.ipAddress}
-																</span>
+									<Select
+										onValueChange={field.onChange}
+										defaultValue={field.value}
+									>
+										<SelectTrigger>
+											<SelectValue placeholder="Select a Server" />
+										</SelectTrigger>
+										<SelectContent>
+											<SelectGroup>
+												{servers?.map((server) => (
+													<SelectItem
+														key={server.serverId}
+														value={server.serverId}
+													>
+														<span className="flex items-center gap-2 justify-between w-full">
+															<span>{server.name}</span>
+															<span className="text-muted-foreground text-xs self-center">
+																{server.ipAddress}
 															</span>
-														</SelectItem>
-													))}
-													<SelectLabel>Servers ({servers?.length})</SelectLabel>
-												</SelectGroup>
-											</SelectContent>
-										</Select>
-										<FormMessage />
-									</FormItem>
-								)}
-							/>
-						)}
+														</span>
+													</SelectItem>
+												))}
+												<SelectLabel>Servers ({servers?.length})</SelectLabel>
+											</SelectGroup>
+										</SelectContent>
+									</Select>
+									<FormMessage />
+								</FormItem>
+							)}
+						/>
 						<FormField
 							control={form.control}
 							name="appName"

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

@@ -1,9 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { AlertTriangle, Database, HelpCircle } from "lucide-react";
-import { useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import {
 	MariadbIcon,
 	MongodbIcon,
@@ -43,14 +37,14 @@ import {
 } from "@/components/ui/select";
 import { Switch } from "@/components/ui/switch";
 import { Textarea } from "@/components/ui/textarea";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} from "@/components/ui/tooltip";
 import { slugify } from "@/lib/slug";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { AlertTriangle, Database } from "lucide-react";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 type DbType = typeof mySchema._type.type;
 
@@ -169,8 +163,6 @@ export const AddDatabase = ({ projectId, projectName }: Props) => {
 	const mariadbMutation = api.mariadb.create.useMutation();
 	const mysqlMutation = api.mysql.create.useMutation();
 
-	const hasServers = servers && servers.length > 0;
-
 	const form = useForm<AddDatabase>({
 		defaultValues: {
 			type: "postgres",
@@ -382,62 +374,45 @@ export const AddDatabase = ({ projectId, projectName }: Props) => {
 										</FormItem>
 									)}
 								/>
-								{hasServers && (
-									<FormField
-										control={form.control}
-										name="serverId"
-										render={({ field }) => (
-											<FormItem>
-												<FormLabel>Select a Server</FormLabel>
-												<Select
-													onValueChange={field.onChange}
-													defaultValue={field.value || ""}
-												>
-													<SelectTrigger>
-														<SelectValue placeholder="Select a Server" />
-													</SelectTrigger>
-													<SelectContent>
-														<SelectGroup>
-															{servers?.map((server) => (
-																<SelectItem
-																	key={server.serverId}
-																	value={server.serverId}
-																>
-																	{server.name}
-																</SelectItem>
-															))}
-															<SelectLabel>
-																Servers ({servers?.length})
-															</SelectLabel>
-														</SelectGroup>
-													</SelectContent>
-												</Select>
-												<FormMessage />
-											</FormItem>
-										)}
-									/>
-								)}
+								<FormField
+									control={form.control}
+									name="serverId"
+									render={({ field }) => (
+										<FormItem>
+											<FormLabel>Select a Server</FormLabel>
+											<Select
+												onValueChange={field.onChange}
+												defaultValue={field.value || ""}
+											>
+												<SelectTrigger>
+													<SelectValue placeholder="Select a Server" />
+												</SelectTrigger>
+												<SelectContent>
+													<SelectGroup>
+														{servers?.map((server) => (
+															<SelectItem
+																key={server.serverId}
+																value={server.serverId}
+															>
+																{server.name}
+															</SelectItem>
+														))}
+														<SelectLabel>
+															Servers ({servers?.length})
+														</SelectLabel>
+													</SelectGroup>
+												</SelectContent>
+											</Select>
+											<FormMessage />
+										</FormItem>
+									)}
+								/>
 								<FormField
 									control={form.control}
 									name="appName"
 									render={({ field }) => (
 										<FormItem>
-											<FormLabel className="flex items-center gap-2">
-												App Name
-												<TooltipProvider delayDuration={0}>
-													<Tooltip>
-														<TooltipTrigger asChild>
-															<HelpCircle className="size-4 text-muted-foreground" />
-														</TooltipTrigger>
-														<TooltipContent side="right">
-															<p>
-																This will be the name of the Docker Swarm
-																service
-															</p>
-														</TooltipContent>
-													</Tooltip>
-												</TooltipProvider>
-											</FormLabel>
+											<FormLabel>App Name</FormLabel>
 											<FormControl>
 												<Input placeholder="my-app" {...field} />
 											</FormControl>

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

@@ -1,18 +1,3 @@
-import {
-	BookText,
-	CheckIcon,
-	ChevronsUpDown,
-	Globe,
-	HelpCircle,
-	LayoutGrid,
-	List,
-	Loader2,
-	PuzzleIcon,
-	SearchIcon,
-} from "lucide-react";
-import Link from "next/link";
-import { useEffect, useState } from "react";
-import { toast } from "sonner";
 import { GithubIcon } from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import {
@@ -69,6 +54,21 @@ import {
 } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
+import {
+	BookText,
+	CheckIcon,
+	ChevronsUpDown,
+	Globe,
+	HelpCircle,
+	LayoutGrid,
+	List,
+	Loader2,
+	PuzzleIcon,
+	SearchIcon,
+} from "lucide-react";
+import Link from "next/link";
+import { useEffect, useState } from "react";
+import { toast } from "sonner";
 
 const TEMPLATE_BASE_URL_KEY = "dokploy_template_base_url";
 
@@ -137,8 +137,6 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 			return matchesTags && matchesQuery;
 		}) || [];
 
-	const hasServers = servers && servers.length > 0;
-
 	return (
 		<Dialog open={open} onOpenChange={setOpen}>
 			<DialogTrigger className="w-full">
@@ -427,62 +425,60 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
 															project.
 														</AlertDialogDescription>
 
-														{hasServers && (
-															<div>
-																<TooltipProvider delayDuration={0}>
-																	<Tooltip>
-																		<TooltipTrigger asChild>
-																			<Label className="break-all w-fit flex flex-row gap-1 items-center pb-2 pt-3.5">
-																				Select a Server{" "}
-																				{!isCloud ? "(Optional)" : ""}
-																				<HelpCircle className="size-4 text-muted-foreground" />
-																			</Label>
-																		</TooltipTrigger>
-																		<TooltipContent
-																			className="z-[999] w-[300px]"
-																			align="start"
-																			side="top"
-																		>
-																			<span>
-																				If no server is selected, the
-																				application will be deployed on the
-																				server where the user is logged in.
-																			</span>
-																		</TooltipContent>
-																	</Tooltip>
-																</TooltipProvider>
+														<div>
+															<TooltipProvider delayDuration={0}>
+																<Tooltip>
+																	<TooltipTrigger asChild>
+																		<Label className="break-all w-fit flex flex-row gap-1 items-center pb-2 pt-3.5">
+																			Select a Server{" "}
+																			{!isCloud ? "(Optional)" : ""}
+																			<HelpCircle className="size-4 text-muted-foreground" />
+																		</Label>
+																	</TooltipTrigger>
+																	<TooltipContent
+																		className="z-[999] w-[300px]"
+																		align="start"
+																		side="top"
+																	>
+																		<span>
+																			If no server is selected, the application
+																			will be deployed on the server where the
+																			user is logged in.
+																		</span>
+																	</TooltipContent>
+																</Tooltip>
+															</TooltipProvider>
 
-																<Select
-																	onValueChange={(e) => {
-																		setServerId(e);
-																	}}
-																>
-																	<SelectTrigger>
-																		<SelectValue placeholder="Select a Server" />
-																	</SelectTrigger>
-																	<SelectContent>
-																		<SelectGroup>
-																			{servers?.map((server) => (
-																				<SelectItem
-																					key={server.serverId}
-																					value={server.serverId}
-																				>
-																					<span className="flex items-center gap-2 justify-between w-full">
-																						<span>{server.name}</span>
-																						<span className="text-muted-foreground text-xs self-center">
-																							{server.ipAddress}
-																						</span>
+															<Select
+																onValueChange={(e) => {
+																	setServerId(e);
+																}}
+															>
+																<SelectTrigger>
+																	<SelectValue placeholder="Select a Server" />
+																</SelectTrigger>
+																<SelectContent>
+																	<SelectGroup>
+																		{servers?.map((server) => (
+																			<SelectItem
+																				key={server.serverId}
+																				value={server.serverId}
+																			>
+																				<span className="flex items-center gap-2 justify-between w-full">
+																					<span>{server.name}</span>
+																					<span className="text-muted-foreground text-xs self-center">
+																						{server.ipAddress}
 																					</span>
-																				</SelectItem>
-																			))}
-																			<SelectLabel>
-																				Servers ({servers?.length})
-																			</SelectLabel>
-																		</SelectGroup>
-																	</SelectContent>
-																</Select>
-															</div>
-														)}
+																				</span>
+																			</SelectItem>
+																		))}
+																		<SelectLabel>
+																			Servers ({servers?.length})
+																		</SelectLabel>
+																	</SelectGroup>
+																</SelectContent>
+															</Select>
+														</div>
 													</AlertDialogHeader>
 													<AlertDialogFooter>
 														<AlertDialogCancel>Cancel</AlertDialogCancel>

apps/dokploy/components/dashboard/project/ai/step-one.tsx

@@ -25,7 +25,6 @@ const examples = [
 export const StepOne = ({ setTemplateInfo, templateInfo }: any) => {
 	// Get servers from the API
 	const { data: servers } = api.server.withSSHKey.useQuery();
-	const hasServers = servers && servers.length > 0;
 
 	const handleExampleClick = (example: string) => {
 		setTemplateInfo({ ...templateInfo, userInput: example });
@@ -48,39 +47,37 @@ export const StepOne = ({ setTemplateInfo, templateInfo }: any) => {
 						/>
 					</div>
 
-					{hasServers && (
-						<div className="space-y-2">
-							<Label htmlFor="server-deploy">
-								Select the server where you want to deploy (optional)
-							</Label>
-							<Select
-								value={templateInfo.server?.serverId}
-								onValueChange={(value) => {
-									const server = servers?.find((s) => s.serverId === value);
-									if (server) {
-										setTemplateInfo({
-											...templateInfo,
-											server: server,
-										});
-									}
-								}}
-							>
-								<SelectTrigger className="w-full">
-									<SelectValue placeholder="Select a server" />
-								</SelectTrigger>
-								<SelectContent>
-									<SelectGroup>
-										{servers?.map((server) => (
-											<SelectItem key={server.serverId} value={server.serverId}>
-												{server.name}
-											</SelectItem>
-										))}
-										<SelectLabel>Servers ({servers?.length})</SelectLabel>
-									</SelectGroup>
-								</SelectContent>
-							</Select>
-						</div>
-					)}
+					<div className="space-y-2">
+						<Label htmlFor="server-deploy">
+							Select the server where you want to deploy (optional)
+						</Label>
+						<Select
+							value={templateInfo.server?.serverId}
+							onValueChange={(value) => {
+								const server = servers?.find((s) => s.serverId === value);
+								if (server) {
+									setTemplateInfo({
+										...templateInfo,
+										server: server,
+									});
+								}
+							}}
+						>
+							<SelectTrigger className="w-full">
+								<SelectValue placeholder="Select a server" />
+							</SelectTrigger>
+							<SelectContent>
+								<SelectGroup>
+									{servers?.map((server) => (
+										<SelectItem key={server.serverId} value={server.serverId}>
+											{server.name}
+										</SelectItem>
+									))}
+									<SelectLabel>Servers ({servers?.length})</SelectLabel>
+								</SelectGroup>
+							</SelectContent>
+						</Select>
+					</div>
 
 					<div className="space-y-2">
 						<Label>Examples:</Label>

apps/dokploy/components/dashboard/project/ai/step-two.tsx

@@ -199,7 +199,7 @@ export const StepTwo = ({ templateInfo, setTemplateInfo }: StepProps) => {
 				<p className="text-muted-foreground">
 					Generating template suggestions based on your input...
 				</p>
-				<pre className="whitespace-normal">{templateInfo.userInput}</pre>
+				<pre>{templateInfo.userInput}</pre>
 			</div>
 		);
 	}

apps/dokploy/components/dashboard/project/duplicate-project.tsx

@@ -167,7 +167,7 @@ export const DuplicateProject = ({
 
 					<div className="grid gap-2">
 						<Label>Selected services to duplicate</Label>
-						<div className="space-y-2 max-h-[200px] overflow-y-auto border rounded-md p-4">
+						<div className="space-y-2 max-h-[200px] border rounded-md p-4">
 							{selectedServices.map((service) => (
 								<div key={service.id} className="flex items-center space-x-2">
 									<span className="text-sm">

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

@@ -47,11 +47,12 @@ import { useMemo, useState } from "react";
 import { toast } from "sonner";
 import { HandleProject } from "./handle-project";
 import { ProjectEnvironment } from "./project-environment";
+import { PERMISSIONS } from "@dokploy/server/lib/permissions";
+import { Permissions } from "../shared/Permissions";
 
 export const ShowProjects = () => {
 	const utils = api.useUtils();
 	const { data, isLoading } = api.project.all.useQuery();
-	const { data: auth } = api.user.get.useQuery();
 	const { mutateAsync } = api.project.remove.useMutation();
 	const [searchQuery, setSearchQuery] = useState("");
 
@@ -83,11 +84,11 @@ export const ShowProjects = () => {
 								</CardDescription>
 							</CardHeader>
 
-							{(auth?.role === "owner" || auth?.canCreateProjects) && (
+							<Permissions permissions={[PERMISSIONS.PROJECT.CREATE.name]}>
 								<div className="">
 									<HandleProject />
 								</div>
-							)}
+							</Permissions>
 						</div>
 
 						<CardContent className="space-y-2 py-8 border-t gap-4 flex flex-col min-h-[60vh]">
@@ -157,7 +158,7 @@ export const ShowProjects = () => {
 																		</Button>
 																	</DropdownMenuTrigger>
 																	<DropdownMenuContent
-																		className="w-[200px] space-y-2 overflow-y-auto max-h-[400px]"
+																		className="w-[200px] space-y-2 max-h-[400px]"
 																		onClick={(e) => e.stopPropagation()}
 																	>
 																		{project.applications.length > 0 && (
@@ -265,7 +266,7 @@ export const ShowProjects = () => {
 																				</Button>
 																			</DropdownMenuTrigger>
 																			<DropdownMenuContent
-																				className="w-[200px] space-y-2 overflow-y-auto max-h-[280px]"
+																				className="w-[200px] space-y-2 max-h-[280px]"
 																				onClick={(e) => e.stopPropagation()}
 																			>
 																				<DropdownMenuLabel className="font-normal">
@@ -289,8 +290,11 @@ export const ShowProjects = () => {
 																				<div
 																					onClick={(e) => e.stopPropagation()}
 																				>
-																					{(auth?.role === "owner" ||
-																						auth?.canDeleteProjects) && (
+																					<Permissions
+																						permissions={[
+																							PERMISSIONS.PROJECT.DELETE.name,
+																						]}
+																					>
 																						<AlertDialog>
 																							<AlertDialogTrigger className="w-full">
 																								<DropdownMenuItem
@@ -356,7 +360,7 @@ export const ShowProjects = () => {
 																								</AlertDialogFooter>
 																							</AlertDialogContent>
 																						</AlertDialog>
-																					)}
+																					</Permissions>
 																				</div>
 																			</DropdownMenuContent>
 																		</DropdownMenu>

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

@@ -46,11 +46,11 @@ interface Props {
 	redisId: string;
 }
 export const ShowExternalRedisCredentials = ({ redisId }: Props) => {
-	const { data: ip } = api.settings.getIp.useQuery();
+	const { data: webServer } = api.webServer.get.useQuery();
 	const { data, refetch } = api.redis.one.useQuery({ redisId });
 	const { mutateAsync, isLoading } = api.redis.saveExternalPort.useMutation();
 	const [connectionUrl, setConnectionUrl] = useState("");
-	const getIp = data?.server?.ipAddress || ip;
+	const getIp = data?.server?.ipAddress || webServer?.serverIp;
 
 	const form = useForm<DockerProvider>({
 		defaultValues: {},

apps/dokploy/components/dashboard/settings/billing/show-welcome-dokploy.tsx

@@ -14,7 +14,7 @@ export const ShowWelcomeDokploy = () => {
 
 	const { data: isCloud, isLoading } = api.settings.isCloud.useQuery();
 
-	if (!isCloud || data?.role !== "admin") {
+	if (!isCloud || data?.role?.name !== "admin") {
 		return null;
 	}
 
@@ -23,14 +23,14 @@ export const ShowWelcomeDokploy = () => {
 			!isLoading &&
 			isCloud &&
 			!localStorage.getItem("hasSeenCloudWelcomeModal") &&
-			data?.role === "owner"
+			data?.role?.name === "owner"
 		) {
 			setOpen(true);
 		}
 	}, [isCloud, isLoading]);
 
 	const handleClose = (isOpen: boolean) => {
-		if (data?.role === "owner") {
+		if (data?.role?.name === "owner") {
 			setOpen(isOpen);
 			if (!isOpen) {
 				localStorage.setItem("hasSeenCloudWelcomeModal", "true"); // Establece el flag al cerrar el modal

apps/dokploy/components/dashboard/settings/destination/handle-destinations.tsx

@@ -70,7 +70,6 @@ export const HandleDestinations = ({ destinationId }: Props) => {
 		},
 		{
 			enabled: !!destinationId,
-			refetchOnWindowFocus: false,
 		},
 	);
 	const {

apps/dokploy/components/dashboard/settings/git/github/add-github-provider.tsx

@@ -24,14 +24,12 @@ export const AddGithubProvider = () => {
 	const [isOrganization, setIsOrganization] = useState(false);
 	const [organizationName, setOrganization] = useState("");
 
-	const randomString = () => Math.random().toString(36).slice(2, 8);
-
 	useEffect(() => {
 		const url = document.location.origin;
 		const manifest = JSON.stringify(
 			{
 				redirect_url: `${origin}/api/providers/github/setup?organizationId=${activeOrganization?.id}&userId=${session?.user?.id}`,
-				name: `Dokploy-${format(new Date(), "yyyy-MM-dd")}-${randomString()}`,
+				name: `Dokploy-${format(new Date(), "yyyy-MM-dd")}`,
 				url: origin,
 				hook_attributes: {
 					url: `${url}/api/deploy/github`,

apps/dokploy/components/dashboard/settings/git/show-git-providers.tsx

@@ -33,7 +33,6 @@ import { AddGithubProvider } from "./github/add-github-provider";
 import { EditGithubProvider } from "./github/edit-github-provider";
 import { AddGitlabProvider } from "./gitlab/add-gitlab-provider";
 import { EditGitlabProvider } from "./gitlab/edit-gitlab-provider";
-import { Badge } from "@/components/ui/badge";
 
 export const ShowGitProviders = () => {
 	const { data, isLoading, refetch } = api.gitProvider.getAll.useQuery();
@@ -159,13 +158,7 @@ export const ShowGitProviders = () => {
 
 															<div className="flex flex-row gap-1">
 																{!haveGithubRequirements && isGithub && (
-																	<div className="flex flex-row gap-1 items-center">
-																		<Badge
-																			variant="outline"
-																			className="text-xs"
-																		>
-																			Action Required
-																		</Badge>
+																	<div className="flex flex-col gap-1">
 																		<Link
 																			href={`${gitProvider?.github?.githubAppName}/installations/new?state=gh_setup:${gitProvider?.github.githubId}`}
 																			className={buttonVariants({
@@ -192,13 +185,7 @@ export const ShowGitProviders = () => {
 																	</div>
 																)}
 																{!haveGitlabRequirements && isGitlab && (
-																	<div className="flex flex-row gap-1 items-center">
-																		<Badge
-																			variant="outline"
-																			className="text-xs"
-																		>
-																			Action Required
-																		</Badge>
+																	<div className="flex flex-col gap-1">
 																		<Link
 																			href={getGitlabUrl(
 																				gitProvider.gitlab?.applicationId || "",

apps/dokploy/components/dashboard/settings/profile/profile-form.tsx

@@ -1,4 +1,3 @@
-import { Avatar, AvatarFallback } from "@/components/ui/avatar";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -20,7 +19,7 @@ import {
 import { Input } from "@/components/ui/input";
 import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 import { Switch } from "@/components/ui/switch";
-import { generateSHA256Hash, getFallbackAvatarInitials } from "@/lib/utils";
+import { generateSHA256Hash } from "@/lib/utils";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { Loader2, User } from "lucide-react";
@@ -33,11 +32,11 @@ import { Disable2FA } from "./disable-2fa";
 import { Enable2FA } from "./enable-2fa";
 
 const profileSchema = z.object({
+	name: z.string(),
 	email: z.string(),
 	password: z.string().nullable(),
 	currentPassword: z.string().nullable(),
 	image: z.string().optional(),
-	name: z.string().optional(),
 	allowImpersonation: z.boolean().optional().default(false),
 });
 
@@ -81,12 +80,12 @@ export const ProfileForm = () => {
 
 	const form = useForm<Profile>({
 		defaultValues: {
+			name: data?.user?.name || "",
 			email: data?.user?.email || "",
 			password: "",
 			image: data?.user?.image || "",
 			currentPassword: "",
 			allowImpersonation: data?.user?.allowImpersonation || false,
-			name: data?.user?.name || "",
 		},
 		resolver: zodResolver(profileSchema),
 	});
@@ -95,12 +94,12 @@ export const ProfileForm = () => {
 		if (data) {
 			form.reset(
 				{
+					name: data?.user?.name || "",
 					email: data?.user?.email || "",
 					password: form.getValues("password") || "",
 					image: data?.user?.image || "",
 					currentPassword: form.getValues("currentPassword") || "",
 					allowImpersonation: data?.user?.allowImpersonation,
-					name: data?.user?.name || "",
 				},
 				{
 					keepValues: true,
@@ -118,22 +117,22 @@ export const ProfileForm = () => {
 
 	const onSubmit = async (values: Profile) => {
 		await mutateAsync({
+			name: values.name,
 			email: values.email.toLowerCase(),
 			password: values.password || undefined,
 			image: values.image,
 			currentPassword: values.currentPassword || undefined,
 			allowImpersonation: values.allowImpersonation,
-			name: values.name || undefined,
 		})
 			.then(async () => {
 				await refetch();
 				toast.success("Profile Updated");
 				form.reset({
+					name: values.name,
 					email: values.email,
 					password: "",
 					image: values.image,
 					currentPassword: "",
-					name: values.name || "",
 				});
 			})
 			.catch(() => {
@@ -180,7 +179,7 @@ export const ProfileForm = () => {
 													<FormItem>
 														<FormLabel>Name</FormLabel>
 														<FormControl>
-															<Input placeholder="Name" {...field} />
+															<Input {...field} />
 														</FormControl>
 														<FormMessage />
 													</FormItem>
@@ -258,24 +257,6 @@ export const ProfileForm = () => {
 																value={field.value}
 																className="flex flex-row flex-wrap gap-2 max-xl:justify-center"
 															>
-																<FormItem key="no-avatar">
-																	<FormLabel className="[&:has([data-state=checked])>.default-avatar]:border-primary [&:has([data-state=checked])>.default-avatar]:border-1 [&:has([data-state=checked])>.default-avatar]:p-px cursor-pointer">
-																		<FormControl>
-																			<RadioGroupItem
-																				value=""
-																				className="sr-only"
-																			/>
-																		</FormControl>
-
-																		<Avatar className="default-avatar h-12 w-12 rounded-full border hover:p-px hover:border-primary transition-transform">
-																			<AvatarFallback className="rounded-lg">
-																				{getFallbackAvatarInitials(
-																					data?.user?.name,
-																				)}
-																			</AvatarFallback>
-																		</Avatar>
-																	</FormLabel>
-																</FormItem>
 																{availableAvatars.map((image) => (
 																	<FormItem key={image}>
 																		<FormLabel className="[&:has([data-state=checked])>img]:border-primary [&:has([data-state=checked])>img]:border-1 [&:has([data-state=checked])>img]:p-px cursor-pointer">

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

@@ -1,6 +1,5 @@
-import { useTranslation } from "next-i18next";
-import { toast } from "sonner";
 import { Button } from "@/components/ui/button";
+
 import {
 	DropdownMenu,
 	DropdownMenuContent,
@@ -11,6 +10,8 @@ import {
 	DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { api } from "@/utils/api";
+import { useTranslation } from "next-i18next";
+import { toast } from "sonner";
 import { EditTraefikEnv } from "../../web-server/edit-traefik-env";
 import { ManageTraefikPorts } from "../../web-server/manage-traefik-ports";
 import { ShowModalLogs } from "../../web-server/show-modal-logs";

apps/dokploy/components/dashboard/settings/servers/actions/toggle-docker-cleanup.tsx

@@ -7,7 +7,7 @@ interface Props {
 	serverId?: string;
 }
 export const ToggleDockerCleanup = ({ serverId }: Props) => {
-	const { data, refetch } = api.user.get.useQuery(undefined, {
+	const { data, refetch } = api.webServer.get.useQuery(undefined, {
 		enabled: !serverId,
 	});
 
@@ -20,11 +20,9 @@ export const ToggleDockerCleanup = ({ serverId }: Props) => {
 		},
 	);
 
-	const enabled = serverId
-		? server?.enableDockerCleanup
-		: data?.user.enableDockerCleanup;
+	const enabled = data?.enableDockerCleanup || server?.enableDockerCleanup;
 
-	const { mutateAsync } = api.settings.updateDockerCleanup.useMutation();
+	const { mutateAsync } = api.webServer.updateDockerCleanup.useMutation();
 
 	const handleToggle = async (checked: boolean) => {
 		try {

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

@@ -1,11 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { PlusIcon } from "lucide-react";
-import Link from "next/link";
-import { useTranslation } from "next-i18next";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
@@ -38,6 +30,14 @@ import {
 } from "@/components/ui/select";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { PlusIcon } from "lucide-react";
+import { useTranslation } from "next-i18next";
+import Link from "next/link";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 const Schema = z.object({
 	name: z.string().min(1, {
@@ -218,7 +218,7 @@ export const HandleServers = ({ serverId }: Props) => {
 					</AlertBlock>
 				</div>
 				{!canCreateMoreServers && (
-					<AlertBlock type="warning" className="mt-4">
+					<AlertBlock type="warning">
 						You cannot create more servers,{" "}
 						<Link href="/dashboard/settings/billing" className="text-primary">
 							Please upgrade your plan

apps/dokploy/components/dashboard/settings/servers/setup-monitoring.tsx

@@ -89,7 +89,7 @@ export const SetupMonitoring = ({ serverId }: Props) => {
 					enabled: !!serverId,
 				},
 			)
-		: api.user.getServerMetrics.useQuery();
+		: api.webServer.get.useQuery();
 
 	const url = useUrl();
 

apps/dokploy/components/dashboard/settings/servers/setup-server.tsx

@@ -147,7 +147,7 @@ export const SetupServer = ({ serverId }: Props) => {
 										<li>2. Add The SSH Key to Server Manually</li>
 									</ul>
 									<div className="flex flex-col gap-4 w-full overflow-auto">
-										<div className="flex relative flex-col gap-2 overflow-y-auto">
+										<div className="flex relative flex-col gap-2">
 											<div className="text-sm text-primary flex flex-row gap-2 items-center">
 												Copy Public Key ({server?.sshKey?.name})
 												<button

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

@@ -1,9 +1,3 @@
-import { format } from "date-fns";
-import { KeyIcon, Loader2, MoreHorizontal, ServerIcon } from "lucide-react";
-import Link from "next/link";
-import { useRouter } from "next/router";
-import { useTranslation } from "next-i18next";
-import { toast } from "sonner";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { DialogAction } from "@/components/shared/dialog-action";
 import { Badge } from "@/components/ui/badge";
@@ -33,6 +27,12 @@ import {
 	TableRow,
 } from "@/components/ui/table";
 import { api } from "@/utils/api";
+import { format } from "date-fns";
+import { KeyIcon, Loader2, MoreHorizontal, ServerIcon } from "lucide-react";
+import { useTranslation } from "next-i18next";
+import Link from "next/link";
+import { useRouter } from "next/router";
+import { toast } from "sonner";
 import { ShowNodesModal } from "../cluster/nodes/show-nodes-modal";
 import { TerminalModal } from "../web-server/terminal-modal";
 import { ShowServerActions } from "./actions/show-server-actions";
@@ -115,6 +115,24 @@ export const ShowServers = () => {
 											</div>
 										) : (
 											<div className="flex flex-col gap-4  min-h-[25vh]">
+												{!canCreateMoreServers && (
+													<AlertBlock type="warning">
+														<div className="flex flex-row items-center gap-3 justify-center">
+															<span>
+																<div>
+																	You cannot create more servers,{" "}
+																	<Link
+																		href="/dashboard/settings/billing"
+																		className="text-primary"
+																	>
+																		Please upgrade your plan
+																	</Link>
+																</div>
+															</span>
+														</div>
+													</AlertBlock>
+												)}
+
 												<Table>
 													<TableCaption>
 														<div className="flex flex-col  gap-4">

apps/dokploy/components/dashboard/settings/servers/welcome-stripe/create-server.tsx

@@ -1,9 +1,3 @@
-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";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
@@ -28,6 +22,12 @@ import {
 } from "@/components/ui/select";
 import { Textarea } from "@/components/ui/textarea";
 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";
+import { z } from "zod";
 
 const Schema = z.object({
 	name: z.string().min(1, {
@@ -108,7 +108,7 @@ export const CreateServer = ({ stepper }: Props) => {
 		<Card className="bg-background flex flex-col gap-4">
 			<div className="flex flex-col gap-2 pt-5 px-4">
 				{!canCreateMoreServers && (
-					<AlertBlock type="warning" className="mt-2">
+					<AlertBlock type="warning">
 						You cannot create more servers,{" "}
 						<Link href="/dashboard/settings/billing" className="text-primary">
 							Please upgrade your plan

apps/dokploy/components/dashboard/settings/servers/welcome-stripe/create-ssh-key.tsx

@@ -1,22 +1,18 @@
-import copy from "copy-to-clipboard";
-import { CopyIcon, ExternalLinkIcon, Loader2 } from "lucide-react";
-import Link from "next/link";
-import { useEffect, useRef, useState } from "react";
-import { toast } from "sonner";
 import { CodeEditor } from "@/components/shared/code-editor";
 import { Card, CardContent } from "@/components/ui/card";
-import { Label } from "@/components/ui/label";
-import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 import { api } from "@/utils/api";
+import copy from "copy-to-clipboard";
+import { ExternalLinkIcon, Loader2 } from "lucide-react";
+import { CopyIcon } from "lucide-react";
+import Link from "next/link";
+import { useEffect, useRef } from "react";
+import { toast } from "sonner";
 
 export const CreateSSHKey = () => {
 	const { data, refetch } = api.sshKey.all.useQuery();
 	const generateMutation = api.sshKey.generate.useMutation();
 	const { mutateAsync, isLoading } = api.sshKey.create.useMutation();
 	const hasCreatedKey = useRef(false);
-	const [selectedOption, setSelectedOption] = useState<"manual" | "provider">(
-		"manual",
-	);
 
 	const cloudSSHKey = data?.find(
 		(sshKey) => sshKey.name === "dokploy-cloud-ssh-key",
@@ -64,122 +60,89 @@ export const CreateSSHKey = () => {
 						</div>
 					) : (
 						<>
-							<div className="flex flex-col gap-4 text-sm text-muted-foreground">
+							<div className="flex flex-col gap-2 text-sm text-muted-foreground">
 								<p className="text-primary text-base font-semibold">
-									Choose how to add SSH Keys to your server:
+									You have two options to add SSH Keys to your server:
 								</p>
 
-								{/* Radio button options */}
-								<div className="grid gap-2">
-									<RadioGroup
-										value={selectedOption}
-										onValueChange={(value) => {
-											setSelectedOption(value as "manual" | "provider");
-										}}
-										className="grid gap-3"
-									>
-										<div className="flex items-center space-x-2">
-											<RadioGroupItem value="manual" id="manual" />
-											<Label
-												htmlFor="manual"
-												className="text-primary font-medium cursor-pointer"
-											>
-												Add SSH Key to Server Manually
-											</Label>
-										</div>
+								<ul>
+									<li>1. Add The SSH Key to Server Manually</li>
 
-										<div className="flex items-center space-x-2">
-											<RadioGroupItem value="provider" id="provider" />
-											<Label
-												htmlFor="provider"
-												className="text-primary font-medium cursor-pointer"
-											>
-												Add SSH Key when creating server in your provider
-											</Label>
-										</div>
-									</RadioGroup>
+									<li>
+										2. Add the public SSH Key when you create a server in your
+										preffered provider (Hostinger, Digital Ocean, Hetzner, etc){" "}
+									</li>
+								</ul>
+
+								<div className="flex flex-col gap-2 w-full border rounded-lg p-4">
+									<span className="text-base font-semibold text-primary">
+										Option 1
+									</span>
+									<ul>
+										<li className="items-center flex gap-1">
+											1. Login to your server{" "}
+										</li>
+										<li>
+											2. When you are logged in run the following command
+											<div className="flex  relative flex-col gap-4 w-full mt-2">
+												<CodeEditor
+													lineWrapping
+													language="properties"
+													value={`echo "${cloudSSHKey?.publicKey}" >> ~/.ssh/authorized_keys`}
+													readOnly
+													className="font-mono opacity-60"
+												/>
+												<button
+													type="button"
+													className="absolute right-2 top-2"
+													onClick={() => {
+														copy(
+															`echo "${cloudSSHKey?.publicKey}" >> ~/.ssh/authorized_keys`,
+														);
+														toast.success("Copied to clipboard");
+													}}
+												>
+													<CopyIcon className="size-4" />
+												</button>
+											</div>
+										</li>
+										<li className="mt-1">
+											3. You're done, follow the next step to insert the details
+											of your server.
+										</li>
+									</ul>
 								</div>
-
-								{/* Content based on selected option */}
-								{selectedOption === "manual" && (
-									<div className="flex flex-col gap-2 w-full border rounded-lg p-4">
-										<span className="text-base font-semibold text-primary">
-											Manual Setup Instructions
-										</span>
-										<ul className="space-y-2">
-											<li className="items-center flex gap-1">
-												1. Login to your server
-											</li>
-											<li>
-												2. When you are logged in run the following command
-												<div className="flex relative flex-col gap-4 w-full mt-2">
-													<CodeEditor
-														lineWrapping
-														language="properties"
-														value={`echo "${cloudSSHKey?.publicKey}" >> ~/.ssh/authorized_keys`}
-														readOnly
-														className="font-mono opacity-60"
-													/>
-													<button
-														type="button"
-														className="absolute right-2 top-2"
-														onClick={() => {
-															copy(
-																`echo "${cloudSSHKey?.publicKey}" >> ~/.ssh/authorized_keys`,
-															);
-															toast.success("Copied to clipboard");
-														}}
-													>
-														<CopyIcon className="size-4" />
-													</button>
-												</div>
-											</li>
-											<li className="mt-1">
-												3. You're done, follow the next step to insert the
-												details of your server.
-											</li>
-										</ul>
-									</div>
-								)}
-
-								{selectedOption === "provider" && (
-									<div className="flex flex-col gap-2 w-full border rounded-lg p-4">
-										<span className="text-base font-semibold text-primary">
-											Provider Setup Instructions
-										</span>
-										<div className="flex flex-col gap-4 w-full overflow-auto">
-											<div className="flex relative flex-col gap-2 overflow-y-auto">
-												<div className="text-sm text-primary flex flex-row gap-2 items-center">
-													Copy Public Key
-													<button
-														type="button"
-														className="right-2 top-8"
-														onClick={() => {
-															copy(
-																cloudSSHKey?.publicKey || "Generate a SSH Key",
-															);
-															toast.success("SSH Copied to clipboard");
-														}}
-													>
-														<CopyIcon className="size-4 text-muted-foreground" />
-													</button>
-												</div>
+								<div className="flex flex-col gap-2 w-full mt-2 border rounded-lg p-4">
+									<span className="text-base font-semibold text-primary">
+										Option 2
+									</span>
+									<div className="flex flex-col gap-4 w-full overflow-auto">
+										<div className="flex relative flex-col gap-2">
+											<div className="text-sm text-primary flex flex-row gap-2 items-center">
+												Copy Public Key
+												<button
+													type="button"
+													className="right-2 top-8"
+													onClick={() => {
+														copy(
+															cloudSSHKey?.publicKey || "Generate a SSH Key",
+														);
+														toast.success("SSH Copied to clipboard");
+													}}
+												>
+													<CopyIcon className="size-4 text-muted-foreground" />
+												</button>
 											</div>
 										</div>
-										<p className="text-sm mt-2">
-											Use this public key when creating a server in your
-											preferred provider (Hostinger, Digital Ocean, Hetzner,
-											etc.)
-										</p>
-										<Link
-											href="https://docs.dokploy.com/docs/core/multi-server/instructions#requirements"
-											target="_blank"
-											className="text-primary flex flex-row gap-2 mt-2"
-										>
-											View Tutorial <ExternalLinkIcon className="size-4" />
-										</Link>
 									</div>
-								)}
+									<Link
+										href="https://docs.dokploy.com/docs/core/multi-server/instructions#requirements"
+										target="_blank"
+										className="text-primary flex flex-row gap-2"
+									>
+										View Tutorial <ExternalLinkIcon className="size-4" />
+									</Link>
+								</div>
 							</div>
 						</>
 					)}

apps/dokploy/components/dashboard/settings/users/add-invitation.tsx

@@ -49,12 +49,15 @@ type AddInvitation = z.infer<typeof addInvitation>;
 export const AddInvitation = () => {
 	const [open, setOpen] = useState(false);
 	const utils = api.useUtils();
-	const [isLoading, setIsLoading] = useState(false);
+	const { data: roles } = api.role.all.useQuery();
 	const { data: isCloud } = api.settings.isCloud.useQuery();
 	const { data: emailProviders } =
 		api.notification.getEmailProviders.useQuery();
-	const { mutateAsync: sendInvitation } = api.user.sendInvitation.useMutation();
-	const [error, setError] = useState<string | null>(null);
+	const {
+		mutateAsync: createInvitation,
+		isLoading,
+		error,
+	} = api.user.createInvitation.useMutation();
 	const { data: activeOrganization } = authClient.useActiveOrganization();
 
 	const form = useForm<AddInvitation>({
@@ -70,36 +73,20 @@ export const AddInvitation = () => {
 	}, [form, form.formState.isSubmitSuccessful, form.reset]);
 
 	const onSubmit = async (data: AddInvitation) => {
-		setIsLoading(true);
-		const result = await authClient.organization.inviteMember({
+		await createInvitation({
 			email: data.email.toLowerCase(),
 			role: data.role,
-			organizationId: activeOrganization?.id,
-		});
-
-		if (result.error) {
-			setError(result.error.message || "");
-		} else {
-			if (!isCloud && data.notificationId) {
-				await sendInvitation({
-					invitationId: result.data.id,
-					notificationId: data.notificationId || "",
-				})
-					.then(() => {
-						toast.success("Invitation created and email sent");
-					})
-					.catch((error: any) => {
-						toast.error(error.message);
-					});
-			} else {
+			organizationId: activeOrganization?.id || "",
+			notificationId: data.notificationId || "",
+		})
+			.then(() => {
 				toast.success("Invitation created");
-			}
-			setError(null);
-			setOpen(false);
-		}
+			})
+			.catch((error: any) => {
+				toast.error(error.message);
+			});
 
 		utils.organization.allInvitations.invalidate();
-		setIsLoading(false);
 	};
 	return (
 		<Dialog open={open} onOpenChange={setOpen}>
@@ -113,7 +100,7 @@ export const AddInvitation = () => {
 					<DialogTitle>Add Invitation</DialogTitle>
 					<DialogDescription>Invite a new user</DialogDescription>
 				</DialogHeader>
-				{error && <AlertBlock type="error">{error}</AlertBlock>}
+				{error && <AlertBlock type="error">{error.message}</AlertBlock>}
 
 				<Form {...form}>
 					<form
@@ -158,6 +145,12 @@ export const AddInvitation = () => {
 											</FormControl>
 											<SelectContent>
 												<SelectItem value="member">Member</SelectItem>
+												<SelectItem value="admin">Admin</SelectItem>
+												{roles?.map((role) => (
+													<SelectItem key={role.name} value={role.name}>
+														{role.name}
+													</SelectItem>
+												))}
 											</SelectContent>
 										</Select>
 										<FormDescription>

apps/dokploy/components/dashboard/settings/users/add-permissions-v2.tsx

@@ -0,0 +1,758 @@
+import { Button } from "@/components/ui/button";
+import {
+	Dialog,
+	DialogContent,
+	DialogDescription,
+	DialogFooter,
+	DialogHeader,
+	DialogTitle,
+	DialogTrigger,
+} from "@/components/ui/dialog";
+import { DropdownMenuItem } from "@/components/ui/dropdown-menu";
+import {
+	Form,
+	FormControl,
+	FormField,
+	FormItem,
+	FormLabel,
+	FormMessage,
+	FormDescription,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
+import { Separator } from "@/components/ui/separator";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
+import { Badge } from "@/components/ui/badge";
+import { Checkbox } from "@/components/ui/checkbox";
+import {
+	Card,
+	CardContent,
+	CardDescription,
+	CardHeader,
+	CardTitle,
+} from "@/components/ui/card";
+import { extractServices } from "@/pages/dashboard/project/[projectId]";
+import { PenBoxIcon, Trash2 } from "lucide-react";
+import { format } from "date-fns";
+import { DialogAction } from "@/components/shared/dialog-action";
+
+const assignRoleSchema = z.object({
+	roleId: z.string(),
+	accessedProjects: z.array(z.string()).optional(),
+	accessedServices: z.array(z.string()).optional(),
+});
+
+const createRoleSchema = z.object({
+	name: z.string().min(1, "Name is required"),
+	description: z.string().optional(),
+	permissions: z.array(z.string()).min(1, "Select at least one permission"),
+});
+
+type AssignRoleForm = z.infer<typeof assignRoleSchema>;
+type CreateRoleForm = z.infer<typeof createRoleSchema>;
+
+interface Props {
+	userId: string;
+}
+
+export const AddUserPermissionsV2 = ({ userId }: Props) => {
+	const utils = api.useUtils();
+	const { data: projects } = api.project.all.useQuery();
+	const [activeTab, setActiveTab] = useState<"assign" | "create">("assign");
+	const [editingRole, setEditingRole] = useState<{
+		roleId: string;
+		name: string;
+		description?: string;
+		permissions: string[];
+	} | null>(null);
+	const { data: roles, refetch: refetchRoles } = api.role.all.useQuery();
+	const { data: defaultRoles } = api.role.getDefaultRoles.useQuery();
+
+	const { data: userData, refetch: refetchUser } = api.user.one.useQuery(
+		{
+			userId,
+		},
+		{
+			enabled: !!userId,
+		},
+	);
+
+	const { mutateAsync: createRole, isLoading: isCreatingRole } =
+		api.role.create.useMutation();
+	const { mutateAsync: updateRole, isLoading: isUpdatingRole } =
+		api.role.update.useMutation();
+	const { mutateAsync: deleteRole, isLoading: isDeletingRole } =
+		api.role.delete.useMutation();
+	const { mutateAsync: updateMemberRole, isLoading: isAssigningRole } =
+		api.user.assignRole.useMutation();
+
+	const assignForm = useForm<AssignRoleForm>({
+		resolver: zodResolver(assignRoleSchema),
+		defaultValues: {
+			accessedProjects: [],
+			accessedServices: [],
+		},
+	});
+
+	const createForm = useForm<CreateRoleForm>({
+		resolver: zodResolver(createRoleSchema),
+		defaultValues: {
+			permissions: [],
+		},
+	});
+
+	useEffect(() => {
+		if (userData) {
+			assignForm.reset({
+				roleId: userData.roleId || "",
+				accessedProjects: userData.accessedProjects || [],
+				accessedServices: userData.accessedServices || [],
+			});
+		}
+	}, [userData, assignForm]);
+
+	// Reset form when switching between create and edit modes
+	useEffect(() => {
+		if (editingRole) {
+			createForm.reset({
+				name: editingRole.name,
+				description: editingRole.description || "",
+				permissions: editingRole.permissions,
+			});
+		} else {
+			createForm.reset({
+				name: "",
+				description: "",
+				permissions: [],
+			});
+		}
+	}, [editingRole, createForm]);
+
+	// Check if the selected role is owner or admin (has full access)
+	const selectedRoleId = assignForm.watch("roleId");
+	const selectedRole = defaultRoles?.roles?.find(
+		(role) => role.roleId === selectedRoleId,
+	);
+
+	const isFullAccessRole =
+		selectedRole &&
+		(selectedRole.name === "owner" || selectedRole.name === "admin");
+
+	const onAssignRole = async (data: AssignRoleForm) => {
+		try {
+			await updateMemberRole({
+				userId,
+				roleId: data.roleId,
+				accessedProjects: isFullAccessRole ? [] : data.accessedProjects || [],
+				accessedServices: isFullAccessRole ? [] : data.accessedServices || [],
+			});
+			toast.success("Role assigned successfully");
+			await refetchUser();
+			await utils.user.all.invalidate();
+		} catch (error) {
+			const message =
+				error instanceof Error ? error.message : "Failed to assign role";
+			toast.error(message);
+		}
+	};
+
+	const onCreateRole = async (data: CreateRoleForm) => {
+		try {
+			if (editingRole) {
+				// Update existing role
+				await updateRole({
+					roleId: editingRole.roleId,
+					...data,
+					permissions: data.permissions,
+				});
+				toast.success("Role updated successfully");
+			} else {
+				// Create new role
+				await createRole({
+					...data,
+					permissions: data.permissions,
+				});
+				toast.success("Role created successfully");
+			}
+			refetchRoles();
+			setActiveTab("assign");
+			setEditingRole(null);
+			createForm.reset();
+		} catch (error) {
+			const message =
+				error instanceof Error
+					? error.message
+					: editingRole
+						? "Failed to update role"
+						: "Failed to create role";
+			toast.error(message);
+		}
+	};
+
+	const onEditRole = (role: {
+		roleId: string;
+		name: string;
+		description?: string | null;
+		permissions: string[] | null;
+	}) => {
+		setEditingRole({
+			roleId: role.roleId,
+			name: role.name,
+			description: role.description || "",
+			permissions: role.permissions || [],
+		});
+		setActiveTab("create");
+	};
+
+	const cancelEdit = () => {
+		setEditingRole(null);
+		setActiveTab("assign");
+		createForm.reset();
+	};
+
+	return (
+		<Dialog>
+			<DialogTrigger asChild>
+				<DropdownMenuItem
+					className="w-full cursor-pointer"
+					onSelect={(e) => e.preventDefault()}
+				>
+					Manage Roles
+				</DropdownMenuItem>
+			</DialogTrigger>
+			<DialogContent className="max-h-[85vh] overflow-y-auto sm:max-w-4xl">
+				<DialogHeader>
+					<DialogTitle>Role Management</DialogTitle>
+					<DialogDescription>
+						Assign existing roles or create new ones. The Owner role has full
+						access to all features.
+					</DialogDescription>
+				</DialogHeader>
+
+				<Tabs
+					value={activeTab}
+					onValueChange={(v) => setActiveTab(v as "assign" | "create")}
+				>
+					<TabsList className="grid w-full grid-cols-2">
+						<TabsTrigger value="assign">Assign Role</TabsTrigger>
+						<TabsTrigger value="create">
+							{editingRole ? "Edit Role" : "Create Role"}
+						</TabsTrigger>
+					</TabsList>
+
+					<TabsContent value="assign">
+						<Form {...assignForm}>
+							<form onSubmit={assignForm.handleSubmit(onAssignRole)}>
+								<div className="space-y-4 py-4">
+									<FormField
+										control={assignForm.control}
+										name="roleId"
+										render={({ field }) => (
+											<FormItem className="space-y-3">
+												<FormLabel>Select Role</FormLabel>
+												<FormControl>
+													<RadioGroup
+														onValueChange={field.onChange}
+														defaultValue={field.value}
+														className="space-y-4"
+													>
+														<div className="space-y-4">
+															<h4 className="text-sm font-medium">
+																Default Roles
+															</h4>
+															{defaultRoles?.roles?.map((role) => {
+																const isOwner = role.name === "owner";
+																const isAdmin = role.name === "admin";
+																if (isOwner) {
+																	return null;
+																}
+																return (
+																	<FormItem
+																		key={role.roleId}
+																		className="flex items-center space-x-3 space-y-0"
+																	>
+																		<FormControl>
+																			<RadioGroupItem
+																				value={role.roleId || ""}
+																				disabled={isOwner}
+																			/>
+																		</FormControl>
+																		<FormLabel className="font-normal">
+																			<div className="flex items-center gap-2">
+																				<span className="font-medium capitalize">
+																					{role.name}
+																				</span>
+																				{isAdmin && (
+																					<Badge
+																						variant="default"
+																						className="text-xs"
+																					>
+																						Full Access
+																					</Badge>
+																				)}
+																			</div>
+																			<div className="text-xs text-muted-foreground">
+																				{role.description}
+																			</div>
+																			{!isOwner && (
+																				<div className="flex flex-wrap gap-1 mt-1">
+																					{role.permissions?.map(
+																						(permission) => (
+																							<Badge
+																								key={permission.name}
+																								variant={
+																									isOwner
+																										? "default"
+																										: "secondary"
+																								}
+																								className="text-xs"
+																							>
+																								{permission.description}
+																							</Badge>
+																						),
+																					)}
+																				</div>
+																			)}
+																		</FormLabel>
+																	</FormItem>
+																);
+															})}
+														</div>
+
+														<Separator />
+
+														{/* Custom Roles Section */}
+														{roles &&
+															roles.filter((r) => !r.isSystem).length > 0 && (
+																<div className="space-y-4">
+																	<h4 className="text-sm font-medium">
+																		Custom Roles
+																	</h4>
+																	{roles
+																		?.filter((r) => !r.isSystem)
+																		.map((role) => (
+																			<FormItem
+																				key={role.roleId}
+																				className="flex items-center justify-between space-x-3 space-y-0"
+																			>
+																				<div className="flex items-center space-x-3">
+																					<FormControl>
+																						<RadioGroupItem
+																							value={role.roleId}
+																						/>
+																					</FormControl>
+																					<FormLabel className="font-normal">
+																						<span className="font-medium">
+																							{role.name}
+																						</span>
+																						<div className="text-xs text-muted-foreground">
+																							{role.description}
+																						</div>
+																						<p className="text-xs text-muted-foreground">
+																							{format(
+																								role.createdAt,
+																								"MMM d, yyyy",
+																							)}
+																						</p>
+																						<div className="flex flex-wrap gap-1 mt-1">
+																							{role.permissions?.map(
+																								(permission) => {
+																									const permissionInfo =
+																										defaultRoles?.permissions?.find(
+																											(p) =>
+																												p.name === permission,
+																										);
+																									return (
+																										<Badge
+																											key={permission}
+																											variant="secondary"
+																											className="text-xs"
+																										>
+																											{
+																												permissionInfo?.description
+																											}
+																										</Badge>
+																									);
+																								},
+																							)}
+																						</div>
+																					</FormLabel>
+																				</div>
+																				<div className="flex space-x-2">
+																					<Button
+																						variant="ghost"
+																						size="icon"
+																						onClick={() => onEditRole(role)}
+																						title="Edit role"
+																					>
+																						<PenBoxIcon className="h-4 w-4" />
+																					</Button>
+																					<DialogAction
+																						title="Delete Role"
+																						description="Are you sure you want to delete this role?"
+																						type="destructive"
+																						onClick={async () => {
+																							await deleteRole({
+																								roleId: role.roleId,
+																							})
+																								.then(() => {
+																									refetchRoles();
+																									toast.success(
+																										"Role deleted successfully",
+																									);
+																								})
+																								.catch((error) => {
+																									const message =
+																										error instanceof Error
+																											? error.message
+																											: "Error deleting role";
+																									toast.error(message);
+																								});
+																						}}
+																					>
+																						<Button
+																							variant="ghost"
+																							size="icon"
+																							className="text-destructive hover:text-destructive"
+																							isLoading={isDeletingRole}
+																						>
+																							<Trash2 className="h-4 w-4" />
+																						</Button>
+																					</DialogAction>
+																				</div>
+																			</FormItem>
+																		))}
+																</div>
+															)}
+													</RadioGroup>
+												</FormControl>
+											</FormItem>
+										)}
+									/>
+
+									{/* Project Access Section - Only show if not full access role */}
+									{!isFullAccessRole && selectedRoleId && (
+										<>
+											<Separator />
+											<FormField
+												control={assignForm.control}
+												name="accessedProjects"
+												render={() => (
+													<FormItem className="space-y-4">
+														<div>
+															<FormLabel className="text-base">
+																Projects Access
+															</FormLabel>
+															<FormDescription>
+																Select the projects that the user can access
+															</FormDescription>
+														</div>
+														{projects?.length === 0 && (
+															<p className="text-sm text-muted-foreground">
+																No projects found
+															</p>
+														)}
+														<div className="grid md:grid-cols-2 gap-4">
+															{projects?.map((project, index) => {
+																const services = extractServices(project);
+																return (
+																	<FormField
+																		key={`project-${index}`}
+																		control={assignForm.control}
+																		name="accessedProjects"
+																		render={({ field }) => {
+																			return (
+																				<FormItem
+																					key={project.projectId}
+																					className="flex flex-col items-start space-x-4 rounded-lg p-4 border"
+																				>
+																					<div className="flex flex-row gap-4">
+																						<FormControl>
+																							<Checkbox
+																								checked={field.value?.includes(
+																									project.projectId,
+																								)}
+																								onCheckedChange={(checked) => {
+																									return checked
+																										? field.onChange([
+																												...(field.value || []),
+																												project.projectId,
+																											])
+																										: field.onChange(
+																												field.value?.filter(
+																													(value) =>
+																														value !==
+																														project.projectId,
+																												),
+																											);
+																								}}
+																							/>
+																						</FormControl>
+																						<FormLabel className="text-sm font-medium text-primary">
+																							{project.name}
+																						</FormLabel>
+																					</div>
+																					{services.length === 0 && (
+																						<p className="text-sm text-muted-foreground ml-6">
+																							No services found
+																						</p>
+																					)}
+																					{services?.map(
+																						(service, serviceIndex) => (
+																							<FormField
+																								key={`service-${serviceIndex}`}
+																								control={assignForm.control}
+																								name="accessedServices"
+																								render={({ field }) => {
+																									return (
+																										<FormItem
+																											key={service.id}
+																											className="flex flex-row items-start space-x-3 space-y-0 ml-6"
+																										>
+																											<FormControl>
+																												<Checkbox
+																													checked={field.value?.includes(
+																														service.id,
+																													)}
+																													onCheckedChange={(
+																														checked,
+																													) => {
+																														const currentProjects =
+																															assignForm.getValues(
+																																"accessedProjects",
+																															) || [];
+																														const currentServices =
+																															field.value || [];
+
+																														if (checked) {
+																															// Add service
+																															const newServices =
+																																[
+																																	...currentServices,
+																																	service.id,
+																																];
+																															field.onChange(
+																																newServices,
+																															);
+
+																															// Auto-select project if not already selected
+																															if (
+																																!currentProjects.includes(
+																																	project.projectId,
+																																)
+																															) {
+																																assignForm.setValue(
+																																	"accessedProjects",
+																																	[
+																																		...currentProjects,
+																																		project.projectId,
+																																	],
+																																);
+																															}
+																														} else {
+																															// Remove service
+																															const newServices =
+																																currentServices.filter(
+																																	(value) =>
+																																		value !==
+																																		service.id,
+																																);
+																															field.onChange(
+																																newServices,
+																															);
+
+																															// Check if any other services from this project are still selected
+																															const otherServicesFromProject =
+																																services.filter(
+																																	(s) =>
+																																		s.id !==
+																																			service.id &&
+																																		newServices.includes(
+																																			s.id,
+																																		),
+																																);
+
+																															// If no other services from this project, unselect the project
+																															if (
+																																otherServicesFromProject.length ===
+																																0
+																															) {
+																																assignForm.setValue(
+																																	"accessedProjects",
+																																	currentProjects.filter(
+																																		(p) =>
+																																			p !==
+																																			project.projectId,
+																																	),
+																																);
+																															}
+																														}
+																													}}
+																												/>
+																											</FormControl>
+																											<FormLabel className="text-sm text-muted-foreground">
+																												{service.name}
+																											</FormLabel>
+																										</FormItem>
+																									);
+																								}}
+																							/>
+																						),
+																					)}
+																				</FormItem>
+																			);
+																		}}
+																	/>
+																);
+															})}
+														</div>
+														<FormMessage />
+													</FormItem>
+												)}
+											/>
+										</>
+									)}
+								</div>
+
+								<DialogFooter>
+									<Button type="submit" disabled={isAssigningRole}>
+										{isAssigningRole ? "Assigning..." : "Save Role"}
+									</Button>
+								</DialogFooter>
+							</form>
+						</Form>
+					</TabsContent>
+
+					{/* Create Role Tab Content */}
+					<TabsContent value="create">
+						<Form {...createForm}>
+							<form onSubmit={createForm.handleSubmit(onCreateRole)}>
+								<div className="space-y-4 py-4">
+									<FormField
+										control={createForm.control}
+										name="name"
+										render={({ field }) => (
+											<FormItem>
+												<FormLabel>Role Name</FormLabel>
+												<FormControl>
+													<Input placeholder="e.g. Developer" {...field} />
+												</FormControl>
+												<FormDescription>
+													Role name must be unique
+												</FormDescription>
+												<FormMessage />
+											</FormItem>
+										)}
+									/>
+
+									<FormField
+										control={createForm.control}
+										name="description"
+										render={({ field }) => (
+											<FormItem>
+												<FormLabel>Description</FormLabel>
+												<FormControl>
+													<Input
+														placeholder="e.g. Role for development team members"
+														{...field}
+													/>
+												</FormControl>
+
+												<FormMessage />
+											</FormItem>
+										)}
+									/>
+
+									<FormField
+										control={createForm.control}
+										name="permissions"
+										render={() => (
+											<FormItem>
+												<FormLabel>Permissions</FormLabel>
+												<Card className=" bg-transparent">
+													<CardHeader>
+														<CardTitle className="text-sm">
+															Available Permissions
+														</CardTitle>
+														<CardDescription>
+															Select the permissions for this role
+														</CardDescription>
+													</CardHeader>
+													<CardContent className="grid grid-cols-2 gap-4">
+														{defaultRoles?.permissions?.map((permission) => (
+															<FormField
+																key={permission.name}
+																control={createForm.control}
+																name="permissions"
+																render={({ field }) => (
+																	<FormItem
+																		key={permission.name}
+																		className="flex flex-row items-start space-x-3 space-y-0"
+																	>
+																		<FormControl>
+																			<Checkbox
+																				checked={field.value?.includes(
+																					permission.name,
+																				)}
+																				onCheckedChange={(checked) => {
+																					return checked
+																						? field.onChange([
+																								...(field.value || []),
+																								permission.name,
+																							])
+																						: field.onChange(
+																								field.value?.filter(
+																									(value) =>
+																										value !== permission.name,
+																								),
+																							);
+																				}}
+																			/>
+																		</FormControl>
+																		<FormLabel className="text-sm font-normal">
+																			{permission.description}
+																		</FormLabel>
+																	</FormItem>
+																)}
+															/>
+														))}
+													</CardContent>
+												</Card>
+												<FormMessage />
+											</FormItem>
+										)}
+									/>
+								</div>
+								<DialogFooter>
+									<Button
+										type="submit"
+										disabled={isCreatingRole || isUpdatingRole}
+									>
+										{isCreatingRole || isUpdatingRole
+											? "Saving..."
+											: "Save Role"}
+									</Button>
+									{editingRole && (
+										<Button
+											variant="outline"
+											onClick={cancelEdit}
+											disabled={isUpdatingRole}
+										>
+											Cancel
+										</Button>
+									)}
+								</DialogFooter>
+							</form>
+						</Form>
+					</TabsContent>
+				</Tabs>
+			</DialogContent>
+		</Dialog>
+	);
+};

apps/dokploy/components/dashboard/settings/users/add-permissions.tsx

@@ -1,444 +0,0 @@
-import { AlertBlock } from "@/components/shared/alert-block";
-import { Button } from "@/components/ui/button";
-import { Checkbox } from "@/components/ui/checkbox";
-import {
-	Dialog,
-	DialogContent,
-	DialogDescription,
-	DialogFooter,
-	DialogHeader,
-	DialogTitle,
-	DialogTrigger,
-} from "@/components/ui/dialog";
-import { DropdownMenuItem } from "@/components/ui/dropdown-menu";
-import {
-	Form,
-	FormControl,
-	FormDescription,
-	FormField,
-	FormItem,
-	FormLabel,
-	FormMessage,
-} from "@/components/ui/form";
-import { Switch } from "@/components/ui/switch";
-import { extractServices } from "@/pages/dashboard/project/[projectId]";
-import { api } from "@/utils/api";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
-
-const addPermissions = z.object({
-	accessedProjects: z.array(z.string()).optional(),
-	accessedServices: z.array(z.string()).optional(),
-	canCreateProjects: z.boolean().optional().default(false),
-	canCreateServices: z.boolean().optional().default(false),
-	canDeleteProjects: z.boolean().optional().default(false),
-	canDeleteServices: z.boolean().optional().default(false),
-	canAccessToTraefikFiles: z.boolean().optional().default(false),
-	canAccessToDocker: z.boolean().optional().default(false),
-	canAccessToAPI: z.boolean().optional().default(false),
-	canAccessToSSHKeys: z.boolean().optional().default(false),
-	canAccessToGitProviders: z.boolean().optional().default(false),
-});
-
-type AddPermissions = z.infer<typeof addPermissions>;
-
-interface Props {
-	userId: string;
-}
-
-export const AddUserPermissions = ({ userId }: Props) => {
-	const { data: projects } = api.project.all.useQuery();
-
-	const { data, refetch } = api.user.one.useQuery(
-		{
-			userId,
-		},
-		{
-			enabled: !!userId,
-		},
-	);
-
-	const { mutateAsync, isError, error, isLoading } =
-		api.user.assignPermissions.useMutation();
-
-	const form = useForm<AddPermissions>({
-		defaultValues: {
-			accessedProjects: [],
-			accessedServices: [],
-		},
-		resolver: zodResolver(addPermissions),
-	});
-
-	useEffect(() => {
-		if (data) {
-			form.reset({
-				accessedProjects: data.accessedProjects || [],
-				accessedServices: data.accessedServices || [],
-				canCreateProjects: data.canCreateProjects,
-				canCreateServices: data.canCreateServices,
-				canDeleteProjects: data.canDeleteProjects,
-				canDeleteServices: data.canDeleteServices,
-				canAccessToTraefikFiles: data.canAccessToTraefikFiles,
-				canAccessToDocker: data.canAccessToDocker,
-				canAccessToAPI: data.canAccessToAPI,
-				canAccessToSSHKeys: data.canAccessToSSHKeys,
-				canAccessToGitProviders: data.canAccessToGitProviders,
-			});
-		}
-	}, [form, form.formState.isSubmitSuccessful, form.reset, data]);
-
-	const onSubmit = async (data: AddPermissions) => {
-		await mutateAsync({
-			id: userId,
-			canCreateServices: data.canCreateServices,
-			canCreateProjects: data.canCreateProjects,
-			canDeleteServices: data.canDeleteServices,
-			canDeleteProjects: data.canDeleteProjects,
-			canAccessToTraefikFiles: data.canAccessToTraefikFiles,
-			accessedProjects: data.accessedProjects || [],
-			accessedServices: data.accessedServices || [],
-			canAccessToDocker: data.canAccessToDocker,
-			canAccessToAPI: data.canAccessToAPI,
-			canAccessToSSHKeys: data.canAccessToSSHKeys,
-			canAccessToGitProviders: data.canAccessToGitProviders,
-		})
-			.then(async () => {
-				toast.success("Permissions updated");
-				refetch();
-			})
-			.catch(() => {
-				toast.error("Error updating the permissions");
-			});
-	};
-	return (
-		<Dialog>
-			<DialogTrigger className="" asChild>
-				<DropdownMenuItem
-					className="w-full cursor-pointer"
-					onSelect={(e) => e.preventDefault()}
-				>
-					Add Permissions
-				</DropdownMenuItem>
-			</DialogTrigger>
-			<DialogContent className="max-h-[85vh]  sm:max-w-4xl">
-				<DialogHeader>
-					<DialogTitle>Permissions</DialogTitle>
-					<DialogDescription>Add or remove permissions</DialogDescription>
-				</DialogHeader>
-				{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
-
-				<Form {...form}>
-					<form
-						id="hook-form-add-permissions"
-						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid  grid-cols-1 md:grid-cols-2  w-full gap-4"
-					>
-						<FormField
-							control={form.control}
-							name="canCreateProjects"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Create Projects</FormLabel>
-										<FormDescription>
-											Allow the user to create projects
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="canDeleteProjects"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Delete Projects</FormLabel>
-										<FormDescription>
-											Allow the user to delete projects
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="canCreateServices"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Create Services</FormLabel>
-										<FormDescription>
-											Allow the user to create services
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="canDeleteServices"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Delete Services</FormLabel>
-										<FormDescription>
-											Allow the user to delete services
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="canAccessToTraefikFiles"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Access to Traefik Files</FormLabel>
-										<FormDescription>
-											Allow the user to access to the Traefik Tab Files
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="canAccessToDocker"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Access to Docker</FormLabel>
-										<FormDescription>
-											Allow the user to access to the Docker Tab
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="canAccessToAPI"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Access to API/CLI</FormLabel>
-										<FormDescription>
-											Allow the user to access to the API/CLI
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="canAccessToSSHKeys"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Access to SSH Keys</FormLabel>
-										<FormDescription>
-											Allow to users to access to the SSH Keys section
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="canAccessToGitProviders"
-							render={({ field }) => (
-								<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
-									<div className="space-y-0.5">
-										<FormLabel>Access to Git Providers</FormLabel>
-										<FormDescription>
-											Allow to users to access to the Git Providers section
-										</FormDescription>
-									</div>
-									<FormControl>
-										<Switch
-											checked={field.value}
-											onCheckedChange={field.onChange}
-										/>
-									</FormControl>
-								</FormItem>
-							)}
-						/>
-						<FormField
-							control={form.control}
-							name="accessedProjects"
-							render={() => (
-								<FormItem className="md:col-span-2">
-									<div className="mb-4">
-										<FormLabel className="text-base">Projects</FormLabel>
-										<FormDescription>
-											Select the Projects that the user can access
-										</FormDescription>
-									</div>
-									{projects?.length === 0 && (
-										<p className="text-sm text-muted-foreground">
-											No projects found
-										</p>
-									)}
-									<div className="grid md:grid-cols-2  gap-4">
-										{projects?.map((item, index) => {
-											const applications = extractServices(item);
-											return (
-												<FormField
-													key={`project-${index}`}
-													control={form.control}
-													name="accessedProjects"
-													render={({ field }) => {
-														return (
-															<FormItem
-																key={item.projectId}
-																className="flex flex-col items-start space-x-4 rounded-lg p-4 border"
-															>
-																<div className="flex flex-row gap-4">
-																	<FormControl>
-																		<Checkbox
-																			checked={field.value?.includes(
-																				item.projectId,
-																			)}
-																			onCheckedChange={(checked) => {
-																				return checked
-																					? field.onChange([
-																							...(field.value || []),
-																							item.projectId,
-																						])
-																					: field.onChange(
-																							field.value?.filter(
-																								(value) =>
-																									value !== item.projectId,
-																							),
-																						);
-																			}}
-																		/>
-																	</FormControl>
-																	<FormLabel className="text-sm font-medium text-primary">
-																		{item.name}
-																	</FormLabel>
-																</div>
-																{applications.length === 0 && (
-																	<p className="text-sm text-muted-foreground">
-																		No services found
-																	</p>
-																)}
-																{applications?.map((item, index) => (
-																	<FormField
-																		key={`project-${index}`}
-																		control={form.control}
-																		name="accessedServices"
-																		render={({ field }) => {
-																			return (
-																				<FormItem
-																					key={item.id}
-																					className="flex flex-row items-start space-x-3 space-y-0"
-																				>
-																					<FormControl>
-																						<Checkbox
-																							checked={field.value?.includes(
-																								item.id,
-																							)}
-																							onCheckedChange={(checked) => {
-																								return checked
-																									? field.onChange([
-																											...(field.value || []),
-																											item.id,
-																										])
-																									: field.onChange(
-																											field.value?.filter(
-																												(value) =>
-																													value !== item.id,
-																											),
-																										);
-																							}}
-																						/>
-																					</FormControl>
-																					<FormLabel className="text-sm text-muted-foreground">
-																						{item.name}
-																					</FormLabel>
-																				</FormItem>
-																			);
-																		}}
-																	/>
-																))}
-															</FormItem>
-														);
-													}}
-												/>
-											);
-										})}
-									</div>
-
-									<FormMessage />
-								</FormItem>
-							)}
-						/>
-						<DialogFooter className="flex w-full flex-row justify-end md:col-span-2">
-							<Button
-								isLoading={isLoading}
-								form="hook-form-add-permissions"
-								type="submit"
-							>
-								Update
-							</Button>
-						</DialogFooter>
-					</form>
-				</Form>
-			</DialogContent>
-		</Dialog>
-	);
-};

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

@@ -30,9 +30,10 @@ import { format } from "date-fns";
 import { MoreHorizontal, Users } from "lucide-react";
 import { Loader2 } from "lucide-react";
 import { toast } from "sonner";
-import { AddUserPermissions } from "./add-permissions";
+import { AddUserPermissionsV2 } from "./add-permissions-v2";
 
 export const ShowUsers = () => {
+	const { data: user } = api.user.get.useQuery();
 	const { data: isCloud } = api.settings.isCloud.useQuery();
 	const { data, isLoading, refetch } = api.user.all.useQuery();
 	const { mutateAsync } = api.user.remove.useMutation();
@@ -84,20 +85,22 @@ export const ShowUsers = () => {
 											</TableHeader>
 											<TableBody>
 												{data?.map((member) => {
+													const isSameUser = member.user.id === user?.user.id;
+
 													return (
 														<TableRow key={member.id}>
-															<TableCell className="w-[100px]">
-																{member.user.email}
+															<TableCell className="w-[250px]">
+																{member.user.email} {isSameUser && "(You)"}
 															</TableCell>
 															<TableCell className="text-center">
 																<Badge
 																	variant={
-																		member.role === "owner"
+																		member?.role?.name === "owner"
 																			? "default"
 																			: "secondary"
 																	}
 																>
-																	{member.role}
+																	{member?.role?.name}
 																</Badge>
 															</TableCell>
 															<TableCell className="text-center">
@@ -112,35 +115,77 @@ export const ShowUsers = () => {
 															</TableCell>
 
 															<TableCell className="text-right flex justify-end">
-																<DropdownMenu>
-																	<DropdownMenuTrigger asChild>
-																		<Button
-																			variant="ghost"
-																			className="h-8 w-8 p-0"
-																		>
-																			<span className="sr-only">Open menu</span>
-																			<MoreHorizontal className="h-4 w-4" />
-																		</Button>
-																	</DropdownMenuTrigger>
-																	<DropdownMenuContent align="end">
-																		<DropdownMenuLabel>
-																			Actions
-																		</DropdownMenuLabel>
+																{member.role !== "owner" && !isSameUser && (
+																	<DropdownMenu>
+																		<DropdownMenuTrigger asChild>
+																			<Button
+																				variant="ghost"
+																				className="h-8 w-8 p-0"
+																			>
+																				<span className="sr-only">
+																					Open menu
+																				</span>
+																				<MoreHorizontal className="h-4 w-4" />
+																			</Button>
+																		</DropdownMenuTrigger>
+																		<DropdownMenuContent align="end">
+																			<DropdownMenuLabel>
+																				Actions
+																			</DropdownMenuLabel>
 
-																		{member.role !== "owner" && (
-																			<AddUserPermissions
-																				userId={member.user.id}
-																			/>
-																		)}
-
-																		{member.role !== "owner" && (
 																			<>
-																				{!isCloud && (
-																					<DialogAction
-																						title="Delete User"
-																						description="Are you sure you want to delete this user?"
-																						type="destructive"
-																						onClick={async () => {
+																				<AddUserPermissionsV2
+																					userId={member.user.id}
+																				/>
+																			</>
+
+																			{!isCloud && (
+																				<DialogAction
+																					title="Delete User"
+																					description="Are you sure you want to delete this user?"
+																					type="destructive"
+																					onClick={async () => {
+																						await mutateAsync({
+																							userId: member.user.id,
+																						})
+																							.then(() => {
+																								toast.success(
+																									"User deleted successfully",
+																								);
+																								refetch();
+																							})
+																							.catch(() => {
+																								toast.error(
+																									"Error deleting destination",
+																								);
+																							});
+																					}}
+																				>
+																					<DropdownMenuItem
+																						className="w-full cursor-pointer text-red-500 hover:!text-red-600"
+																						onSelect={(e) => e.preventDefault()}
+																					>
+																						Delete User
+																					</DropdownMenuItem>
+																				</DialogAction>
+																			)}
+
+																			<DialogAction
+																				title="Unlink User"
+																				description="Are you sure you want to unlink this user?"
+																				type="destructive"
+																				onClick={async () => {
+																					if (!isCloud) {
+																						const orgCount =
+																							await utils.user.checkUserOrganizations.fetch(
+																								{
+																									userId: member.user.id,
+																								},
+																							);
+
+																						console.log(orgCount);
+
+																						if (orgCount === 1) {
 																							await mutateAsync({
 																								userId: member.user.id,
 																							})
@@ -152,86 +197,40 @@ export const ShowUsers = () => {
 																								})
 																								.catch(() => {
 																									toast.error(
-																										"Error deleting destination",
+																										"Error deleting user",
 																									);
 																								});
-																						}}
-																					>
-																						<DropdownMenuItem
-																							className="w-full cursor-pointer text-red-500 hover:!text-red-600"
-																							onSelect={(e) =>
-																								e.preventDefault()
-																							}
-																						>
-																							Delete User
-																						</DropdownMenuItem>
-																					</DialogAction>
-																				)}
-
-																				<DialogAction
-																					title="Unlink User"
-																					description="Are you sure you want to unlink this user?"
-																					type="destructive"
-																					onClick={async () => {
-																						if (!isCloud) {
-																							const orgCount =
-																								await utils.user.checkUserOrganizations.fetch(
-																									{
-																										userId: member.user.id,
-																									},
-																								);
-
-																							console.log(orgCount);
-
-																							if (orgCount === 1) {
-																								await mutateAsync({
-																									userId: member.user.id,
-																								})
-																									.then(() => {
-																										toast.success(
-																											"User deleted successfully",
-																										);
-																										refetch();
-																									})
-																									.catch(() => {
-																										toast.error(
-																											"Error deleting user",
-																										);
-																									});
-																								return;
-																							}
+																							return;
 																						}
+																					}
 
-																						const { error } =
-																							await authClient.organization.removeMember(
-																								{
-																									memberIdOrEmail: member.id,
-																								},
-																							);
+																					const { error } =
+																						await authClient.organization.removeMember(
+																							{
+																								memberIdOrEmail: member.id,
+																							},
+																						);
 
-																						if (!error) {
-																							toast.success(
-																								"User unlinked successfully",
-																							);
-																							refetch();
-																						} else {
-																							toast.error(
-																								"Error unlinking user",
-																							);
-																						}
-																					}}
+																					if (!error) {
+																						toast.success(
+																							"User unlinked successfully",
+																						);
+																						refetch();
+																					} else {
+																						toast.error("Error unlinking user");
+																					}
+																				}}
+																			>
+																				<DropdownMenuItem
+																					className="w-full cursor-pointer text-red-500 hover:!text-red-600"
+																					onSelect={(e) => e.preventDefault()}
 																				>
-																					<DropdownMenuItem
-																						className="w-full cursor-pointer text-red-500 hover:!text-red-600"
-																						onSelect={(e) => e.preventDefault()}
-																					>
-																						Unlink User
-																					</DropdownMenuItem>
-																				</DialogAction>
-																			</>
-																		)}
-																	</DropdownMenuContent>
-																</DropdownMenu>
+																					Unlink User
+																				</DropdownMenuItem>
+																			</DialogAction>
+																		</DropdownMenuContent>
+																	</DropdownMenu>
+																)}
 															</TableCell>
 														</TableRow>
 													);

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

@@ -62,9 +62,9 @@ type AddServerDomain = z.infer<typeof addServerDomain>;
 
 export const WebDomain = () => {
 	const { t } = useTranslation("settings");
-	const { data, refetch } = api.user.get.useQuery();
+	const { data, refetch } = api.webServer.get.useQuery();
 	const { mutateAsync, isLoading } =
-		api.settings.assignDomainServer.useMutation();
+		api.webServer.assignDomainServer.useMutation();
 
 	const form = useForm<AddServerDomain>({
 		defaultValues: {
@@ -79,10 +79,10 @@ export const WebDomain = () => {
 	useEffect(() => {
 		if (data) {
 			form.reset({
-				domain: data?.user?.host || "",
-				certificateType: data?.user?.certificateType,
-				letsEncryptEmail: data?.user?.letsEncryptEmail || "",
-				https: data?.user?.https || false,
+				domain: data?.host || "",
+				certificateType: data?.certificateType,
+				letsEncryptEmail: data?.letsEncryptEmail || "",
+				https: data?.https || false,
 			});
 		}
 	}, [form, form.reset, data]);

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

@@ -16,13 +16,12 @@ import { UpdateServer } from "./web-server/update-server";
 
 export const WebServer = () => {
 	const { t } = useTranslation("settings");
-	const { data } = api.user.get.useQuery();
+	const { data } = api.webServer.get.useQuery();
 
 	const { data: dokployVersion } = api.settings.getDokployVersion.useQuery();
 
 	return (
 		<div className="w-full">
-			{/* <Card className={cn("rounded-lg w-full bg-transparent p-0", className)}></Card> */}
 			<Card className="h-full bg-sidebar  p-2.5 rounded-xl  max-w-5xl mx-auto">
 				<div className="rounded-xl bg-background shadow-md ">
 					<CardHeader className="">
@@ -34,14 +33,6 @@ export const WebServer = () => {
 							{t("settings.server.webServer.description")}
 						</CardDescription>
 					</CardHeader>
-					{/* <CardHeader>
-						<CardTitle className="text-xl">
-							{t("settings.server.webServer.title")}
-						</CardTitle>
-						<CardDescription>
-							{t("settings.server.webServer.description")}
-						</CardDescription>
-					</CardHeader> */}
 					<CardContent className="space-y-6 py-6 border-t">
 						<div className="grid md:grid-cols-2 gap-4">
 							<ShowDokployActions />
@@ -53,7 +44,7 @@ export const WebServer = () => {
 
 						<div className="flex items-center flex-wrap justify-between gap-4">
 							<span className="text-sm text-muted-foreground">
-								Server IP: {data?.user.serverIp}
+								Server IP: {data?.serverIp}
 							</span>
 							<span className="text-sm text-muted-foreground">
 								Version: {dokployVersion}

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

@@ -1,11 +1,3 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { ArrowRightLeft, Plus, Trash2 } from "lucide-react";
-import { useTranslation } from "next-i18next";
-import type React from "react";
-import { useEffect, useState } from "react";
-import { useFieldArray, useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
@@ -27,15 +19,15 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { ScrollArea } from "@/components/ui/scroll-area";
-import {
-	Select,
-	SelectContent,
-	SelectGroup,
-	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";
+import { useTranslation } from "next-i18next";
+import type React from "react";
+import { useEffect, useState } from "react";
+import { useFieldArray, useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
 
 interface Props {
 	children: React.ReactNode;
@@ -45,7 +37,6 @@ interface Props {
 const PortSchema = z.object({
 	targetPort: z.number().min(1, "Target port is required"),
 	publishedPort: z.number().min(1, "Published port is required"),
-	protocol: z.enum(["tcp", "udp", "sctp"]),
 });
 
 const TraefikPortsSchema = z.object({
@@ -84,17 +75,12 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 
 	useEffect(() => {
 		if (currentPorts) {
-			form.reset({
-				ports: currentPorts.map((port) => ({
-					...port,
-					protocol: port.protocol as "tcp" | "udp" | "sctp",
-				})),
-			});
+			form.reset({ ports: currentPorts });
 		}
 	}, [currentPorts, form]);
 
 	const handleAddPort = () => {
-		append({ targetPort: 0, publishedPort: 0, protocol: "tcp" });
+		append({ targetPort: 0, publishedPort: 0 });
 	};
 
 	const onSubmit = async (data: TraefikPortsForm) => {
@@ -110,9 +96,7 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 
 	return (
 		<>
-			<button type="button" onClick={() => setOpen(true)}>
-				{children}
-			</button>
+			<div onClick={() => setOpen(true)}>{children}</div>
 			<Dialog open={open} onOpenChange={setOpen}>
 				<DialogContent className="sm:max-w-3xl">
 					<DialogHeader>
@@ -159,8 +143,8 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 									<ScrollArea className="h-[400px] pr-4">
 										<div className="grid gap-4">
 											{fields.map((field, index) => (
-												<Card key={field.id} className="bg-transparent">
-													<CardContent className="grid grid-cols-[1fr_1fr_1fr_auto] gap-4 p-4 transparent">
+												<Card key={field.id}>
+													<CardContent className="grid grid-cols-[1fr_1fr_auto] gap-4 p-4 transparent">
 														<FormField
 															control={form.control}
 															name={`ports.${index}.targetPort`}
@@ -184,6 +168,7 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 																				);
 																			}}
 																			value={field.value || ""}
+																			className="w-full dark:bg-black"
 																			placeholder="e.g. 8080"
 																		/>
 																	</FormControl>
@@ -215,6 +200,7 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 																				);
 																			}}
 																			value={field.value || ""}
+																			className="w-full dark:bg-black"
 																			placeholder="e.g. 80"
 																		/>
 																	</FormControl>
@@ -222,42 +208,6 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 																</FormItem>
 															)}
 														/>
-														<FormField
-															control={form.control}
-															name={`ports.${index}.protocol`}
-															render={({ field }) => (
-																<FormItem>
-																	<FormLabel className="text-sm font-medium text-muted-foreground">
-																		Protocol
-																	</FormLabel>
-																	<FormControl>
-																		<Select
-																			onValueChange={field.onChange}
-																			defaultValue={field.value}
-																		>
-																			<SelectTrigger>
-																				<SelectValue placeholder="Select a protocol" />
-																			</SelectTrigger>
-																			<SelectContent>
-																				<SelectGroup>
-																					{["tcp", "udp", "sctp"].map(
-																						(protocol) => (
-																							<SelectItem
-																								key={protocol}
-																								value={protocol}
-																							>
-																								{protocol}
-																							</SelectItem>
-																						),
-																					)}
-																				</SelectGroup>
-																			</SelectContent>
-																		</Select>
-																	</FormControl>
-																	<FormMessage />
-																</FormItem>
-															)}
-														/>
 
 														<div className="flex items-end">
 															<Button

apps/dokploy/components/dashboard/settings/web-server/update-server-ip.tsx

@@ -46,15 +46,15 @@ interface Props {
 export const UpdateServerIp = ({ children }: Props) => {
 	const [isOpen, setIsOpen] = useState(false);
 
-	const { data } = api.user.get.useQuery();
+	const { data } = api.webServer.get.useQuery();
 	const { data: ip } = api.server.publicIp.useQuery();
 
 	const { mutateAsync, isLoading, error, isError } =
-		api.user.update.useMutation();
+		api.webServer.update.useMutation();
 
 	const form = useForm<Schema>({
 		defaultValues: {
-			serverIp: data?.user.serverIp || "",
+			serverIp: data?.serverIp || "",
 		},
 		resolver: zodResolver(schema),
 	});
@@ -62,7 +62,7 @@ export const UpdateServerIp = ({ children }: Props) => {
 	useEffect(() => {
 		if (data) {
 			form.reset({
-				serverIp: data.user.serverIp || "",
+				serverIp: data.serverIp || "",
 			});
 		}
 	}, [form, form.reset, data]);
@@ -80,7 +80,7 @@ export const UpdateServerIp = ({ children }: Props) => {
 		})
 			.then(async () => {
 				toast.success("Server IP Updated");
-				await utils.user.get.invalidate();
+				await utils.webServer.get.invalidate();
 				setIsOpen(false);
 			})
 			.catch(() => {

apps/dokploy/components/dashboard/settings/web-server/update-server.tsx

@@ -126,7 +126,7 @@ export const UpdateServer = ({
 					</TooltipProvider>
 				)}
 			</DialogTrigger>
-			<DialogContent className="max-w-lg">
+			<DialogContent className="max-w-lg p-6">
 				<div className="flex items-center justify-between mb-8">
 					<DialogTitle className="text-2xl font-semibold">
 						Web Server Update
@@ -253,7 +253,7 @@ export const UpdateServer = ({
 					<ToggleAutoCheckUpdates disabled={isLoading} />
 				</div>
 
-				<div className="space-y-4 flex items-center justify-end mt-4	">
+				<div className="space-y-4 flex items-center justify-end">
 					<div className="flex items-center gap-2">
 						<Button variant="outline" onClick={() => onOpenChange?.(false)}>
 							Cancel

apps/dokploy/components/dashboard/shared/Permissions.tsx

@@ -0,0 +1,28 @@
+import { api } from "@/utils/api";
+import type { PermissionName } from "@dokploy/server/lib/permissions";
+import { useMemo } from "react";
+
+interface Props {
+	permissions: PermissionName[];
+	children: React.ReactNode;
+}
+
+export const Permissions = ({ permissions, children }: Props) => {
+	const { data: auth } = api.user.get.useQuery();
+
+	const hasPermission = useMemo(() => {
+		if (auth?.role?.name === "owner" || auth?.role?.name === "admin") {
+			return true;
+		}
+
+		return permissions.some((permission) =>
+			auth?.role?.permissions?.includes(permission),
+		);
+	}, [permissions, auth]);
+
+	if (!hasPermission) {
+		return null;
+	}
+
+	return <>{children}</>;
+};

apps/dokploy/components/dashboard/swarm/applications/show-applications.tsx

@@ -1,4 +1,3 @@
-import { Layers, Loader2 } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import {
 	Dialog,
@@ -9,6 +8,7 @@ import {
 	DialogTrigger,
 } from "@/components/ui/dialog";
 import { api } from "@/utils/api";
+import { Layers, Loader2 } from "lucide-react";
 import { type ApplicationList, columns } from "./columns";
 import { DataTable } from "./data-table";
 
@@ -20,10 +20,10 @@ export const ShowNodeApplications = ({ serverId }: Props) => {
 	const { data: NodeApps, isLoading: NodeAppsLoading } =
 		api.swarm.getNodeApps.useQuery({ serverId });
 
-	let applicationList: string[] = [];
+	let applicationList = "";
 
 	if (NodeApps && NodeApps.length > 0) {
-		applicationList = NodeApps.map((app) => app.Name);
+		applicationList = NodeApps.map((app) => app.Name).join(" ");
 	}
 
 	const { data: NodeAppDetails, isLoading: NodeAppDetailsLoading } =

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

@@ -128,7 +128,7 @@ export default function SwarmMonitorCard({ serverId }: Props) {
 										</div>
 									</TooltipTrigger>
 									<TooltipContent>
-										<div className="max-h-48 overflow-y-auto">
+										<div className="max-h-48">
 											{activeNodes.map((node) => (
 												<div key={node.ID} className="flex items-center gap-2">
 													{node.Hostname}
@@ -162,7 +162,7 @@ export default function SwarmMonitorCard({ serverId }: Props) {
 										</div>
 									</TooltipTrigger>
 									<TooltipContent>
-										<div className="max-h-48 overflow-y-auto">
+										<div className="max-h-48">
 											{managerNodes.map((node) => (
 												<div key={node.ID} className="flex items-center gap-2">
 													{node.Hostname}

apps/dokploy/components/layouts/onboarding-layout.tsx

@@ -1,6 +1,6 @@
+import { cn } from "@/lib/utils";
 import Link from "next/link";
 import type React from "react";
-import { cn } from "@/lib/utils";
 import { GithubIcon } from "../icons/data-tools-icons";
 import { Logo } from "../shared/logo";
 import { Button } from "../ui/button";

apps/dokploy/components/layouts/side.tsx

@@ -1,5 +1,4 @@
 "use client";
-import type { inferRouterOutputs } from "@trpc/server";
 import {
 	Activity,
 	BarChartHorizontalBigIcon,
@@ -30,10 +29,10 @@ import {
 	User,
 	Users,
 } from "lucide-react";
-import Link from "next/link";
 import { usePathname } from "next/navigation";
+import type * as React from "react";
 import { useEffect, useState } from "react";
-import { toast } from "sonner";
+
 import {
 	Breadcrumb,
 	BreadcrumbItem,
@@ -78,14 +77,18 @@ import { authClient } from "@/lib/auth-client";
 import { cn } from "@/lib/utils";
 import type { AppRouter } from "@/server/api/root";
 import { api } from "@/utils/api";
+import type { inferRouterOutputs } from "@trpc/server";
+import Link from "next/link";
+import { useRouter } from "next/router";
+import { toast } from "sonner";
 import { AddOrganization } from "../dashboard/organization/handle-organization";
 import { DialogAction } from "../shared/dialog-action";
 import { Logo } from "../shared/logo";
 import { Button } from "../ui/button";
 import { UpdateServerButton } from "./update-server";
 import { UserNav } from "./user-nav";
+import { PERMISSIONS } from "@dokploy/server/lib/permissions";
 
-// The types of the queries we are going to use
 type AuthQueryOutput = inferRouterOutputs<AppRouter>["user"]["get"];
 
 type SingleNavItem = {
@@ -93,13 +96,12 @@ type SingleNavItem = {
 	title: string;
 	url: string;
 	icon?: LucideIcon;
-	isEnabled?: (opts: { auth?: AuthQueryOutput; isCloud: boolean }) => boolean;
+	isEnabled?: (opts: {
+		auth?: AuthQueryOutput;
+		isCloud: boolean;
+	}) => boolean;
 };
 
-// NavItem type
-// Consists of a single item or a group of items
-// If `isSingle` is true or undefined, the item is a single item
-// If `isSingle` is false, the item is a group of items
 type NavItem =
 	| SingleNavItem
 	| {
@@ -113,27 +115,22 @@ type NavItem =
 			}) => boolean;
 	  };
 
-// ExternalLink type
-// Represents an external link item (used for the help section)
 type ExternalLink = {
 	name: string;
 	url: string;
 	icon: React.ComponentType<{ className?: string }>;
-	isEnabled?: (opts: { auth?: AuthQueryOutput; isCloud: boolean }) => boolean;
+	isEnabled?: (opts: {
+		auth?: AuthQueryOutput;
+		isCloud: boolean;
+	}) => boolean;
 };
 
-// Menu type
-// Consists of home, settings, and help items
 type Menu = {
 	home: NavItem[];
 	settings: NavItem[];
 	help: ExternalLink[];
 };
 
-// Menu items
-// Consists of unfiltered home, settings, and help items
-// The items are filtered based on the user's role and permissions
-// The `isEnabled` function is called to determine if the item should be displayed
 const MENU: Menu = {
 	home: [
 		{
@@ -156,7 +153,8 @@ const MENU: Menu = {
 			url: "/dashboard/schedules",
 			icon: Clock,
 			// Only enabled in non-cloud environments
-			isEnabled: ({ isCloud, auth }) => !isCloud && auth?.role === "owner",
+			isEnabled: ({ isCloud, auth }) =>
+				!isCloud && auth?.role?.name === "owner",
 		},
 		{
 			isSingle: true,
@@ -166,7 +164,10 @@ const MENU: Menu = {
 			// Only enabled for admins and users with access to Traefik files in non-cloud environments
 			isEnabled: ({ auth, isCloud }) =>
 				!!(
-					(auth?.role === "owner" || auth?.canAccessToTraefikFiles) &&
+					(auth?.role?.name === "owner" ||
+						auth?.role?.permissions?.includes(
+							PERMISSIONS.TRAEFIK.ACCESS.name,
+						)) &&
 					!isCloud
 				),
 		},
@@ -177,7 +178,11 @@ const MENU: Menu = {
 			icon: BlocksIcon,
 			// Only enabled for admins and users with access to Docker in non-cloud environments
 			isEnabled: ({ auth, isCloud }) =>
-				!!((auth?.role === "owner" || auth?.canAccessToDocker) && !isCloud),
+				!!(
+					(auth?.role?.name === "owner" ||
+						auth?.role?.permissions?.includes(PERMISSIONS.DOCKER.VIEW.name)) &&
+					!isCloud
+				),
 		},
 		{
 			isSingle: true,
@@ -186,7 +191,11 @@ const MENU: Menu = {
 			icon: PieChart,
 			// Only enabled for admins and users with access to Docker in non-cloud environments
 			isEnabled: ({ auth, isCloud }) =>
-				!!((auth?.role === "owner" || auth?.canAccessToDocker) && !isCloud),
+				!!(
+					(auth?.role?.name === "owner" ||
+						auth?.role?.permissions?.includes(PERMISSIONS.DOCKER.VIEW.name)) &&
+					!isCloud
+				),
 		},
 		{
 			isSingle: true,
@@ -195,64 +204,12 @@ const MENU: Menu = {
 			icon: Forward,
 			// Only enabled for admins and users with access to Docker in non-cloud environments
 			isEnabled: ({ auth, isCloud }) =>
-				!!((auth?.role === "owner" || auth?.canAccessToDocker) && !isCloud),
+				!!(
+					(auth?.role?.name === "owner" ||
+						auth?.role?.permissions?.includes(PERMISSIONS.DOCKER.VIEW.name)) &&
+					!isCloud
+				),
 		},
-
-		// Legacy unused menu, adjusted to the new structure
-		// {
-		// 	isSingle: true,
-		// 	title: "Projects",
-		// 	url: "/dashboard/projects",
-		// 	icon: Folder,
-		// },
-		// {
-		// 	isSingle: true,
-		// 	title: "Monitoring",
-		// 	icon: BarChartHorizontalBigIcon,
-		// 	url: "/dashboard/settings/monitoring",
-		// },
-		// {
-		//   isSingle: false,
-		//   title: "Settings",
-		//   icon: Settings2,
-		//   items: [
-		//     {
-		//       title: "Profile",
-		//       url: "/dashboard/settings/profile",
-		//     },
-		//     {
-		//       title: "Users",
-		//       url: "/dashboard/settings/users",
-		//     },
-		//     {
-		//       title: "SSH Key",
-		//       url: "/dashboard/settings/ssh-keys",
-		//     },
-		//     {
-		//       title: "Git",
-		//       url: "/dashboard/settings/git-providers",
-		//     },
-		//   ],
-		// },
-		// {
-		//   isSingle: false,
-		//   title: "Integrations",
-		//   icon: BlocksIcon,
-		//   items: [
-		//     {
-		//       title: "S3 Destinations",
-		//       url: "/dashboard/settings/destinations",
-		//     },
-		//     {
-		//       title: "Registry",
-		//       url: "/dashboard/settings/registry",
-		//     },
-		//     {
-		//       title: "Notifications",
-		//       url: "/dashboard/settings/notifications",
-		//     },
-		//   ],
-		// },
 	],
 
 	settings: [
@@ -262,7 +219,8 @@ const MENU: Menu = {
 			url: "/dashboard/settings/server",
 			icon: Activity,
 			// Only enabled for admins in non-cloud environments
-			isEnabled: ({ auth, isCloud }) => !!(auth?.role === "owner" && !isCloud),
+			isEnabled: ({ auth, isCloud }) =>
+				!!(auth?.role?.name === "owner" && !isCloud),
 		},
 		{
 			isSingle: true,
@@ -276,7 +234,7 @@ const MENU: Menu = {
 			url: "/dashboard/settings/servers",
 			icon: Server,
 			// Only enabled for admins
-			isEnabled: ({ auth }) => !!(auth?.role === "owner"),
+			isEnabled: ({ auth }) => !!(auth?.role?.name === "owner"),
 		},
 		{
 			isSingle: true,
@@ -284,7 +242,7 @@ const MENU: Menu = {
 			icon: Users,
 			url: "/dashboard/settings/users",
 			// Only enabled for admins
-			isEnabled: ({ auth }) => !!(auth?.role === "owner"),
+			isEnabled: ({ auth }) => !!(auth?.role?.name === "owner"),
 		},
 		{
 			isSingle: true,
@@ -293,14 +251,17 @@ const MENU: Menu = {
 			url: "/dashboard/settings/ssh-keys",
 			// Only enabled for admins and users with access to SSH keys
 			isEnabled: ({ auth }) =>
-				!!(auth?.role === "owner" || auth?.canAccessToSSHKeys),
+				!!(
+					auth?.role?.name === "owner" ||
+					auth?.role?.permissions?.includes(PERMISSIONS.SSH_KEYS.ACCESS.name)
+				),
 		},
 		{
 			title: "AI",
 			icon: BotIcon,
 			url: "/dashboard/settings/ai",
 			isSingle: true,
-			isEnabled: ({ auth }) => !!(auth?.role === "owner"),
+			isEnabled: ({ auth }) => !!(auth?.role?.name === "owner"),
 		},
 		{
 			isSingle: true,
@@ -309,7 +270,12 @@ const MENU: Menu = {
 			icon: GitBranch,
 			// Only enabled for admins and users with access to Git providers
 			isEnabled: ({ auth }) =>
-				!!(auth?.role === "owner" || auth?.canAccessToGitProviders),
+				!!(
+					auth?.role?.name === "owner" ||
+					auth?.role?.permissions?.includes(
+						PERMISSIONS.GIT_PROVIDERS.ACCESS.name,
+					)
+				),
 		},
 		{
 			isSingle: true,
@@ -317,7 +283,7 @@ const MENU: Menu = {
 			url: "/dashboard/settings/registry",
 			icon: Package,
 			// Only enabled for admins
-			isEnabled: ({ auth }) => !!(auth?.role === "owner"),
+			isEnabled: ({ auth }) => !!(auth?.role?.name === "owner"),
 		},
 		{
 			isSingle: true,
@@ -325,7 +291,7 @@ const MENU: Menu = {
 			url: "/dashboard/settings/destinations",
 			icon: Database,
 			// Only enabled for admins
-			isEnabled: ({ auth }) => !!(auth?.role === "owner"),
+			isEnabled: ({ auth }) => !!(auth?.role?.name === "owner"),
 		},
 
 		{
@@ -334,7 +300,7 @@ const MENU: Menu = {
 			url: "/dashboard/settings/certificates",
 			icon: ShieldCheck,
 			// Only enabled for admins
-			isEnabled: ({ auth }) => !!(auth?.role === "owner"),
+			isEnabled: ({ auth }) => !!(auth?.role?.name === "owner"),
 		},
 		{
 			isSingle: true,
@@ -342,7 +308,8 @@ const MENU: Menu = {
 			url: "/dashboard/settings/cluster",
 			icon: Boxes,
 			// Only enabled for admins in non-cloud environments
-			isEnabled: ({ auth, isCloud }) => !!(auth?.role === "owner" && !isCloud),
+			isEnabled: ({ auth, isCloud }) =>
+				!!(auth?.role?.name === "owner" && !isCloud),
 		},
 		{
 			isSingle: true,
@@ -350,7 +317,7 @@ const MENU: Menu = {
 			url: "/dashboard/settings/notifications",
 			icon: Bell,
 			// Only enabled for admins
-			isEnabled: ({ auth }) => !!(auth?.role === "owner"),
+			isEnabled: ({ auth }) => !!(auth?.role?.name === "owner"),
 		},
 		{
 			isSingle: true,
@@ -358,7 +325,8 @@ const MENU: Menu = {
 			url: "/dashboard/settings/billing",
 			icon: CreditCard,
 			// Only enabled for admins in cloud environments
-			isEnabled: ({ auth, isCloud }) => !!(auth?.role === "owner" && isCloud),
+			isEnabled: ({ auth, isCloud }) =>
+				!!(auth?.role?.name === "owner" && isCloud),
 		},
 	],
 
@@ -496,6 +464,7 @@ function SidebarLogo() {
 	const { state } = useSidebar();
 	const { data: isCloud } = api.settings.isCloud.useQuery();
 	const { data: user } = api.user.get.useQuery();
+	console.log(user);
 	const { data: session } = authClient.useSession();
 
 	const {
@@ -654,7 +623,7 @@ function SidebarLogo() {
 										)}
 									</div>
 								))}
-								{(user?.role === "owner" || isCloud) && (
+								{(user?.role?.name === "owner" || isCloud) && (
 									<>
 										<DropdownMenuSeparator />
 										<AddOrganization />
@@ -767,7 +736,9 @@ export default function Page({ children }: Props) {
 		setIsLoaded(true);
 	}, []);
 
+	const router = useRouter();
 	const pathname = usePathname();
+	const _currentPath = router.pathname;
 	const { data: auth } = api.user.get.useQuery();
 	const { data: dokployVersion } = api.settings.getDokployVersion.useQuery();
 
@@ -1018,7 +989,7 @@ export default function Page({ children }: Props) {
 				</SidebarContent>
 				<SidebarFooter>
 					<SidebarMenu className="flex flex-col gap-2">
-						{!isCloud && auth?.role === "owner" && (
+						{!isCloud && auth?.role?.name === "owner" && (
 							<SidebarMenuItem>
 								<UpdateServerButton />
 							</SidebarMenuItem>

apps/dokploy/components/layouts/update-server.tsx

@@ -1,7 +1,8 @@
+import { api } from "@/utils/api";
 import type { IUpdateData } from "@dokploy/server/index";
 import { Download } from "lucide-react";
+import { useRouter } from "next/router";
 import { useEffect, useRef, useState } from "react";
-import { api } from "@/utils/api";
 import UpdateServer from "../dashboard/settings/web-server/update-server";
 import { Button } from "../ui/button";
 import {
@@ -10,7 +11,6 @@ import {
 	TooltipProvider,
 	TooltipTrigger,
 } from "../ui/tooltip";
-
 const AUTO_CHECK_UPDATES_INTERVAL_MINUTES = 7;
 
 export const UpdateServerButton = () => {
@@ -18,6 +18,7 @@ export const UpdateServerButton = () => {
 		latestVersion: null,
 		updateAvailable: false,
 	});
+	const _router = useRouter();
 	const { data: isCloud } = api.settings.isCloud.useQuery();
 	const { mutateAsync: getUpdateData } =
 		api.settings.getUpdateData.useMutation();
@@ -25,6 +26,9 @@ export const UpdateServerButton = () => {
 
 	const checkUpdatesIntervalRef = useRef<null | NodeJS.Timeout>(null);
 
+	if (isCloud) {
+		return null;
+	}
 	useEffect(() => {
 		// Handling of automatic check for server updates
 		if (isCloud) {
@@ -73,7 +77,7 @@ export const UpdateServerButton = () => {
 		};
 	}, []);
 
-	return !isCloud && updateData.updateAvailable ? (
+	return updateData.updateAvailable ? (
 		<div className="border-t pt-4">
 			<UpdateServer
 				updateData={updateData}

apps/dokploy/components/layouts/user-nav.tsx

@@ -1,5 +1,3 @@
-import { ChevronsUpDown } from "lucide-react";
-import { useRouter } from "next/router";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
 import {
 	DropdownMenu,
@@ -19,11 +17,14 @@ import {
 } from "@/components/ui/select";
 import { authClient } from "@/lib/auth-client";
 import { Languages } from "@/lib/languages";
-import { getFallbackAvatarInitials } from "@/lib/utils";
 import { api } from "@/utils/api";
 import useLocale from "@/utils/hooks/use-locale";
+import { ChevronsUpDown } from "lucide-react";
+import { useRouter } from "next/router";
 import { ModeToggle } from "../ui/modeToggle";
 import { SidebarMenuButton } from "../ui/sidebar";
+import { Permissions } from "../dashboard/shared/Permissions";
+import { PERMISSIONS } from "@dokploy/server/lib/permissions";
 
 const _AUTO_CHECK_UPDATES_INTERVAL_MINUTES = 7;
 
@@ -47,9 +48,7 @@ export const UserNav = () => {
 							src={data?.user?.image || ""}
 							alt={data?.user?.image || ""}
 						/>
-						<AvatarFallback className="rounded-lg">
-							{getFallbackAvatarInitials(data?.user?.name)}
-						</AvatarFallback>
+						<AvatarFallback className="rounded-lg">CN</AvatarFallback>
 					</Avatar>
 					<div className="grid flex-1 text-left text-sm leading-tight">
 						<span className="truncate font-semibold">Account</span>
@@ -101,7 +100,7 @@ export const UserNav = () => {
 							>
 								Monitoring
 							</DropdownMenuItem>
-							{(data?.role === "owner" || data?.canAccessToTraefikFiles) && (
+							<Permissions permissions={[PERMISSIONS.TRAEFIK.ACCESS.name]}>
 								<DropdownMenuItem
 									className="cursor-pointer"
 									onClick={() => {
@@ -110,8 +109,9 @@ export const UserNav = () => {
 								>
 									Traefik
 								</DropdownMenuItem>
-							)}
-							{(data?.role === "owner" || data?.canAccessToDocker) && (
+							</Permissions>
+
+							<Permissions permissions={[PERMISSIONS.DOCKER.VIEW.name]}>
 								<DropdownMenuItem
 									className="cursor-pointer"
 									onClick={() => {
@@ -122,22 +122,24 @@ export const UserNav = () => {
 								>
 									Docker
 								</DropdownMenuItem>
-							)}
+							</Permissions>
 						</>
 					) : (
-						data?.role === "owner" && (
-							<DropdownMenuItem
-								className="cursor-pointer"
-								onClick={() => {
-									router.push("/dashboard/settings/servers");
-								}}
-							>
-								Servers
-							</DropdownMenuItem>
-						)
+						<>
+							{data?.role?.name === "owner" && (
+								<DropdownMenuItem
+									className="cursor-pointer"
+									onClick={() => {
+										router.push("/dashboard/settings/servers");
+									}}
+								>
+									Servers
+								</DropdownMenuItem>
+							)}
+						</>
 					)}
 				</DropdownMenuGroup>
-				{isCloud && data?.role === "owner" && (
+				{isCloud && data?.role?.name === "owner" && (
 					<DropdownMenuItem
 						className="cursor-pointer"
 						onClick={() => {
@@ -155,9 +157,6 @@ export const UserNav = () => {
 							await authClient.signOut().then(() => {
 								router.push("/");
 							});
-							// await mutateAsync().then(() => {
-							// 	router.push("/");
-							// });
 						}}
 					>
 						Log out

apps/dokploy/drizzle/0103_brainy_nehzno.sql

@@ -0,0 +1,187 @@
+CREATE TABLE "member_role" (
+	"roleId" text PRIMARY KEY NOT NULL,
+	"name" text NOT NULL,
+	"description" text,
+	"canDelete" boolean DEFAULT true NOT NULL,
+	"is_system" boolean DEFAULT false,
+	"permissions" text[],
+	"created_at" timestamp DEFAULT now() NOT NULL,
+	"updated_at" timestamp DEFAULT now() NOT NULL,
+	"organizationId" text NOT NULL,
+	CONSTRAINT "member_role_name_unique" UNIQUE("name"),
+	CONSTRAINT "role_name_unique" UNIQUE("name","organizationId")
+);
+
+-- Create default roles for each organization
+DO $$
+DECLARE
+    org RECORD;
+BEGIN
+    FOR org IN SELECT id FROM "organization"
+    LOOP
+        -- Insert owner role
+        INSERT INTO "member_role" ("roleId", "name", "description", "canDelete", "is_system", "permissions", "created_at", "updated_at", "organizationId")
+        VALUES (
+            org.id || '_owner',
+            'owner',
+            'Owner role with full access',
+            false,
+            true,
+            '{"project:create", "project:delete", "service:create", "service:delete", "traefik_files:access", "docker:view", "api:access", "ssh_keys:access", "git_providers:access", "schedules:access"}',
+            NOW(),
+            NOW(),
+            org.id
+        );
+
+        -- Insert admin role
+        INSERT INTO "member_role" ("roleId", "name", "description", "canDelete", "is_system", "permissions", "created_at", "updated_at", "organizationId")
+        VALUES (
+            org.id || '_admin',
+            'admin',
+            'Administrator role with elevated access',
+            false,
+            true,
+            '{"project:create", "project:delete", "service:create", "service:delete", "traefik_files:access", "docker:view", "api:access", "ssh_keys:access", "schedules:access"}',
+            NOW(),
+            NOW(),
+            org.id
+        );
+
+        -- Insert member role
+        INSERT INTO "member_role" ("roleId", "name", "description", "canDelete", "is_system", "permissions", "created_at", "updated_at", "organizationId")
+        VALUES (
+            org.id || '_member',
+            'member',
+            'Standard member role',
+            false,
+            true,
+            '{"project:create", "service:create", "docker:view"}',
+            NOW(),
+            NOW(),
+            org.id
+        );
+    END LOOP;
+END $$;
+
+
+--> statement-breakpoint
+ALTER TABLE "user_temp" RENAME TO "users";--> statement-breakpoint
+ALTER TABLE "users" DROP CONSTRAINT "user_temp_email_unique";--> statement-breakpoint
+ALTER TABLE "backup" DROP CONSTRAINT "backup_userId_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "session_temp" DROP CONSTRAINT "session_temp_user_id_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "git_provider" DROP CONSTRAINT "git_provider_userId_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "account" DROP CONSTRAINT "account_user_id_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "apikey" DROP CONSTRAINT "apikey_user_id_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "invitation" DROP CONSTRAINT "invitation_inviter_id_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "member" DROP CONSTRAINT "member_user_id_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "organization" DROP CONSTRAINT "organization_owner_id_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "two_factor" DROP CONSTRAINT "two_factor_user_id_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "schedule" DROP CONSTRAINT "schedule_userId_user_temp_id_fk";
+--> statement-breakpoint
+ALTER TABLE "users" ALTER COLUMN "created_at" SET NOT NULL;--> statement-breakpoint
+ALTER TABLE "users" ALTER COLUMN "updated_at" SET DEFAULT now();--> statement-breakpoint
+ALTER TABLE "member" ALTER COLUMN "role" DROP NOT NULL;--> statement-breakpoint
+ALTER TABLE "member" ADD COLUMN "roleId" text;--> statement-breakpoint
+ALTER TABLE "member_role" ADD CONSTRAINT "member_role_organizationId_organization_id_fk" FOREIGN KEY ("organizationId") REFERENCES "public"."organization"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "backup" ADD CONSTRAINT "backup_userId_users_id_fk" FOREIGN KEY ("userId") REFERENCES "public"."users"("id") ON DELETE no action ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "session_temp" ADD CONSTRAINT "session_temp_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "git_provider" ADD CONSTRAINT "git_provider_userId_users_id_fk" FOREIGN KEY ("userId") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "account" ADD CONSTRAINT "account_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "apikey" ADD CONSTRAINT "apikey_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "invitation" ADD CONSTRAINT "invitation_inviter_id_users_id_fk" FOREIGN KEY ("inviter_id") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "member" ADD CONSTRAINT "member_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "member" ADD CONSTRAINT "member_roleId_member_role_roleId_fk" FOREIGN KEY ("roleId") REFERENCES "public"."member_role"("roleId") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+
+-- Update existing members with corresponding roles based on their current role type
+DO $$
+DECLARE
+    mem RECORD;
+BEGIN
+    FOR mem IN SELECT m.id, m.organization_id, m.role as role_type FROM "member" m
+    LOOP
+        UPDATE "member"
+        SET "roleId" = mem.organization_id || '_' || mem.role_type
+        WHERE id = mem.id;
+    END LOOP;
+END $$;
+
+
+ALTER TABLE "organization" ADD CONSTRAINT "organization_owner_id_users_id_fk" FOREIGN KEY ("owner_id") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "two_factor" ADD CONSTRAINT "two_factor_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "schedule" ADD CONSTRAINT "schedule_userId_users_id_fk" FOREIGN KEY ("userId") REFERENCES "public"."users"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+
+
+--> statement-breakpoint
+CREATE TABLE "web_server" (
+	"webServerId" text PRIMARY KEY NOT NULL,
+	"serverIp" text,
+	"certificateType" "certificateType" DEFAULT 'none' NOT NULL,
+	"https" boolean DEFAULT false NOT NULL,
+	"host" text,
+	"letsEncryptEmail" text,
+	"sshPrivateKey" text,
+	"enableDockerCleanup" boolean DEFAULT false NOT NULL,
+	"logCleanupCron" text DEFAULT '0 0 * * *',
+	"metricsConfig" jsonb DEFAULT '{"server":{"type":"Dokploy","refreshRate":60,"port":4500,"token":"","retentionDays":2,"cronJob":"","urlCallback":"","thresholds":{"cpu":0,"memory":0}},"containers":{"refreshRate":60,"services":{"include":[],"exclude":[]}}}'::jsonb NOT NULL
+);
+
+INSERT INTO "web_server" (
+	"webServerId", 
+	"serverIp", 
+	"certificateType", 
+	"https", 
+	"host", 
+	"letsEncryptEmail", 
+	"sshPrivateKey", 
+	"enableDockerCleanup", 
+	"logCleanupCron", 
+	"metricsConfig"
+)
+SELECT 
+	gen_random_uuid() as "webServerId",
+	u."serverIp",
+	COALESCE(u."certificateType", 'none') as "certificateType",
+	COALESCE(u."https", false) as "https",
+	u."host",
+	u."letsEncryptEmail",
+	u."sshPrivateKey",
+	COALESCE(u."enableDockerCleanup", false) as "enableDockerCleanup",
+	COALESCE(u."logCleanupCron", '0 0 * * *') as "logCleanupCron",
+	COALESCE(u."metricsConfig", '{"server":{"type":"Dokploy","refreshRate":60,"port":4500,"token":"","retentionDays":2,"cronJob":"","urlCallback":"","thresholds":{"cpu":0,"memory":0}},"containers":{"refreshRate":60,"services":{"include":[],"exclude":[]}}}') as "metricsConfig"
+FROM "users" u
+INNER JOIN "organization" o ON u.id = o.owner_id
+LIMIT 1;
+
+
+ALTER TABLE "users" DROP COLUMN "createdAt";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "serverIp";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "certificateType";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "https";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "host";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "letsEncryptEmail";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "sshPrivateKey";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "enableDockerCleanup";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "logCleanupCron";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "metricsConfig";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "cleanupCacheApplications";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "cleanupCacheOnPreviews";--> statement-breakpoint
+ALTER TABLE "users" DROP COLUMN "cleanupCacheOnCompose";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canCreateProjects";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canAccessToSSHKeys";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canCreateServices";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canDeleteProjects";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canDeleteServices";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canAccessToDocker";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canAccessToAPI";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canAccessToGitProviders";--> statement-breakpoint
+ALTER TABLE "member" DROP COLUMN "canAccessToTraefikFiles";--> statement-breakpoint
+ALTER TABLE "users" ADD CONSTRAINT "users_email_unique" UNIQUE("email");

apps/dokploy/drizzle/0103_cultured_pestilence.sql

@@ -1 +0,0 @@
-ALTER TABLE "application" ADD COLUMN "previewRequireCollaboratorPermissions" boolean DEFAULT true;

apps/dokploy/drizzle/0104_omniscient_randall.sql

@@ -1 +0,0 @@
-ALTER TABLE "application" ADD COLUMN "railpackVersion" text DEFAULT '0.2.2';

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

@@ -1,5 +1,5 @@
 {
-  "id": "8bf085dd-e054-4ae6-811b-1d1a68dab752",
+  "id": "6b7b9d76-9e2d-4251-9a3e-8a337076714e",
   "prevId": "218e3c9b-ef86-4665-98af-56d65282b73b",
   "version": "7",
   "dialect": "postgresql",
@@ -111,13 +111,6 @@
           "notNull": false,
           "default": false
         },
-        "previewRequireCollaboratorPermissions": {
-          "name": "previewRequireCollaboratorPermissions",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": false,
-          "default": true
-        },
         "rollbackActive": {
           "name": "rollbackActive",
           "type": "boolean",
@@ -829,8 +822,8 @@
       "checkConstraints": {},
       "isRLSEnabled": false
     },
-    "public.user_temp": {
-      "name": "user_temp",
+    "public.users": {
+      "name": "users",
       "schema": "",
       "columns": {
         "id": {
@@ -859,17 +852,11 @@
           "primaryKey": false,
           "notNull": true
         },
-        "createdAt": {
-          "name": "createdAt",
-          "type": "text",
-          "primaryKey": false,
-          "notNull": true
-        },
         "created_at": {
           "name": "created_at",
           "type": "timestamp",
           "primaryKey": false,
-          "notNull": false,
+          "notNull": true,
           "default": "now()"
         },
         "two_factor_enabled": {
@@ -918,60 +905,8 @@
           "name": "updated_at",
           "type": "timestamp",
           "primaryKey": false,
-          "notNull": true
-        },
-        "serverIp": {
-          "name": "serverIp",
-          "type": "text",
-          "primaryKey": false,
-          "notNull": false
-        },
-        "certificateType": {
-          "name": "certificateType",
-          "type": "certificateType",
-          "typeSchema": "public",
-          "primaryKey": false,
           "notNull": true,
-          "default": "'none'"
-        },
-        "https": {
-          "name": "https",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "host": {
-          "name": "host",
-          "type": "text",
-          "primaryKey": false,
-          "notNull": false
-        },
-        "letsEncryptEmail": {
-          "name": "letsEncryptEmail",
-          "type": "text",
-          "primaryKey": false,
-          "notNull": false
-        },
-        "sshPrivateKey": {
-          "name": "sshPrivateKey",
-          "type": "text",
-          "primaryKey": false,
-          "notNull": false
-        },
-        "enableDockerCleanup": {
-          "name": "enableDockerCleanup",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "logCleanupCron": {
-          "name": "logCleanupCron",
-          "type": "text",
-          "primaryKey": false,
-          "notNull": false,
-          "default": "'0 0 * * *'"
+          "default": "now()"
         },
         "role": {
           "name": "role",
@@ -994,34 +929,6 @@
           "notNull": true,
           "default": false
         },
-        "metricsConfig": {
-          "name": "metricsConfig",
-          "type": "jsonb",
-          "primaryKey": false,
-          "notNull": true,
-          "default": "'{\"server\":{\"type\":\"Dokploy\",\"refreshRate\":60,\"port\":4500,\"token\":\"\",\"retentionDays\":2,\"cronJob\":\"\",\"urlCallback\":\"\",\"thresholds\":{\"cpu\":0,\"memory\":0}},\"containers\":{\"refreshRate\":60,\"services\":{\"include\":[],\"exclude\":[]}}}'::jsonb"
-        },
-        "cleanupCacheApplications": {
-          "name": "cleanupCacheApplications",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "cleanupCacheOnPreviews": {
-          "name": "cleanupCacheOnPreviews",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "cleanupCacheOnCompose": {
-          "name": "cleanupCacheOnCompose",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
         "stripeCustomerId": {
           "name": "stripeCustomerId",
           "type": "text",
@@ -1046,8 +953,8 @@
       "foreignKeys": {},
       "compositePrimaryKeys": {},
       "uniqueConstraints": {
-        "user_temp_email_unique": {
-          "name": "user_temp_email_unique",
+        "users_email_unique": {
+          "name": "users_email_unique",
           "nullsNotDistinct": false,
           "columns": [
             "email"
@@ -1981,10 +1888,10 @@
           "onDelete": "cascade",
           "onUpdate": "no action"
         },
-        "backup_userId_user_temp_id_fk": {
-          "name": "backup_userId_user_temp_id_fk",
+        "backup_userId_users_id_fk": {
+          "name": "backup_userId_users_id_fk",
           "tableFrom": "backup",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "userId"
           ],
@@ -2693,10 +2600,10 @@
       },
       "indexes": {},
       "foreignKeys": {
-        "session_temp_user_id_user_temp_id_fk": {
-          "name": "session_temp_user_id_user_temp_id_fk",
+        "session_temp_user_id_users_id_fk": {
+          "name": "session_temp_user_id_users_id_fk",
           "tableFrom": "session_temp",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "user_id"
           ],
@@ -4071,10 +3978,10 @@
           "onDelete": "cascade",
           "onUpdate": "no action"
         },
-        "git_provider_userId_user_temp_id_fk": {
-          "name": "git_provider_userId_user_temp_id_fk",
+        "git_provider_userId_users_id_fk": {
+          "name": "git_provider_userId_users_id_fk",
           "tableFrom": "git_provider",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "userId"
           ],
@@ -4746,6 +4653,107 @@
       "checkConstraints": {},
       "isRLSEnabled": false
     },
+    "public.member_role": {
+      "name": "member_role",
+      "schema": "",
+      "columns": {
+        "roleId": {
+          "name": "roleId",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "description": {
+          "name": "description",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "canDelete": {
+          "name": "canDelete",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": true
+        },
+        "is_system": {
+          "name": "is_system",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": false,
+          "default": false
+        },
+        "permissions": {
+          "name": "permissions",
+          "type": "text[]",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "organizationId": {
+          "name": "organizationId",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {
+        "member_role_organizationId_organization_id_fk": {
+          "name": "member_role_organizationId_organization_id_fk",
+          "tableFrom": "member_role",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organizationId"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {
+        "member_role_name_unique": {
+          "name": "member_role_name_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "name"
+          ]
+        },
+        "role_name_unique": {
+          "name": "role_name_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "name",
+            "organizationId"
+          ]
+        }
+      },
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
     "public.account": {
       "name": "account",
       "schema": "",
@@ -4862,10 +4870,10 @@
       },
       "indexes": {},
       "foreignKeys": {
-        "account_user_id_user_temp_id_fk": {
-          "name": "account_user_id_user_temp_id_fk",
+        "account_user_id_users_id_fk": {
+          "name": "account_user_id_users_id_fk",
           "tableFrom": "account",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "user_id"
           ],
@@ -5015,10 +5023,10 @@
       },
       "indexes": {},
       "foreignKeys": {
-        "apikey_user_id_user_temp_id_fk": {
-          "name": "apikey_user_id_user_temp_id_fk",
+        "apikey_user_id_users_id_fk": {
+          "name": "apikey_user_id_users_id_fk",
           "tableFrom": "apikey",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "user_id"
           ],
@@ -5103,10 +5111,10 @@
           "onDelete": "cascade",
           "onUpdate": "no action"
         },
-        "invitation_inviter_id_user_temp_id_fk": {
-          "name": "invitation_inviter_id_user_temp_id_fk",
+        "invitation_inviter_id_users_id_fk": {
+          "name": "invitation_inviter_id_users_id_fk",
           "tableFrom": "invitation",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "inviter_id"
           ],
@@ -5149,7 +5157,13 @@
           "name": "role",
           "type": "text",
           "primaryKey": false,
-          "notNull": true
+          "notNull": false
+        },
+        "roleId": {
+          "name": "roleId",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
         },
         "created_at": {
           "name": "created_at",
@@ -5163,69 +5177,6 @@
           "primaryKey": false,
           "notNull": false
         },
-        "canCreateProjects": {
-          "name": "canCreateProjects",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "canAccessToSSHKeys": {
-          "name": "canAccessToSSHKeys",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "canCreateServices": {
-          "name": "canCreateServices",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "canDeleteProjects": {
-          "name": "canDeleteProjects",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "canDeleteServices": {
-          "name": "canDeleteServices",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "canAccessToDocker": {
-          "name": "canAccessToDocker",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "canAccessToAPI": {
-          "name": "canAccessToAPI",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "canAccessToGitProviders": {
-          "name": "canAccessToGitProviders",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
-        "canAccessToTraefikFiles": {
-          "name": "canAccessToTraefikFiles",
-          "type": "boolean",
-          "primaryKey": false,
-          "notNull": true,
-          "default": false
-        },
         "accesedProjects": {
           "name": "accesedProjects",
           "type": "text[]",
@@ -5256,10 +5207,10 @@
           "onDelete": "cascade",
           "onUpdate": "no action"
         },
-        "member_user_id_user_temp_id_fk": {
-          "name": "member_user_id_user_temp_id_fk",
+        "member_user_id_users_id_fk": {
+          "name": "member_user_id_users_id_fk",
           "tableFrom": "member",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "user_id"
           ],
@@ -5268,6 +5219,19 @@
           ],
           "onDelete": "cascade",
           "onUpdate": "no action"
+        },
+        "member_roleId_member_role_roleId_fk": {
+          "name": "member_roleId_member_role_roleId_fk",
+          "tableFrom": "member",
+          "tableTo": "member_role",
+          "columnsFrom": [
+            "roleId"
+          ],
+          "columnsTo": [
+            "roleId"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
         }
       },
       "compositePrimaryKeys": {},
@@ -5325,10 +5289,10 @@
       },
       "indexes": {},
       "foreignKeys": {
-        "organization_owner_id_user_temp_id_fk": {
-          "name": "organization_owner_id_user_temp_id_fk",
+        "organization_owner_id_users_id_fk": {
+          "name": "organization_owner_id_users_id_fk",
           "tableFrom": "organization",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "owner_id"
           ],
@@ -5384,10 +5348,10 @@
       },
       "indexes": {},
       "foreignKeys": {
-        "two_factor_user_id_user_temp_id_fk": {
-          "name": "two_factor_user_id_user_temp_id_fk",
+        "two_factor_user_id_users_id_fk": {
+          "name": "two_factor_user_id_users_id_fk",
           "tableFrom": "two_factor",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "user_id"
           ],
@@ -5594,10 +5558,10 @@
           "onDelete": "cascade",
           "onUpdate": "no action"
         },
-        "schedule_userId_user_temp_id_fk": {
-          "name": "schedule_userId_user_temp_id_fk",
+        "schedule_userId_users_id_fk": {
+          "name": "schedule_userId_users_id_fk",
           "tableFrom": "schedule",
-          "tableTo": "user_temp",
+          "tableTo": "users",
           "columnsFrom": [
             "userId"
           ],
@@ -5917,6 +5881,85 @@
       "policies": {},
       "checkConstraints": {},
       "isRLSEnabled": false
+    },
+    "public.web_server": {
+      "name": "web_server",
+      "schema": "",
+      "columns": {
+        "webServerId": {
+          "name": "webServerId",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "serverIp": {
+          "name": "serverIp",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "certificateType": {
+          "name": "certificateType",
+          "type": "certificateType",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'none'"
+        },
+        "https": {
+          "name": "https",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "host": {
+          "name": "host",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "letsEncryptEmail": {
+          "name": "letsEncryptEmail",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "sshPrivateKey": {
+          "name": "sshPrivateKey",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "enableDockerCleanup": {
+          "name": "enableDockerCleanup",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "logCleanupCron": {
+          "name": "logCleanupCron",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "default": "'0 0 * * *'"
+        },
+        "metricsConfig": {
+          "name": "metricsConfig",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'{\"server\":{\"type\":\"Dokploy\",\"refreshRate\":60,\"port\":4500,\"token\":\"\",\"retentionDays\":2,\"cronJob\":\"\",\"urlCallback\":\"\",\"thresholds\":{\"cpu\":0,\"memory\":0}},\"containers\":{\"refreshRate\":60,\"services\":{\"include\":[],\"exclude\":[]}}}'::jsonb"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
     }
   },
   "enums": {

apps/dokploy/drizzle/meta/_journal.json

@@ -726,15 +726,8 @@
     {
       "idx": 103,
       "version": "7",
-      "when": 1752465764072,
-      "tag": "0103_cultured_pestilence",
-      "breakpoints": true
-    },
-    {
-      "idx": 104,
-      "version": "7",
-      "when": 1754207407121,
-      "tag": "0104_omniscient_randall",
+      "when": 1752428260850,
+      "tag": "0103_brainy_nehzno",
       "breakpoints": true
     }
   ]

apps/dokploy/lib/utils.ts

@@ -27,14 +27,3 @@ export function formatTimestamp(timestamp: string | number) {
 		return "Fecha inválida";
 	}
 }
-
-export function getFallbackAvatarInitials(
-	fullName: string | undefined,
-): string {
-	if (typeof fullName === "undefined" || fullName === "") return "CN";
-	const [name = "", surname = ""] = fullName.split(" ");
-	if (surname === "") {
-		return name.substring(0, 2).toUpperCase();
-	}
-	return (name.charAt(0) + surname.charAt(0)).toUpperCase();
-}