Dokploy/dokploy
1
0
Fork 0
mirror of https://github.com/Dokploy/dokploy synced 2025-06-26 18:27:59 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor(multi-server): add deploy templates on different servers

Browse Source
This commit is contained in:
Mauricio Siu
2024-09-17 00:38:27 -06:00
parent abe787593c
commit a591e02ffa
9 changed files with 106 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/dokploy/components/dashboard/project/add-application.tsx
View File

@@ -73,7 +73,7 @@ export const AddApplication = ({ projectId, projectName }: Props) => {
const [visible, setVisible] = useState(false);
const slug = slugify(projectName);
const { data: servers } = api.server.all.useQuery();
const { data: servers } = api.server.withSSHKey.useQuery();
const { mutateAsync, isLoading, error, isError } =
api.application.create.useMutation();

2
apps/dokploy/components/dashboard/project/add-compose.tsx
View File

@@ -72,7 +72,7 @@ interface Props {
export const AddCompose = ({ projectId, projectName }: Props) => {
const utils = api.useUtils();
const slug = slugify(projectName);
const { data: servers } = api.server.all.useQuery();
const { data: servers } = api.server.withSSHKey.useQuery();
const { mutateAsync, isLoading, error, isError } =
api.compose.create.useMutation();

2
apps/dokploy/components/dashboard/project/add-database.tsx
View File

@@ -157,7 +157,7 @@ export const AddDatabase = ({ projectId, projectName }: Props) => {
const utils = api.useUtils();
const [visible, setVisible] = useState(false);
const slug = slugify(projectName);
const { data: servers } = api.server.all.useQuery();
const { data: servers } = api.server.withSSHKey.useQuery();
const postgresMutation = api.postgres.create.useMutation();
const mongoMutation = api.mongo.create.useMutation();
const redisMutation = api.redis.create.useMutation();

96
apps/dokploy/components/dashboard/project/add-template.tsx
View File

@@ -19,6 +19,21 @@ import {
CommandInput,
CommandItem,
} from "@/components/ui/command";
import {
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectLabel,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import {
Dialog,
DialogContent,
@@ -43,12 +58,14 @@ import {
Code,
Github,
Globe,
HelpCircle,
PuzzleIcon,
SearchIcon,
} from "lucide-react";
import Link from "next/link";
import { useState } from "react";
import { toast } from "sonner";
import { Label } from "@/components/ui/label";
interface Props {
projectId: string;
}
@@ -58,9 +75,12 @@ export const AddTemplate = ({ projectId }: Props) => {
const [open, setOpen] = useState(false);
const { data } = api.compose.templates.useQuery();
const [selectedTags, setSelectedTags] = useState<string[]>([]);
const { data: servers } = api.server.withSSHKey.useQuery();
const { data: tags, isLoading: isLoadingTags } =
api.compose.getTags.useQuery();
const utils = api.useUtils();
const [serverId, setServerId] = useState<string | undefined>(undefined);
const { mutateAsync, isLoading, error, isError } =
api.compose.deployTemplate.useMutation();
@@ -109,7 +129,6 @@ export const AddTemplate = ({ projectId }: Props) => {
role="combobox"
className={cn(
"md:max-w-[15rem] w-full justify-between !bg-input",
// !field.value && "text-muted-foreground",
)}
>
{isLoadingTags
@@ -267,30 +286,79 @@ export const AddTemplate = ({ projectId }: Props) => {
This will deploy {template.name} template to
your project.
</AlertDialogDescription>
<div>
<TooltipProvider delayDuration={0}>
<Tooltip>
<TooltipTrigger asChild>
<Label className="break-all w-fit flex flex-row gap-1 items-center pb-2 pt-3.5">
Select a Server (Optional)
<HelpCircle className="size-4 text-muted-foreground" />
</Label>
</TooltipTrigger>
<TooltipContent
className="z-[999] w-[300px]"
align="start"
side="top"
>
<span>
If not server is selected, the
application will be deployed on the
server where the user is logged in.
</span>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<Select
onValueChange={(e) => {
setServerId(e);
}}
>
<SelectTrigger>
<SelectValue placeholder="Select a Server" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
{servers?.map((server) => (
<SelectItem
key={server.serverId}
value={server.serverId}
>
{server.name}
</SelectItem>
))}
<SelectLabel>
Servers ({servers?.length})
</SelectLabel>
</SelectGroup>
</SelectContent>
</Select>
</div>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction
disabled={isLoading}
onClick={async () => {
await mutateAsync({
const promise = mutateAsync({
projectId,
serverId: serverId || undefined,
id: template.id,
})
.then(async () => {
toast.success(
`${template.name} template created succesfully`,
);
});
toast.promise(promise, {
loading: "Setting up...",
success: (data) => {
utils.project.one.invalidate({
projectId,
});
setOpen(false);
})
.catch(() => {
toast.error(
`Error to delete ${template.name} template`,
);
});
return `${template.name} template created succesfully`;
},
error: (err) => {
return `Ocurred an error deploying ${template.name} template`;
},
});
}}
>
Confirm