Replace leaflet for maplibre, use react-router in framework mode

1 files changed, 46 insertions, 0 deletions

diff --git a/src/frontend/app/ErrorBoundary.tsx b/src/frontend/app/ErrorBoundary.tsx
new file mode 100644
index 0000000..5c877b7
--- /dev/null
+++ b/src/frontend/app/ErrorBoundary.tsx
@@ -0,0 +1,46 @@
+import React, { Component, type ReactNode } from 'react';
+
+interface ErrorBoundaryProps {
+  children: ReactNode;
+}
+
+interface ErrorBoundaryState {
+  hasError: boolean;
+  error: Error | null;
+}
+
+class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+  constructor(props: ErrorBoundaryProps) {
+    super(props);
+    this.state = {
+      hasError: false,
+      error: null
+    };
+  }
+
+  static getDerivedStateFromError(error: Error): ErrorBoundaryState {
+    return {
+      hasError: true,
+      error
+    };
+  }
+
+  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
+    console.error("Uncaught error:", error, errorInfo);
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return <>
+        <h1>Something went wrong.</h1>
+        <pre>
+          {this.state.error?.stack}
+        </pre>
+      </>;
+    }
+
+    return this.props.children;
+  }
+}
+
+export default ErrorBoundary;