@overmap-ai/blocks 1.0.17-add-error-boundary-component.1 → 1.0.17-add-error-boundary-component.2

package/dist/blocks.js

@@ -13,7 +13,8 @@ import { Root as Root$1, Item as Item$1 } from "@radix-ui/react-toggle-group";
 import { Root as Root$2 } from "@radix-ui/react-toolbar";
 import * as RadixToast from "@radix-ui/react-toast";
 import { ToastProvider as ToastProvider$1, ToastViewport as ToastViewport$1 } from "@radix-ui/react-toast";
-import { ErrorBoundary } from "react-error-boundary";
+import { useErrorBoundary, ErrorBoundary } from "react-error-boundary";
+import FeatherIcon from "feather-icons-react";
 import { flushSync } from "react-dom";
 import { HeaderCell, Table as Table$1, Header, HeaderRow, Body, Cell, Row } from "@table-library/react-table-library/table.js";
 import { useTheme } from "@table-library/react-table-library/theme.js";
@@ -2261,22 +2262,34 @@ const _Separator = forwardRef(function Separator2({
   );
 });
 const Separator = memo(_Separator);
-const ErrorFallback = memo((props) => {
-  alert("FIND ME");
-  const { resetErrorBoundary } = props;
-  return /* @__PURE__ */ jsxs(Box, { style: { background: "red" }, p: "2", children: [
-    /* @__PURE__ */ jsx(Text$1, { children: "Something went wrong" }),
-    /* @__PURE__ */ jsx(Button2, { onClick: resetErrorBoundary, children: "Try again" })
+const ErrorFallback = memo(() => {
+  const { resetBoundary } = useErrorBoundary();
+  const height = "20px";
+  const centerStyles = { placeSelf: "center" };
+  return /* @__PURE__ */ jsxs(Flex, { gap: "2", direction: "row", children: [
+    /* @__PURE__ */ jsx("div", { style: { flexGrow: 1 } }),
+    /* @__PURE__ */ jsx(FeatherIcon, { icon: "alert-triangle", size: height, style: centerStyles }),
+    /* @__PURE__ */ jsx(Text$1, { style: { lineHeight: height, ...centerStyles }, children: "Something went wrong" }),
+    /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        "aria-label": "Try again",
+        variant: "soft",
+        onClick: resetBoundary,
+        style: centerStyles,
+        hoverEffects: ["spin180Clockwise"],
+        children: /* @__PURE__ */ jsx(FeatherIcon, { icon: "refresh-ccw", size: height })
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { style: { flexGrow: 1 } })
   ] });
 });
 ErrorFallback.displayName = "ErrorFallback";
 const OvermapErrorBoundary = memo((props) => {
   const logError = useCallback((error, info) => {
     console.error(error, info);
-    alert("Test");
   }, []);
-  alert(props.children);
-  return /* @__PURE__ */ jsx(Box, { style: { background: "green" }, p: "2", children: /* @__PURE__ */ jsx(ErrorBoundary, { fallbackRender: ErrorFallback, onError: logError, children: props.children }) });
+  return /* @__PURE__ */ jsx(ErrorBoundary, { fallback: /* @__PURE__ */ jsx(ErrorFallback, {}), onError: logError, children: props.children });
 });
 OvermapErrorBoundary.displayName = "OvermapErrorBoundary";
 function _extends() {