Deploy
This commit is contained in:
@@ -0,0 +1,43 @@
|
||||
'use client'
|
||||
import { Component, ErrorInfo, ReactNode } from 'react'
|
||||
|
||||
interface Props { children: ReactNode }
|
||||
interface State { hasError: boolean; error: string }
|
||||
|
||||
export class VulaSandboxBoundary extends Component<Props, State> {
|
||||
constructor(props: Props) {
|
||||
super(props)
|
||||
this.state = { hasError: false, error: '' }
|
||||
}
|
||||
|
||||
static getDerivedStateFromError(error: Error): State {
|
||||
return { hasError: true, error: error.message }
|
||||
}
|
||||
|
||||
componentDidCatch(error: Error, info: ErrorInfo): void {
|
||||
try {
|
||||
const parent = typeof window !== 'undefined' && window !== window.parent ? window.parent : null
|
||||
if (parent) {
|
||||
parent.postMessage(
|
||||
{ type: 'VULA_SANDBOX_ERROR', error: error.message, stack: error.stack, componentStack: info.componentStack },
|
||||
'*'
|
||||
)
|
||||
}
|
||||
} catch (_) { /* cross-origin postMessage can throw — swallow */ }
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.hasError) {
|
||||
return (
|
||||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', minHeight: '100vh', background: '#09090b', color: '#71717a', fontFamily: 'system-ui, -apple-system, sans-serif', padding: '2rem', textAlign: 'center' }}>
|
||||
<div>
|
||||
<div style={{ fontSize: '2rem', marginBottom: '0.75rem' }}>⚡</div>
|
||||
<p style={{ color: '#f97316', fontWeight: 600, margin: '0 0 0.5rem' }}>Fixing detected issue…</p>
|
||||
<p style={{ fontSize: '0.75rem', color: '#52525b', maxWidth: '28rem', margin: '0 auto' }}>{this.state.error}</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return this.props.children
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user