strapi-nextgen-framework
Version:
Production-ready, type-safe framework bridging Strapi v4 CMS and Next.js 14+ App Router with automatic cache management, Error Boundaries, and SEO optimization
79 lines • 3.57 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.ComponentErrorBoundary = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
/**
* Error Boundary for individual Strapi components
* Prevents single component failure from crashing entire page
*/
const react_1 = require("react");
/**
* Error Boundary that wraps each dynamic component
*
* Features:
* - Catches React errors in child components
* - Logs errors in development mode
* - Shows fallback UI or hides component in production
* - Calls optional onError callback
*/
class ComponentErrorBoundary extends react_1.Component {
constructor(props) {
super(props);
this.state = {
hasError: false,
error: null,
};
}
static getDerivedStateFromError(error) {
return {
hasError: true,
error,
};
}
componentDidCatch(error, errorInfo) {
const { componentType, onError } = this.props;
// Log error in development
if (process.env.NODE_ENV === 'development') {
console.error(`[StrapiRenderer] Error in component: ${componentType}`, '\nError:', error, '\nComponent Stack:', errorInfo.componentStack);
}
else {
// Log minimal info in production
console.error(`[StrapiRenderer] Component error: ${componentType}`, error.message);
}
// Call optional error callback
if (onError) {
onError(error, errorInfo, componentType);
}
}
render() {
const { hasError, error } = this.state;
const { children, componentType, fallback } = this.props;
if (hasError) {
// Development mode: show detailed error
if (process.env.NODE_ENV === 'development') {
return ((0, jsx_runtime_1.jsxs)("div", { style: {
border: '2px solid #ef4444',
borderRadius: '8px',
padding: '16px',
margin: '16px 0',
backgroundColor: '#fef2f2',
color: '#991b1b',
}, children: [(0, jsx_runtime_1.jsxs)("h3", { style: { margin: '0 0 8px 0', fontSize: '16px', fontWeight: 'bold' }, children: ["\u26A0\uFE0F Component Error: ", componentType] }), (0, jsx_runtime_1.jsxs)("p", { style: { margin: '0 0 8px 0', fontSize: '14px' }, children: [(0, jsx_runtime_1.jsx)("strong", { children: "Error:" }), " ", error?.message || 'Unknown error'] }), (0, jsx_runtime_1.jsxs)("details", { style: { fontSize: '12px', fontFamily: 'monospace' }, children: [(0, jsx_runtime_1.jsx)("summary", { style: { cursor: 'pointer', marginBottom: '8px' }, children: "Stack Trace" }), (0, jsx_runtime_1.jsx)("pre", { style: {
overflow: 'auto',
padding: '8px',
backgroundColor: '#fff',
border: '1px solid #fca5a5',
borderRadius: '4px',
}, children: error?.stack })] })] }));
}
// Production mode: show fallback or hide component
if (fallback) {
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: fallback });
}
return null;
}
return children;
}
}
exports.ComponentErrorBoundary = ComponentErrorBoundary;
//# sourceMappingURL=error-boundary.js.map