diff --git a/apps/web/src/components/common/error-state.tsx b/apps/web/src/components/common/error-state.tsx
index 46dac4747..515f36409 100644
--- a/apps/web/src/components/common/error-state.tsx
+++ b/apps/web/src/components/common/error-state.tsx
@@ -1,4 +1,5 @@
import { Button } from "@maple/ui/components/ui/button"
+import { useNetworkAutoRetry } from "@/hooks/use-network-auto-retry"
import { formatBackendError } from "@/lib/error-messages"
import { cn } from "@maple/ui/lib/utils"
@@ -33,6 +34,13 @@ interface ErrorStateProps {
export function ErrorState({ error, title, onRetry, variant = "panel", className }: ErrorStateProps) {
const formatted = formatBackendError(error)
const heading = title ?? formatted.title
+ // Connectivity blips self-heal: probe on a backoff poll + the `online`
+ // event, so recovery doesn't require the user to click or reload.
+ const autoRetrying = formatted.kind === "network" && onRetry !== undefined
+ useNetworkAutoRetry(autoRetrying, onRetry)
+ const description = autoRetrying
+ ? `${formatted.description} Retrying automatically…`
+ : formatted.description
if (variant === "inline") {
return (
@@ -46,7 +54,7 @@ export function ErrorState({ error, title, onRetry, variant = "panel", className
{heading}
- {formatted.description}
+ {description}
{onRetry && (
{heading}
-
{formatted.description}
+
{description}
{onRetry && (