Merge branch 'canary' into vicke4/canary

.github/workflows/dokploy.yml

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

README.md

@@ -74,6 +74,8 @@ For detailed documentation, visit [docs.dokploy.com](https://docs.dokploy.com).
     <a href="https://lightnode.com/?ref=dokploy" target="_blank" style="display: inline-block;">
     <img src=".github/sponsors/light-node.webp" alt="Lightnode" height="70"/>
   </a>
+
+  
 </div>
 
 ### Premium Supporters 🥇
@@ -94,8 +96,10 @@ For detailed documentation, visit [docs.dokploy.com](https://docs.dokploy.com).
 <a href="https://startupfa.me/?ref=dokploy "><img src=".github/sponsors/startupfame.png" width="65px" alt="Startupfame"/></a>
 <a href="https://itsdb-center.com?ref=dokploy "><img src=".github/sponsors/its.png" width="65px" alt="Itsdb-center"/></a>
 <a href="https://openalternative.co/?ref=dokploy "><img src=".github/sponsors/openalternative.png" width="65px" alt="Openalternative"/></a>
+<a href="https://synexa.ai/?ref=dokploy"><img src=".github/sponsors/synexa.png" width="65px" alt="Synexa"/></a>
 </div>
 
+
 ### Community Backers 🤝
 
 <div style="display: flex; gap: 30px; flex-wrap: wrap;">

apps/api/src/index.ts

@@ -28,7 +28,7 @@ app.use(async (c, next) => {
 
 app.post("/deploy", zValidator("json", deployJobSchema), (c) => {
 	const data = c.req.valid("json");
-	const res = queue.add(data, { groupName: data.serverId });
+	queue.add(data, { groupName: data.serverId });
 	return c.json(
 		{
 			message: "Deployment Added",

apps/api/src/utils.ts

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

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

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

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

@@ -293,29 +293,6 @@ networks:
   dokploy-network:
 `;
 
-const expectedComposeFile7 = `
-version: "3.8"
-
-services:
-  web:
-    image: nginx:latest
-    networks:
-      - dokploy-network
-
-networks:
-  dokploy-network:
-    driver: bridge
-    driver_opts:
-      com.docker.network.driver.mtu: 1200
-
-  backend:
-    driver: bridge
-    attachable: true
-
-  external_network:
-    external: true
-    name: dokploy-network
-`;
 test("It shoudn't add suffix to dokploy-network", () => {
 	const composeData = load(composeFile7) as ComposeSpecification;
 

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

@@ -1,7 +1,7 @@
 import { generateRandomHash } from "@dokploy/server";
 import { addSuffixToSecretsRoot } from "@dokploy/server";
 import type { ComposeSpecification } from "@dokploy/server";
-import { dump, load } from "js-yaml";
+import { load } from "js-yaml";
 import { expect, test } from "vitest";
 
 test("Generate random hash with 8 characters", () => {

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

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

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

@@ -45,7 +45,7 @@ const baseApp: ApplicationNested = {
 	previewWildcard: "",
 	project: {
 		env: "",
-		adminId: "",
+		organizationId: "",
 		name: "",
 		description: "",
 		createdAt: "",

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

@@ -5,7 +5,7 @@ vi.mock("node:fs", () => ({
 	default: fs,
 }));
 
-import type { Admin, FileConfig } from "@dokploy/server";
+import type { FileConfig, User } from "@dokploy/server";
 import {
 	createDefaultServerTraefikConfig,
 	loadOrCreateConfig,
@@ -13,7 +13,7 @@ import {
 } from "@dokploy/server";
 import { beforeEach, expect, test, vi } from "vitest";
 
-const baseAdmin: Admin = {
+const baseAdmin: User = {
 	enablePaidFeatures: false,
 	metricsConfig: {
 		containers: {
@@ -40,9 +40,7 @@ const baseAdmin: Admin = {
 	cleanupCacheApplications: false,
 	cleanupCacheOnCompose: false,
 	cleanupCacheOnPreviews: false,
-	createdAt: "",
+	createdAt: new Date(),
-	authId: "",
-	adminId: "string",
 	serverIp: null,
 	certificateType: "none",
 	host: null,
@@ -53,6 +51,19 @@ const baseAdmin: Admin = {
 	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,
 };
 
 beforeEach(() => {
@@ -103,8 +114,6 @@ test("Should not touch config without host", () => {
 });
 
 test("Should remove websecure if https rollback to http", () => {
-	const originalConfig: FileConfig = loadOrCreateConfig("dokploy");
-
 	updateServerTraefik(
 		{ ...baseAdmin, certificateType: "letsencrypt" },
 		"example.com",

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

@@ -26,7 +26,7 @@ const baseApp: ApplicationNested = {
 	previewWildcard: "",
 	project: {
 		env: "",
-		adminId: "",
+		organizationId: "",
 		name: "",
 		description: "",
 		createdAt: "",

apps/dokploy/components/auth/login-2fa.tsx

@@ -1,132 +0,0 @@
-import { Button } from "@/components/ui/button";
-import {
-	Form,
-	FormControl,
-	FormDescription,
-	FormField,
-	FormItem,
-	FormLabel,
-	FormMessage,
-} from "@/components/ui/form";
-
-import { CardTitle } from "@/components/ui/card";
-import {
-	InputOTP,
-	InputOTPGroup,
-	InputOTPSeparator,
-	InputOTPSlot,
-} from "@/components/ui/input-otp";
-import { api } from "@/utils/api";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { REGEXP_ONLY_DIGITS } from "input-otp";
-import { AlertTriangle } from "lucide-react";
-import { useRouter } from "next/router";
-import { useEffect } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
-
-const Login2FASchema = z.object({
-	pin: z.string().min(6, {
-		message: "Pin is required",
-	}),
-});
-
-type Login2FA = z.infer<typeof Login2FASchema>;
-
-interface Props {
-	authId: string;
-}
-
-export const Login2FA = ({ authId }: Props) => {
-	const { push } = useRouter();
-
-	const { mutateAsync, isLoading, isError, error } =
-		api.auth.verifyLogin2FA.useMutation();
-
-	const form = useForm<Login2FA>({
-		defaultValues: {
-			pin: "",
-		},
-		resolver: zodResolver(Login2FASchema),
-	});
-
-	useEffect(() => {
-		form.reset({
-			pin: "",
-		});
-	}, [form, form.reset, form.formState.isSubmitSuccessful]);
-
-	const onSubmit = async (data: Login2FA) => {
-		await mutateAsync({
-			pin: data.pin,
-			id: authId,
-		})
-			.then(() => {
-				toast.success("Signin successfully", {
-					duration: 2000,
-				});
-
-				push("/dashboard/projects");
-			})
-			.catch(() => {
-				toast.error("Signin failed", {
-					duration: 2000,
-				});
-			});
-	};
-	return (
-		<Form {...form}>
-			<form
-				onSubmit={form.handleSubmit(onSubmit)}
-				className="grid w-full gap-4"
-			>
-				{isError && (
-					<div className="flex flex-row gap-4 rounded-lg items-center bg-red-50 p-2 dark:bg-red-950">
-						<AlertTriangle className="text-red-600 dark:text-red-400" />
-						<span className="text-sm text-red-600 dark:text-red-400">
-							{error?.message}
-						</span>
-					</div>
-				)}
-				<CardTitle className="text-xl font-bold">2FA Login</CardTitle>
-
-				<FormField
-					control={form.control}
-					name="pin"
-					render={({ field }) => (
-						<FormItem className="flex flex-col  max-sm:items-center">
-							<FormLabel>Pin</FormLabel>
-							<FormControl>
-								<div className="flex">
-									<InputOTP
-										maxLength={6}
-										{...field}
-										pattern={REGEXP_ONLY_DIGITS}
-									>
-										<InputOTPGroup>
-											<InputOTPSlot index={0} className="border-border" />
-											<InputOTPSlot index={1} className="border-border" />
-											<InputOTPSlot index={2} className="border-border" />
-											<InputOTPSlot index={3} className="border-border" />
-											<InputOTPSlot index={4} className="border-border" />
-											<InputOTPSlot index={5} className="border-border" />
-										</InputOTPGroup>
-									</InputOTP>
-								</div>
-							</FormControl>
-							<FormDescription>
-								Please enter the 6 digits code provided by your authenticator
-								app.
-							</FormDescription>
-							<FormMessage />
-						</FormItem>
-					)}
-				/>
-				<Button isLoading={isLoading} type="submit">
-					Submit 2FA
-				</Button>
-			</form>
-		</Form>
-	);
-};

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

@@ -130,7 +130,7 @@ const createStringToJSONSchema = (schema: z.ZodTypeAny) => {
 			}
 			try {
 				return JSON.parse(str);
-			} catch (e) {
+			} catch (_e) {
 				ctx.addIssue({ code: "custom", message: "Invalid JSON format" });
 				return z.NEVER;
 			}

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

@@ -29,7 +29,6 @@ import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { Server } from "lucide-react";
 import Link from "next/link";
-import React from "react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

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

@@ -17,7 +17,6 @@ import {
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import React from "react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

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

@@ -10,7 +10,6 @@ import {
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { Rss, Trash2 } from "lucide-react";
-import React from "react";
 import { toast } from "sonner";
 import { HandlePorts } from "./handle-ports";
 interface Props {

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

@@ -9,7 +9,6 @@ import {
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { Split, Trash2 } from "lucide-react";
-import React from "react";
 import { toast } from "sonner";
 import { HandleRedirect } from "./handle-redirect";
 

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

@@ -9,7 +9,6 @@ import {
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { LockKeyhole, Trash2 } from "lucide-react";
-import React from "react";
 import { toast } from "sonner";
 import { HandleSecurity } from "./handle-security";
 

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

@@ -25,7 +25,7 @@ import {
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { InfoIcon } from "lucide-react";
-import React, { useEffect } from "react";
+import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";

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

@@ -8,7 +8,6 @@ import {
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { File, Loader2 } from "lucide-react";
-import React from "react";
 import { UpdateTraefikConfig } from "./update-traefik-config";
 interface Props {
 	applicationId: string;

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

@@ -10,7 +10,6 @@ import {
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { Package, Trash2 } from "lucide-react";
-import React from "react";
 import { toast } from "sonner";
 import type { ServiceType } from "../show-resources";
 import { AddVolumes } from "./add-volumes";

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

@@ -21,7 +21,7 @@ import {
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { PenBoxIcon, Pencil } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -77,7 +77,7 @@ export const UpdateVolume = ({
 	serviceType,
 }: Props) => {
 	const [isOpen, setIsOpen] = useState(false);
-	const utils = api.useUtils();
+	const _utils = api.useUtils();
 	const { data } = api.mounts.one.useQuery(
 		{
 			mountId,

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

@@ -11,7 +11,6 @@ import {
 } from "@/components/ui/alert-dialog";
 import { api } from "@/utils/api";
 import { RefreshCcw } from "lucide-react";
-import React from "react";
 import { toast } from "sonner";
 
 interface Props {

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

@@ -18,7 +18,7 @@ import { Toggle } from "@/components/ui/toggle";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { EyeIcon, EyeOffIcon } from "lucide-react";
-import React, { type CSSProperties, useEffect, useState } from "react";
+import { type CSSProperties, useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";

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

@@ -1,5 +1,5 @@
 import { Button } from "@/components/ui/button";
-import { Card, CardContent } from "@/components/ui/card";
+import { Card } from "@/components/ui/card";
 import { Form } from "@/components/ui/form";
 import { Secrets } from "@/components/ui/secrets";
 import { api } from "@/utils/api";

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

@@ -84,7 +84,6 @@ export const SaveBitbucketProvider = ({ applicationId }: Props) => {
 		data: repositories,
 		isLoading: isLoadingRepositories,
 		error,
-		isError,
 	} = api.bitbucket.getBitbucketRepositories.useQuery(
 		{
 			bitbucketId,

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

@@ -11,7 +11,7 @@ import {
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { api } from "@/utils/api";
-import { GitBranch, LockIcon, UploadCloud } from "lucide-react";
+import { GitBranch, UploadCloud } from "lucide-react";
 import Link from "next/link";
 import { useState } from "react";
 import { SaveBitbucketProvider } from "./save-bitbucket-provider";

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

@@ -7,7 +7,6 @@ import { Switch } from "@/components/ui/switch";
 import { api } from "@/utils/api";
 import { Ban, CheckCircle2, Hammer, RefreshCcw, Terminal } from "lucide-react";
 import { useRouter } from "next/router";
-import React from "react";
 import { toast } from "sonner";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";
 interface Props {
@@ -28,8 +27,7 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 	const { mutateAsync: stop, isLoading: isStopping } =
 		api.application.stop.useMutation();
 
-	const { mutateAsync: deploy, isLoading: isDeploying } =
+	const { mutateAsync: deploy } = api.application.deploy.useMutation();
-		api.application.deploy.useMutation();
 
 	const { mutateAsync: reload, isLoading: isReloading } =
 		api.application.reload.useMutation();

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

@@ -5,7 +5,6 @@ import {
 	Dialog,
 	DialogContent,
 	DialogDescription,
-	DialogFooter,
 	DialogHeader,
 	DialogTitle,
 	DialogTrigger,

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

@@ -22,7 +22,6 @@ import {
 	RocketIcon,
 	Trash2,
 } from "lucide-react";
-import React from "react";
 import { toast } from "sonner";
 import { ShowModalLogs } from "../../settings/web-server/show-modal-logs";
 import { AddPreviewDomain } from "./add-preview-domain";

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

@@ -279,7 +279,7 @@ export const ShowPreviewSettings = ({ applicationId }: Props) => {
 								<FormField
 									control={form.control}
 									name="env"
-									render={({ field }) => (
+									render={() => (
 										<FormItem>
 											<FormControl>
 												<Secrets

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

@@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { AlertTriangle, PenBoxIcon, SquarePen } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

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

@@ -19,7 +19,6 @@ import {
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import React from "react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

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

@@ -60,7 +60,7 @@ export const DeleteService = ({ id, type }: Props) => {
 		compose: () =>
 			api.compose.one.useQuery({ composeId: id }, { enabled: !!id }),
 	};
-	const { data, refetch } = queryMap[type]
+	const { data } = queryMap[type]
 		? queryMap[type]()
 		: api.mongo.one.useQuery({ mongoId: id }, { enabled: !!id });
 

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

@@ -11,7 +11,6 @@ import {
 } from "@/components/ui/alert-dialog";
 import { api } from "@/utils/api";
 import { RefreshCcw } from "lucide-react";
-import React from "react";
 import { toast } from "sonner";
 
 interface Props {

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

@@ -118,7 +118,7 @@ export const ShowDomainsCompose = ({ composeId }: Props) => {
 														await deleteDomain({
 															domainId: item.domainId,
 														})
-															.then((data) => {
+															.then((_data) => {
 																refetch();
 																toast.success("Domain deleted successfully");
 															})

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

@@ -35,8 +35,7 @@ export const ComposeFileEditor = ({ composeId }: Props) => {
 		{ enabled: !!composeId },
 	);
 
-	const { mutateAsync, isLoading, error, isError } =
+	const { mutateAsync, isLoading } = api.compose.update.useMutation();
-		api.compose.update.useMutation();
 
 	const form = useForm<AddComposeFile>({
 		defaultValues: {
@@ -76,7 +75,7 @@ export const ComposeFileEditor = ({ composeId }: Props) => {
 					composeId,
 				});
 			})
-			.catch((e) => {
+			.catch((_e) => {
 				toast.error("Error updating the Compose config");
 			});
 	};

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

@@ -84,7 +84,6 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 		data: repositories,
 		isLoading: isLoadingRepositories,
 		error,
-		isError,
 	} = api.bitbucket.getBitbucketRepositories.useQuery(
 		{
 			bitbucketId,

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

@@ -7,7 +7,7 @@ import {
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { api } from "@/utils/api";
-import { CodeIcon, GitBranch, LockIcon } from "lucide-react";
+import { CodeIcon, GitBranch } from "lucide-react";
 import Link from "next/link";
 import { useState } from "react";
 import { ComposeFileEditor } from "../compose-file-editor";

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

@@ -70,7 +70,7 @@ export const IsolatedDeployment = ({ composeId }: Props) => {
 			composeId,
 			isolatedDeployment: formData?.isolatedDeployment || false,
 		})
-			.then(async (data) => {
+			.then(async (_data) => {
 				randomizeCompose();
 				refetch();
 				toast.success("Compose updated");

apps/dokploy/components/dashboard/compose/general/randomize-compose.tsx

@@ -19,7 +19,7 @@ import { Input } from "@/components/ui/input";
 import { Switch } from "@/components/ui/switch";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { AlertTriangle, Dices } from "lucide-react";
+import { AlertTriangle } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -39,7 +39,7 @@ type Schema = z.infer<typeof schema>;
 export const RandomizeCompose = ({ composeId }: Props) => {
 	const utils = api.useUtils();
 	const [compose, setCompose] = useState<string>("");
-	const [isOpen, setIsOpen] = useState(false);
+	const [_isOpen, _setIsOpen] = useState(false);
 	const { mutateAsync, error, isError } =
 		api.compose.randomizeCompose.useMutation();
 
@@ -76,7 +76,7 @@ export const RandomizeCompose = ({ composeId }: Props) => {
 			suffix: formData?.suffix || "",
 			randomize: formData?.randomize || false,
 		})
-			.then(async (data) => {
+			.then(async (_data) => {
 				randomizeCompose();
 				refetch();
 				toast.success("Compose updated");

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

@@ -40,7 +40,7 @@ export const ShowConvertedCompose = ({ composeId }: Props) => {
 				.then(() => {
 					refetch();
 				})
-				.catch((err) => {});
+				.catch((_err) => {});
 		}
 	}, [isOpen]);
 

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

@@ -7,7 +7,6 @@ import {
 	CardTitle,
 } from "@/components/ui/card";
 import { api } from "@/utils/api";
-import React from "react";
 import { ComposeActions } from "./actions";
 import { ShowProviderFormCompose } from "./generic/show";
 interface Props {

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

@@ -18,7 +18,7 @@ import {
 	SelectValue,
 } from "@/components/ui/select";
 import { api } from "@/utils/api";
-import { Loader, Loader2 } from "lucide-react";
+import { Loader2 } from "lucide-react";
 import dynamic from "next/dynamic";
 import { useEffect, useState } from "react";
 export const DockerLogs = dynamic(

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

@@ -16,7 +16,6 @@ import {
 import { api } from "@/utils/api";
 import { DatabaseBackup, Play, Trash2 } from "lucide-react";
 import Link from "next/link";
-import React from "react";
 import { toast } from "sonner";
 import type { ServiceType } from "../../application/advanced/show-resources";
 import { AddBackup } from "./add-backup";

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

@@ -35,7 +35,7 @@ import { Switch } from "@/components/ui/switch";
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { CheckIcon, ChevronsUpDown, PenBoxIcon, Pencil } from "lucide-react";
+import { CheckIcon, ChevronsUpDown, PenBoxIcon } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

apps/dokploy/components/dashboard/docker/logs/since-logs-filter.tsx

@@ -15,7 +15,6 @@ import { Separator } from "@/components/ui/separator";
 import { Switch } from "@/components/ui/switch";
 import { cn } from "@/lib/utils";
 import { CheckIcon } from "lucide-react";
-import React from "react";
 
 export type TimeFilter = "all" | "1h" | "6h" | "24h" | "168h" | "720h";
 

apps/dokploy/components/dashboard/docker/logs/terminal-line.tsx

@@ -9,7 +9,6 @@ import {
 import { cn } from "@/lib/utils";
 import { FancyAnsi } from "fancy-ansi";
 import { escapeRegExp } from "lodash";
-import React from "react";
 import { type LogLine, getLogType } from "./utils";
 
 interface LogLineProps {
@@ -48,23 +47,12 @@ export function TerminalLine({ log, noTimestamp, searchTerm }: LogLineProps) {
 		}
 
 		const htmlContent = fancyAnsi.toHtml(text);
+		const searchRegex = new RegExp(`(${escapeRegExp(term)})`, "gi");
+
 		const modifiedContent = htmlContent.replace(
-			/<span([^>]*)>([^<]*)<\/span>/g,
+			searchRegex,
-			(match, attrs, content) => {
+			(match) =>
-				const searchRegex = new RegExp(`(${escapeRegExp(term)})`, "gi");
+				`<span class="bg-orange-200/80 dark:bg-orange-900/80 font-bold">${match}</span>`,
-				if (!content.match(searchRegex)) return match;
-
-				const segments = content.split(searchRegex);
-				const wrappedSegments = segments
-					.map((segment: string) =>
-						segment.toLowerCase() === term.toLowerCase()
-							? `<span${attrs} class="bg-yellow-200/50 dark:bg-yellow-900/50">${segment}</span>`
-							: segment,
-					)
-					.join("");
-
-				return `<span${attrs}>${wrappedSegments}</span>`;
-			},
 		);
 
 		return (

apps/dokploy/components/dashboard/docker/show/colums.tsx

@@ -1,6 +1,5 @@
 import type { ColumnDef } from "@tanstack/react-table";
 import { ArrowUpDown, MoreHorizontal } from "lucide-react";
-import * as React from "react";
 
 import { Button } from "@/components/ui/button";
 import {

apps/dokploy/components/dashboard/docker/show/show-containers.tsx

@@ -1,18 +1,3 @@
-import {
-	type ColumnFiltersState,
-	type SortingState,
-	type VisibilityState,
-	flexRender,
-	getCoreRowModel,
-	getFilteredRowModel,
-	getPaginationRowModel,
-	getSortedRowModel,
-	useReactTable,
-} from "@tanstack/react-table";
-import { ChevronDown, Container } from "lucide-react";
-import * as React from "react";
-
-import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import {
 	Card,
@@ -37,6 +22,19 @@ import {
 	TableRow,
 } from "@/components/ui/table";
 import { type RouterOutputs, api } from "@/utils/api";
+import {
+	type ColumnFiltersState,
+	type SortingState,
+	type VisibilityState,
+	flexRender,
+	getCoreRowModel,
+	getFilteredRowModel,
+	getPaginationRowModel,
+	getSortedRowModel,
+	useReactTable,
+} from "@tanstack/react-table";
+import { ChevronDown, Container } from "lucide-react";
+import * as React from "react";
 import { columns } from "./colums";
 export type Container = NonNullable<
 	RouterOutputs["docker"]["getContainers"]

apps/dokploy/components/dashboard/file-system/show-traefik-system.tsx

@@ -7,9 +7,8 @@ import {
 	CardTitle,
 } from "@/components/ui/card";
 import { Tree } from "@/components/ui/file-tree";
-import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
-import { FileIcon, Folder, Link, Loader2, Workflow } from "lucide-react";
+import { FileIcon, Folder, Loader2, Workflow } from "lucide-react";
 import React from "react";
 import { ShowTraefikFile } from "./show-traefik-file";
 

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

@@ -19,7 +19,7 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";

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

@@ -4,7 +4,7 @@ import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { Ban, CheckCircle2, RefreshCcw, Terminal } from "lucide-react";
-import React, { useState } from "react";
+import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";

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

@@ -3,7 +3,6 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
-import React from "react";
 
 interface Props {
 	mariadbId: string;

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

@@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { AlertTriangle, PenBoxIcon, SquarePen } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

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

@@ -19,7 +19,7 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";

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

@@ -4,7 +4,7 @@ import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { Ban, CheckCircle2, RefreshCcw, Terminal } from "lucide-react";
-import React, { useState } from "react";
+import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";

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

@@ -3,7 +3,6 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
-import React from "react";
 
 interface Props {
 	mongoId: string;

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

@@ -1,6 +1,7 @@
+import { badgeStateColor } from "@/components/dashboard/application/logs/show";
+import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import {
-	Card,
 	CardContent,
 	CardDescription,
 	CardHeader,
@@ -96,7 +97,10 @@ export const ComposeFreeMonitoring = ({
 										key={container.containerId}
 										value={container.name}
 									>
-										{container.name} ({container.containerId}) {container.state}
+										{container.name} ({container.containerId}){" "}
+										<Badge variant={badgeStateColor(container.state)}>
+											{container.state}
+										</Badge>
 									</SelectItem>
 								))}
 								<SelectLabel>Containers ({data?.length})</SelectLabel>

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

@@ -1,13 +1,7 @@
-import {
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
-	Card,
-	CardContent,
-	CardDescription,
-	CardHeader,
-	CardTitle,
-} from "@/components/ui/card";
 import { Progress } from "@/components/ui/progress";
 import { api } from "@/utils/api";
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { DockerBlockChart } from "./docker-block-chart";
 import { DockerCpuChart } from "./docker-cpu-chart";
 import { DockerDiskChart } from "./docker-disk-chart";

apps/dokploy/components/dashboard/monitoring/paid/container/container-block-chart.tsx

@@ -29,14 +29,6 @@ interface Props {
 	data: ContainerMetric[];
 }
 
-interface FormattedMetric {
-	timestamp: string;
-	read: number;
-	write: number;
-	readUnit: string;
-	writeUnit: string;
-}
-
 const chartConfig = {
 	read: {
 		label: "Read",

apps/dokploy/components/dashboard/monitoring/paid/container/show-paid-compose-monitoring.tsx

@@ -1,3 +1,5 @@
+import { badgeStateColor } from "@/components/dashboard/application/logs/show";
+import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import {
 	Card,
@@ -102,7 +104,9 @@ export const ComposePaidMonitoring = ({
 											value={container.name}
 										>
 											{container.name} ({container.containerId}){" "}
-											{container.state}
+											<Badge variant={badgeStateColor(container.state)}>
+												{container.state}
+											</Badge>
 										</SelectItem>
 									))}
 									<SelectLabel>Containers ({data?.length})</SelectLabel>

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

@@ -79,7 +79,7 @@ export const ContainerPaidMonitoring = ({ appName, baseUrl, token }: Props) => {
 		data,
 		isLoading,
 		error: queryError,
-	} = api.admin.getContainerMetrics.useQuery(
+	} = api.user.getContainerMetrics.useQuery(
 		{
 			url: baseUrl,
 			token,

apps/dokploy/components/dashboard/monitoring/paid/servers/show-paid-monitoring.tsx

@@ -7,7 +7,6 @@ import {
 } from "@/components/ui/select";
 import { api } from "@/utils/api";
 import { Clock, Cpu, HardDrive, Loader2, MemoryStick } from "lucide-react";
-import type React from "react";
 import { useEffect, useState } from "react";
 import { CPUChart } from "./cpu-chart";
 import { DiskChart } from "./disk-chart";
@@ -73,7 +72,7 @@ export const ShowPaidMonitoring = ({
 		data,
 		isLoading,
 		error: queryError,
-	} = api.admin.getServerMetrics.useQuery(
+	} = api.server.getServerMetrics.useQuery(
 		{
 			url: BASE_URL,
 			token,

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

@@ -19,7 +19,7 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";

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

@@ -4,7 +4,7 @@ import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { Ban, CheckCircle2, RefreshCcw, Terminal } from "lucide-react";
-import React, { useState } from "react";
+import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";

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

@@ -3,7 +3,6 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
-import React from "react";
 
 interface Props {
 	mysqlId: string;

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

@@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { AlertTriangle, PenBoxIcon, SquarePen } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

apps/dokploy/components/dashboard/organization/handle-organization.tsx

@@ -0,0 +1,182 @@
+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,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { api } from "@/utils/api";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { PenBoxIcon, Plus } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
+
+const organizationSchema = z.object({
+	name: z.string().min(1, {
+		message: "Organization name is required",
+	}),
+	logo: z.string().optional(),
+});
+
+type OrganizationFormValues = z.infer<typeof organizationSchema>;
+
+interface Props {
+	organizationId?: string;
+	children?: React.ReactNode;
+}
+
+export function AddOrganization({ organizationId }: Props) {
+	const [open, setOpen] = useState(false);
+	const utils = api.useUtils();
+	const { data: organization } = api.organization.one.useQuery(
+		{
+			organizationId: organizationId ?? "",
+		},
+		{
+			enabled: !!organizationId,
+		},
+	);
+	const { mutateAsync, isLoading } = organizationId
+		? api.organization.update.useMutation()
+		: api.organization.create.useMutation();
+
+	const form = useForm<OrganizationFormValues>({
+		resolver: zodResolver(organizationSchema),
+		defaultValues: {
+			name: "",
+			logo: "",
+		},
+	});
+
+	useEffect(() => {
+		if (organization) {
+			form.reset({
+				name: organization.name,
+				logo: organization.logo || "",
+			});
+		}
+	}, [organization, form]);
+
+	const onSubmit = async (values: OrganizationFormValues) => {
+		await mutateAsync({
+			name: values.name,
+			logo: values.logo,
+			organizationId: organizationId ?? "",
+		})
+			.then(() => {
+				form.reset();
+				toast.success(
+					`Organization ${organizationId ? "updated" : "created"} successfully`,
+				);
+				utils.organization.all.invalidate();
+				setOpen(false);
+			})
+			.catch((error) => {
+				console.error(error);
+				toast.error(
+					`Failed to ${organizationId ? "update" : "create"} organization`,
+				);
+			});
+	};
+
+	return (
+		<Dialog open={open} onOpenChange={setOpen}>
+			<DialogTrigger asChild>
+				{organizationId ? (
+					<DropdownMenuItem
+						className="group cursor-pointer hover:bg-blue-500/10"
+						onSelect={(e) => e.preventDefault()}
+					>
+						<PenBoxIcon className="size-3.5 text-primary group-hover:text-blue-500" />
+					</DropdownMenuItem>
+				) : (
+					<DropdownMenuItem
+						className="gap-2 p-2"
+						onSelect={(e) => e.preventDefault()}
+					>
+						<div className="flex size-6 items-center justify-center rounded-md border bg-background">
+							<Plus className="size-4" />
+						</div>
+						<div className="font-medium text-muted-foreground">
+							Add organization
+						</div>
+					</DropdownMenuItem>
+				)}
+			</DialogTrigger>
+			<DialogContent className="sm:max-w-[425px]">
+				<DialogHeader>
+					<DialogTitle>
+						{organizationId ? "Update organization" : "Add organization"}
+					</DialogTitle>
+					<DialogDescription>
+						{organizationId
+							? "Update the organization name and logo"
+							: "Create a new organization to manage your projects."}
+					</DialogDescription>
+				</DialogHeader>
+				<Form {...form}>
+					<form
+						onSubmit={form.handleSubmit(onSubmit)}
+						className="grid gap-4 py-4"
+					>
+						<FormField
+							control={form.control}
+							name="name"
+							render={({ field }) => (
+								<FormItem className="tems-center gap-4">
+									<FormLabel className="text-right">Name</FormLabel>
+									<FormControl>
+										<Input
+											placeholder="Organization name"
+											{...field}
+											className="col-span-3"
+										/>
+									</FormControl>
+									<FormMessage className="" />
+								</FormItem>
+							)}
+						/>
+						<FormField
+							control={form.control}
+							name="logo"
+							render={({ field }) => (
+								<FormItem className=" gap-4">
+									<FormLabel className="text-right">Logo URL</FormLabel>
+									<FormControl>
+										<Input
+											placeholder="https://example.com/logo.png"
+											{...field}
+											value={field.value || ""}
+											className="col-span-3"
+										/>
+									</FormControl>
+									<FormMessage className="col-span-3 col-start-2" />
+								</FormItem>
+							)}
+						/>
+						<DialogFooter className="mt-4">
+							<Button type="submit" isLoading={isLoading}>
+								{organizationId ? "Update organization" : "Create organization"}
+							</Button>
+						</DialogFooter>
+					</form>
+				</Form>
+			</DialogContent>
+		</Dialog>
+	);
+}

apps/dokploy/components/dashboard/postgres/advanced/show-custom-command.tsx

@@ -11,7 +11,7 @@ import {
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import React, { useEffect } from "react";
+import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
@@ -53,7 +53,7 @@ export const ShowCustomCommand = ({ id, type }: Props) => {
 		mongo: () => api.mongo.update.useMutation(),
 	};
 
-	const { mutateAsync, isLoading } = mutationMap[type]
+	const { mutateAsync } = mutationMap[type]
 		? mutationMap[type]()
 		: api.mongo.update.useMutation();
 

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

@@ -19,7 +19,7 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";

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

@@ -4,7 +4,7 @@ import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { Ban, CheckCircle2, RefreshCcw, Terminal } from "lucide-react";
-import React, { useState } from "react";
+import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";

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

@@ -3,7 +3,6 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
-import React from "react";
 
 interface Props {
 	postgresId: string;

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

@@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { AlertTriangle, PenBoxIcon, SquarePen } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

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

@@ -103,7 +103,7 @@ export const AddApplication = ({ projectId, projectName }: Props) => {
 					projectId,
 				});
 			})
-			.catch((e) => {
+			.catch((_e) => {
 				toast.error("Error creating the service");
 			});
 	};

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

@@ -18,7 +18,6 @@ import { DropdownMenuItem } from "@/components/ui/dropdown-menu";
 import {
 	Form,
 	FormControl,
-	FormDescription,
 	FormField,
 	FormItem,
 	FormLabel,
@@ -49,7 +48,6 @@ import { z } from "zod";
 
 type DbType = typeof mySchema._type.type;
 
-// TODO: Change to a real docker images
 const dockerImageDefaultPlaceholder: Record<DbType, string> = {
 	mongo: "mongo:6",
 	mariadb: "mariadb:11",

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

@@ -57,7 +57,6 @@ import {
 	BookText,
 	CheckIcon,
 	ChevronsUpDown,
-	Code,
 	Github,
 	Globe,
 	HelpCircle,
@@ -435,14 +434,14 @@ export const AddTemplate = ({ projectId }: Props) => {
 																});
 																toast.promise(promise, {
 																	loading: "Setting up...",
-																	success: (data) => {
+																	success: (_data) => {
 																		utils.project.one.invalidate({
 																			projectId,
 																		});
 																		setOpen(false);
 																		return `${template.name} template created successfully`;
 																	},
-																	error: (err) => {
+																	error: (_err) => {
 																		return `An error ocurred deploying ${template.name} template`;
 																	},
 																});

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

@@ -97,6 +97,18 @@ export const HandleProject = ({ projectId }: Props) => {
 				);
 			});
 	};
+	// useEffect(() => {
+	// 	const getUsers = async () => {
+	// 		const users = await authClient.admin.listUsers({
+	// 			query: {
+	// 				limit: 100,
+	// 			},
+	// 		});
+	// 		console.log(users);
+	// 	};
+
+	// 	getUsers();
+	// });
 
 	return (
 		<Dialog open={isOpen} onOpenChange={setIsOpen}>

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

@@ -51,15 +51,7 @@ import { ProjectEnvironment } from "./project-environment";
 export const ShowProjects = () => {
 	const utils = api.useUtils();
 	const { data, isLoading } = api.project.all.useQuery();
-	const { data: auth } = api.auth.get.useQuery();
+	const { data: auth } = api.user.get.useQuery();
-	const { data: user } = api.user.byAuthId.useQuery(
-		{
-			authId: auth?.id || "",
-		},
-		{
-			enabled: !!auth?.id && auth?.rol === "user",
-		},
-	);
 	const { mutateAsync } = api.project.remove.useMutation();
 	const [searchQuery, setSearchQuery] = useState("");
 
@@ -91,7 +83,7 @@ export const ShowProjects = () => {
 								</CardDescription>
 							</CardHeader>
 
-							{(auth?.rol === "admin" || user?.canCreateProjects) && (
+							{(auth?.role === "owner" || auth?.canCreateProjects) && (
 								<div className="">
 									<HandleProject />
 								</div>
@@ -293,8 +285,8 @@ export const ShowProjects = () => {
 																				<div
 																					onClick={(e) => e.stopPropagation()}
 																				>
-																					{(auth?.rol === "admin" ||
+																					{(auth?.role === "owner" ||
-																						user?.canDeleteProjects) && (
+																						auth?.canDeleteProjects) && (
 																						<AlertDialog>
 																							<AlertDialogTrigger className="w-full">
 																								<DropdownMenuItem

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

@@ -19,7 +19,7 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
@@ -79,7 +79,7 @@ export const ShowExternalRedisCredentials = ({ redisId }: Props) => {
 
 	useEffect(() => {
 		const buildConnectionUrl = () => {
-			const hostname = window.location.hostname;
+			const _hostname = window.location.hostname;
 			const port = form.watch("externalPort") || data?.externalPort;
 
 			return `redis://default:${data?.databasePassword}@${getIp}:${port}`;

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

@@ -4,7 +4,7 @@ import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { api } from "@/utils/api";
 import { Ban, CheckCircle2, RefreshCcw, Terminal } from "lucide-react";
-import React, { useState } from "react";
+import { useState } from "react";
 import { toast } from "sonner";
 import { type LogLine, parseLogs } from "../../docker/logs/utils";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";

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

@@ -3,7 +3,6 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { api } from "@/utils/api";
-import React from "react";
 
 interface Props {
 	redisId: string;

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

@@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { AlertTriangle, PenBoxIcon, SquarePen } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

apps/dokploy/components/dashboard/requests/columns.tsx

@@ -3,7 +3,6 @@ import { Button } from "@/components/ui/button";
 import type { ColumnDef } from "@tanstack/react-table";
 import { format } from "date-fns";
 import { ArrowUpDown } from "lucide-react";
-import * as React from "react";
 import type { LogEntry } from "./show-requests";
 
 export const getStatusColor = (status: number) => {
@@ -25,7 +24,7 @@ export const getStatusColor = (status: number) => {
 export const columns: ColumnDef<LogEntry>[] = [
 	{
 		accessorKey: "level",
-		header: ({ column }) => {
+		header: () => {
 			return <Button variant="ghost">Level</Button>;
 		},
 		cell: ({ row }) => {

apps/dokploy/components/dashboard/requests/requests-table.tsx

@@ -92,7 +92,7 @@ export const RequestsTable = () => {
 		pageSize: 10,
 	});
 
-	const { data: statsLogs, isLoading } = api.settings.readStatsLogs.useQuery(
+	const { data: statsLogs } = api.settings.readStatsLogs.useQuery(
 		{
 			sort: sorting[0],
 			page: pagination,
@@ -300,7 +300,7 @@ export const RequestsTable = () => {
 			</div>
 			<Sheet
 				open={!!selectedRow}
-				onOpenChange={(open) => setSelectedRow(undefined)}
+				onOpenChange={(_open) => setSelectedRow(undefined)}
 			>
 				<SheetContent className="sm:max-w-[740px]  flex flex-col">
 					<SheetHeader>

apps/dokploy/components/dashboard/requests/show-requests.tsx

@@ -11,7 +11,6 @@ import {
 import { type RouterOutputs, api } from "@/utils/api";
 import { ArrowDownUp } from "lucide-react";
 import Link from "next/link";
-import * as React from "react";
 import { toast } from "sonner";
 import { RequestDistributionChart } from "./request-distribution-chart";
 import { RequestsTable } from "./requests-table";

apps/dokploy/components/dashboard/search-command.tsx

@@ -7,9 +7,7 @@ import {
 	PostgresqlIcon,
 	RedisIcon,
 } from "@/components/icons/data-tools-icons";
-import { Badge } from "@/components/ui/badge";
 import {
-	Command,
 	CommandDialog,
 	CommandEmpty,
 	CommandGroup,
@@ -18,26 +16,26 @@ import {
 	CommandList,
 	CommandSeparator,
 } from "@/components/ui/command";
+import { authClient } from "@/lib/auth-client";
 import {
 	type Services,
 	extractServices,
 } from "@/pages/dashboard/project/[projectId]";
 import { api } from "@/utils/api";
-import type { findProjectById } from "@dokploy/server/services/project";
 import { BookIcon, CircuitBoard, GlobeIcon } from "lucide-react";
 import { useRouter } from "next/router";
 import React from "react";
 import { StatusTooltip } from "../shared/status-tooltip";
 
-type Project = Awaited<ReturnType<typeof findProjectById>>;
-
 export const SearchCommand = () => {
 	const router = useRouter();
 	const [open, setOpen] = React.useState(false);
 	const [search, setSearch] = React.useState("");
-
+	const { data: session } = authClient.useSession();
-	const { data } = api.project.all.useQuery();
+	const { data } = api.project.all.useQuery(undefined, {
-	const { data: isCloud, isLoading } = api.settings.isCloud.useQuery();
+		enabled: !!session,
+	});
+	const { data: isCloud } = api.settings.isCloud.useQuery();
 
 	React.useEffect(() => {
 		const down = (e: KeyboardEvent) => {

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

@@ -0,0 +1,468 @@
+import { Button } from "@/components/ui/button";
+import { api } from "@/utils/api";
+import { toast } from "sonner";
+import {
+	Dialog,
+	DialogContent,
+	DialogHeader,
+	DialogTitle,
+	DialogTrigger,
+	DialogDescription,
+} from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import {
+	Select,
+	SelectContent,
+	SelectItem,
+	SelectTrigger,
+	SelectValue,
+} from "@/components/ui/select";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+import {
+	Form,
+	FormControl,
+	FormField,
+	FormItem,
+	FormLabel,
+	FormMessage,
+	FormDescription,
+} from "@/components/ui/form";
+import { Switch } from "@/components/ui/switch";
+
+const formSchema = z.object({
+	name: z.string().min(1, "Name is required"),
+	prefix: z.string().optional(),
+	expiresIn: z.number().nullable(),
+	organizationId: z.string().min(1, "Organization is required"),
+	// Rate limiting fields
+	rateLimitEnabled: z.boolean().optional(),
+	rateLimitTimeWindow: z.number().nullable(),
+	rateLimitMax: z.number().nullable(),
+	// Request limiting fields
+	remaining: z.number().nullable().optional(),
+	refillAmount: z.number().nullable().optional(),
+	refillInterval: z.number().nullable().optional(),
+});
+
+type FormValues = z.infer<typeof formSchema>;
+
+const EXPIRATION_OPTIONS = [
+	{ label: "Never", value: "0" },
+	{ label: "1 day", value: String(60 * 60 * 24) },
+	{ label: "7 days", value: String(60 * 60 * 24 * 7) },
+	{ label: "30 days", value: String(60 * 60 * 24 * 30) },
+	{ label: "90 days", value: String(60 * 60 * 24 * 90) },
+	{ label: "1 year", value: String(60 * 60 * 24 * 365) },
+];
+
+const TIME_WINDOW_OPTIONS = [
+	{ label: "1 minute", value: String(60 * 1000) },
+	{ label: "5 minutes", value: String(5 * 60 * 1000) },
+	{ label: "15 minutes", value: String(15 * 60 * 1000) },
+	{ label: "30 minutes", value: String(30 * 60 * 1000) },
+	{ label: "1 hour", value: String(60 * 60 * 1000) },
+	{ label: "1 day", value: String(24 * 60 * 60 * 1000) },
+];
+
+const REFILL_INTERVAL_OPTIONS = [
+	{ label: "1 hour", value: String(60 * 60 * 1000) },
+	{ label: "6 hours", value: String(6 * 60 * 60 * 1000) },
+	{ label: "12 hours", value: String(12 * 60 * 60 * 1000) },
+	{ label: "1 day", value: String(24 * 60 * 60 * 1000) },
+	{ label: "7 days", value: String(7 * 24 * 60 * 60 * 1000) },
+	{ label: "30 days", value: String(30 * 24 * 60 * 60 * 1000) },
+];
+
+export const AddApiKey = () => {
+	const [open, setOpen] = useState(false);
+	const [showSuccessModal, setShowSuccessModal] = useState(false);
+	const [newApiKey, setNewApiKey] = useState("");
+	const { refetch } = api.user.get.useQuery();
+	const { data: organizations } = api.organization.all.useQuery();
+	const createApiKey = api.user.createApiKey.useMutation({
+		onSuccess: (data) => {
+			if (!data) return;
+
+			setNewApiKey(data.key);
+			setOpen(false);
+			setShowSuccessModal(true);
+			form.reset();
+			void refetch();
+		},
+		onError: () => {
+			toast.error("Failed to generate API key");
+		},
+	});
+
+	const form = useForm<FormValues>({
+		resolver: zodResolver(formSchema),
+		defaultValues: {
+			name: "",
+			prefix: "",
+			expiresIn: null,
+			organizationId: "",
+			rateLimitEnabled: false,
+			rateLimitTimeWindow: null,
+			rateLimitMax: null,
+			remaining: null,
+			refillAmount: null,
+			refillInterval: null,
+		},
+	});
+
+	const rateLimitEnabled = form.watch("rateLimitEnabled");
+
+	const onSubmit = async (values: FormValues) => {
+		createApiKey.mutate({
+			name: values.name,
+			expiresIn: values.expiresIn || undefined,
+			prefix: values.prefix || undefined,
+			metadata: {
+				organizationId: values.organizationId,
+			},
+			// Rate limiting
+			rateLimitEnabled: values.rateLimitEnabled,
+			rateLimitTimeWindow: values.rateLimitTimeWindow || undefined,
+			rateLimitMax: values.rateLimitMax || undefined,
+			// Request limiting
+			remaining: values.remaining || undefined,
+			refillAmount: values.refillAmount || undefined,
+			refillInterval: values.refillInterval || undefined,
+		});
+	};
+
+	return (
+		<>
+			<Dialog open={open} onOpenChange={setOpen}>
+				<DialogTrigger asChild>
+					<Button>Generate New Key</Button>
+				</DialogTrigger>
+				<DialogContent className="sm:max-w-xl max-h-[90vh] overflow-y-auto">
+					<DialogHeader>
+						<DialogTitle>Generate API Key</DialogTitle>
+						<DialogDescription>
+							Create a new API key for accessing the API. You can set an
+							expiration date and a custom prefix for better organization.
+						</DialogDescription>
+					</DialogHeader>
+					<Form {...form}>
+						<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
+							<FormField
+								control={form.control}
+								name="name"
+								render={({ field }) => (
+									<FormItem>
+										<FormLabel>Name</FormLabel>
+										<FormControl>
+											<Input placeholder="My API Key" {...field} />
+										</FormControl>
+										<FormMessage />
+									</FormItem>
+								)}
+							/>
+							<FormField
+								control={form.control}
+								name="prefix"
+								render={({ field }) => (
+									<FormItem>
+										<FormLabel>Prefix</FormLabel>
+										<FormControl>
+											<Input placeholder="my_app" {...field} />
+										</FormControl>
+										<FormMessage />
+									</FormItem>
+								)}
+							/>
+							<FormField
+								control={form.control}
+								name="expiresIn"
+								render={({ field }) => (
+									<FormItem>
+										<FormLabel>Expiration</FormLabel>
+										<Select
+											value={field.value?.toString() || "0"}
+											onValueChange={(value) =>
+												field.onChange(Number.parseInt(value, 10))
+											}
+										>
+											<FormControl>
+												<SelectTrigger>
+													<SelectValue placeholder="Select expiration time" />
+												</SelectTrigger>
+											</FormControl>
+											<SelectContent>
+												{EXPIRATION_OPTIONS.map((option) => (
+													<SelectItem key={option.value} value={option.value}>
+														{option.label}
+													</SelectItem>
+												))}
+											</SelectContent>
+										</Select>
+										<FormMessage />
+									</FormItem>
+								)}
+							/>
+							<FormField
+								control={form.control}
+								name="organizationId"
+								render={({ field }) => (
+									<FormItem>
+										<FormLabel>Organization</FormLabel>
+										<Select value={field.value} onValueChange={field.onChange}>
+											<FormControl>
+												<SelectTrigger>
+													<SelectValue placeholder="Select organization" />
+												</SelectTrigger>
+											</FormControl>
+											<SelectContent>
+												{organizations?.map((org) => (
+													<SelectItem key={org.id} value={org.id}>
+														{org.name}
+													</SelectItem>
+												))}
+											</SelectContent>
+										</Select>
+										<FormMessage />
+									</FormItem>
+								)}
+							/>
+
+							{/* Rate Limiting Section */}
+							<div className="space-y-4 rounded-lg border p-4">
+								<h3 className="text-lg font-medium">Rate Limiting</h3>
+								<FormField
+									control={form.control}
+									name="rateLimitEnabled"
+									render={({ field }) => (
+										<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3">
+											<div className="space-y-0.5">
+												<FormLabel>Enable Rate Limiting</FormLabel>
+												<FormDescription>
+													Limit the number of requests within a time window
+												</FormDescription>
+											</div>
+											<FormControl>
+												<Switch
+													checked={field.value}
+													onCheckedChange={field.onChange}
+												/>
+											</FormControl>
+										</FormItem>
+									)}
+								/>
+
+								{rateLimitEnabled && (
+									<>
+										<FormField
+											control={form.control}
+											name="rateLimitTimeWindow"
+											render={({ field }) => (
+												<FormItem>
+													<FormLabel>Time Window</FormLabel>
+													<Select
+														value={field.value?.toString()}
+														onValueChange={(value) =>
+															field.onChange(Number.parseInt(value, 10))
+														}
+													>
+														<FormControl>
+															<SelectTrigger>
+																<SelectValue placeholder="Select time window" />
+															</SelectTrigger>
+														</FormControl>
+														<SelectContent>
+															{TIME_WINDOW_OPTIONS.map((option) => (
+																<SelectItem
+																	key={option.value}
+																	value={option.value}
+																>
+																	{option.label}
+																</SelectItem>
+															))}
+														</SelectContent>
+													</Select>
+													<FormDescription>
+														The duration in which requests are counted
+													</FormDescription>
+													<FormMessage />
+												</FormItem>
+											)}
+										/>
+										<FormField
+											control={form.control}
+											name="rateLimitMax"
+											render={({ field }) => (
+												<FormItem>
+													<FormLabel>Maximum Requests</FormLabel>
+													<FormControl>
+														<Input
+															type="number"
+															placeholder="100"
+															value={field.value?.toString() ?? ""}
+															onChange={(e) =>
+																field.onChange(
+																	e.target.value
+																		? Number.parseInt(e.target.value, 10)
+																		: null,
+																)
+															}
+														/>
+													</FormControl>
+													<FormDescription>
+														Maximum number of requests allowed within the time
+														window
+													</FormDescription>
+													<FormMessage />
+												</FormItem>
+											)}
+										/>
+									</>
+								)}
+							</div>
+
+							{/* Request Limiting Section */}
+							<div className="space-y-4 rounded-lg border p-4">
+								<h3 className="text-lg font-medium">Request Limiting</h3>
+								<FormField
+									control={form.control}
+									name="remaining"
+									render={({ field }) => (
+										<FormItem>
+											<FormLabel>Total Request Limit</FormLabel>
+											<FormControl>
+												<Input
+													type="number"
+													placeholder="Leave empty for unlimited"
+													value={field.value?.toString() ?? ""}
+													onChange={(e) =>
+														field.onChange(
+															e.target.value
+																? Number.parseInt(e.target.value, 10)
+																: null,
+														)
+													}
+												/>
+											</FormControl>
+											<FormDescription>
+												Total number of requests allowed (leave empty for
+												unlimited)
+											</FormDescription>
+											<FormMessage />
+										</FormItem>
+									)}
+								/>
+
+								<FormField
+									control={form.control}
+									name="refillAmount"
+									render={({ field }) => (
+										<FormItem>
+											<FormLabel>Refill Amount</FormLabel>
+											<FormControl>
+												<Input
+													type="number"
+													placeholder="Amount to refill"
+													value={field.value?.toString() ?? ""}
+													onChange={(e) =>
+														field.onChange(
+															e.target.value
+																? Number.parseInt(e.target.value, 10)
+																: null,
+														)
+													}
+												/>
+											</FormControl>
+											<FormDescription>
+												Number of requests to add on each refill
+											</FormDescription>
+											<FormMessage />
+										</FormItem>
+									)}
+								/>
+
+								<FormField
+									control={form.control}
+									name="refillInterval"
+									render={({ field }) => (
+										<FormItem>
+											<FormLabel>Refill Interval</FormLabel>
+											<Select
+												value={field.value?.toString()}
+												onValueChange={(value) =>
+													field.onChange(Number.parseInt(value, 10))
+												}
+											>
+												<FormControl>
+													<SelectTrigger>
+														<SelectValue placeholder="Select refill interval" />
+													</SelectTrigger>
+												</FormControl>
+												<SelectContent>
+													{REFILL_INTERVAL_OPTIONS.map((option) => (
+														<SelectItem key={option.value} value={option.value}>
+															{option.label}
+														</SelectItem>
+													))}
+												</SelectContent>
+											</Select>
+											<FormDescription>
+												How often to refill the request limit
+											</FormDescription>
+											<FormMessage />
+										</FormItem>
+									)}
+								/>
+							</div>
+
+							<div className="flex justify-end gap-3 pt-4">
+								<Button
+									type="button"
+									variant="outline"
+									onClick={() => setOpen(false)}
+								>
+									Cancel
+								</Button>
+								<Button type="submit">Generate</Button>
+							</div>
+						</form>
+					</Form>
+				</DialogContent>
+			</Dialog>
+
+			<Dialog open={showSuccessModal} onOpenChange={setShowSuccessModal}>
+				<DialogContent className="sm:max-w-xl">
+					<DialogHeader>
+						<DialogTitle>API Key Generated Successfully</DialogTitle>
+						<DialogDescription>
+							Please copy your API key now. You won't be able to see it again!
+						</DialogDescription>
+					</DialogHeader>
+					<div className="mt-4 space-y-4">
+						<div className="rounded-md bg-muted p-4 font-mono text-sm break-all">
+							{newApiKey}
+						</div>
+						<div className="flex justify-end gap-3">
+							<Button
+								onClick={() => {
+									navigator.clipboard.writeText(newApiKey);
+									toast.success("API key copied to clipboard");
+								}}
+							>
+								Copy to Clipboard
+							</Button>
+							<Button
+								variant="outline"
+								onClick={() => setShowSuccessModal(false)}
+							>
+								Close
+							</Button>
+						</div>
+					</div>
+				</DialogContent>
+			</Dialog>
+		</>
+	);
+};

apps/dokploy/components/dashboard/settings/api/show-api-keys.tsx

@@ -0,0 +1,142 @@
+import { Button } from "@/components/ui/button";
+import {
+	Card,
+	CardContent,
+	CardDescription,
+	CardHeader,
+	CardTitle,
+} from "@/components/ui/card";
+import { api } from "@/utils/api";
+import { ExternalLinkIcon, KeyIcon, Trash2, Clock, Tag } from "lucide-react";
+import Link from "next/link";
+import { toast } from "sonner";
+import { formatDistanceToNow } from "date-fns";
+import { DialogAction } from "@/components/shared/dialog-action";
+import { AddApiKey } from "./add-api-key";
+import { Badge } from "@/components/ui/badge";
+
+export const ShowApiKeys = () => {
+	const { data, refetch } = api.user.get.useQuery();
+	const { mutateAsync: deleteApiKey, isLoading: isLoadingDelete } =
+		api.user.deleteApiKey.useMutation();
+
+	return (
+		<div className="w-full">
+			<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="flex flex-row gap-2 flex-wrap justify-between items-center">
+						<div>
+							<CardTitle className="text-xl flex items-center gap-2">
+								<KeyIcon className="size-5" />
+								API/CLI Keys
+							</CardTitle>
+							<CardDescription>
+								Generate and manage API keys to access the API/CLI
+							</CardDescription>
+						</div>
+						<div className="flex flex-row gap-2 max-sm:flex-wrap items-end">
+							<span className="text-sm font-medium text-muted-foreground">
+								Swagger API:
+							</span>
+							<Link
+								href="/swagger"
+								target="_blank"
+								className="flex flex-row gap-2 items-center"
+							>
+								<span className="text-sm font-medium">View</span>
+								<ExternalLinkIcon className="size-4" />
+							</Link>
+						</div>
+					</CardHeader>
+					<CardContent className="space-y-6">
+						<div className="flex flex-col gap-4">
+							{data?.user.apiKeys && data.user.apiKeys.length > 0 ? (
+								data.user.apiKeys.map((apiKey) => (
+									<div
+										key={apiKey.id}
+										className="flex flex-col gap-2 p-4 border rounded-lg"
+									>
+										<div className="flex justify-between items-start">
+											<div className="flex flex-col gap-1">
+												<span className="font-medium">{apiKey.name}</span>
+												<div className="flex flex-wrap gap-2 items-center text-sm text-muted-foreground">
+													<span className="flex items-center gap-1">
+														<Clock className="size-3.5" />
+														Created{" "}
+														{formatDistanceToNow(new Date(apiKey.createdAt))}{" "}
+														ago
+													</span>
+													{apiKey.prefix && (
+														<Badge
+															variant="secondary"
+															className="flex items-center gap-1"
+														>
+															<Tag className="size-3.5" />
+															{apiKey.prefix}
+														</Badge>
+													)}
+													{apiKey.expiresAt && (
+														<Badge
+															variant="outline"
+															className="flex items-center gap-1"
+														>
+															<Clock className="size-3.5" />
+															Expires in{" "}
+															{formatDistanceToNow(
+																new Date(apiKey.expiresAt),
+															)}{" "}
+														</Badge>
+													)}
+												</div>
+											</div>
+											<DialogAction
+												title="Delete API Key"
+												description="Are you sure you want to delete this API key? This action cannot be undone."
+												type="destructive"
+												onClick={async () => {
+													try {
+														await deleteApiKey({
+															apiKeyId: apiKey.id,
+														});
+														await refetch();
+														toast.success("API key deleted successfully");
+													} catch (error) {
+														toast.error(
+															error instanceof Error
+																? error.message
+																: "Error deleting API key",
+														);
+													}
+												}}
+											>
+												<Button
+													variant="ghost"
+													size="icon"
+													isLoading={isLoadingDelete}
+												>
+													<Trash2 className="size-4" />
+												</Button>
+											</DialogAction>
+										</div>
+									</div>
+								))
+							) : (
+								<div className="flex flex-col items-center gap-3 py-6">
+									<KeyIcon className="size-8 text-muted-foreground" />
+									<span className="text-base text-muted-foreground">
+										No API keys found
+									</span>
+								</div>
+							)}
+						</div>
+
+						{/* Generate new API key */}
+						<div className="flex justify-end pt-4 border-t">
+							<AddApiKey />
+						</div>
+					</CardContent>
+				</div>
+			</Card>
+		</div>
+	);
+};

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

@@ -23,7 +23,7 @@ import {
 	PlusIcon,
 } from "lucide-react";
 import Link from "next/link";
-import React, { useState } from "react";
+import { useState } from "react";
 
 const stripePromise = loadStripe(
 	process.env.NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY!,
@@ -38,8 +38,8 @@ export const calculatePrice = (count: number, isAnnual = false) => {
 	return count * 3.5;
 };
 export const ShowBilling = () => {
-	const { data: servers } = api.server.all.useQuery(undefined);
+	const { data: servers } = api.server.count.useQuery();
-	const { data: admin } = api.admin.one.useQuery();
+	const { data: admin } = api.user.get.useQuery();
 	const { data, isLoading } = api.stripe.getProducts.useQuery();
 	const { mutateAsync: createCheckoutSession } =
 		api.stripe.createCheckoutSession.useMutation();
@@ -70,8 +70,8 @@ export const ShowBilling = () => {
 		return isAnnual ? interval === "year" : interval === "month";
 	});
 
-	const maxServers = admin?.serversQuantity ?? 1;
+	const maxServers = admin?.user.serversQuantity ?? 1;
-	const percentage = ((servers?.length ?? 0) / maxServers) * 100;
+	const percentage = ((servers ?? 0) / maxServers) * 100;
 	const safePercentage = Math.min(percentage, 100);
 
 	return (
@@ -98,17 +98,17 @@ export const ShowBilling = () => {
 									<TabsTrigger value="annual">Annual</TabsTrigger>
 								</TabsList>
 							</Tabs>
-							{admin?.stripeSubscriptionId && (
+							{admin?.user.stripeSubscriptionId && (
 								<div className="space-y-2 flex flex-col">
 									<h3 className="text-lg font-medium">Servers Plan</h3>
 									<p className="text-sm text-muted-foreground">
-										You have {servers?.length} server on your plan of{" "}
+										You have {servers} server on your plan of{" "}
-										{admin?.serversQuantity} servers
+										{admin?.user.serversQuantity} servers
 									</p>
 									<div>
 										<Progress value={safePercentage} className="max-w-lg" />
 									</div>
-									{admin && admin.serversQuantity! <= servers?.length! && (
+									{admin && admin.user.serversQuantity! <= (servers ?? 0) && (
 										<div className="flex flex-row gap-4 p-2 bg-yellow-50 dark:bg-yellow-950 rounded-lg items-center">
 											<AlertTriangle className="text-yellow-600 dark:text-yellow-400" />
 											<span className="text-sm text-yellow-600 dark:text-yellow-400">
@@ -279,7 +279,7 @@ export const ShowBilling = () => {
 																"flex flex-row  items-center gap-2 mt-4",
 															)}
 														>
-															{admin?.stripeCustomerId && (
+															{admin?.user.stripeCustomerId && (
 																<Button
 																	variant="secondary"
 																	className="w-full"

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

@@ -6,16 +6,15 @@ import {
 	DialogTitle,
 } from "@/components/ui/dialog";
 import { api } from "@/utils/api";
-import type React from "react";
 import { useEffect, useState } from "react";
 
 export const ShowWelcomeDokploy = () => {
-	const { data } = api.auth.get.useQuery();
+	const { data } = api.user.get.useQuery();
 	const [open, setOpen] = useState(false);
 
 	const { data: isCloud, isLoading } = api.settings.isCloud.useQuery();
 
-	if (!isCloud || data?.rol !== "admin") {
+	if (!isCloud || data?.role !== "admin") {
 		return null;
 	}
 
@@ -24,14 +23,14 @@ export const ShowWelcomeDokploy = () => {
 			!isLoading &&
 			isCloud &&
 			!localStorage.getItem("hasSeenCloudWelcomeModal") &&
-			data?.rol === "admin"
+			data?.role === "owner"
 		) {
 			setOpen(true);
 		}
 	}, [isCloud, isLoading]);
 
 	const handleClose = (isOpen: boolean) => {
-		if (data?.rol === "admin") {
+		if (data?.role === "owner") {
 			setOpen(isOpen);
 			if (!isOpen) {
 				localStorage.setItem("hasSeenCloudWelcomeModal", "true"); // Establece el flag al cerrar el modal

apps/dokploy/components/dashboard/settings/certificates/add-certificate.tsx

@@ -86,6 +86,7 @@ export const AddCertificate = () => {
 			privateKey: data.privateKey,
 			autoRenew: data.autoRenew,
 			serverId: data.serverId,
+			organizationId: "",
 		})
 			.then(async () => {
 				toast.success("Certificate Created");

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

@@ -33,7 +33,6 @@ import {
 } from "@/components/ui/tooltip";
 import { api } from "@/utils/api";
 import { Boxes, HelpCircle, LockIcon, MoreHorizontal } from "lucide-react";
-import React from "react";
 import { toast } from "sonner";
 import { AddNode } from "./add-node";
 import { ShowNodeData } from "./show-node-data";
@@ -42,8 +41,7 @@ export const ShowNodes = () => {
 	const { data, isLoading, refetch } = api.cluster.getNodes.useQuery();
 	const { data: registry } = api.registry.all.useQuery();
 
-	const { mutateAsync: deleteNode, isLoading: isRemoving } =
+	const { mutateAsync: deleteNode } = api.cluster.removeWorker.useMutation();
-		api.cluster.removeWorker.useMutation();
 
 	const haveAtLeastOneRegistry = !!(registry && registry?.length > 0);
 	return (

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

@@ -131,7 +131,7 @@ export const HandleRegistry = ({ registryId }: Props) => {
 			serverId: data.serverId,
 			registryId: registryId || "",
 		})
-			.then(async (data) => {
+			.then(async (_data) => {
 				await utils.registry.all.invalidate();
 				toast.success(registryId ? "Registry updated" : "Registry added");
 				setIsOpen(false);

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

@@ -1,8 +1,4 @@
-import {
+import { BitbucketIcon } from "@/components/icons/data-tools-icons";
-	BitbucketIcon,
-	GithubIcon,
-	GitlabIcon,
-} from "@/components/icons/data-tools-icons";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { Button } from "@/components/ui/button";
 import { CardContent } from "@/components/ui/card";
@@ -51,10 +47,10 @@ type Schema = z.infer<typeof Schema>;
 export const AddBitbucketProvider = () => {
 	const utils = api.useUtils();
 	const [isOpen, setIsOpen] = useState(false);
-	const url = useUrl();
+	const _url = useUrl();
 	const { mutateAsync, error, isError } = api.bitbucket.create.useMutation();
-	const { data: auth } = api.auth.get.useQuery();
+	const { data: auth } = api.user.get.useQuery();
-	const router = useRouter();
+	const _router = useRouter();
 	const form = useForm<Schema>({
 		defaultValues: {
 			username: "",

apps/dokploy/components/dashboard/settings/git/bitbucket/edit-bitbucket-provider.tsx

@@ -20,7 +20,7 @@ import {
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { Edit, PenBoxIcon } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";

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

@@ -10,13 +10,15 @@ import {
 } from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
 import { Switch } from "@/components/ui/switch";
+import { authClient } from "@/lib/auth-client";
 import { api } from "@/utils/api";
 import { format } from "date-fns";
 import { useEffect, useState } from "react";
 
 export const AddGithubProvider = () => {
 	const [isOpen, setIsOpen] = useState(false);
-	const { data } = api.auth.get.useQuery();
+	const { data: activeOrganization } = authClient.useActiveOrganization();
+	const { data } = api.user.get.useQuery();
 	const [manifest, setManifest] = useState("");
 	const [isOrganization, setIsOrganization] = useState(false);
 	const [organizationName, setOrganization] = useState("");
@@ -25,7 +27,7 @@ export const AddGithubProvider = () => {
 		const url = document.location.origin;
 		const manifest = JSON.stringify(
 			{
-				redirect_url: `${origin}/api/providers/github/setup?authId=${data?.id}`,
+				redirect_url: `${origin}/api/providers/github/setup?organizationId=${activeOrganization?.id}`,
 				name: `Dokploy-${format(new Date(), "yyyy-MM-dd")}`,
 				url: origin,
 				hook_attributes: {
@@ -93,8 +95,8 @@ export const AddGithubProvider = () => {
 							<form
 								action={
 									isOrganization
-										? `https://github.com/organizations/${organizationName}/settings/apps/new?state=gh_init:${data?.id}`
+										? `https://github.com/organizations/${organizationName}/settings/apps/new?state=gh_init:${activeOrganization?.id}`
-										: `https://github.com/settings/apps/new?state=gh_init:${data?.id}`
+										: `https://github.com/settings/apps/new?state=gh_init:${activeOrganization?.id}`
 								}
 								method="post"
 							>

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

@@ -55,7 +55,7 @@ export const AddGitlabProvider = () => {
 	const utils = api.useUtils();
 	const [isOpen, setIsOpen] = useState(false);
 	const url = useUrl();
-	const { data: auth } = api.auth.get.useQuery();
+	const { data: auth } = api.user.get.useQuery();
 	const { mutateAsync, error, isError } = api.gitlab.create.useMutation();
 	const webhookUrl = `${url}/api/providers/gitlab/callback`;
 

apps/dokploy/components/dashboard/settings/git/gitlab/edit-gitlab-provider.tsx

@@ -20,7 +20,7 @@ import {
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { Edit, PenBoxIcon } from "lucide-react";
+import { PenBoxIcon } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";