mirror of
https://github.com/Dokploy/dokploy
synced 2025-06-26 18:27:59 +00:00
feat(cluster): add error handling in AddManager and AddWorker components
- Integrated error handling in AddManager and AddWorker components to display error messages using AlertBlock when data fetching fails. - Updated API query hooks to include error and isError states for improved user feedback during data operations.
This commit is contained in:
parent
891dc840f5
commit
7123b9b109
@ -1,3 +1,4 @@
|
|||||||
|
import { AlertBlock } from "@/components/shared/alert-block";
|
||||||
import { CardContent } from "@/components/ui/card";
|
import { CardContent } from "@/components/ui/card";
|
||||||
import {
|
import {
|
||||||
DialogDescription,
|
DialogDescription,
|
||||||
@ -14,7 +15,9 @@ interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const AddManager = ({ serverId }: Props) => {
|
export const AddManager = ({ serverId }: Props) => {
|
||||||
const { data, isLoading } = api.cluster.addManager.useQuery({ serverId });
|
const { data, isLoading, error, isError } = api.cluster.addManager.useQuery({
|
||||||
|
serverId,
|
||||||
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@ -23,6 +26,7 @@ export const AddManager = ({ serverId }: Props) => {
|
|||||||
<DialogTitle>Add a new manager</DialogTitle>
|
<DialogTitle>Add a new manager</DialogTitle>
|
||||||
<DialogDescription>Add a new manager</DialogDescription>
|
<DialogDescription>Add a new manager</DialogDescription>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
|
{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
|
||||||
{isLoading ? (
|
{isLoading ? (
|
||||||
<Loader2 className="w-full animate-spin text-muted-foreground" />
|
<Loader2 className="w-full animate-spin text-muted-foreground" />
|
||||||
) : (
|
) : (
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
|
import { AlertBlock } from "@/components/shared/alert-block";
|
||||||
import { CardContent } from "@/components/ui/card";
|
import { CardContent } from "@/components/ui/card";
|
||||||
import {
|
import {
|
||||||
DialogDescription,
|
DialogDescription,
|
||||||
@ -14,7 +15,9 @@ interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const AddWorker = ({ serverId }: Props) => {
|
export const AddWorker = ({ serverId }: Props) => {
|
||||||
const { data, isLoading } = api.cluster.addWorker.useQuery({ serverId });
|
const { data, isLoading, error, isError } = api.cluster.addWorker.useQuery({
|
||||||
|
serverId,
|
||||||
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<CardContent className="sm:max-w-4xl flex flex-col gap-4 px-0">
|
<CardContent className="sm:max-w-4xl flex flex-col gap-4 px-0">
|
||||||
@ -22,6 +25,7 @@ export const AddWorker = ({ serverId }: Props) => {
|
|||||||
<DialogTitle>Add a new worker</DialogTitle>
|
<DialogTitle>Add a new worker</DialogTitle>
|
||||||
<DialogDescription>Add a new worker</DialogDescription>
|
<DialogDescription>Add a new worker</DialogDescription>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
|
{isError && <AlertBlock type="error">{error?.message}</AlertBlock>}
|
||||||
{isLoading ? (
|
{isLoading ? (
|
||||||
<Loader2 className="w-full animate-spin text-muted-foreground" />
|
<Loader2 className="w-full animate-spin text-muted-foreground" />
|
||||||
) : (
|
) : (
|
||||||
|
Loading…
Reference in New Issue
Block a user