Merge pull request #358 from Dokploy/154-all-pop-ups-when-the-confirmation-behavior-occurs-successfully-the-pop-ups-are-not-closed

refactor: add dialog close on submit success
This commit is contained in:
Mauricio Siu
2024-08-17 23:43:10 -06:00
committed by GitHub
16 changed files with 78 additions and 40 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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