import type { ReactElement } from 'react';
import { useRouteError } from 'react-router-dom';

/**
 * `/chat` renders live, server-driven state (streamed text, tool calls,
 * manifests) that can carry malformed payloads no compile-time contract can
 * fully rule out at every dereference site. This is the last line of
 * defense: if something still throws during render, show a recoverable
 * alert instead of leaving the user on a blank/white screen.
 */
export function ChatRouteErrorBoundary(): ReactElement {
  useRouteError();

  return (
    <div role="alert" className="flex min-h-screen flex-col items-center justify-center gap-3 p-8">
      <p className="text-sm font-medium">Something went wrong loading chat.</p>
      <a href="/chat" className="text-sm underline">
        Reload chat
      </a>
    </div>
  );
}