sccoreui
Version:
ui-sccore
31 lines (30 loc) • 2.61 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const svg_component_1 = tslib_1.__importDefault(require("../../directives/svg-component"));
const button_1 = tslib_1.__importDefault(require("../button/button"));
function ErrorBoundary({ children }) {
const [hasError, setHasError] = (0, react_1.useState)(false);
(0, react_1.useEffect)(() => {
const errorHandler = (error, errorInfo) => {
setHasError(true);
// You can log the error here
console.error(error, errorInfo, 'error details');
};
// Add the error handler to the window object
window.addEventListener('error', errorHandler);
// Clean up the error handler
return () => {
window.removeEventListener('error', errorHandler);
};
}, []);
if (hasError) {
console.log(hasError, 'error occured');
// Fallback UI for when an error occurs
return (0, jsx_runtime_1.jsx)("div", Object.assign({ role: "alert", className: "errorContainer bg-red-50" }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `flex align-items-center justify-content-center border-1 border-red-200 border-round-xl` }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-3 flex-column align-items-center border-round-lg p-6 error_description" }, { children: [(0, jsx_runtime_1.jsx)("h2", Object.assign({ className: "my-0 text-gray-900" }, { children: "Fail to connect" })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "my-0 text-gray-600" }, { children: "Something went wrong! please refresh the page and try again." })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-3 mt-6" }, { children: [(0, jsx_runtime_1.jsxs)(button_1.default, Object.assign({ onClick: () => window.location.reload(), outlined: true, className: "flex bg-white focus:border-gray-400 align-items-center gap-3 px-4 py-3" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "refresh-ccw-02" }), " Refresh"] })), (0, jsx_runtime_1.jsxs)(button_1.default, Object.assign({ className: "flex align-items-center gap-3 px-4 py-3", onClick: () => (window.location.href = window.location.origin) }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-narrow-left", color: "#fff" }), " Go Back"] }))] }))] })) })) }));
}
return children;
}
exports.default = ErrorBoundary;