Merge pull request #197 from Dokploy/canary

v0.3.1

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -0,0 +1,62 @@
+name: Bug Report
+description: Create a bug report
+labels: ['bug']
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Before opening a new issue, please do a search of existing issues.
+
+        If you need help with your own project, you can start a discussion in the [Q&A Section](https://github.com/Dokploy/dokploy/discussions).
+  - type: textarea
+    attributes:
+      label: To Reproduce
+      description: A step-by-step description of how to reproduce the issue, or a link to the reproducible repository.
+      placeholder: |
+        1. Create a application
+        2. Click X
+        3. Y will happen
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: Current vs. Expected behavior
+      description: A clear and concise description of what the bug is, and what you expected to happen.
+      placeholder: 'Following the steps from the previous section, I expected A to happen, but I observed B instead'
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: Provide environment information
+      description: Please provide the following information about your environment.
+      render: bash
+      placeholder: |
+        Operating System:
+          OS: Ubuntu 20.04
+          Arch: arm64
+        Dokploy version: 0.2.2'
+        VPS Provider: DigitalOcean, Hetzner, Linode, etc.
+        What applications/services are you tying to deploy?
+         eg - Database, Nextjs App, laravel, etc.
+    validations:
+      required: true
+  - type: dropdown
+    attributes:
+      label: Which area(s) are affected? (Select all that apply)
+      multiple: true
+      options:
+        - 'Installation'
+        - 'Application'
+        - 'Databases'
+        - 'Docker Compose'
+        - 'Traefik'
+        - 'Docker'
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: Additional context
+      description: |
+        Any extra information that might help us investigate.
+      placeholder: |
+        I tested on a DigitalOcean VPS with Ubuntu 20.04 and Docker version 20.10.12.

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,5 @@
+blank_issues_enabled: false
+contact_links:
+  - name: Questions?
+    url: https://github.com/Dokploy/dokploy/discussions
+    about: Ask your questions here.

.github/ISSUE_TEMPLATE/feature-request.yml

@@ -0,0 +1,33 @@
+name: Feature Request
+description: Suggest a new feature or improvement to the project
+labels: ['enhancement']
+body:
+  - type: textarea
+    attributes:
+      label: What problem will this feature address?
+      description: A clear and concise description of what the problem is.
+      placeholder: |
+        I'm always frustrated when I can't do X
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: Describe the solution you'd like
+      description: A clear and concise description of what you want to happen.
+      placeholder: Add X to the core
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: Describe alternatives you've considered
+      description: A clear and concise description of any alternative solutions or features you've considered.
+      placeholder: |
+        Maybe use Y as a workaround?
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: Additional context
+      description: Add any other context or screenshots about the feature request here.
+    validations:
+      required: false

README.md

@@ -1,36 +1,37 @@
 
-
 <div align="center">
    <h1 align="center">Dokploy</h1>
+   <div>
+  <img style="object-fit: cover; border-radius:20px;" align="center" width="50%"src="https://raw.githubusercontent.com/Dokploy/docs/main/public/logo.png" >
+
 </div>
 
-<div align="center" style="width:100%;">
-<img src="https://raw.githubusercontent.com/Dokploy/dokploy/main/logo.png" alt="Reflex Logo"  style="width:60%;">
 </div>
-<hr>
+
+<br />
+Dokploy is a free self-hostable Platform as a Service (PaaS) that simplifies the deployment and management of applications and databases.
 
 
+### Features
 
-Dokploy is a free self-hostable Platform as a Service (PaaS) that simplifies the deployment and management of applications and databases using Docker and Traefik. Designed to enhance efficiency and security, Dokploy allows you to deploy your applications on any VPS.
+Dokploy include multiples features to make your life easier.
 
 
-
-## Explanation
-[English](README.md) | [中文](README-zh.md) | [Deutsch](README-de.md) | [Русский Язык](README-ru.md)
+* **Applications**: Deploy any type of application (Node.js, PHP, Python, Go, Ruby, etc.).
+* **Databases**: Create and manage databases with support for MySQL, PostgreSQL, MongoDB, MariaDB, Redis.
+* **Backups**: Automate backups for databases to a external storage destination.
+* **Docker Compose**: Native support for Docker Compose to manage complex applications.
+* **Multi Node**: Scale applications to multiples nodes using docker swarm to manage the cluster.
+* **Templates**: Deploy in a single click open source templates (Plausible, Pocketbase, Calcom, etc.).
+* **Traefik Integration**: Automatically integrates with Traefik for routing and load balancing.
+* **Real-time Monitoring**: Monitor CPU, memory, storage, and network usage, for every resource.
+* **Docker Management**: Easily deploy and manage Docker containers.
+* **CLI/API**: Manage your applications and databases using the command line or trought the API.
+* **Self-Hosted**: Self-host Dokploy on your VPS.
 
 
 
 
-## 🌟 Features
-
-- **Applications**: Deploy any type of application (Node.js, PHP, Python, Go, Ruby, etc.) with ease.
-- **Databases**: Create  and manage databases with support for MySQL, PostgreSQL, MongoDB, MariaDB, Redis, and more.
-- **Docker Management**: Easily deploy and manage Docker containers.
-- **Traefik Integration**: Automatically integrates with Traefik for routing and load balancing.
-- **Real-time Monitoring**: Monitor CPU, memory, storage, and network usage.
-- **Database Backups**: Automate backups with support for multiple storage destinations.
-
-
 ## 🚀 Getting Started
 
 To get started run the following command in a VPS:
@@ -40,20 +41,54 @@ To get started run the following command in a VPS:
 curl -sSL https://dokploy.com/install.sh | sh
 ```
 
-Tested Systems:
 
-- Ubuntu 24.04 LTS (Noble Numbat)
-- Ubuntu 23.10 (Mantic Minotaur)
-- Ubuntu 22.04 LTS (Jammy Jellyfish)
-- Ubuntu 20.04 LTS (Focal Fossa)
-- Ubuntu 18.04 LTS (Bionic Beaver)
+## 📄 Documentation
+
+For detailed documentation, visit [docs.dokploy.com](https://docs.dokploy.com).
+
+
+## Video Tutorial
+<a href="https://youtu.be/mznYKPvhcfw">
+  <img src="https://dokploy.com/banner.webp" alt="Watch the video" width="400" style="border-radius:20px;"/>
+</a>
+
+
+## Donations
+
+If you like dokploy, and want to support the project to cover the costs of hosting, testing and development new features, you can donate to the project using the following link:
+
+Thanks to all the supporters!
+
+https://opencollective.com/dokploy
+
+
+<a href="https://opencollective.com/dokploy"><img src="https://opencollective.com/dokploy/individuals.svg?width=890"></a>
+
+
+## Contributors
+
+<a href="https://github.com/dokploy/dokploy/graphs/contributors">
+  <img src="https://contrib.rocks/image?repo=dokploy/dokploy" />
+</a>
+
+
+
+## Support OS
+
+- Ubuntu 24.04 LTS 
+- Ubuntu 23.10
+- Ubuntu 22.04 LTS 
+- Ubuntu 20.04 LTS 
+- Ubuntu 18.04 LTS
 - Debian 12
 - Debian 11
 - Fedora 40
 - Centos 9
 - Centos 8
 
-## 📄 Documentation
 
-For detailed documentation, visit [docs.dokploy.com/docs](https://docs.dokploy.com).
+
+## Explanation
+[English](README.md) | [中文](README-zh.md) | [Deutsch](README-de.md) | [Русский Язык](README-ru.md)
+
 

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

@@ -19,7 +19,7 @@ import {
 import { api } from "@/utils/api";
 import { AlertBlock } from "@/components/shared/alert-block";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
@@ -58,6 +58,7 @@ export const validateAndFormatYAML = (yamlText: string) => {
 };
 
 export const UpdateTraefikConfig = ({ applicationId }: Props) => {
+	const [open, setOpen] = useState(false);
 	const { data, refetch } = api.application.readTraefikConfig.useQuery(
 		{
 			applicationId,
@@ -81,7 +82,7 @@ export const UpdateTraefikConfig = ({ applicationId }: Props) => {
 				traefikConfig: data || "",
 			});
 		}
-	}, [form, form.reset, data]);
+	}, [data]);
 
 	const onSubmit = async (data: UpdateTraefikConfig) => {
 		const { valid, error } = validateAndFormatYAML(data.traefikConfig);
@@ -100,6 +101,8 @@ export const UpdateTraefikConfig = ({ applicationId }: Props) => {
 			.then(async () => {
 				toast.success("Traefik config Updated");
 				refetch();
+				setOpen(false);
+				form.reset();
 			})
 			.catch(() => {
 				toast.error("Error to update the traefik config");
@@ -107,7 +110,12 @@ export const UpdateTraefikConfig = ({ applicationId }: Props) => {
 	};
 
 	return (
-		<Dialog>
+		<Dialog open={open} onOpenChange={(open) => {
+			setOpen(open)
+			if (!open) {
+				form.reset();
+			}
+		}}>
 			<DialogTrigger asChild>
 				<Button isLoading={isLoading}>Modify</Button>
 			</DialogTrigger>
@@ -122,7 +130,7 @@ export const UpdateTraefikConfig = ({ applicationId }: Props) => {
 					<form
 						id="hook-form-update-traefik-config"
 						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid w-full py-4 overflow-auto"
+						className="w-full space-y-4 overflow-auto"
 					>
 						<div className="flex flex-col">
 							<FormField

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

@@ -189,7 +189,7 @@ export const AddVolumes = ({
 															/>
 															<Label
 																htmlFor="bind"
-																className="flex flex-col items-center justify-between rounded-md border-2 border-muted bg-popover p-4 hover:bg-accent hover:text-accent-foreground peer-data-[state=checked]:border-primary [&:has([data-state=checked])]:border-primary"
+																className="flex flex-col items-center justify-between rounded-md border-2 border-muted bg-popover p-4 hover:bg-accent hover:text-accent-foreground peer-data-[state=checked]:border-primary [&:has([data-state=checked])]:border-primary cursor-pointer"
 															>
 																Bind Mount
 															</Label>
@@ -209,7 +209,7 @@ export const AddVolumes = ({
 															/>
 															<Label
 																htmlFor="volume"
-																className="flex flex-col items-center justify-between rounded-md border-2 border-muted bg-popover p-4 hover:bg-accent hover:text-accent-foreground peer-data-[state=checked]:border-primary [&:has([data-state=checked])]:border-primary"
+																className="flex flex-col items-center justify-between rounded-md border-2 border-muted bg-popover p-4 hover:bg-accent hover:text-accent-foreground peer-data-[state=checked]:border-primary [&:has([data-state=checked])]:border-primary cursor-pointer"
 															>
 																Volume Mount
 															</Label>
@@ -233,7 +233,7 @@ export const AddVolumes = ({
 														/>
 														<Label
 															htmlFor="file"
-															className="flex flex-col items-center justify-between rounded-md border-2 border-muted bg-popover p-4 hover:bg-accent hover:text-accent-foreground peer-data-[state=checked]:border-primary [&:has([data-state=checked])]:border-primary"
+															className="flex flex-col items-center justify-between rounded-md border-2 border-muted bg-popover p-4 hover:bg-accent hover:text-accent-foreground peer-data-[state=checked]:border-primary [&:has([data-state=checked])]:border-primary cursor-pointer"
 														>
 															File Mount
 														</Label>

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

@@ -86,6 +86,11 @@ export const ShowDeployments = ({ applicationId }: Props) => {
 									<span className="text-sm text-muted-foreground">
 										{deployment.title}
 									</span>
+									{deployment.description && (
+										<span className="text-sm text-muted-foreground">
+											{deployment.description}
+										</span>
+									)}
 								</div>
 								<div className="flex flex-col items-end gap-2">
 									<div className="text-sm capitalize text-muted-foreground">

components/dashboard/application/domains/generate-domain.tsx

@@ -0,0 +1,79 @@
+import { Button } from "@/components/ui/button";
+import {
+	Dialog,
+	DialogContent,
+	DialogDescription,
+	DialogHeader,
+	DialogTitle,
+	DialogTrigger,
+} from "@/components/ui/dialog";
+import { RefreshCcw } from "lucide-react";
+import { GenerateTraefikMe } from "./generate-traefikme";
+import { GenerateWildCard } from "./generate-wildcard";
+import Link from "next/link";
+import { api } from "@/utils/api";
+
+interface Props {
+	applicationId: string;
+}
+
+export const GenerateDomain = ({ applicationId }: Props) => {
+	return (
+		<Dialog>
+			<DialogTrigger className="" asChild>
+				<Button variant="secondary">
+					Generate Domain
+					<RefreshCcw className="size-4  text-muted-foreground " />
+				</Button>
+			</DialogTrigger>
+			<DialogContent className="max-h-screen  overflow-y-auto sm:max-w-2xl">
+				<DialogHeader>
+					<DialogTitle>Generate Domain</DialogTitle>
+					<DialogDescription>
+						Generate Domains for your applications
+					</DialogDescription>
+				</DialogHeader>
+
+				<div className="flex flex-col gap-4 w-full">
+					<ul className="flex flex-col gap-4">
+						<li className="flex flex-row items-center gap-4">
+							<div className="flex flex-col gap-2">
+								<div className="text-base font-bold">
+									1. Generate TraefikMe Domain
+								</div>
+								<div className="text-sm text-muted-foreground">
+									This option generates a free domain provided by{" "}
+									<Link
+										href="https://traefik.me"
+										className="text-primary"
+										target="_blank"
+									>
+										TraefikMe
+									</Link>
+									. We recommend using this for quick domain testing or if you
+									don't have a domain yet.
+								</div>
+							</div>
+						</li>
+						{/* <li className="flex flex-row items-center gap-4">
+							<div className="flex flex-col gap-2">
+								<div className="text-base font-bold">
+									2. Use Wildcard Domain
+								</div>
+								<div className="text-sm text-muted-foreground">
+									To use this option, you need to set up an 'A' record in your
+									domain provider. For example, create a record for
+									*.yourdomain.com.
+								</div>
+							</div>
+						</li> */}
+					</ul>
+					<div className="flex flex-row gap-4 w-full">
+						<GenerateTraefikMe applicationId={applicationId} />
+						{/* <GenerateWildCard applicationId={applicationId} /> */}
+					</div>
+				</div>
+			</DialogContent>
+		</Dialog>
+	);
+};

components/dashboard/application/domains/generate-traefikme.tsx

@@ -0,0 +1,69 @@
+import React from "react";
+import {
+	AlertDialog,
+	AlertDialogAction,
+	AlertDialogCancel,
+	AlertDialogContent,
+	AlertDialogDescription,
+	AlertDialogFooter,
+	AlertDialogHeader,
+	AlertDialogTitle,
+	AlertDialogTrigger,
+} from "@/components/ui/alert-dialog";
+import { Button } from "@/components/ui/button";
+import { api } from "@/utils/api";
+import { RefreshCcw } from "lucide-react";
+import { toast } from "sonner";
+
+interface Props {
+	applicationId: string;
+}
+export const GenerateTraefikMe = ({ applicationId }: Props) => {
+	const { mutateAsync, isLoading } = api.domain.generateDomain.useMutation();
+	const utils = api.useUtils();
+	return (
+		<AlertDialog>
+			<AlertDialogTrigger asChild>
+				<Button variant="secondary" isLoading={isLoading}>
+					Generate Domain
+					<RefreshCcw className="size-4  text-muted-foreground " />
+				</Button>
+			</AlertDialogTrigger>
+			<AlertDialogContent>
+				<AlertDialogHeader>
+					<AlertDialogTitle>
+						Are you sure to generate a new domain?
+					</AlertDialogTitle>
+					<AlertDialogDescription>
+						This will generate a new domain and will be used to access to the
+						application
+					</AlertDialogDescription>
+				</AlertDialogHeader>
+				<AlertDialogFooter>
+					<AlertDialogCancel>Cancel</AlertDialogCancel>
+					<AlertDialogAction
+						onClick={async () => {
+							await mutateAsync({
+								applicationId,
+							})
+								.then((data) => {
+									utils.domain.byApplicationId.invalidate({
+										applicationId: applicationId,
+									});
+									utils.application.readTraefikConfig.invalidate({
+										applicationId: applicationId,
+									});
+									toast.success("Generated Domain succesfully");
+								})
+								.catch(() => {
+									toast.error("Error to generate Domain");
+								});
+						}}
+					>
+						Confirm
+					</AlertDialogAction>
+				</AlertDialogFooter>
+			</AlertDialogContent>
+		</AlertDialog>
+	);
+};

components/dashboard/application/domains/generate-wildcard.tsx

@@ -0,0 +1,69 @@
+import React from "react";
+import {
+	AlertDialog,
+	AlertDialogAction,
+	AlertDialogCancel,
+	AlertDialogContent,
+	AlertDialogDescription,
+	AlertDialogFooter,
+	AlertDialogHeader,
+	AlertDialogTitle,
+	AlertDialogTrigger,
+} from "@/components/ui/alert-dialog";
+import { Button } from "@/components/ui/button";
+import { api } from "@/utils/api";
+import { SquareAsterisk } from "lucide-react";
+import { toast } from "sonner";
+
+interface Props {
+	applicationId: string;
+}
+export const GenerateWildCard = ({ applicationId }: Props) => {
+	const { mutateAsync, isLoading } = api.domain.generateWildcard.useMutation();
+	const utils = api.useUtils();
+	return (
+		<AlertDialog>
+			<AlertDialogTrigger asChild>
+				<Button variant="secondary" isLoading={isLoading}>
+					Generate Wildcard Domain
+					<SquareAsterisk className="size-4  text-muted-foreground " />
+				</Button>
+			</AlertDialogTrigger>
+			<AlertDialogContent>
+				<AlertDialogHeader>
+					<AlertDialogTitle>
+						Are you sure to generate a new wildcard domain?
+					</AlertDialogTitle>
+					<AlertDialogDescription>
+						This will generate a new domain and will be used to access to the
+						application
+					</AlertDialogDescription>
+				</AlertDialogHeader>
+				<AlertDialogFooter>
+					<AlertDialogCancel>Cancel</AlertDialogCancel>
+					<AlertDialogAction
+						onClick={async () => {
+							await mutateAsync({
+								applicationId,
+							})
+								.then((data) => {
+									utils.domain.byApplicationId.invalidate({
+										applicationId: applicationId,
+									});
+									utils.application.readTraefikConfig.invalidate({
+										applicationId: applicationId,
+									});
+									toast.success("Generated Domain succesfully");
+								})
+								.catch((e) => {
+									toast.error(`Error to generate Domain: ${e.message}`);
+								});
+						}}
+					>
+						Confirm
+					</AlertDialogAction>
+				</AlertDialogFooter>
+			</AlertDialogContent>
+		</AlertDialog>
+	);
+};

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

@@ -6,7 +6,7 @@ import {
 	CardHeader,
 	CardTitle,
 } from "@/components/ui/card";
-import { ExternalLink, GlobeIcon } from "lucide-react";
+import { ExternalLink, GlobeIcon, RefreshCcw } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { api } from "@/utils/api";
 import { Input } from "@/components/ui/input";
@@ -14,6 +14,7 @@ import { DeleteDomain } from "./delete-domain";
 import Link from "next/link";
 import { AddDomain } from "./add-domain";
 import { UpdateDomain } from "./update-domain";
+import { GenerateDomain } from "./generate-domain";
 
 interface Props {
 	applicationId: string;
@@ -31,7 +32,7 @@ export const ShowDomains = ({ applicationId }: Props) => {
 	return (
 		<div className="flex w-full flex-col gap-5 ">
 			<Card className="bg-background">
-				<CardHeader className="flex flex-row items-center justify-between">
+				<CardHeader className="flex flex-row items-center flex-wrap gap-4 justify-between">
 					<div className="flex flex-col gap-1">
 						<CardTitle className="text-xl">Domains</CardTitle>
 						<CardDescription>
@@ -39,11 +40,16 @@ export const ShowDomains = ({ applicationId }: Props) => {
 						</CardDescription>
 					</div>
 
-					{data && data?.length > 0 && (
-						<AddDomain applicationId={applicationId}>
-							<GlobeIcon className="size-4" /> Add Domain
-						</AddDomain>
-					)}
+					<div className="flex flex-row gap-4 flex-wrap">
+						{data && data?.length > 0 && (
+							<AddDomain applicationId={applicationId}>
+								<GlobeIcon className="size-4" /> Add Domain
+							</AddDomain>
+						)}
+						{data && data?.length > 0 && (
+							<GenerateDomain applicationId={applicationId} />
+						)}
+					</div>
 				</CardHeader>
 				<CardContent className="flex w-full flex-row gap-4">
 					{data?.length === 0 ? (
@@ -53,9 +59,13 @@ export const ShowDomains = ({ applicationId }: Props) => {
 								To access to the application is required to set at least 1
 								domain
 							</span>
-							<AddDomain applicationId={applicationId}>
-								<GlobeIcon className="size-4" /> Add Domain
-							</AddDomain>
+							<div className="flex flex-row gap-4 flex-wrap">
+								<AddDomain applicationId={applicationId}>
+									<GlobeIcon className="size-4" /> Add Domain
+								</AddDomain>
+
+								<GenerateDomain applicationId={applicationId} />
+							</div>
 						</div>
 					) : (
 						<div className="flex w-full flex-col gap-4">

components/dashboard/application/environment/show.tsx

@@ -124,7 +124,7 @@ export const ShowEnvironment = ({ applicationId }: Props) => {
 						<form
 							id="hook-form"
 							onSubmit={form.handleSubmit(onSubmit)}
-							className="grid w-full gap-4 "
+							className="w-full space-y-4"
 						>
 							<FormField
 								control={form.control}

components/dashboard/application/general/deploy-application.tsx

@@ -11,7 +11,6 @@ import {
 } from "@/components/ui/alert-dialog";
 import { Button } from "@/components/ui/button";
 import { api } from "@/utils/api";
-import { useEffect, useState } from "react";
 import { toast } from "sonner";
 
 interface Props {
@@ -26,8 +25,6 @@ export const DeployApplication = ({ applicationId }: Props) => {
 		{ enabled: !!applicationId },
 	);
 
-	const { mutateAsync: markRunning } =
-		api.application.markRunning.useMutation();
 	const { mutateAsync: deploy } = api.application.deploy.useMutation();
 
 	return (
@@ -48,24 +45,16 @@ export const DeployApplication = ({ applicationId }: Props) => {
 					<AlertDialogCancel>Cancel</AlertDialogCancel>
 					<AlertDialogAction
 						onClick={async () => {
-							await markRunning({
+							toast.success("Deploying Application....");
+
+							await refetch();
+							await deploy({
 								applicationId,
-							})
-								.then(async () => {
-									toast.success("Deploying Application....");
+							}).catch(() => {
+								toast.error("Error to deploy Application");
+							});
 
-									await refetch();
-									await deploy({
-										applicationId,
-									}).catch(() => {
-										toast.error("Error to deploy Application");
-									});
-
-									await refetch();
-								})
-								.catch((e) => {
-									toast.error(e.message || "Error to deploy Application");
-								});
+							await refetch();
 						}}
 					>
 						Confirm

components/dashboard/application/general/show.tsx

@@ -10,7 +10,7 @@ import { RedbuildApplication } from "../rebuild-application";
 import { StartApplication } from "../start-application";
 import { StopApplication } from "../stop-application";
 import { DockerTerminalModal } from "../../settings/web-server/docker-terminal-modal";
-import { Terminal } from "lucide-react";
+import { CheckCircle2, Terminal } from "lucide-react";
 import { DeployApplication } from "./deploy-application";
 import { ResetApplication } from "./reset-application";
 interface Props {
@@ -55,8 +55,10 @@ export const ShowGeneralApplication = ({ applicationId }: Props) => {
 									toast.error("Error to update Auto Deploy");
 								});
 						}}
+						className="flex flex-row gap-2 items-center"
 					>
 						Autodeploy
+						{data?.autoDeploy && <CheckCircle2 className="size-4" />}
 					</Toggle>
 					<RedbuildApplication applicationId={applicationId} />
 					{data?.applicationStatus === "idle" ? (

components/dashboard/application/rebuild-application.tsx

@@ -25,8 +25,7 @@ export const RedbuildApplication = ({ applicationId }: Props) => {
 		},
 		{ enabled: !!applicationId },
 	);
-	const { mutateAsync: markRunning } =
-		api.application.markRunning.useMutation();
+
 	const { mutateAsync } = api.application.redeploy.useMutation();
 	const utils = api.useUtils();
 	return (
@@ -54,22 +53,14 @@ export const RedbuildApplication = ({ applicationId }: Props) => {
 					<AlertDialogCancel>Cancel</AlertDialogCancel>
 					<AlertDialogAction
 						onClick={async () => {
-							await markRunning({
+							toast.success("Redeploying Application....");
+							await mutateAsync({
 								applicationId,
 							})
 								.then(async () => {
-									await mutateAsync({
+									await utils.application.one.invalidate({
 										applicationId,
-									})
-										.then(async () => {
-											await utils.application.one.invalidate({
-												applicationId,
-											});
-											toast.success("Application rebuild succesfully");
-										})
-										.catch(() => {
-											toast.error("Error to rebuild the application");
-										});
+									});
 								})
 								.catch(() => {
 									toast.error("Error to rebuild the application");

components/dashboard/compose/deployments/show-deployments-compose.tsx

@@ -9,14 +9,11 @@ import {
 import { api } from "@/utils/api";
 import { RocketIcon } from "lucide-react";
 import React, { useEffect, useState } from "react";
-// import { CancelQueues } from "./cancel-queues";
-// import { ShowDeployment } from "./show-deployment-compose";
 import { StatusTooltip } from "@/components/shared/status-tooltip";
 import { DateTooltip } from "@/components/shared/date-tooltip";
 import { ShowDeploymentCompose } from "./show-deployment-compose";
 import { RefreshTokenCompose } from "./refresh-token-compose";
 import { CancelQueuesCompose } from "./cancel-queues-compose";
-// import { RefreshToken } from "./refresh-token";//
 
 interface Props {
 	composeId: string;
@@ -90,6 +87,11 @@ export const ShowDeploymentsCompose = ({ composeId }: Props) => {
 									<span className="text-sm text-muted-foreground">
 										{deployment.title}
 									</span>
+									{deployment.description && (
+										<span className="text-sm text-muted-foreground">
+											{deployment.description}
+										</span>
+									)}
 								</div>
 								<div className="flex flex-col items-end gap-2">
 									<div className="text-sm capitalize text-muted-foreground">

components/dashboard/compose/enviroment/show.tsx

@@ -124,7 +124,7 @@ export const ShowEnvironmentCompose = ({ composeId }: Props) => {
 						<form
 							id="hook-form"
 							onSubmit={form.handleSubmit(onSubmit)}
-							className="grid w-full gap-4 "
+							className="w-full space-y-4"
 						>
 							<FormField
 								control={form.control}

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

@@ -87,7 +87,7 @@ export const ComposeFileEditor = ({ composeId }: Props) => {
 				<Form {...form}>
 					<form
 						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid w-full relative gap-4"
+						className="w-full relative space-y-4"
 					>
 						<FormField
 							control={form.control}
@@ -99,8 +99,8 @@ export const ComposeFileEditor = ({ composeId }: Props) => {
 											<CodeEditor
 												// disabled
 												value={field.value}
-												className="font-mono min-h-[20rem] compose-file-editor"
-												wrapperClassName="min-h-[20rem]"
+												className="font-mono"
+												wrapperClassName="compose-file-editor"
 												placeholder={`version: '3'
 services:
     web:

components/dashboard/compose/general/deploy-compose.tsx

@@ -25,7 +25,6 @@ export const DeployCompose = ({ composeId }: Props) => {
 		{ enabled: !!composeId },
 	);
 
-	const { mutateAsync: markRunning } = api.compose.update.useMutation();
 	const { mutateAsync: deploy } = api.compose.deploy.useMutation();
 
 	return (
@@ -44,25 +43,16 @@ export const DeployCompose = ({ composeId }: Props) => {
 					<AlertDialogCancel>Cancel</AlertDialogCancel>
 					<AlertDialogAction
 						onClick={async () => {
-							await markRunning({
+							toast.success("Deploying Compose....");
+
+							await refetch();
+							await deploy({
 								composeId,
-								composeStatus: "running",
-							})
-								.then(async () => {
-									toast.success("Deploying Compose....");
+							}).catch(() => {
+								toast.error("Error to deploy Compose");
+							});
 
-									await refetch();
-									await deploy({
-										composeId,
-									}).catch(() => {
-										toast.error("Error to deploy Compose");
-									});
-
-									await refetch();
-								})
-								.catch((e) => {
-									toast.error(e.message || "Error to deploy Compose");
-								});
+							await refetch();
 						}}
 					>
 						Confirm

components/dashboard/compose/general/rebuild-compose.tsx

@@ -25,7 +25,6 @@ export const RedbuildCompose = ({ composeId }: Props) => {
 		},
 		{ enabled: !!composeId },
 	);
-	const { mutateAsync: markRunning } = api.compose.update.useMutation();
 	const { mutateAsync } = api.compose.redeploy.useMutation();
 	const utils = api.useUtils();
 	return (
@@ -53,23 +52,14 @@ export const RedbuildCompose = ({ composeId }: Props) => {
 					<AlertDialogCancel>Cancel</AlertDialogCancel>
 					<AlertDialogAction
 						onClick={async () => {
-							await markRunning({
+							toast.success("Redeploying Compose....");
+							await mutateAsync({
 								composeId,
-								composeStatus: "running",
 							})
 								.then(async () => {
-									await mutateAsync({
+									await utils.compose.one.invalidate({
 										composeId,
-									})
-										.then(async () => {
-											await utils.compose.one.invalidate({
-												composeId,
-											});
-											toast.success("Compose rebuild succesfully");
-										})
-										.catch(() => {
-											toast.error("Error to rebuild the compose");
-										});
+									});
 								})
 								.catch(() => {
 									toast.error("Error to rebuild the compose");

components/dashboard/compose/general/stop-compose.tsx

@@ -25,7 +25,6 @@ export const StopCompose = ({ composeId }: Props) => {
 		},
 		{ enabled: !!composeId },
 	);
-	const { mutateAsync: markRunning } = api.compose.update.useMutation();
 	const { mutateAsync, isLoading } = api.compose.stop.useMutation();
 	const utils = api.useUtils();
 	return (
@@ -47,26 +46,17 @@ export const StopCompose = ({ composeId }: Props) => {
 					<AlertDialogCancel>Cancel</AlertDialogCancel>
 					<AlertDialogAction
 						onClick={async () => {
-							await markRunning({
+							await mutateAsync({
 								composeId,
-								composeStatus: "running",
 							})
 								.then(async () => {
-									await mutateAsync({
+									await utils.compose.one.invalidate({
 										composeId,
-									})
-										.then(async () => {
-											await utils.compose.one.invalidate({
-												composeId,
-											});
-											toast.success("Compose rebuild succesfully");
-										})
-										.catch(() => {
-											toast.error("Error to rebuild the compose");
-										});
+									});
+									toast.success("Compose stopped succesfully");
 								})
 								.catch(() => {
-									toast.error("Error to rebuild the compose");
+									toast.error("Error to stop the compose");
 								});
 						}}
 					>

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

@@ -161,10 +161,6 @@ export const ShowContainers = () => {
 					</Table>
 				</div>
 				<div className="flex items-center justify-end space-x-2 py-4">
-					<div className="flex-1 text-sm text-muted-foreground">
-						{table.getFilteredSelectedRowModel().rows.length} of{" "}
-						{table.getFilteredRowModel().rows.length} row(s) selected.
-					</div>
 					<div className="space-x-2 flex flex-wrap">
 						<Button
 							variant="outline"

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

@@ -90,7 +90,7 @@ export const ShowTraefikFile = ({ path }: Props) => {
 			<Form {...form}>
 				<form
 					onSubmit={form.handleSubmit(onSubmit)}
-					className="grid w-full relative z-[5]"
+					className="w-full relative z-[5]"
 				>
 					<div className="flex flex-col overflow-auto">
 						<FormField

components/dashboard/mariadb/environment/show-mariadb-environment.tsx

@@ -85,7 +85,7 @@ export const ShowMariadbEnvironment = ({ mariadbId }: Props) => {
 						<form
 							id="hook-form"
 							onSubmit={form.handleSubmit(onSubmit)}
-							className="grid w-full gap-4 "
+							className="w-full space-y-4"
 						>
 							<FormField
 								control={form.control}

components/dashboard/mongo/environment/show-mongo-environment.tsx

@@ -85,7 +85,7 @@ export const ShowMongoEnvironment = ({ mongoId }: Props) => {
 						<form
 							id="hook-form"
 							onSubmit={form.handleSubmit(onSubmit)}
-							className="grid w-full gap-4 "
+							className="w-full space-y-4"
 						>
 							<FormField
 								control={form.control}

components/dashboard/monitoring/docker/show.tsx

@@ -141,7 +141,13 @@ export const DockerMonitoring = ({
 			network: data.network[data.network.length - 1] ?? currentData.network,
 			disk: data.disk[data.disk.length - 1] ?? currentData.disk,
 		});
-		setAcummulativeData(data);
+		setAcummulativeData({
+			block: data?.block || [],
+			cpu: data?.cpu || [],
+			disk: data?.disk || [],
+			memory: data?.memory || [],
+			network: data?.network || [],
+		});
 	}, [data]);
 
 	useEffect(() => {

components/dashboard/mysql/environment/show-mysql-environment.tsx

@@ -85,7 +85,7 @@ export const ShowMysqlEnvironment = ({ mysqlId }: Props) => {
 						<form
 							id="hook-form"
 							onSubmit={form.handleSubmit(onSubmit)}
-							className="grid w-full gap-4 "
+							className="w-full space-y-4"
 						>
 							<FormField
 								control={form.control}

components/dashboard/postgres/environment/show-postgres-environment.tsx

@@ -85,7 +85,7 @@ export const ShowPostgresEnvironment = ({ postgresId }: Props) => {
 						<form
 							id="hook-form"
 							onSubmit={form.handleSubmit(onSubmit)}
-							className="grid w-full gap-4 "
+							className="w-full space-y-4"
 						>
 							<FormField
 								control={form.control}

components/dashboard/project/add-template.tsx

@@ -54,7 +54,7 @@ export const AddTemplate = ({ projectId }: Props) => {
 				</DropdownMenuItem>
 			</DialogTrigger>
 			<DialogContent className="max-h-screen  overflow-y-auto sm:max-w-7xl p-0">
-				<div className="sticky top-0 z-10 flex flex-col gap-4 bg-black p-6 border-b">
+				<div className="sticky top-0 z-10 flex flex-col gap-4 bg-background p-6 border-b">
 					<DialogHeader>
 						<DialogTitle>Create Template</DialogTitle>
 						<DialogDescription>

components/dashboard/projects/show.tsx

@@ -76,8 +76,8 @@ export const ShowProjects = () => {
 						project?.compose.length;
 					return (
 						<div key={project.projectId} className="w-full lg:max-w-md">
-							<Card className="group relative w-full  bg-transparent transition-colors hover:bg-card">
-								<Link href={`/dashboard/project/${project.projectId}`}>
+							<Link href={`/dashboard/project/${project.projectId}`}>
+								<Card className="group relative w-full  bg-transparent transition-colors hover:bg-card">
 									<Button
 										className="absolute -right-3 -top-3 size-9 translate-y-1 rounded-full p-0 opacity-0 transition-all duration-200 group-hover:translate-y-0 group-hover:opacity-100"
 										size="sm"
@@ -85,113 +85,122 @@ export const ShowProjects = () => {
 									>
 										<ExternalLinkIcon className="size-3.5" />
 									</Button>
-								</Link>
-								<CardHeader>
-									<CardTitle className="flex items-center justify-between gap-2">
-										<span className="flex flex-col gap-1.5">
-											<div className="flex items-center gap-2">
-												<BookIcon className="size-4 text-muted-foreground" />
-												<Link
-													className="text-base font-medium leading-none"
-													href={`/dashboard/project/${project.projectId}`}
-												>
-													{project.name}
-												</Link>
-											</div>
+									<CardHeader>
+										<CardTitle className="flex items-center justify-between gap-2">
+											<span className="flex flex-col gap-1.5">
+												<div className="flex items-center gap-2">
+													<BookIcon className="size-4 text-muted-foreground" />
+													<span className="text-base font-medium leading-none">
+														{project.name}
+													</span>
+												</div>
 
-											<span className="text-sm font-medium text-muted-foreground">
-												{project.description}
+												<span className="text-sm font-medium text-muted-foreground">
+													{project.description}
+												</span>
 											</span>
-										</span>
-										<div className="flex self-start space-x-1">
-											<DropdownMenu>
-												<DropdownMenuTrigger asChild>
-													<Button variant="ghost" size="icon" className="px-2">
-														<MoreHorizontalIcon className="size-5" />
-													</Button>
-												</DropdownMenuTrigger>
-												<DropdownMenuContent className="w-[200px] space-y-2">
-													<DropdownMenuLabel className="font-normal">
-														Actions
-													</DropdownMenuLabel>
+											<div className="flex self-start space-x-1">
+												<DropdownMenu>
+													<DropdownMenuTrigger asChild>
+														<Button
+															variant="ghost"
+															size="icon"
+															className="px-2"
+														>
+															<MoreHorizontalIcon className="size-5" />
+														</Button>
+													</DropdownMenuTrigger>
+													<DropdownMenuContent className="w-[200px] space-y-2">
+														<DropdownMenuLabel className="font-normal">
+															Actions
+														</DropdownMenuLabel>
 
-													<UpdateProject projectId={project.projectId} />
+														<div onClick={(e) => e.stopPropagation()}>
+															<UpdateProject projectId={project.projectId} />
+														</div>
 
-													{(auth?.rol === "admin" ||
-														user?.canDeleteProjects) && (
-														<AlertDialog>
-															<AlertDialogTrigger className="w-full">
-																<DropdownMenuItem
-																	className="w-full cursor-pointer  space-x-3"
-																	onSelect={(e) => e.preventDefault()}
-																>
-																	<TrashIcon className="size-4" />
-																	<span>Delete</span>
-																</DropdownMenuItem>
-															</AlertDialogTrigger>
-															<AlertDialogContent>
-																<AlertDialogHeader>
-																	<AlertDialogTitle>
-																		Are you sure to delete this project?
-																	</AlertDialogTitle>
-																	{!emptyServices ? (
-																		<div className="flex flex-row gap-4 rounded-lg bg-yellow-50 p-2 dark:bg-yellow-950">
-																			<AlertTriangle className="text-yellow-600 dark:text-yellow-400" />
-																			<span className="text-sm text-yellow-600 dark:text-yellow-400">
-																				You have active services, please delete
-																				them first
-																			</span>
-																		</div>
-																	) : (
-																		<AlertDialogDescription>
-																			This action cannot be undone
-																		</AlertDialogDescription>
-																	)}
-																</AlertDialogHeader>
-																<AlertDialogFooter>
-																	<AlertDialogCancel>Cancel</AlertDialogCancel>
-																	<AlertDialogAction
-																		disabled={!emptyServices}
-																		onClick={async () => {
-																			await mutateAsync({
-																				projectId: project.projectId,
-																			})
-																				.then(() => {
-																					toast.success(
-																						"Project delete succesfully",
-																					);
-																				})
-																				.catch(() => {
-																					toast.error(
-																						"Error to delete this project",
-																					);
-																				})
-																				.finally(() => {
-																					utils.project.all.invalidate();
-																				});
-																		}}
-																	>
-																		Delete
-																	</AlertDialogAction>
-																</AlertDialogFooter>
-															</AlertDialogContent>
-														</AlertDialog>
-													)}
-												</DropdownMenuContent>
-											</DropdownMenu>
+														<div onClick={(e) => e.stopPropagation()}>
+															{(auth?.rol === "admin" ||
+																user?.canDeleteProjects) && (
+																<AlertDialog>
+																	<AlertDialogTrigger className="w-full">
+																		<DropdownMenuItem
+																			className="w-full cursor-pointer  space-x-3"
+																			onSelect={(e) => e.preventDefault()}
+																		>
+																			<TrashIcon className="size-4" />
+																			<span>Delete</span>
+																		</DropdownMenuItem>
+																	</AlertDialogTrigger>
+																	<AlertDialogContent>
+																		<AlertDialogHeader>
+																			<AlertDialogTitle>
+																				Are you sure to delete this project?
+																			</AlertDialogTitle>
+																			{!emptyServices ? (
+																				<div className="flex flex-row gap-4 rounded-lg bg-yellow-50 p-2 dark:bg-yellow-950">
+																					<AlertTriangle className="text-yellow-600 dark:text-yellow-400" />
+																					<span className="text-sm text-yellow-600 dark:text-yellow-400">
+																						You have active services, please
+																						delete them first
+																					</span>
+																				</div>
+																			) : (
+																				<AlertDialogDescription>
+																					This action cannot be undone
+																				</AlertDialogDescription>
+																			)}
+																		</AlertDialogHeader>
+																		<AlertDialogFooter>
+																			<AlertDialogCancel>
+																				Cancel
+																			</AlertDialogCancel>
+																			<AlertDialogAction
+																				disabled={!emptyServices}
+																				onClick={async () => {
+																					await mutateAsync({
+																						projectId: project.projectId,
+																					})
+																						.then(() => {
+																							toast.success(
+																								"Project delete succesfully",
+																							);
+																						})
+																						.catch(() => {
+																							toast.error(
+																								"Error to delete this project",
+																							);
+																						})
+																						.finally(() => {
+																							utils.project.all.invalidate();
+																						});
+																				}}
+																			>
+																				Delete
+																			</AlertDialogAction>
+																		</AlertDialogFooter>
+																	</AlertDialogContent>
+																</AlertDialog>
+															)}
+														</div>
+													</DropdownMenuContent>
+												</DropdownMenu>
+											</div>
+										</CardTitle>
+									</CardHeader>
+									<CardFooter className="pt-4">
+										<div className="space-y-1 text-sm flex flex-row justify-between max-sm:flex-wrap w-full gap-2 sm:gap-4">
+											<DateTooltip date={project.createdAt}>
+												Created
+											</DateTooltip>
+											<span>
+												{totalServices}{" "}
+												{totalServices === 1 ? "service" : "services"}
+											</span>
 										</div>
-									</CardTitle>
-								</CardHeader>
-								<CardFooter className="pt-4">
-									<div className="space-y-1 text-sm flex flex-row justify-between max-sm:flex-wrap w-full gap-2 sm:gap-4">
-										<DateTooltip date={project.createdAt}>Created</DateTooltip>
-										<span>
-											{totalServices}{" "}
-											{totalServices === 1 ? "service" : "services"}
-										</span>
-									</div>
-								</CardFooter>
-							</Card>
+									</CardFooter>
+								</Card>
+							</Link>
 						</div>
 					);
 				})}

components/dashboard/redis/environment/show-redis-environment.tsx

@@ -85,7 +85,7 @@ export const ShowRedisEnvironment = ({ redisId }: Props) => {
 						<form
 							id="hook-form"
 							onSubmit={form.handleSubmit(onSubmit)}
-							className="grid w-full gap-4 "
+							className="w-full space-y-4"
 						>
 							<FormField
 								control={form.control}

components/dashboard/settings/github/github-setup.tsx

@@ -48,6 +48,7 @@ export const GithubSetup = () => {
 	const [organizationName, setOrganization] = useState<string>("");
 	const { data } = api.admin.one.useQuery();
 	useEffect(() => {
+		const url = document.location.origin;
 		const manifest = JSON.stringify(
 			{
 				redirect_url: `${origin}/api/redirect?authId=${data?.authId}`,
@@ -55,7 +56,7 @@ export const GithubSetup = () => {
 				url: origin,
 				hook_attributes: {
 					// JUST FOR TESTING
-					url: "https://webhook.site/b6a167c0-ceb5-4f0c-a257-97c0fd163977",
+					url: `${url}/api/deploy/github`,
 					// url: `${origin}/api/webhook`, // Aquí especificas la URL del endpoint de tu webhook
 				},
 				callback_urls: [`${origin}/api/redirect`], // Los URLs de callback para procesos de autenticación
@@ -92,8 +93,18 @@ export const GithubSetup = () => {
 							</span>
 							<BadgeCheck className="size-4 text-green-700" />
 						</div>
-						<div className="flex items-end">
+						<div className="flex items-end gap-4 flex-wrap">
 							<RemoveGithubApp />
+							{/* <Link
+								href={`https://github.com/settings/apps/${data?.githubAppName}`}
+								target="_blank"
+								className={buttonVariants({
+									className: "w-fit",
+									variant: "secondary",
+								})}
+							>
+								<span className="text-sm">Manage Github App</span>
+							</Link> */}
 						</div>
 					</div>
 				) : (

components/dashboard/settings/github/remove-github-app.tsx

@@ -13,6 +13,13 @@ import {
 } from "@/components/ui/alert-dialog";
 import { Button } from "@/components/ui/button";
 import { toast } from "sonner";
+import {
+	Tooltip,
+	TooltipContent,
+	TooltipTrigger,
+	TooltipProvider,
+} from "@/components/ui/tooltip";
+import { InfoIcon } from "lucide-react";
 
 export const RemoveGithubApp = () => {
 	const { refetch } = api.auth.get.useQuery();
@@ -22,7 +29,20 @@ export const RemoveGithubApp = () => {
 	return (
 		<AlertDialog>
 			<AlertDialogTrigger asChild>
-				<Button variant="destructive">Remove Current Github App</Button>
+				<Button variant="destructive">
+					Remove Current Github App
+					<TooltipProvider delayDuration={0}>
+						<Tooltip>
+							<TooltipTrigger asChild>
+								<InfoIcon className="size-4 fill-muted-destructive text-muted-destructive" />
+							</TooltipTrigger>
+							<TooltipContent>
+								We recommend deleting the GitHub app first, and then removing
+								the current one from here.
+							</TooltipContent>
+						</Tooltip>
+					</TooltipProvider>
+				</Button>
 			</AlertDialogTrigger>
 			<AlertDialogContent>
 				<AlertDialogHeader>

components/dashboard/settings/profile/generate-token.tsx

@@ -0,0 +1,73 @@
+import { Button } from "@/components/ui/button";
+import {
+	Card,
+	CardContent,
+	CardDescription,
+	CardHeader,
+	CardTitle,
+} from "@/components/ui/card";
+import { api } from "@/utils/api";
+import { toast } from "sonner";
+import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
+import { Label } from "@/components/ui/label";
+import Link from "next/link";
+import { ExternalLinkIcon } from "lucide-react";
+
+export const GenerateToken = () => {
+	const { data, refetch } = api.auth.get.useQuery();
+
+	const { mutateAsync: generateToken, isLoading: isLoadingToken } =
+		api.auth.generateToken.useMutation();
+
+	return (
+		<Card className="bg-transparent">
+			<CardHeader className="flex flex-row gap-2 flex-wrap justify-between items-center">
+				<div>
+					<CardTitle className="text-xl">API/CLI</CardTitle>
+					<CardDescription>
+						Generate a token 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-2">
+				<div className="flex flex-row gap-2 max-sm:flex-wrap justify-end items-end">
+					<div className="grid w-full gap-8">
+						<div className="flex flex-col gap-2">
+							<Label>Token</Label>
+							<ToggleVisibilityInput
+								placeholder="Token"
+								value={data?.token || ""}
+								disabled
+							/>
+						</div>
+					</div>
+					<Button
+						type="button"
+						isLoading={isLoadingToken}
+						onClick={async () => {
+							await generateToken().then(() => {
+								refetch();
+								toast.success("Token generated");
+							});
+						}}
+					>
+						Generate
+					</Button>
+				</div>
+			</CardContent>
+		</Card>
+	);
+};

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

@@ -51,6 +51,9 @@ const randomImages = [
 export const ProfileForm = () => {
 	const { data, refetch } = api.auth.get.useQuery();
 	const { mutateAsync, isLoading } = api.auth.update.useMutation();
+
+	const { mutateAsync: generateToken, isLoading: isLoadingToken } =
+		api.auth.generateToken.useMutation();
 	const form = useForm<Profile>({
 		defaultValues: {
 			email: data?.email || "",

components/dashboard/settings/show.tsx

@@ -32,7 +32,6 @@ export const ShowSettings = () => {
 					<ShowCertificates />
 					<WebDomain />
 					<WebServer />
-
 					<ShowUsers />
 				</>
 			)}

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

@@ -38,6 +38,7 @@ const addPermissions = z.object({
 	canDeleteServices: z.boolean().optional().default(false),
 	canAccessToTraefikFiles: z.boolean().optional().default(false),
 	canAccessToDocker: z.boolean().optional().default(false),
+	canAccessToAPI: z.boolean().optional().default(false),
 });
 
 type AddPermissions = z.infer<typeof addPermissions>;
@@ -80,6 +81,7 @@ export const AddUserPermissions = ({ userId }: Props) => {
 				canDeleteServices: data.canDeleteServices,
 				canAccessToTraefikFiles: data.canAccessToTraefikFiles,
 				canAccessToDocker: data.canAccessToDocker,
+				canAccessToAPI: data.canAccessToAPI,
 			});
 		}
 	}, [form, form.formState.isSubmitSuccessful, form.reset, data]);
@@ -95,6 +97,7 @@ export const AddUserPermissions = ({ userId }: Props) => {
 			accesedProjects: data.accesedProjects || [],
 			accesedServices: data.accesedServices || [],
 			canAccessToDocker: data.canAccessToDocker,
+			canAccessToAPI: data.canAccessToAPI,
 		})
 			.then(async () => {
 				toast.success("Permissions updated");
@@ -247,6 +250,26 @@ export const AddUserPermissions = ({ userId }: Props) => {
 								</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="accesedProjects"

components/dashboard/settings/web-server.tsx

@@ -194,7 +194,7 @@ export const WebServer = () => {
 								Space
 							</Button>
 						</DropdownMenuTrigger>
-						<DropdownMenuContent className="w-56" align="start">
+						<DropdownMenuContent className="w-64" align="start">
 							<DropdownMenuLabel>Actions</DropdownMenuLabel>
 							<DropdownMenuSeparator />
 							<DropdownMenuGroup>

components/dashboard/settings/web-server/show-main-traefik-config.tsx

@@ -95,7 +95,7 @@ export const ShowMainTraefikConfig = ({ children }: Props) => {
 					<form
 						id="hook-form-update-main-traefik-config"
 						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid w-full py-4 relative"
+						className="w-full space-y-4 relative"
 					>
 						<div className="flex flex-col">
 							<FormField

components/dashboard/settings/web-server/show-server-middleware-config.tsx

@@ -98,7 +98,7 @@ export const ShowServerMiddlewareConfig = ({ children }: Props) => {
 					<form
 						id="hook-form-update-server-traefik-config"
 						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid w-full py-4 relative overflow-auto"
+						className="w-full space-y-4 relative overflow-auto"
 					>
 						<div className="flex flex-col">
 							<FormField

components/dashboard/settings/web-server/show-server-traefik-config.tsx

@@ -98,7 +98,7 @@ export const ShowServerTraefikConfig = ({ children }: Props) => {
 					<form
 						id="hook-form-update-server-traefik-config"
 						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid w-full py-4 relative overflow-auto"
+						className="w-full space-y-4 relative overflow-auto"
 					>
 						<div className="flex flex-col">
 							<FormField

components/shared/code-editor.tsx

@@ -46,7 +46,7 @@ export const CodeEditor = ({
 				)}
 			/>
 			{props.disabled && (
-				<div className="absolute top-0 left-0 w-full h-full  flex items-center justify-center z-[10] [background:var(--overlay)]" />
+				<div className="absolute top-0 rounded-md left-0 w-full h-full  flex items-center justify-center z-[10] [background:var(--overlay)]" />
 			)}
 		</div>
 	);

components/ui/dialog.tsx

@@ -36,12 +36,14 @@ const DialogContent = React.forwardRef<
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
+        "fixed left-[50%] top-[50%] z-50 w-full max-w-lg translate-x-[-50%] translate-y-[-50%] border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
         className,
       )}
       {...props}
     >
-      {children}
+      <div className="space-y-4 w-full">
+        {children}
+      </div>
       <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
         <X className="h-4 w-4" />
         <span className="sr-only">Close</span>

drizzle/0015_fearless_callisto.sql

@@ -0,0 +1 @@
+ALTER TABLE "auth" ADD COLUMN "token" text;

drizzle/0016_chunky_leopardon.sql

@@ -0,0 +1 @@
+ALTER TABLE "user" ADD COLUMN "canAccessToAPI" boolean DEFAULT false NOT NULL;

drizzle/0017_minor_post.sql

@@ -0,0 +1 @@
+ALTER TABLE "deployment" ADD COLUMN "description" text;

drizzle/0018_careful_killmonger.sql

@@ -0,0 +1 @@
+ALTER TABLE "admin" ADD COLUMN "githubWebhookSecret" text;

drizzle/meta/_journal.json

@@ -106,6 +106,34 @@
       "when": 1716715367982,
       "tag": "0014_same_hammerhead",
       "breakpoints": true
+    },
+    {
+      "idx": 15,
+      "version": "6",
+      "when": 1717564517104,
+      "tag": "0015_fearless_callisto",
+      "breakpoints": true
+    },
+    {
+      "idx": 16,
+      "version": "6",
+      "when": 1719109196484,
+      "tag": "0016_chunky_leopardon",
+      "breakpoints": true
+    },
+    {
+      "idx": 17,
+      "version": "6",
+      "when": 1719547174326,
+      "tag": "0017_minor_post",
+      "breakpoints": true
+    },
+    {
+      "idx": 18,
+      "version": "6",
+      "when": 1719928377858,
+      "tag": "0018_careful_killmonger",
+      "breakpoints": true
     }
   ]
 }

package.json

@@ -1,8 +1,8 @@
 {
   "name": "dokploy",
-  "version": "v0.2.2",
+  "version": "v0.3.1",
   "private": true,
-  "license": "AGPL-3.0-only",
+  "license": "Apache-2.0",
   "type": "module",
   "scripts": {
     "build": "npm run build-server && npm run build-next",
@@ -19,7 +19,7 @@
     "migration:drop": "drizzle-kit drop --config ./server/db/drizzle.config.ts",
     "db:push": "drizzle-kit --config ./server/db/drizzle.config.ts",
     "db:truncate": "tsx -r dotenv/config ./server/db/reset.ts",
-    "db:studio": "drizzle-kit studio",
+    "db:studio": "drizzle-kit studio --config ./server/db/drizzle.config.ts",
     "lint": "biome lint",
     "db:seed": "tsx -r dotenv/config ./server/db/seed.ts",
     "db:clean": "tsx -r dotenv/config ./server/db/reset.ts",
@@ -36,10 +36,12 @@
     "@codemirror/lang-yaml": "^6.1.1",
     "@codemirror/language": "^6.10.1",
     "@codemirror/legacy-modes": "6.4.0",
+    "@dokploy/trpc-openapi": "0.0.4",
     "@faker-js/faker": "^8.4.1",
     "@hookform/resolvers": "^3.3.4",
     "@lucia-auth/adapter-drizzle": "1.0.7",
     "@octokit/auth-app": "^6.0.4",
+    "@octokit/webhooks": "^13.2.7",
     "@radix-ui/react-accordion": "1.1.2",
     "@radix-ui/react-alert-dialog": "^1.0.5",
     "@radix-ui/react-avatar": "^1.0.4",
@@ -109,6 +111,7 @@
     "slugify": "^1.6.6",
     "sonner": "^1.4.0",
     "superjson": "^2.2.1",
+    "swagger-ui-react": "^5.17.14",
     "tailwind-merge": "^2.2.0",
     "tailwindcss-animate": "^1.0.7",
     "tar-fs": "3.0.5",
@@ -129,6 +132,7 @@
     "@types/qrcode": "^1.5.5",
     "@types/react": "^18.2.37",
     "@types/react-dom": "^18.2.15",
+    "@types/swagger-ui-react": "^4.18.3",
     "@types/tar-fs": "2.0.4",
     "@types/ws": "8.5.10",
     "autoprefixer": "^10.4.14",

pages/api/[...trpc].ts

@@ -0,0 +1,29 @@
+import type { NextApiRequest, NextApiResponse } from "next";
+import { createOpenApiNextHandler } from "@dokploy/trpc-openapi";
+import { appRouter } from "@/server/api/root";
+import { createTRPCContext } from "@/server/api/trpc";
+import { validateBearerToken } from "@/server/auth/token";
+import { validateRequest } from "@/server/auth/auth";
+
+const handler = async (req: NextApiRequest, res: NextApiResponse) => {
+	let { session, user } = await validateBearerToken(req);
+
+	if (!session) {
+		const cookieResult = await validateRequest(req, res);
+		session = cookieResult.session;
+		user = cookieResult.user;
+	}
+
+	if (!user || !session) {
+		res.status(401).json({ message: "Unauthorized" });
+		return;
+	}
+
+	// @ts-ignore
+	return createOpenApiNextHandler({
+		router: appRouter,
+		createContext: createTRPCContext,
+	})(req, res);
+};
+
+export default handler;

pages/api/deploy/[refreshToken].ts

@@ -1,4 +1,3 @@
-import { updateApplicationStatus } from "@/server/api/services/application";
 import { db } from "@/server/db";
 import { applications } from "@/server/db/schema";
 import type { DeploymentJob } from "@/server/queues/deployments-queue";
@@ -33,6 +32,7 @@ export default async function handler(
 		}
 
 		const deploymentTitle = extractCommitMessage(req.headers, req.body);
+		const deploymentHash = extractHash(req.headers, req.body);
 
 		const sourceType = application.sourceType;
 
@@ -67,14 +67,10 @@ export default async function handler(
 		}
 
 		try {
-			await updateApplicationStatus(
-				application.applicationId as string,
-				"running",
-			);
-
 			const jobData: DeploymentJob = {
 				applicationId: application.applicationId as string,
 				titleLog: deploymentTitle,
+				descriptionLog: `Hash: ${deploymentHash}`,
 				type: "deploy",
 				applicationType: "application",
 			};
@@ -166,6 +162,37 @@ export const extractCommitMessage = (headers: any, body: any) => {
 	return "NEW CHANGES";
 };
 
+export const extractHash = (headers: any, body: any) => {
+	// GitHub
+	if (headers["x-github-event"]) {
+		return body.head_commit ? body.head_commit.id : "";
+	}
+
+	// GitLab
+	if (headers["x-gitlab-event"]) {
+		return (
+			body.checkout_sha ||
+			(body.commits && body.commits.length > 0
+				? body.commits[0].id
+				: "NEW COMMIT")
+		);
+	}
+
+	// Bitbucket
+	if (headers["x-event-key"]?.includes("repo:push")) {
+		return body.push.changes && body.push.changes.length > 0
+			? body.push.changes[0].new.target.hash
+			: "NEW COMMIT";
+	}
+
+	// Gitea
+	if (headers["x-gitea-event"]) {
+		return body.after || "NEW COMMIT";
+	}
+
+	return "";
+};
+
 export const extractBranchName = (headers: any, body: any) => {
 	if (headers["x-github-event"] || headers["x-gitea-event"]) {
 		return body?.ref?.replace("refs/heads/", "");

pages/api/deploy/compose/[refreshToken].ts

@@ -4,8 +4,11 @@ import type { DeploymentJob } from "@/server/queues/deployments-queue";
 import { myQueue } from "@/server/queues/queueSetup";
 import { eq } from "drizzle-orm";
 import type { NextApiRequest, NextApiResponse } from "next";
-import { extractBranchName, extractCommitMessage } from "../[refreshToken]";
-import { updateCompose } from "@/server/api/services/compose";
+import {
+	extractBranchName,
+	extractCommitMessage,
+	extractHash,
+} from "../[refreshToken]";
 
 export default async function handler(
 	req: NextApiRequest,
@@ -34,7 +37,7 @@ export default async function handler(
 		}
 
 		const deploymentTitle = extractCommitMessage(req.headers, req.body);
-
+		const deploymentHash = extractHash(req.headers, req.body);
 		const sourceType = composeResult.sourceType;
 
 		if (sourceType === "github") {
@@ -52,15 +55,12 @@ export default async function handler(
 		}
 
 		try {
-			await updateCompose(composeResult.composeId, {
-				composeStatus: "running",
-			});
-
 			const jobData: DeploymentJob = {
 				composeId: composeResult.composeId as string,
 				titleLog: deploymentTitle,
 				type: "deploy",
 				applicationType: "compose",
+				descriptionLog: `Hash: ${deploymentHash}`,
 			};
 			await myQueue.add(
 				"deployments",

pages/api/deploy/github.ts

@@ -0,0 +1,126 @@
+import { and, eq } from "drizzle-orm";
+import { db } from "@/server/db";
+import { Webhooks } from "@octokit/webhooks";
+import type { NextApiRequest, NextApiResponse } from "next";
+import { applications, compose } from "@/server/db/schema";
+import { extractCommitMessage, extractHash } from "./[refreshToken]";
+import type { DeploymentJob } from "@/server/queues/deployments-queue";
+import { myQueue } from "@/server/queues/queueSetup";
+import { findAdmin } from "@/server/api/services/admin";
+
+export default async function handler(
+	req: NextApiRequest,
+	res: NextApiResponse,
+) {
+	const admin = await findAdmin();
+
+	if (!admin) {
+		res.status(200).json({ message: "Could not find admin" });
+		return;
+	}
+
+	if (!admin.githubWebhookSecret) {
+		res.status(200).json({ message: "Github Webhook Secret not set" });
+		return;
+	}
+
+	const webhooks = new Webhooks({
+		secret: admin.githubWebhookSecret,
+	});
+
+	const signature = req.headers["x-hub-signature-256"];
+	const github = req.body;
+
+	const verified = await webhooks.verify(
+		JSON.stringify(github),
+		signature as string,
+	);
+
+	if (!verified) {
+		res.status(401).json({ message: "Unauthorized" });
+		return;
+	}
+
+	if (req.headers["x-github-event"] === "ping") {
+		res.status(200).json({ message: "Ping received, webhook is active" });
+		return;
+	}
+
+	if (req.headers["x-github-event"] !== "push") {
+		res.status(400).json({ message: "We only accept push events" });
+		return;
+	}
+
+	try {
+		const branchName = github?.ref?.replace("refs/heads/", "");
+		const repository = github?.repository?.name;
+		const deploymentTitle = extractCommitMessage(req.headers, req.body);
+		const deploymentHash = extractHash(req.headers, req.body);
+
+		const apps = await db.query.applications.findMany({
+			where: and(
+				eq(applications.sourceType, "github"),
+				eq(applications.autoDeploy, true),
+				eq(applications.branch, branchName),
+				eq(applications.repository, repository),
+			),
+		});
+
+		for (const app of apps) {
+			const jobData: DeploymentJob = {
+				applicationId: app.applicationId as string,
+				titleLog: deploymentTitle,
+				descriptionLog: `Hash: ${deploymentHash}`,
+				type: "deploy",
+				applicationType: "application",
+			};
+			await myQueue.add(
+				"deployments",
+				{ ...jobData },
+				{
+					removeOnComplete: true,
+					removeOnFail: true,
+				},
+			);
+		}
+
+		const composeApps = await db.query.compose.findMany({
+			where: and(
+				eq(compose.sourceType, "github"),
+				eq(compose.autoDeploy, true),
+				eq(compose.branch, branchName),
+				eq(compose.repository, repository),
+			),
+		});
+
+		for (const composeApp of composeApps) {
+			const jobData: DeploymentJob = {
+				composeId: composeApp.composeId as string,
+				titleLog: deploymentTitle,
+				type: "deploy",
+				applicationType: "compose",
+				descriptionLog: `Hash: ${deploymentHash}`,
+			};
+
+			await myQueue.add(
+				"deployments",
+				{ ...jobData },
+				{
+					removeOnComplete: true,
+					removeOnFail: true,
+				},
+			);
+		}
+
+		const totalApps = apps.length + composeApps.length;
+		const emptyApps = totalApps === 0;
+
+		if (emptyApps) {
+			res.status(200).json({ message: "No apps to deploy" });
+			return;
+		}
+		res.status(200).json({ message: `Deployed ${totalApps} apps` });
+	} catch (error) {
+		res.status(400).json({ message: "Error To Deploy Application", error });
+	}
+}

pages/api/redirect.ts

@@ -38,6 +38,7 @@ export default async function handler(
 				githubAppName: data.name,
 				githubClientId: data.client_id,
 				githubClientSecret: data.client_secret,
+				githubWebhookSecret: data.webhook_secret,
 				githubPrivateKey: data.pem,
 			})
 			.where(eq(admins.authId, authId as string))

pages/api/trpc/[trpc].ts

@@ -5,14 +5,14 @@ import { createTRPCContext } from "@/server/api/trpc";
 
 // export API handler
 export default createNextApiHandler({
-  router: appRouter,
-  createContext: createTRPCContext,
-  onError:
-    process.env.NODE_ENV === "development"
-      ? ({ path, error }) => {
-          console.error(
-            `❌ tRPC failed on ${path ?? "<no-path>"}: ${error.message}`,
-          );
-        }
-      : undefined,
+	router: appRouter,
+	createContext: createTRPCContext,
+	onError:
+		process.env.NODE_ENV === "development"
+			? ({ path, error }) => {
+					console.error(
+						`❌ tRPC failed on ${path ?? "<no-path>"}: ${error.message}`,
+					);
+				}
+			: undefined,
 });

pages/dashboard/settings/profile.tsx

@@ -1,14 +1,26 @@
+import { GenerateToken } from "@/components/dashboard/settings/profile/generate-token";
 import { ProfileForm } from "@/components/dashboard/settings/profile/profile-form";
 import { DashboardLayout } from "@/components/layouts/dashboard-layout";
 import { SettingsLayout } from "@/components/layouts/settings-layout";
 import { validateRequest } from "@/server/auth/auth";
+import { api } from "@/utils/api";
 import type { GetServerSidePropsContext } from "next";
 import React, { type ReactElement } from "react";
 
 const Page = () => {
+	const { data } = api.auth.get.useQuery();
+	const { data: user } = api.user.byAuthId.useQuery(
+		{
+			authId: data?.id || "",
+		},
+		{
+			enabled: !!data?.id && data?.rol === "user",
+		},
+	);
 	return (
 		<div className="flex flex-col gap-4 w-full">
 			<ProfileForm />
+			{(user?.canAccessToAPI || data?.rol === "admin") && <GenerateToken />}
 		</div>
 	);
 };

pages/swagger.tsx

@@ -0,0 +1,80 @@
+import { appRouter } from "@/server/api/root";
+import { validateRequest } from "@/server/auth/auth";
+import { api } from "@/utils/api";
+import { createServerSideHelpers } from "@trpc/react-query/server";
+import type { GetServerSidePropsContext, NextPage } from "next";
+import dynamic from "next/dynamic";
+import "swagger-ui-react/swagger-ui.css";
+import superjson from "superjson";
+import { useEffect, useState } from "react";
+
+const SwaggerUI = dynamic(() => import("swagger-ui-react"), { ssr: false });
+
+const Home: NextPage = () => {
+	const { data } = api.settings.getOpenApiDocument.useQuery();
+	const [spec, setSpec] = useState({});
+
+	useEffect(() => {
+		// Esto solo se ejecutará en el cliente
+		if (data) {
+			const protocolAndHost = `${window.location.protocol}//${window.location.host}/api`;
+			const newSpec = {
+				...data,
+				servers: [{ url: protocolAndHost }],
+				externalDocs: {
+					url: `${protocolAndHost}/settings.getOpenApiDocument`,
+				},
+			};
+			setSpec(newSpec);
+		}
+	}, [data]);
+
+	return (
+		<div className="h-screen bg-white">
+			<SwaggerUI spec={spec} />
+		</div>
+	);
+};
+
+export default Home;
+export async function getServerSideProps(context: GetServerSidePropsContext) {
+	const { req, res } = context;
+	const { user, session } = await validateRequest(context.req, context.res);
+	if (!user) {
+		return {
+			redirect: {
+				permanent: true,
+				destination: "/",
+			},
+		};
+	}
+	const helpers = createServerSideHelpers({
+		router: appRouter,
+		ctx: {
+			req: req as any,
+			res: res as any,
+			db: null as any,
+			session: session,
+			user: user,
+		},
+		transformer: superjson,
+	});
+	if (user.rol === "user") {
+		const result = await helpers.user.byAuthId.fetch({
+			authId: user.id,
+		});
+
+		if (!result.canAccessToAPI) {
+			return {
+				redirect: {
+					permanent: true,
+					destination: "/",
+				},
+			};
+		}
+	}
+
+	return {
+		props: {},
+	};
+}

public/templates/grafana.svg

@@ -0,0 +1,70 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 142.5 145.6" style="enable-background:new 0 0 142.5 145.6;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#565656;}
+	.st1{fill:url(#SVGID_1_);}
+</style>
+<g>
+	<path class="st0" d="M28.7,131.5c-0.3,7.9-6.6,14.1-14.4,14.1C6.1,145.6,0,139,0,130.9s6.6-14.7,14.7-14.7c3.6,0,7.2,1.6,10.2,4.4
+		l-2.3,2.9c-2.3-2-5.1-3.4-7.9-3.4c-5.9,0-10.8,4.8-10.8,10.8c0,6.1,4.6,10.8,10.4,10.8c5.2,0,9.3-3.8,10.2-8.8H12.6v-3.5h16.1
+		V131.5z"/>
+	<path class="st0" d="M42.3,129.5h-2.2c-2.4,0-4.4,2-4.4,4.4v11.4h-3.9v-19.6H35v1.6c1.1-1.1,2.7-1.6,4.6-1.6h4.2L42.3,129.5z"/>
+	<path class="st0" d="M63.7,145.3h-3.4v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
+		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4V145.3z M59.7,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
+		C57.1,141.2,59.1,139.3,59.7,137z"/>
+	<path class="st0" d="M71.5,124.7v1.1h6.2v3.4h-6.2v16.1h-3.8v-20.5c0-4.3,3.1-6.8,7-6.8h4.7l-1.6,3.7h-3.1
+		C72.9,121.6,71.5,123,71.5,124.7z"/>
+	<path class="st0" d="M98.5,145.3h-3.3v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
+		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4v19.6H98.5z M94.5,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
+		C92,141.2,93.9,139.3,94.5,137z"/>
+	<path class="st0" d="M119.4,133.8v11.5h-3.9v-11.6c0-2.4-2-4.4-4.4-4.4c-2.5,0-4.4,2-4.4,4.4v11.6h-3.9v-19.6h3.2v1.7
+		c1.4-1.3,3.3-2,5.2-2C115.8,125.5,119.4,129.2,119.4,133.8z"/>
+	<path class="st0" d="M142.4,145.3h-3.3v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
+		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4v19.6H142.4z M138.4,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
+		C135.9,141.2,137.8,139.3,138.4,137z"/>
+</g>
+<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="71.25" y1="10.4893" x2="71.25" y2="113.3415" gradientTransform="matrix(1 0 0 -1 0 148.6)">
+	<stop  offset="0" style="stop-color:#FCEE1F"/>
+	<stop  offset="1" style="stop-color:#F15B2A"/>
+</linearGradient>
+<path class="st1" d="M122.9,49.9c-0.2-1.9-0.5-4.1-1.1-6.5c-0.6-2.4-1.6-5-2.9-7.8c-1.4-2.7-3.1-5.6-5.4-8.3
+	c-0.9-1.1-1.9-2.1-2.9-3.2c1.6-6.3-1.9-11.8-1.9-11.8c-6.1-0.4-9.9,1.9-11.3,2.9c-0.2-0.1-0.5-0.2-0.7-0.3c-1-0.4-2.1-0.8-3.2-1.2
+	c-1.1-0.3-2.2-0.7-3.3-0.9c-1.1-0.3-2.3-0.5-3.5-0.7c-0.2,0-0.4-0.1-0.6-0.1C83.5,3.6,75.9,0,75.9,0c-8.7,5.6-10.4,13.1-10.4,13.1
+	s0,0.2-0.1,0.4c-0.5,0.1-0.9,0.3-1.4,0.4c-0.6,0.2-1.3,0.4-1.9,0.7c-0.6,0.3-1.3,0.5-1.9,0.8c-1.3,0.6-2.5,1.2-3.8,1.9
+	c-1.2,0.7-2.4,1.4-3.5,2.2c-0.2-0.1-0.3-0.2-0.3-0.2c-11.7-4.5-22.1,0.9-22.1,0.9c-0.9,12.5,4.7,20.3,5.8,21.7
+	c-0.3,0.8-0.5,1.5-0.8,2.3c-0.9,2.8-1.5,5.7-1.9,8.7c-0.1,0.4-0.1,0.9-0.2,1.3c-10.8,5.3-14,16.3-14,16.3c9,10.4,19.6,11,19.6,11
+	l0,0c1.3,2.4,2.9,4.7,4.6,6.8c0.7,0.9,1.5,1.7,2.3,2.6c-3.3,9.4,0.5,17.3,0.5,17.3c10.1,0.4,16.7-4.4,18.1-5.5c1,0.3,2,0.6,3,0.9
+	c3.1,0.8,6.3,1.3,9.4,1.4c0.8,0,1.6,0,2.4,0h0.4H80h0.5H81l0,0c4.7,6.8,13.1,7.7,13.1,7.7c5.9-6.3,6.3-12.4,6.3-13.8l0,0
+	c0,0,0,0,0-0.1s0-0.2,0-0.2l0,0c0-0.1,0-0.2,0-0.3c1.2-0.9,2.4-1.8,3.6-2.8c2.4-2.1,4.4-4.6,6.2-7.2c0.2-0.2,0.3-0.5,0.5-0.7
+	c6.7,0.4,11.4-4.2,11.4-4.2c-1.1-7-5.1-10.4-5.9-11l0,0c0,0,0,0-0.1-0.1l-0.1-0.1l0,0l-0.1-0.1c0-0.4,0.1-0.8,0.1-1.3
+	c0.1-0.8,0.1-1.5,0.1-2.3v-0.6v-0.3v-0.1c0-0.2,0-0.1,0-0.2v-0.5v-0.6c0-0.2,0-0.4,0-0.6s0-0.4-0.1-0.6l-0.1-0.6l-0.1-0.6
+	c-0.1-0.8-0.3-1.5-0.4-2.3c-0.7-3-1.9-5.9-3.4-8.4c-1.6-2.6-3.5-4.8-5.7-6.8c-2.2-1.9-4.6-3.5-7.2-4.6c-2.6-1.2-5.2-1.9-7.9-2.2
+	c-1.3-0.2-2.7-0.2-4-0.2h-0.5h-0.1h-0.2h-0.2h-0.5c-0.2,0-0.4,0-0.5,0c-0.7,0.1-1.4,0.2-2,0.3c-2.7,0.5-5.2,1.5-7.4,2.8
+	c-2.2,1.3-4.1,3-5.7,4.9s-2.8,3.9-3.6,6.1c-0.8,2.1-1.3,4.4-1.4,6.5c0,0.5,0,1.1,0,1.6c0,0.1,0,0.3,0,0.4v0.4c0,0.3,0,0.5,0.1,0.8
+	c0.1,1.1,0.3,2.1,0.6,3.1c0.6,2,1.5,3.8,2.7,5.4s2.5,2.8,4,3.8s3,1.7,4.6,2.2c1.6,0.5,3.1,0.7,4.5,0.6c0.2,0,0.4,0,0.5,0
+	c0.1,0,0.2,0,0.3,0s0.2,0,0.3,0c0.2,0,0.3,0,0.5,0h0.1h0.1c0.1,0,0.2,0,0.3,0c0.2,0,0.4-0.1,0.5-0.1c0.2,0,0.3-0.1,0.5-0.1
+	c0.3-0.1,0.7-0.2,1-0.3c0.6-0.2,1.2-0.5,1.8-0.7c0.6-0.3,1.1-0.6,1.5-0.9c0.1-0.1,0.3-0.2,0.4-0.3c0.5-0.4,0.6-1.1,0.2-1.6
+	c-0.4-0.4-1-0.5-1.5-0.3C88,74,87.9,74,87.7,74.1c-0.4,0.2-0.9,0.4-1.3,0.5c-0.5,0.1-1,0.3-1.5,0.4c-0.3,0-0.5,0.1-0.8,0.1
+	c-0.1,0-0.3,0-0.4,0c-0.1,0-0.3,0-0.4,0s-0.3,0-0.4,0c-0.2,0-0.3,0-0.5,0c0,0-0.1,0,0,0h-0.1h-0.1c-0.1,0-0.1,0-0.2,0
+	s-0.3,0-0.4-0.1c-1.1-0.2-2.3-0.5-3.4-1c-1.1-0.5-2.2-1.2-3.1-2.1c-1-0.9-1.8-1.9-2.5-3.1c-0.7-1.2-1.1-2.5-1.3-3.8
+	c-0.1-0.7-0.2-1.4-0.1-2.1c0-0.2,0-0.4,0-0.6c0,0.1,0,0,0,0v-0.1v-0.1c0-0.1,0-0.2,0-0.3c0-0.4,0.1-0.7,0.2-1.1c0.5-3,2-5.9,4.3-8.1
+	c0.6-0.6,1.2-1.1,1.9-1.5c0.7-0.5,1.4-0.9,2.1-1.2c0.7-0.3,1.5-0.6,2.3-0.8s1.6-0.4,2.4-0.4c0.4,0,0.8-0.1,1.2-0.1
+	c0.1,0,0.2,0,0.3,0h0.3h0.2c0.1,0,0,0,0,0h0.1h0.3c0.9,0.1,1.8,0.2,2.6,0.4c1.7,0.4,3.4,1,5,1.9c3.2,1.8,5.9,4.5,7.5,7.8
+	c0.8,1.6,1.4,3.4,1.7,5.3c0.1,0.5,0.1,0.9,0.2,1.4v0.3V66c0,0.1,0,0.2,0,0.3c0,0.1,0,0.2,0,0.3v0.3v0.3c0,0.2,0,0.6,0,0.8
+	c0,0.5-0.1,1-0.1,1.5c-0.1,0.5-0.1,1-0.2,1.5s-0.2,1-0.3,1.5c-0.2,1-0.6,1.9-0.9,2.9c-0.7,1.9-1.7,3.7-2.9,5.3
+	c-2.4,3.3-5.7,6-9.4,7.7c-1.9,0.8-3.8,1.5-5.8,1.8c-1,0.2-2,0.3-3,0.3H81h-0.2h-0.3H80h-0.3c0.1,0,0,0,0,0h-0.1
+	c-0.5,0-1.1,0-1.6-0.1c-2.2-0.2-4.3-0.6-6.4-1.2c-2.1-0.6-4.1-1.4-6-2.4c-3.8-2-7.2-4.9-9.9-8.2c-1.3-1.7-2.5-3.5-3.5-5.4
+	s-1.7-3.9-2.3-5.9c-0.6-2-0.9-4.1-1-6.2v-0.4v-0.1v-0.1v-0.2V60v-0.1v-0.1v-0.2v-0.5V59l0,0v-0.2c0-0.3,0-0.5,0-0.8
+	c0-1,0.1-2.1,0.3-3.2c0.1-1.1,0.3-2.1,0.5-3.2c0.2-1.1,0.5-2.1,0.8-3.2c0.6-2.1,1.3-4.1,2.2-6c1.8-3.8,4.1-7.2,6.8-9.9
+	c0.7-0.7,1.4-1.3,2.2-1.9c0.3-0.3,1-0.9,1.8-1.4c0.8-0.5,1.6-1,2.5-1.4c0.4-0.2,0.8-0.4,1.3-0.6c0.2-0.1,0.4-0.2,0.7-0.3
+	c0.2-0.1,0.4-0.2,0.7-0.3c0.9-0.4,1.8-0.7,2.7-1c0.2-0.1,0.5-0.1,0.7-0.2c0.2-0.1,0.5-0.1,0.7-0.2c0.5-0.1,0.9-0.2,1.4-0.4
+	c0.2-0.1,0.5-0.1,0.7-0.2c0.2,0,0.5-0.1,0.7-0.1c0.2,0,0.5-0.1,0.7-0.1l0.4-0.1l0.4-0.1c0.2,0,0.5-0.1,0.7-0.1
+	c0.3,0,0.5-0.1,0.8-0.1c0.2,0,0.6-0.1,0.8-0.1c0.2,0,0.3,0,0.5-0.1h0.3h0.2h0.2c0.3,0,0.5,0,0.8-0.1h0.4c0,0,0.1,0,0,0h0.1h0.2
+	c0.2,0,0.5,0,0.7,0c0.9,0,1.8,0,2.7,0c1.8,0.1,3.6,0.3,5.3,0.6c3.4,0.6,6.7,1.7,9.6,3.2c2.9,1.4,5.6,3.2,7.8,5.1
+	c0.1,0.1,0.3,0.2,0.4,0.4c0.1,0.1,0.3,0.2,0.4,0.4c0.3,0.2,0.5,0.5,0.8,0.7c0.3,0.2,0.5,0.5,0.8,0.7c0.2,0.3,0.5,0.5,0.7,0.8
+	c1,1,1.9,2.1,2.7,3.1c1.6,2.1,2.9,4.2,3.9,6.2c0.1,0.1,0.1,0.2,0.2,0.4c0.1,0.1,0.1,0.2,0.2,0.4s0.2,0.5,0.4,0.7
+	c0.1,0.2,0.2,0.5,0.3,0.7c0.1,0.2,0.2,0.5,0.3,0.7c0.4,0.9,0.7,1.8,1,2.7c0.5,1.4,0.8,2.6,1.1,3.6c0.1,0.4,0.5,0.7,0.9,0.7
+	c0.5,0,0.8-0.4,0.8-0.9C123,52.7,123,51.4,122.9,49.9z"/>
+</svg>

server/api/root.ts

@@ -23,6 +23,7 @@ import { dockerRouter } from "./routers/docker";
 import { composeRouter } from "./routers/compose";
 import { registryRouter } from "./routers/registry";
 import { clusterRouter } from "./routers/cluster";
+
 /**
  * This is the primary router for your server.
  *
@@ -39,6 +40,7 @@ export const appRouter = createTRPCRouter({
 	redis: redisRouter,
 	mongo: mongoRouter,
 	mariadb: mariadbRouter,
+	compose: composeRouter,
 	user: userRouter,
 	domain: domainRouter,
 	destination: destinationRouter,
@@ -50,7 +52,6 @@ export const appRouter = createTRPCRouter({
 	security: securityRouter,
 	redirects: redirectsRouter,
 	port: portRouter,
-	compose: composeRouter,
 	registry: registryRouter,
 	cluster: clusterRouter,
 });

server/api/routers/application.ts

@@ -162,6 +162,7 @@ export const applicationRouter = createTRPCRouter({
 			const jobData: DeploymentJob = {
 				applicationId: input.applicationId,
 				titleLog: "Rebuild deployment",
+				descriptionLog: "",
 				type: "redeploy",
 				applicationType: "application",
 			};
@@ -294,6 +295,7 @@ export const applicationRouter = createTRPCRouter({
 			const jobData: DeploymentJob = {
 				applicationId: input.applicationId,
 				titleLog: "Manual deployment",
+				descriptionLog: "",
 				type: "deploy",
 				applicationType: "application",
 			};

server/api/routers/auth.ts

@@ -26,6 +26,7 @@ import {
 	updateAuthById,
 	verify2FA,
 } from "../services/auth";
+import { luciaToken } from "@/server/auth/token";
 
 export const authRouter = createTRPCRouter({
 	createAdmin: publicProcedure
@@ -138,6 +139,23 @@ export const authRouter = createTRPCRouter({
 			return auth;
 		}),
 
+	generateToken: protectedProcedure.mutation(async ({ ctx, input }) => {
+		const auth = await findAuthById(ctx.user.authId);
+
+		if (auth.token) {
+			await luciaToken.invalidateSession(auth.token);
+		}
+		const session = await luciaToken.createSession(auth?.id || "", {
+			expiresIn: 60 * 60 * 24 * 30,
+		});
+
+		await updateAuthById(auth.id, {
+			token: session.id,
+		});
+
+		return auth;
+	}),
+
 	one: adminProcedure.input(apiFindOneAuth).query(async ({ input }) => {
 		const auth = await findAuthById(input.id);
 		return auth;
@@ -196,4 +214,7 @@ export const authRouter = createTRPCRouter({
 		});
 		return auth;
 	}),
+	verifyToken: protectedProcedure.mutation(async () => {
+		return true;
+	}),
 });

server/api/routers/compose.ts

@@ -138,6 +138,7 @@ export const composeRouter = createTRPCRouter({
 				titleLog: "Manual deployment",
 				type: "deploy",
 				applicationType: "compose",
+				descriptionLog: "",
 			};
 			await myQueue.add(
 				"deployments",
@@ -156,6 +157,7 @@ export const composeRouter = createTRPCRouter({
 				titleLog: "Rebuild deployment",
 				type: "redeploy",
 				applicationType: "compose",
+				descriptionLog: "",
 			};
 			await myQueue.add(
 				"deployments",

server/api/routers/domain.ts

@@ -12,6 +12,8 @@ import {
 	createDomain,
 	findDomainById,
 	findDomainsByApplicationId,
+	generateDomain,
+	generateWildcard,
 	removeDomainById,
 	updateDomainById,
 } from "../services/domain";
@@ -35,6 +37,16 @@ export const domainRouter = createTRPCRouter({
 		.query(async ({ input }) => {
 			return await findDomainsByApplicationId(input.applicationId);
 		}),
+	generateDomain: protectedProcedure
+		.input(apiFindDomainByApplication)
+		.mutation(async ({ input }) => {
+			return generateDomain(input);
+		}),
+	generateWildcard: protectedProcedure
+		.input(apiFindDomainByApplication)
+		.mutation(async ({ input }) => {
+			return generateWildcard(input);
+		}),
 	update: protectedProcedure
 		.input(apiUpdateDomain)
 		.mutation(async ({ input }) => {

server/api/routers/project.ts

@@ -1,4 +1,8 @@
-import { createTRPCRouter, protectedProcedure } from "@/server/api/trpc";
+import {
+	cliProcedure,
+	createTRPCRouter,
+	protectedProcedure,
+} from "@/server/api/trpc";
 import { db } from "@/server/db";
 import {
 	apiCreateProject,
@@ -54,6 +58,7 @@ export const projectRouter = createTRPCRouter({
 				});
 			}
 		}),
+
 	one: protectedProcedure
 		.input(apiFindOneProject)
 		.query(async ({ input, ctx }) => {

server/api/routers/settings.ts

@@ -41,6 +41,8 @@ import {
 } from "../services/settings";
 import { canAccessToTraefikFiles } from "../services/user";
 import { recreateDirectory } from "@/server/utils/filesystem/directory";
+import { generateOpenApiDocument } from "@dokploy/trpc-openapi";
+import { appRouter } from "../root";
 
 export const settingsRouter = createTRPCRouter({
 	reloadServer: adminProcedure.mutation(async () => {
@@ -242,5 +244,50 @@ export const settingsRouter = createTRPCRouter({
 			}
 			return readConfigInPath(input.path);
 		}),
+
+	getOpenApiDocument: protectedProcedure.query(
+		async ({ ctx }): Promise<unknown> => {
+			const protocol = ctx.req.headers["x-forwarded-proto"];
+			const url = `${protocol}://${ctx.req.headers.host}/api`;
+			const openApiDocument = generateOpenApiDocument(appRouter, {
+				title: "tRPC OpenAPI",
+				version: "1.0.0",
+				baseUrl: url,
+				docsUrl: `${url}/settings.getOpenApiDocument`,
+				tags: [
+					"admin",
+					"docker",
+					"compose",
+					"registry",
+					"cluster",
+					"user",
+					"domain",
+					"destination",
+					"backup",
+					"deployment",
+					"mounts",
+					"certificates",
+					"settings",
+					"security",
+					"redirects",
+					"port",
+					"project",
+					"application",
+					"mysql",
+					"postgres",
+					"redis",
+					"mongo",
+					"mariadb",
+				],
+			});
+
+			openApiDocument.info = {
+				title: "Dokploy API",
+				description: "Endpoints for dokploy",
+				version: getDokployVersion(),
+			};
+
+			return openApiDocument;
+		},
+	),
 });
-// apt-get install apache2-utils

server/api/services/application.ts

@@ -16,11 +16,15 @@ import { createTraefikConfig } from "@/server/utils/traefik/application";
 import { docker } from "@/server/constants";
 import { getAdvancedStats } from "@/server/monitoring/utilts";
 import { validUniqueServerAppName } from "./project";
+import { generatePassword } from "@/templates/utils";
+import { generateAppName } from "@/server/db/schema/utils";
 export type Application = typeof applications.$inferSelect;
 
 export const createApplication = async (
 	input: typeof apiCreateApplication._type,
 ) => {
+	input.appName =
+		`${input.appName}-${generatePassword(6)}` || generateAppName("app");
 	if (input.appName) {
 		const valid = await validUniqueServerAppName(input.appName);
 
@@ -126,15 +130,18 @@ export const updateApplicationStatus = async (
 export const deployApplication = async ({
 	applicationId,
 	titleLog = "Manual deployment",
+	descriptionLog = "",
 }: {
 	applicationId: string;
 	titleLog: string;
+	descriptionLog: string;
 }) => {
 	const application = await findApplicationById(applicationId);
 	const admin = await findAdmin();
 	const deployment = await createDeployment({
 		applicationId: applicationId,
 		title: titleLog,
+		description: descriptionLog,
 	});
 
 	try {
@@ -169,14 +176,17 @@ export const deployApplication = async ({
 export const rebuildApplication = async ({
 	applicationId,
 	titleLog = "Rebuild deployment",
+	descriptionLog = "",
 }: {
 	applicationId: string;
 	titleLog: string;
+	descriptionLog: string;
 }) => {
 	const application = await findApplicationById(applicationId);
 	const deployment = await createDeployment({
 		applicationId: applicationId,
 		title: titleLog,
+		description: descriptionLog,
 	});
 
 	try {

server/api/services/compose.ts

@@ -14,10 +14,14 @@ import { COMPOSE_PATH } from "@/server/constants";
 import { cloneGithubRepository } from "@/server/utils/providers/github";
 import { cloneGitRepository } from "@/server/utils/providers/git";
 import { validUniqueServerAppName } from "./project";
+import { generateAppName } from "@/server/db/schema/utils";
+import { generatePassword } from "@/templates/utils";
 
 export type Compose = typeof compose.$inferSelect;
 
 export const createCompose = async (input: typeof apiCreateCompose._type) => {
+	input.appName =
+		`${input.appName}-${generatePassword(6)}` || generateAppName("compose");
 	if (input.appName) {
 		const valid = await validUniqueServerAppName(input.appName);
 
@@ -130,15 +134,18 @@ export const updateCompose = async (
 export const deployCompose = async ({
 	composeId,
 	titleLog = "Manual deployment",
+	descriptionLog = "",
 }: {
 	composeId: string;
 	titleLog: string;
+	descriptionLog: string;
 }) => {
 	const compose = await findComposeById(composeId);
 	const admin = await findAdmin();
 	const deployment = await createDeploymentCompose({
 		composeId: composeId,
 		title: titleLog,
+		description: descriptionLog,
 	});
 
 	try {
@@ -166,14 +173,17 @@ export const deployCompose = async ({
 export const rebuildCompose = async ({
 	composeId,
 	titleLog = "Rebuild deployment",
+	descriptionLog = "",
 }: {
 	composeId: string;
 	titleLog: string;
+	descriptionLog: string;
 }) => {
 	const compose = await findComposeById(composeId);
 	const deployment = await createDeploymentCompose({
 		composeId: composeId,
 		title: titleLog,
+		description: descriptionLog,
 	});
 
 	try {

server/api/services/deployment.ts

@@ -60,6 +60,7 @@ export const createDeployment = async (
 				title: deployment.title || "Deployment",
 				status: "running",
 				logPath: logFilePath,
+				description: deployment.description || "",
 			})
 			.returning();
 		if (deploymentCreate.length === 0 || !deploymentCreate[0]) {
@@ -100,6 +101,7 @@ export const createDeploymentCompose = async (
 			.values({
 				composeId: deployment.composeId,
 				title: deployment.title || "Deployment",
+				description: deployment.description || "",
 				status: "running",
 				logPath: logFilePath,
 			})

server/api/services/domain.ts

@@ -1,9 +1,15 @@
 import { db } from "@/server/db";
-import { type apiCreateDomain, domains } from "@/server/db/schema";
+import {
+	type apiCreateDomain,
+	type apiFindDomainByApplication,
+	domains,
+} from "@/server/db/schema";
 import { TRPCError } from "@trpc/server";
 import { eq } from "drizzle-orm";
 import { findApplicationById } from "./application";
 import { manageDomain } from "@/server/utils/traefik/domain";
+import { findAdmin } from "./admin";
+import { generateRandomDomain } from "@/templates/utils";
 
 export type Domain = typeof domains.$inferSelect;
 
@@ -29,6 +35,58 @@ export const createDomain = async (input: typeof apiCreateDomain._type) => {
 		await manageDomain(application, domain);
 	});
 };
+
+export const generateDomain = async (
+	input: typeof apiFindDomainByApplication._type,
+) => {
+	const application = await findApplicationById(input.applicationId);
+	const admin = await findAdmin();
+	const domain = await createDomain({
+		applicationId: application.applicationId,
+		host: generateRandomDomain({
+			serverIp: admin.serverIp || "",
+			projectName: application.appName,
+		}),
+		port: 3000,
+		certificateType: "none",
+		https: false,
+		path: "/",
+	});
+
+	return domain;
+};
+
+export const generateWildcard = async (
+	input: typeof apiFindDomainByApplication._type,
+) => {
+	const application = await findApplicationById(input.applicationId);
+	const admin = await findAdmin();
+
+	if (!admin.host) {
+		throw new TRPCError({
+			code: "BAD_REQUEST",
+			message: "We need a host to generate a wildcard domain",
+		});
+	}
+	const domain = await createDomain({
+		applicationId: application.applicationId,
+		host: generateWildcardDomain(application.appName, admin.host || ""),
+		port: 3000,
+		certificateType: "none",
+		https: false,
+		path: "/",
+	});
+
+	return domain;
+};
+
+export const generateWildcardDomain = (
+	appName: string,
+	serverDomain: string,
+) => {
+	return `${appName}-${serverDomain}`;
+};
+
 export const findDomainById = async (domainId: string) => {
 	const domain = await db.query.domains.findFirst({
 		where: eq(domains.domainId, domainId),

server/api/services/mariadb.ts

@@ -6,10 +6,14 @@ import { pullImage } from "@/server/utils/docker/utils";
 import { TRPCError } from "@trpc/server";
 import { eq, getTableColumns } from "drizzle-orm";
 import { validUniqueServerAppName } from "./project";
+import { generateAppName } from "@/server/db/schema/utils";
+import { generatePassword } from "@/templates/utils";
 
 export type Mariadb = typeof mariadb.$inferSelect;
 
 export const createMariadb = async (input: typeof apiCreateMariaDB._type) => {
+	input.appName =
+		`${input.appName}-${generatePassword(6)}` || generateAppName("mariadb");
 	if (input.appName) {
 		const valid = await validUniqueServerAppName(input.appName);
 

server/api/services/mongo.ts

@@ -6,10 +6,14 @@ import { pullImage } from "@/server/utils/docker/utils";
 import { TRPCError } from "@trpc/server";
 import { eq, getTableColumns } from "drizzle-orm";
 import { validUniqueServerAppName } from "./project";
+import { generateAppName } from "@/server/db/schema/utils";
+import { generatePassword } from "@/templates/utils";
 
 export type Mongo = typeof mongo.$inferSelect;
 
 export const createMongo = async (input: typeof apiCreateMongo._type) => {
+	input.appName =
+		`${input.appName}-${generatePassword(6)}` || generateAppName("postgres");
 	if (input.appName) {
 		const valid = await validUniqueServerAppName(input.appName);
 

server/api/services/mysql.ts

@@ -6,10 +6,15 @@ import { pullImage } from "@/server/utils/docker/utils";
 import { TRPCError } from "@trpc/server";
 import { eq, getTableColumns } from "drizzle-orm";
 import { validUniqueServerAppName } from "./project";
+import { generatePassword } from "@/templates/utils";
+import { generateAppName } from "@/server/db/schema/utils";
 
 export type MySql = typeof mysql.$inferSelect;
 
 export const createMysql = async (input: typeof apiCreateMySql._type) => {
+	input.appName =
+		`${input.appName}-${generatePassword(6)}` || generateAppName("mysql");
+
 	if (input.appName) {
 		const valid = await validUniqueServerAppName(input.appName);
 

server/api/services/postgres.ts

@@ -6,10 +6,14 @@ import { pullImage } from "@/server/utils/docker/utils";
 import { TRPCError } from "@trpc/server";
 import { eq, getTableColumns } from "drizzle-orm";
 import { validUniqueServerAppName } from "./project";
+import { generatePassword } from "@/templates/utils";
+import { generateAppName } from "@/server/db/schema/utils";
 
 export type Postgres = typeof postgres.$inferSelect;
 
 export const createPostgres = async (input: typeof apiCreatePostgres._type) => {
+	input.appName =
+		`${input.appName}-${generatePassword(6)}` || generateAppName("postgres");
 	if (input.appName) {
 		const valid = await validUniqueServerAppName(input.appName);
 

server/api/services/redis.ts

@@ -6,11 +6,15 @@ import { pullImage } from "@/server/utils/docker/utils";
 import { TRPCError } from "@trpc/server";
 import { eq } from "drizzle-orm";
 import { validUniqueServerAppName } from "./project";
+import { generateAppName } from "@/server/db/schema/utils";
+import { generatePassword } from "@/templates/utils";
 
 export type Redis = typeof redis.$inferSelect;
 
 // https://github.com/drizzle-team/drizzle-orm/discussions/1483#discussioncomment-7523881
 export const createRedis = async (input: typeof apiCreateRedis._type) => {
+	input.appName =
+		`${input.appName}-${generatePassword(6)}` || generateAppName("redis");
 	if (input.appName) {
 		const valid = await validUniqueServerAppName(input.appName);
 

server/api/services/registry.ts

@@ -33,8 +33,10 @@ export const createRegistry = async (input: typeof apiCreateRegistry._type) => {
 			});
 		}
 
-		const loginCommand = `echo ${input.password} | docker login ${input.registryUrl} --username ${input.username} --password-stdin`;
-		await execAsync(loginCommand);
+		if (newRegistry.registryType === "cloud") {
+			const loginCommand = `echo ${input.password} | docker login ${input.registryUrl} --username ${input.username} --password-stdin`;
+			await execAsync(loginCommand);
+		}
 
 		return newRegistry;
 	});

server/api/trpc.ts

@@ -15,6 +15,8 @@ import superjson from "superjson";
 import { ZodError } from "zod";
 import { validateRequest } from "../auth/auth";
 import type { Session, User } from "lucia";
+import { validateBearerToken } from "../auth/token";
+import type { OpenApiMeta } from "@dokploy/trpc-openapi";
 
 /**
  * 1. CONTEXT
@@ -59,9 +61,15 @@ const createInnerTRPCContext = (opts: CreateContextOptions) => {
  */
 export const createTRPCContext = async (opts: CreateNextContextOptions) => {
 	const { req, res } = opts;
-	// const sessionId = lucia.readSessionCookie(req.headers.cookie ?? "");
-	const { session, user } = await validateRequest(req, res);
-	user;
+
+	let { session, user } = await validateBearerToken(req);
+
+	if (!session) {
+		const cookieResult = await validateRequest(req, res);
+		session = cookieResult.session;
+		user = cookieResult.user;
+	}
+
 	return createInnerTRPCContext({
 		req,
 		res,
@@ -88,19 +96,22 @@ export const createTRPCContext = async (opts: CreateNextContextOptions) => {
  * errors on the backend.
  */
 
-const t = initTRPC.context<typeof createTRPCContext>().create({
-	transformer: superjson,
-	errorFormatter({ shape, error }) {
-		return {
-			...shape,
-			data: {
-				...shape.data,
-				zodError:
-					error.cause instanceof ZodError ? error.cause.flatten() : null,
-			},
-		};
-	},
-});
+const t = initTRPC
+	.meta<OpenApiMeta>()
+	.context<typeof createTRPCContext>()
+	.create({
+		transformer: superjson,
+		errorFormatter({ shape, error }) {
+			return {
+				...shape,
+				data: {
+					...shape.data,
+					zodError:
+						error.cause instanceof ZodError ? error.cause.flatten() : null,
+				},
+			};
+		},
+	});
 
 /**
  * 3. ROUTER & PROCEDURE (THE IMPORTANT BIT)
@@ -147,6 +158,20 @@ export const protectedProcedure = t.procedure.use(({ ctx, next }) => {
 	});
 });
 
+export const cliProcedure = t.procedure.use(({ ctx, next }) => {
+	if (!ctx.session || !ctx.user || ctx.user.rol !== "admin") {
+		throw new TRPCError({ code: "UNAUTHORIZED" });
+	}
+	return next({
+		ctx: {
+			// infers the `session` as non-nullable
+			session: ctx.session,
+			user: ctx.user,
+			// session: { ...ctx.session, user: ctx.user },
+		},
+	});
+});
+
 export const adminProcedure = t.procedure.use(({ ctx, next }) => {
 	if (!ctx.session || !ctx.user || ctx.user.rol !== "admin") {
 		throw new TRPCError({ code: "UNAUTHORIZED" });

server/auth/auth.ts

@@ -33,14 +33,17 @@ declare module "lucia" {
 	}
 }
 
+export type ReturnValidateToken = Promise<{
+	user: (User & { authId: string }) | null;
+	session: Session | null;
+}>;
+
 export async function validateRequest(
 	req: IncomingMessage,
 	res: ServerResponse,
-): Promise<{
-	user: (User & { authId: string }) | null;
-	session: Session | null;
-}> {
+): ReturnValidateToken {
 	const sessionId = lucia.readSessionCookie(req.headers.cookie ?? "");
+
 	if (!sessionId) {
 		return {
 			user: null,