Files
agentic-coding-starter-kit/create-agentic-app/template/src/app/chat/error.tsx
Leon van Zyl a3a151c67a feat: comprehensive boilerplate improvements
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>
2025-11-30 14:46:15 +02:00

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>
);
}