diff --git a/apps/dokploy/components/dashboard/application/domains/show-domains.tsx b/apps/dokploy/components/dashboard/application/domains/show-domains.tsx index b1222006..26df7b69 100644 --- a/apps/dokploy/components/dashboard/application/domains/show-domains.tsx +++ b/apps/dokploy/components/dashboard/application/domains/show-domains.tsx @@ -41,6 +41,8 @@ export type ValidationState = { message?: string; }; +export type ValidationStates = Record; + interface Props { id: string; type: "application" | "compose"; @@ -70,24 +72,27 @@ export const ShowDomains = ({ id, type }: Props) => { ); const { data: ip } = api.settings.getIp.useQuery(); - const { data, refetch } = - type === "application" - ? api.domain.byApplicationId.useQuery( - { - applicationId: id, - }, - { - enabled: !!id, - }, - ) - : api.domain.byComposeId.useQuery( - { - composeId: id, - }, - { - enabled: !!id, - }, - ); + const { + data, + refetch, + isLoading: isLoadingDomains, + } = type === "application" + ? api.domain.byApplicationId.useQuery( + { + applicationId: id, + }, + { + enabled: !!id, + }, + ) + : api.domain.byComposeId.useQuery( + { + composeId: id, + }, + { + enabled: !!id, + }, + ); const { mutateAsync: validateDomain } = api.domain.validateDomain.useMutation(); @@ -152,7 +157,14 @@ export const ShowDomains = ({ id, type }: Props) => { - {data?.length === 0 ? ( + {isLoadingDomains ? ( +
+ + + Loading domains... + +
+ ) : data?.length === 0 ? (
@@ -168,7 +180,7 @@ export const ShowDomains = ({ id, type }: Props) => {
) : ( -
+
{data?.map((item) => { const validationState = validationStates[item.host]; return (