Merged in feat/sw-2874-move-select-rate (pull request #2750)

Approved-by: Joakim Jäderberg

packages/booking-flow/lib/components/ErrorBoundary/ErrorBoundary.tsx

@@ -0,0 +1,49 @@
+import * as Sentry from "@sentry/nextjs"
+import React from "react"
+
+import { logger } from "@scandic-hotels/common/logger"
+
+type ErrorBoundaryProps = {
+  children: React.ReactNode
+  fallback?: React.ReactNode
+}
+type ErrorBoundaryState = { hasError: boolean; error?: Error }
+
+export class ErrorBoundary extends React.Component<
+  ErrorBoundaryProps,
+  ErrorBoundaryState
+> {
+  constructor(props: ErrorBoundaryProps) {
+    super(props)
+    this.state = { hasError: false }
+  }
+
+  static getDerivedStateFromError(error: Error) {
+    return { hasError: true, error }
+  }
+
+  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
+    logger.error("ErrorBoundary caught an error:", error, errorInfo)
+    Sentry.captureException(error, { extra: { errorInfo } })
+  }
+
+  render() {
+    if (this.state.hasError) {
+      const hasFallback = !!this.props.fallback
+
+      return (
+        <>
+          {hasFallback && this.props.fallback}
+          {!hasFallback && <h2>Something went wrong.</h2>}
+          {process.env.NODE_ENV === "development" && (
+            <button onClick={() => this.setState({ hasError: false })}>
+              Reset
+            </button>
+          )}
+        </>
+      )
+    }
+
+    return this.props.children
+  }
+}