synapse-react-client/dist/components/error/RouteErrorBoundary.js

[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie

import { jsx as s, jsxs as i } from "react/jsx-runtime";
import { Button as l, Collapse as h } from "@mui/material";
import { useState as u } from "react";
import { useRouteError as f, isRouteErrorResponse as p } from "react-router";
import e from "./RouteErrorBoundary.module.scss.js";
function B(c) {
  const { icon: n } = c, r = f(), [a, d] = u(!1);
  let o, t;
  p(r) ? (o = `${r.status} ${r.statusText}`, t = r.data?.message) : r instanceof Error ? (o = r.message, t = r.stack) : typeof r == "string" ? o = r : o = "An unknown error occurred";
  const m = () => {
    window.location.reload();
  };
  return /* @__PURE__ */ s("div", { className: e.container, children: /* @__PURE__ */ i("div", { className: e.errorBox, children: [
    n && /* @__PURE__ */ s("img", { src: n, alt: "Logo", className: e.icon }),
    /* @__PURE__ */ s("h1", { className: e.errorTitle, children: "Something went wrong" }),
    /* @__PURE__ */ s("p", { className: e.errorMessage, children: o }),
    t && /* @__PURE__ */ i("div", { className: e.detailsContainer, children: [
      /* @__PURE__ */ i(
        l,
        {
          variant: "text",
          onClick: () => d(!a),
          className: e.detailsButton,
          children: [
            a ? "Hide" : "Show",
            " details"
          ]
        }
      ),
      /* @__PURE__ */ s(h, { in: a, children: /* @__PURE__ */ s("div", { className: e.detailsBox, children: /* @__PURE__ */ s("pre", { className: e.detailsText, children: t }) }) })
    ] }),
    /* @__PURE__ */ s(
      l,
      {
        variant: "contained",
        onClick: m,
        className: e.reloadButton,
        children: "Reload Page"
      }
    )
  ] }) });
}
export {
  B as RouteErrorBoundary
};
//# sourceMappingURL=RouteErrorBoundary.js.map