synapse-react-client
Version:
[](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [](https://badge.fury.io/js/synaps
75 lines • 4.21 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SynapseErrorBoundary = exports.TableRowFallbackComponent = exports.ErrorFallbackComponent = exports.ErrorBanner = exports.ClientError = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var react_bootstrap_1 = require("react-bootstrap");
var react_error_boundary_1 = require("react-error-boundary");
var ErrorUtils_1 = require("../utils/ErrorUtils");
var SynapseContext_1 = require("../utils/SynapseContext");
var SignInButton_1 = (0, tslib_1.__importDefault)(require("./SignInButton"));
var ClientError = function (props) {
var accessToken = (0, SynapseContext_1.useSynapseContext)().accessToken;
var error = props.error;
var loginError = (error.status === 403 || error.status === 401) && !accessToken;
var accessDenied = error.status === 403 && accessToken;
return (react_1.default.createElement(react_1.default.Fragment, null,
loginError && (react_1.default.createElement(react_1.default.Fragment, null,
"Please ",
react_1.default.createElement(SignInButton_1.default, null),
" to view this resource.")),
accessDenied && react_1.default.createElement(react_1.default.Fragment, null, "You are not authorized to access this resource."),
// if we don't have a friendly error message then show the error
!accessDenied && !loginError && react_1.default.createElement(react_1.default.Fragment, null, error.reason)));
};
exports.ClientError = ClientError;
var ErrorBanner = function (props) {
var error = props.error, reloadButtonFn = props.reloadButtonFn;
if (!error) {
return react_1.default.createElement(react_1.default.Fragment, null);
}
var synapseClientError = undefined;
var jsError = undefined;
var stringError = undefined;
if ((0, ErrorUtils_1.isSynapseClientError)(error)) {
synapseClientError = error;
}
else if ((0, ErrorUtils_1.isError)(error)) {
jsError = error;
}
else if (typeof error === 'string') {
stringError = error;
}
return (react_1.default.createElement("div", { className: "Error bootstrap-4-backport" },
react_1.default.createElement(react_bootstrap_1.Alert, { dismissible: false, show: true, variant: 'danger', transition: false },
react_1.default.createElement("p", null,
synapseClientError && react_1.default.createElement(exports.ClientError, { error: synapseClientError }),
jsError && jsError.message,
stringError && stringError),
reloadButtonFn && (react_1.default.createElement(react_bootstrap_1.Button, { variant: "default", onClick: reloadButtonFn }, "Reload")))));
};
exports.ErrorBanner = ErrorBanner;
var ErrorFallbackComponent = function (_a) {
var error = _a.error, resetErrorBoundary = _a.resetErrorBoundary;
return (react_1.default.createElement("div", { role: "alert", className: "bootstrap-4-backport SRC-marginBottomTop" },
react_1.default.createElement(exports.ErrorBanner, { error: error, reloadButtonFn: resetErrorBoundary })));
};
exports.ErrorFallbackComponent = ErrorFallbackComponent;
var TableRowFallbackComponent = function (_a) {
var error = _a.error, resetErrorBoundary = _a.resetErrorBoundary;
return (react_1.default.createElement("tr", null,
react_1.default.createElement("td", { colSpan: 999 },
react_1.default.createElement(exports.ErrorBanner, { error: error, reloadButtonFn: resetErrorBoundary }))));
};
exports.TableRowFallbackComponent = TableRowFallbackComponent;
/**
* ErrorBoundary component that uses the default error fallback component, unless overridden.
* Internally uses `react-error-boundary`.
*
* Use with {@link react-error-boundary#handleError | handleError}
* @param props
* @returns
*/
var SynapseErrorBoundary = function (props) { return (react_1.default.createElement(react_error_boundary_1.ErrorBoundary, (0, tslib_1.__assign)({ FallbackComponent: exports.ErrorFallbackComponent }, props))); };
exports.SynapseErrorBoundary = SynapseErrorBoundary;
//# sourceMappingURL=ErrorBanner.js.map