Files
explorer-monorepo/frontend/src/components/common/ExplorerRetryAlert.tsx
defiQUG efd7c8bbcb
Some checks failed
Deploy Explorer Live / deploy (push) Failing after 13s
Validate Explorer / frontend (push) Successful in 1m25s
Validate Explorer / smoke-e2e (push) Failing after 2m46s
Complete UX audit P3: API copy URLs, labels, retry, and smoke sync.
Add footer copy-to-clipboard for public APIs, align ops page labels, improve mobile brand lockup, surface WalletConnect posture on wallet tools, add account access discovery, liquidity retry alerts, and refresh smoke-route expectations.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-05-22 22:54:08 -07:00

35 lines
1.0 KiB
TypeScript

interface ExplorerRetryAlertProps {
message: string
onRetry?: () => void
retryLabel?: string
className?: string
}
export default function ExplorerRetryAlert({
message,
onRetry,
retryLabel = 'Retry',
className = '',
}: ExplorerRetryAlertProps) {
return (
<div
role="alert"
className={[
'flex flex-col gap-3 rounded-xl border border-red-200 bg-red-50/70 px-4 py-3 dark:border-red-900/50 dark:bg-red-950/20 sm:flex-row sm:items-center sm:justify-between',
className,
].join(' ')}
>
<p className="text-sm leading-6 text-red-900 dark:text-red-100">{message}</p>
{onRetry ? (
<button
type="button"
onClick={onRetry}
className="shrink-0 rounded-lg border border-red-300 bg-white px-3 py-1.5 text-sm font-semibold text-red-800 transition-colors hover:bg-red-50 dark:border-red-800 dark:bg-red-950 dark:text-red-100 dark:hover:bg-red-900/40"
>
{retryLabel}
</button>
) : null}
</div>
)
}