@vlsergey/react-bootstrap-pagetable
Version:
Complex solution to work with pageable data, including sorting, filtering, actions, changing displayed columns, etc.
35 lines (34 loc) • 2.85 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var react_router_dom_1 = require("react-router-dom");
var strToSort_1 = tslib_1.__importDefault(require("../sortable/strToSort"));
var fetchArgsToUrlParams_1 = tslib_1.__importDefault(require("./fetchArgsToUrlParams"));
var ReactRouterItemFieldCellLinkWrapper_1 = tslib_1.__importDefault(require("./ReactRouterItemFieldCellLinkWrapper"));
var urlParamsToFetchArgs_1 = tslib_1.__importDefault(require("./urlParamsToFetchArgs"));
var withReactRouter = function (Child) {
return function RoutedPageTable(_a) {
var _b = _a.defaultPage, defaultPage = _b === void 0 ? 0 : _b, _c = _a.defaultSize, defaultSize = _c === void 0 ? 10 : _c, defaultSort = _a.defaultSort, _d = _a.itemFieldCellLinkWrapper, itemFieldCellLinkWrapper = _d === void 0 ? ReactRouterItemFieldCellLinkWrapper_1.default : _d, itemModel = _a.itemModel, onFetchArgsChange = _a.onFetchArgsChange, urlParamsPrefix = _a.urlParamsPrefix, etcProps = tslib_1.__rest(_a, ["defaultPage", "defaultSize", "defaultSort", "itemFieldCellLinkWrapper", "itemModel", "onFetchArgsChange", "urlParamsPrefix"]);
var history = react_router_dom_1.useHistory();
var location = react_router_dom_1.useLocation();
var defaultFetchArgs = react_1.useMemo(function () {
return ({ page: defaultPage, size: defaultSize, sort: strToSort_1.default(defaultSort) });
}, [defaultPage, defaultSize, defaultSort]);
var toFetchArgs = react_1.useMemo(function () { return function (search) {
return urlParamsToFetchArgs_1.default(defaultFetchArgs, itemModel, urlParamsPrefix, new URLSearchParams(search));
}; }, [defaultFetchArgs, itemModel, urlParamsPrefix]);
var handleFetchArgsChange = react_1.useCallback(function (fetchArgs) {
var updated = fetchArgsToUrlParams_1.default(itemModel, urlParamsPrefix, location.search, fetchArgs);
var newSearch = updated.toString();
if (onFetchArgsChange) {
var newFetchArgs = toFetchArgs(newSearch);
onFetchArgsChange(newFetchArgs);
}
history.replace(location.pathname + "?" + newSearch);
}, [history, itemModel, location.pathname, location.search, onFetchArgsChange, toFetchArgs, urlParamsPrefix]);
var fetchArgs = react_1.useMemo(function () { return toFetchArgs(location.search); }, [location.search, toFetchArgs]);
return react_1.default.createElement(Child, tslib_1.__assign({}, etcProps, { fetchArgs: fetchArgs, itemFieldCellLinkWrapper: itemFieldCellLinkWrapper, itemModel: itemModel, onFetchArgsChange: handleFetchArgsChange }));
};
};
exports.default = withReactRouter;