feat(dashboard): enhance Traefik actions with health check integration

- Added a new health check mutation for reloading Traefik, improving user feedback during the reload process.
- Updated button states to reflect the execution status of health checks, preventing user actions during ongoing operations.
- Refactored error handling for Traefik reload to provide clearer feedback on failures.
This commit is contained in:
Mauricio Siu
2026-02-07 00:53:32 -06:00
parent ad29bb6ec2
commit a1a348e22d
2 changed files with 31 additions and 15 deletions

View File

@@ -39,12 +39,22 @@ export const ShowTraefikActions = ({ serverId }: Props) => {
isExecuting: isHealthCheckExecuting,
} = useHealthCheckAfterMutation({
initialDelay: 5000,
pollInterval: 4000,
successMessage: "Traefik dashboard updated successfully",
onSuccess: () => {
refetchDashboard();
},
});
const {
execute: executeReloadWithHealthCheck,
isExecuting: isReloadHealthCheckExecuting,
} = useHealthCheckAfterMutation({
initialDelay: 5000,
pollInterval: 4000,
successMessage: "Traefik Reloaded",
});
return (
<DropdownMenu>
<DropdownMenuTrigger
@@ -52,14 +62,16 @@ export const ShowTraefikActions = ({ serverId }: Props) => {
disabled={
reloadTraefikIsLoading ||
toggleDashboardIsLoading ||
isHealthCheckExecuting
isHealthCheckExecuting ||
isReloadHealthCheckExecuting
}
>
<Button
isLoading={
reloadTraefikIsLoading ||
toggleDashboardIsLoading ||
isHealthCheckExecuting
isHealthCheckExecuting ||
isReloadHealthCheckExecuting
}
variant="outline"
>
@@ -74,15 +86,19 @@ export const ShowTraefikActions = ({ serverId }: Props) => {
<DropdownMenuGroup>
<DropdownMenuItem
onClick={async () => {
await reloadTraefik({
serverId: serverId,
})
.then(async () => {
toast.success("Traefik Reloaded");
})
.catch(() => {});
try {
await executeReloadWithHealthCheck(() =>
reloadTraefik({ serverId }),
);
} catch (error) {
const errorMessage =
(error as Error)?.message ||
"Failed to reload Traefik. Please try again.";
toast.error(errorMessage);
}
}}
className="cursor-pointer"
disabled={isReloadHealthCheckExecuting}
>
<span>{t("settings.server.webServer.reload")}</span>
</DropdownMenuItem>

View File

@@ -118,12 +118,12 @@ export const settingsRouter = createTRPCRouter({
reloadTraefik: adminProcedure
.input(apiServerSchema)
.mutation(async ({ input }) => {
try {
await reloadDockerResource("dokploy-traefik", input?.serverId);
} catch (err) {
console.error(err);
}
// Run in background so the request returns immediately; avoids proxy timeouts.
void reloadDockerResource("dokploy-traefik", input?.serverId).catch(
(err) => {
console.error("reloadTraefik background:", err);
},
);
return true;
}),
toggleDashboard: adminProcedure