UNPKG

3.59 kBJavaScriptView Raw
1/**
2 * react-router v8.0.0
3 *
4 * Copyright (c) Remix Software Inc.
5 *
6 * This source code is licensed under the MIT license found in the
7 * LICENSE.md file in the root directory of this source tree.
8 *
9 * @license MIT
10 */
11import { isRouteErrorResponse } from "../../router/utils.js";
12import { Scripts, useFrameworkContext } from "./components.js";
13import * as React$1 from "react";
14//#region lib/dom/ssr/errorBoundaries.tsx
15var RemixErrorBoundary = class extends React$1.Component {
16 constructor(props) {
17 super(props);
18 this.state = {
19 error: props.error || null,
20 location: props.location
21 };
22 }
23 static getDerivedStateFromError(error) {
24 return { error };
25 }
26 static getDerivedStateFromProps(props, state) {
27 if (state.location !== props.location) return {
28 error: props.error || null,
29 location: props.location
30 };
31 return {
32 error: props.error || state.error,
33 location: state.location
34 };
35 }
36 render() {
37 if (this.state.error) return /* @__PURE__ */ React$1.createElement(RemixRootDefaultErrorBoundary, {
38 error: this.state.error,
39 isOutsideRemixApp: true
40 });
41 else return this.props.children;
42 }
43};
44/**
45* When app's don't provide a root level ErrorBoundary, we default to this.
46*/
47function RemixRootDefaultErrorBoundary({ error, isOutsideRemixApp }) {
48 let { nonce } = useFrameworkContext();
49 console.error(error);
50 let heyDeveloper = /* @__PURE__ */ React$1.createElement("script", {
51 nonce,
52 dangerouslySetInnerHTML: { __html: `
53 console.log(
54 "💿 Hey developer 👋. You can provide a way better UX than this when your app throws errors. Check out https://reactrouter.com/how-to/error-boundary for more information."
55 );
56 ` }
57 });
58 if (isRouteErrorResponse(error)) return /* @__PURE__ */ React$1.createElement(BoundaryShell, { title: "Unhandled Thrown Response!" }, /* @__PURE__ */ React$1.createElement("h1", { style: { fontSize: "24px" } }, error.status, " ", error.statusText), null);
59 let errorInstance;
60 if (error instanceof Error) errorInstance = error;
61 else {
62 let errorString = error == null ? "Unknown Error" : typeof error === "object" && "toString" in error ? error.toString() : JSON.stringify(error);
63 errorInstance = new Error(errorString);
64 }
65 return /* @__PURE__ */ React$1.createElement(BoundaryShell, {
66 title: "Application Error!",
67 isOutsideRemixApp
68 }, /* @__PURE__ */ React$1.createElement("h1", { style: { fontSize: "24px" } }, "Application Error"), /* @__PURE__ */ React$1.createElement("pre", { style: {
69 padding: "2rem",
70 background: "hsla(10, 50%, 50%, 0.1)",
71 color: "red",
72 overflow: "auto"
73 } }, errorInstance.stack), heyDeveloper);
74}
75function BoundaryShell({ title, renderScripts, isOutsideRemixApp, children }) {
76 let { routeModules } = useFrameworkContext();
77 if (routeModules.root?.Layout && !isOutsideRemixApp) return children;
78 return /* @__PURE__ */ React$1.createElement("html", { lang: "en" }, /* @__PURE__ */ React$1.createElement("head", null, /* @__PURE__ */ React$1.createElement("meta", { charSet: "utf-8" }), /* @__PURE__ */ React$1.createElement("meta", {
79 name: "viewport",
80 content: "width=device-width,initial-scale=1,viewport-fit=cover"
81 }), /* @__PURE__ */ React$1.createElement("title", null, title)), /* @__PURE__ */ React$1.createElement("body", null, /* @__PURE__ */ React$1.createElement("main", { style: {
82 fontFamily: "system-ui, sans-serif",
83 padding: "2rem"
84 } }, children, renderScripts ? /* @__PURE__ */ React$1.createElement(Scripts, null) : null)));
85}
86//#endregion
87export { BoundaryShell, RemixErrorBoundary, RemixRootDefaultErrorBoundary };