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: add dialog close on submit success

Browse Source
This commit is contained in:
Mauricio Siu 2024-08-17 23:34:58 -06:00
parent bf6ed15ba7
commit eb62d124bd
16 changed files with 78 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apps/dokploy/components/dashboard/application/advanced/ports/add-port.tsx
View File

@ -28,7 +28,7 @@ import {
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { PlusIcon } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -52,6 +52,7 @@ export const AddPort = ({
applicationId,
children = <PlusIcon className="h-4 w-4" />,
}: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { mutateAsync, isLoading, error, isError } =
@ -82,6 +83,7 @@ export const AddPort = ({
await utils.application.one.invalidate({
applicationId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to create the port");
@ -89,7 +91,7 @@ export const AddPort = ({
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button>{children}</Button>
</DialogTrigger>

6
apps/dokploy/components/dashboard/application/advanced/ports/update-port.tsx
View File

@ -28,7 +28,7 @@ import {
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { PenBoxIcon, Pencil } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -49,6 +49,7 @@ interface Props {
}
export const UpdatePort = ({ portId }: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { data } = api.port.one.useQuery(
{
@ -89,6 +90,7 @@ export const UpdatePort = ({ portId }: Props) => {
await utils.application.one.invalidate({
applicationId: response?.applicationId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the port");
@ -96,7 +98,7 @@ export const UpdatePort = ({ portId }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost" isLoading={isLoading}>
<PenBoxIcon className="size-4 text-muted-foreground" />

6
apps/dokploy/components/dashboard/application/advanced/redirects/add-redirect.tsx
View File

@ -23,7 +23,7 @@ import { Switch } from "@/components/ui/switch";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { PlusIcon } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -45,6 +45,7 @@ export const AddRedirect = ({
applicationId,
children = <PlusIcon className="h-4 w-4" />,
}: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { mutateAsync, isLoading, error, isError } =
@ -80,6 +81,7 @@ export const AddRedirect = ({
await utils.application.readTraefikConfig.invalidate({
applicationId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to create the redirect");
@ -87,7 +89,7 @@ export const AddRedirect = ({
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button>{children}</Button>
</DialogTrigger>

6
apps/dokploy/components/dashboard/application/advanced/redirects/update-redirect.tsx
View File

@ -23,7 +23,7 @@ import { Switch } from "@/components/ui/switch";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { PenBoxIcon, Pencil } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -41,6 +41,7 @@ interface Props {
export const UpdateRedirect = ({ redirectId }: Props) => {
const utils = api.useUtils();
const [isOpen, setIsOpen] = useState(false);
const { data } = api.redirects.one.useQuery(
{
redirectId,
@ -84,6 +85,7 @@ export const UpdateRedirect = ({ redirectId }: Props) => {
await utils.application.one.invalidate({
applicationId: response?.applicationId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the redirect");
@ -91,7 +93,7 @@ export const UpdateRedirect = ({ redirectId }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost" isLoading={isLoading}>
<PenBoxIcon className="size-4 text-muted-foreground" />

7
apps/dokploy/components/dashboard/application/advanced/security/add-security.tsx
View File

@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { PlusIcon } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -43,7 +43,7 @@ export const AddSecurity = ({
children = <PlusIcon className="h-4 w-4" />,
}: Props) => {
const utils = api.useUtils();
const [isOpen, setIsOpen] = useState(false);
const { mutateAsync, isLoading, error, isError } =
api.security.create.useMutation();
@ -72,6 +72,7 @@ export const AddSecurity = ({
await utils.application.readTraefikConfig.invalidate({
applicationId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to create the security");
@ -79,7 +80,7 @@ export const AddSecurity = ({
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button>{children}</Button>
</DialogTrigger>

6
apps/dokploy/components/dashboard/application/advanced/security/update-security.tsx
View File

@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { PenBoxIcon, Pencil } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -38,6 +38,7 @@ interface Props {
}
export const UpdateSecurity = ({ securityId }: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { data } = api.security.one.useQuery(
{
@ -79,6 +80,7 @@ export const UpdateSecurity = ({ securityId }: Props) => {
await utils.application.one.invalidate({
applicationId: response?.applicationId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the security");
@ -86,7 +88,7 @@ export const UpdateSecurity = ({ securityId }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost" isLoading={isLoading}>
<PenBoxIcon className="size-4 text-muted-foreground" />

8
apps/dokploy/components/dashboard/application/advanced/volumes/add-volumes.tsx
View File

@ -24,7 +24,7 @@ import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { PlusIcon } from "lucide-react";
import type React from "react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -77,6 +77,7 @@ export const AddVolumes = ({
refetch,
children = <PlusIcon className="h-4 w-4" />,
}: Props) => {
const [isOpen, setIsOpen] = useState(false);
const { mutateAsync } = api.mounts.create.useMutation();
const form = useForm<AddMount>({
defaultValues: {
@ -103,6 +104,7 @@ export const AddVolumes = ({
})
.then(() => {
toast.success("Mount Created");
setIsOpen(false);
})
.catch(() => {
toast.error("Error to create the Bind mount");
@ -117,6 +119,7 @@ export const AddVolumes = ({
})
.then(() => {
toast.success("Mount Created");
setIsOpen(false);
})
.catch(() => {
toast.error("Error to create the Volume mount");
@ -132,6 +135,7 @@ export const AddVolumes = ({
})
.then(() => {
toast.success("Mount Created");
setIsOpen(false);
})
.catch(() => {
toast.error("Error to create the File mount");
@ -142,7 +146,7 @@ export const AddVolumes = ({
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger className="" asChild>
<Button>{children}</Button>
</DialogTrigger>

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

@ -2,6 +2,7 @@ import { AlertBlock } from "@/components/shared/alert-block";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogClose,
DialogContent,
DialogDescription,
DialogFooter,
@ -22,7 +23,7 @@ import { Textarea } from "@/components/ui/textarea";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { Pencil } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -76,6 +77,7 @@ export const UpdateVolume = ({
refetch,
serviceType,
}: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { data } = api.mounts.one.useQuery(
{
@ -135,6 +137,7 @@ export const UpdateVolume = ({
})
.then(() => {
toast.success("Mount Update");
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the Bind mount");
@ -148,6 +151,7 @@ export const UpdateVolume = ({
})
.then(() => {
toast.success("Mount Update");
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the Volume mount");
@ -162,6 +166,7 @@ export const UpdateVolume = ({
})
.then(() => {
toast.success("Mount Update");
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the File mount");
@ -171,7 +176,7 @@ export const UpdateVolume = ({
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost" isLoading={isLoading}>
<Pencil className="size-4 text-muted-foreground" />
@ -291,13 +296,15 @@ export const UpdateVolume = ({
)}
</div>
<DialogFooter>
<Button
isLoading={isLoading}
form="hook-form-update-volume"
type="submit"
>
Update
</Button>
<DialogClose>
<Button
isLoading={isLoading}
form="hook-form-update-volume"
type="submit"
>
Update
</Button>
</DialogClose>
</DialogFooter>
</form>
</Form>

6
apps/dokploy/components/dashboard/application/update-application.tsx
View File

@ -22,7 +22,7 @@ import { Textarea } from "@/components/ui/textarea";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { AlertTriangle, SquarePen } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -41,6 +41,7 @@ interface Props {
}
export const UpdateApplication = ({ applicationId }: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { mutateAsync, error, isError, isLoading } =
api.application.update.useMutation();
@ -79,6 +80,7 @@ export const UpdateApplication = ({ applicationId }: Props) => {
utils.application.one.invalidate({
applicationId: applicationId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the application");
@ -87,7 +89,7 @@ export const UpdateApplication = ({ applicationId }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost">
<SquarePen className="size-4 text-muted-foreground" />

6
apps/dokploy/components/dashboard/compose/update-compose.tsx
View File

@ -22,7 +22,7 @@ import { Textarea } from "@/components/ui/textarea";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { SquarePen } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -41,6 +41,7 @@ interface Props {
}
export const UpdateCompose = ({ composeId }: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { mutateAsync, error, isError, isLoading } =
api.compose.update.useMutation();
@ -79,6 +80,7 @@ export const UpdateCompose = ({ composeId }: Props) => {
utils.compose.one.invalidate({
composeId: composeId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the Compose");
@ -87,7 +89,7 @@ export const UpdateCompose = ({ composeId }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost">
<SquarePen className="size-4 text-muted-foreground" />

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

@ -36,7 +36,7 @@ import { cn } from "@/lib/utils";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { CheckIcon, ChevronsUpDown, PenBoxIcon, Pencil } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -57,6 +57,7 @@ interface Props {
}
export const UpdateBackup = ({ backupId, refetch }: Props) => {
const [isOpen, setIsOpen] = useState(false);
const { data, isLoading } = api.destination.all.useQuery();
const { data: backup } = api.backup.one.useQuery(
{
@ -105,6 +106,7 @@ export const UpdateBackup = ({ backupId, refetch }: Props) => {
.then(async () => {
toast.success("Backup Updated");
refetch();
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the backup");
@ -112,7 +114,7 @@ export const UpdateBackup = ({ backupId, refetch }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost">
<PenBoxIcon className="size-4 text-muted-foreground" />

6
apps/dokploy/components/dashboard/mongo/update-mongo.tsx
View File

@ -22,7 +22,7 @@ import { Textarea } from "@/components/ui/textarea";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { AlertTriangle, SquarePen } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -41,6 +41,7 @@ interface Props {
}
export const UpdateMongo = ({ mongoId }: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { mutateAsync, error, isError, isLoading } =
api.mongo.update.useMutation();
@ -79,6 +80,7 @@ export const UpdateMongo = ({ mongoId }: Props) => {
utils.mongo.one.invalidate({
mongoId: mongoId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update mongo database");
@ -87,7 +89,7 @@ export const UpdateMongo = ({ mongoId }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost">
<SquarePen className="size-4 text-muted-foreground" />

6
apps/dokploy/components/dashboard/postgres/update-postgres.tsx
View File

@ -22,7 +22,7 @@ import { Textarea } from "@/components/ui/textarea";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { AlertTriangle, SquarePen } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -41,6 +41,7 @@ interface Props {
}
export const UpdatePostgres = ({ postgresId }: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { mutateAsync, error, isError, isLoading } =
api.postgres.update.useMutation();
@ -79,6 +80,7 @@ export const UpdatePostgres = ({ postgresId }: Props) => {
utils.postgres.one.invalidate({
postgresId: postgresId,
});
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the postgres");
@ -87,7 +89,7 @@ export const UpdatePostgres = ({ postgresId }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="ghost">
<SquarePen className="size-4 text-muted-foreground" />

6
apps/dokploy/components/dashboard/projects/update.tsx
View File

@ -23,7 +23,7 @@ import { Textarea } from "@/components/ui/textarea";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { AlertTriangle, SquarePen } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -42,6 +42,7 @@ interface Props {
}
export const UpdateProject = ({ projectId }: Props) => {
const [isOpen, setIsOpen] = useState(false);
const utils = api.useUtils();
const { mutateAsync, error, isError } = api.project.update.useMutation();
const { data } = api.project.one.useQuery(
@ -77,6 +78,7 @@ export const UpdateProject = ({ projectId }: Props) => {
.then(() => {
toast.success("Project updated succesfully");
utils.project.all.invalidate();
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the project");
@ -85,7 +87,7 @@ export const UpdateProject = ({ projectId }: Props) => {
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<DropdownMenuItem
className="w-full cursor-pointer space-x-3"

6
apps/dokploy/components/dashboard/settings/destination/update-destination.tsx
View File

@ -21,7 +21,7 @@ import { Input } from "@/components/ui/input";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { PenBoxIcon } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
@ -43,6 +43,7 @@ interface Props {
export const UpdateDestination = ({ destinationId }: Props) => {
const utils = api.useUtils();
const [isOpen, setIsOpen] = useState(false);
const { data, refetch } = api.destination.one.useQuery(
{
destinationId,
@ -93,13 +94,14 @@ export const UpdateDestination = ({ destinationId }: Props) => {
toast.success("Destination Updated");
await refetch();
await utils.destination.all.invalidate();
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update the Destination");
});
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger className="" asChild>
<Button variant="ghost">
<PenBoxIcon className="size-4 text-muted-foreground" />

6
apps/dokploy/components/dashboard/settings/notifications/update-notification.tsx
View File

@ -27,7 +27,7 @@ import { Switch } from "@/components/ui/switch";
import { api } from "@/utils/api";
import { zodResolver } from "@hookform/resolvers/zod";
import { Mail, PenBoxIcon } from "lucide-react";
import { useEffect } from "react";
import { useEffect, useState } from "react";
import { FieldErrors, useFieldArray, useForm } from "react-hook-form";
import { toast } from "sonner";
import {
@ -41,6 +41,7 @@ interface Props {
export const UpdateNotification = ({ notificationId }: Props) => {
const utils = api.useUtils();
const [isOpen, setIsOpen] = useState(false);
const { data, refetch } = api.notification.one.useQuery(
{
notificationId,
@ -207,6 +208,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
toast.success("Notification Updated");
await utils.notification.all.invalidate();
refetch();
setIsOpen(false);
})
.catch(() => {
toast.error("Error to update a notification");
@ -214,7 +216,7 @@ export const UpdateNotification = ({ notificationId }: Props) => {
}
};
return (
<Dialog>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger className="" asChild>
<Button variant="ghost">
<PenBoxIcon className="size-4 text-muted-foreground" />