Security & Stability: - Add Next.js 16 proxy.ts for BetterAuth cookie-based auth protection - Add rate limiting for API routes (src/lib/rate-limit.ts) - Add Zod validation for chat API request bodies - Add session auth check to chat and diagnostics endpoints - Add security headers in next.config.ts (CSP, X-Frame-Options, etc.) - Add file upload validation and sanitization in storage.ts Core UX Components: - Add error boundaries (error.tsx, not-found.tsx, chat/error.tsx) - Add loading states (skeleton.tsx, spinner.tsx, loading.tsx files) - Add toast notifications with Sonner - Add form components (input.tsx, textarea.tsx, label.tsx) - Add database indexes for performance (schema.ts) - Enhance chat UX: timestamps, copy-to-clipboard, thinking indicator, error display, localStorage message persistence Polish & Accessibility: - Add Open Graph and Twitter card metadata - Add JSON-LD structured data for SEO - Add sitemap.ts, robots.ts, manifest.ts - Add skip-to-content link and ARIA labels in site-header - Enable profile page quick action buttons with dialogs - Update Next.js 15 references to Next.js 16 Developer Experience: - Add GitHub Actions CI workflow (lint, typecheck, build) - Add Prettier configuration (.prettierrc, .prettierignore) - Add .nvmrc pinning Node 20 - Add ESLint rules: import/order, react-hooks/exhaustive-deps - Add stricter TypeScript settings (exactOptionalPropertyTypes, noImplicitOverride) - Add interactive setup script (scripts/setup.ts) - Add session utility functions (src/lib/session.ts) All changes mirrored to create-agentic-app/template/ 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
47 lines
1.4 KiB
TypeScript
47 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect } from "react";
|
|
import { MessageSquareWarning, RefreshCw } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
export default function ChatError({
|
|
error,
|
|
reset,
|
|
}: {
|
|
error: Error & { digest?: string };
|
|
reset: () => void;
|
|
}) {
|
|
useEffect(() => {
|
|
console.error("Chat error:", error);
|
|
}, [error]);
|
|
|
|
return (
|
|
<div className="container mx-auto px-4 py-16">
|
|
<div className="max-w-md mx-auto text-center">
|
|
<div className="flex justify-center mb-6">
|
|
<MessageSquareWarning className="h-16 w-16 text-destructive" />
|
|
</div>
|
|
<h1 className="text-2xl font-bold mb-4">Chat Error</h1>
|
|
<p className="text-muted-foreground mb-6">
|
|
There was a problem with the chat service. This could be due to a
|
|
connection issue or the AI service being temporarily unavailable.
|
|
</p>
|
|
{error.message && (
|
|
<p className="text-sm text-muted-foreground mb-4 p-2 bg-muted rounded">
|
|
{error.message}
|
|
</p>
|
|
)}
|
|
<div className="flex gap-4 justify-center">
|
|
<Button onClick={reset}>
|
|
<RefreshCw className="h-4 w-4 mr-2" />
|
|
Try again
|
|
</Button>
|
|
<Button variant="outline" onClick={() => (window.location.href = "/")}>
|
|
Go home
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|