Files
portfolio/components/ErrorBoundary.tsx
denshooter e2c2585468 feat: update Projects component with framer-motion variants and improve animations
refactor: modify layout to use ClientOnly and BackgroundBlobsClient components

fix: correct import statement for ActivityFeed in the main page

fix: enhance sitemap fetching logic with error handling and mock support

refactor: convert BackgroundBlobs to default export for consistency

refactor: simplify ErrorBoundary component and improve error handling UI

chore: update framer-motion to version 12.24.10 in package.json and package-lock.json

test: add minimal Prisma Client mock for testing purposes

feat: create BackgroundBlobsClient for dynamic import of BackgroundBlobs

feat: implement ClientOnly component to handle client-side rendering

feat: add custom error handling components for better user experience
2026-01-08 01:39:17 +01:00

40 lines
1.1 KiB
TypeScript

"use client"; // <--- Diese Zeile ist PFLICHT für Error Boundaries!
import React from "react";
// Wir nutzen "export default", damit der Import ohne Klammern funktioniert
export default class ErrorBoundary extends React.Component<
{ children: React.ReactNode },
{ hasError: boolean }
> {
constructor(props: { children: React.ReactNode }) {
super(props);
this.state = { hasError: false };
}
static getDerivedStateFromError(error: any) {
return { hasError: true };
}
componentDidCatch(error: any, errorInfo: any) {
console.error("ErrorBoundary caught an error:", error, errorInfo);
}
render() {
if (this.state.hasError) {
return (
<div className="p-4 m-4 bg-red-50 border border-red-200 rounded text-red-800">
<h2>Something went wrong!</h2>
<button
className="mt-2 px-4 py-2 bg-red-600 text-white rounded hover:bg-red-700"
onClick={() => this.setState({ hasError: false })}
>
Try again
</button>
</div>
);
}
return this.props.children;
}
}