@airplane/views
Version:
A React library for building Airplane views. Views components are optimized in style and functionality to produce internal apps that are easy to build and maintain.
54 lines (53 loc) • 1.96 kB
JavaScript
import { jsxs, Fragment, jsx } from "react/jsx-runtime";
import { useState } from "react";
import { DialogComponent } from "../dialog/Dialog.js";
import { HeadingComponent } from "../heading/Heading.js";
import { StackComponent } from "../stack/Stack.js";
import { getIsLocalDev } from "../../getIsLocalDev.js";
import { useToggleModal } from "../../message/useToggleModal.js";
import { ComponentErrorState } from "./ComponentErrorState.js";
import { useStyles } from "./ErrorModal.styles.js";
import { ErrorStackTrace } from "./ErrorStackTrace.js";
import { LatestRunDetails } from "./LatestRunDetails.js";
const ComponentErrorFallback = ({
error,
errorInfo,
componentName,
latestRun,
errorID
}) => {
const isLocalDev = getIsLocalDev();
const [opened, setOpened] = useState(isLocalDev);
useToggleModal(setOpened, errorID);
return /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsx(ComponentErrorModal, { error, errorInfo, componentName, latestRun, opened, setOpened }),
/* @__PURE__ */ jsx(ComponentErrorState, { componentName, onClick: () => setOpened(true) })
] });
};
const ComponentErrorModal = ({
error,
errorInfo,
componentName,
latestRun,
opened,
setOpened
}) => {
const {
classes
} = useStyles();
return /* @__PURE__ */ jsx(DialogComponent, { opened, onClose: () => setOpened(false), title: /* @__PURE__ */ jsxs(HeadingComponent, { level: 4, className: classes.title, children: [
"Something went wrong",
" ",
componentName ? ` in the ${componentName} component` : ""
] }), size: "100%", classNames: {
modal: classes.modal
}, trapFocus: false, children: /* @__PURE__ */ jsxs(StackComponent, { children: [
/* @__PURE__ */ jsx(ErrorStackTrace, { error, errorInfo }),
latestRun && /* @__PURE__ */ jsx(LatestRunDetails, { ...latestRun })
] }) });
};
export {
ComponentErrorFallback,
ComponentErrorModal
};
//# sourceMappingURL=ComponentErrorFallback.js.map