@navinc/base-react-components
Version:
Nav's Pattern Library
58 lines • 3.15 kB
JavaScript
;
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.createGuardedRoute = exports.GuardedRoute = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const prop_types_1 = __importDefault(require("prop-types"));
const react_router_dom_1 = require("react-router-dom");
const loading_view_js_1 = __importDefault(require("./loading-view.js"));
const GuardedRoute = (_a) => {
var {
// A boolean condition that must be met for the route to render.
condition,
// Boolean that determines if the condition logic is still loading. Used when condition must fetch async data first.
isConditionLoading,
// Component to render when condition is still loading (optional).
LoadingComponent = loading_view_js_1.default,
// Component to render when condition fails. This is required, since it will break React Router without one.
FailureComponent,
// The route component to render on condition success.
component: Component } = _a,
// The remaining props that we'll pass to React Router's Route component
routeProps = __rest(_a, ["condition", "isConditionLoading", "LoadingComponent", "FailureComponent", "component"]);
if (!FailureComponent)
throw new Error('You must provide a FailureComponent to your guarded route.');
return ((0, jsx_runtime_1.jsx)(react_router_dom_1.Route, Object.assign({}, routeProps, { render: (props) => {
if (LoadingComponent && isConditionLoading)
return (0, jsx_runtime_1.jsx)(LoadingComponent, Object.assign({}, props));
return !isConditionLoading && condition === true ? (0, jsx_runtime_1.jsx)(Component, Object.assign({}, props)) : (0, jsx_runtime_1.jsx)(FailureComponent, Object.assign({}, props));
} })));
};
exports.GuardedRoute = GuardedRoute;
exports.GuardedRoute.propTypes = {
condition: prop_types_1.default.bool,
isConditionLoading: prop_types_1.default.bool,
LoadingComponent: prop_types_1.default.elementType,
FailureComponent: prop_types_1.default.elementType.isRequired,
component: prop_types_1.default.elementType,
};
/**
* Create a GuardedRoute component with defaults.
* @param {*} defaults Supports `condition`, `isConditionLoading`, `LoadingComponent`, and `FailureComponent`.
*/
const createGuardedRoute = (defaults) => (props) => (0, jsx_runtime_1.jsx)(exports.GuardedRoute, Object.assign({}, defaults, props));
exports.createGuardedRoute = createGuardedRoute;
//# sourceMappingURL=guarded-route.js.map