|
|
@@ -1,13 +1,40 @@
|
|
|
'use client'
|
|
|
|
|
|
import dynamic from 'next/dynamic'
|
|
|
+import { Component, type ReactNode } from 'react'
|
|
|
|
|
|
-const MapView = dynamic(() => import('@/components/MapView'), { ssr: false })
|
|
|
+const MapViewInner = dynamic(() => import('@/components/MapView'), { ssr: false })
|
|
|
+
|
|
|
+interface State {
|
|
|
+ hasError: boolean
|
|
|
+ error: string
|
|
|
+}
|
|
|
+
|
|
|
+class MapErrorBoundary extends Component<{ children: ReactNode }, State> {
|
|
|
+ state: State = { hasError: false, error: '' }
|
|
|
+
|
|
|
+ componentDidCatch(error: Error) {
|
|
|
+ this.setState({ hasError: true, error: `${error.name}: ${error.message}\n${error.stack}` })
|
|
|
+ }
|
|
|
+
|
|
|
+ render() {
|
|
|
+ if (this.state.hasError) {
|
|
|
+ return (
|
|
|
+ <div className="flex h-screen w-screen items-center justify-center bg-[#0f172a] p-8 text-white">
|
|
|
+ <pre className="whitespace-pre-wrap text-sm text-red-400">{this.state.error}</pre>
|
|
|
+ </div>
|
|
|
+ )
|
|
|
+ }
|
|
|
+ return this.props.children
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
export default function HomePage() {
|
|
|
return (
|
|
|
<main className="relative isolate h-screen w-screen overflow-hidden">
|
|
|
- <MapView />
|
|
|
+ <MapErrorBoundary>
|
|
|
+ <MapViewInner />
|
|
|
+ </MapErrorBoundary>
|
|
|
</main>
|
|
|
)
|
|
|
}
|