UNPKG

synapse-react-client

Version:

[![Build Status](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client.svg?branch=main)](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [![npm version](https://badge.fury.io/js/synapse-react-client.svg)](https://badge.fury.io/js/synaps

133 lines 6.92 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.QueryFilter = exports.applyChangesToRangeColumn = exports.applyMultipleChangesToValuesColumn = exports.applyChangesToValuesColumn = void 0; var tslib_1 = require("tslib"); var React = (0, tslib_1.__importStar)(require("react")); var RangeFacetFilter_1 = require("./RangeFacetFilter"); var EnumFacetFilter_1 = require("./EnumFacetFilter"); var QueryWrapper_1 = require("../../QueryWrapper"); var convertFacetToFacetColumnValuesRequest = function (facet) { return ({ concreteType: 'org.sagebionetworks.repo.model.table.FacetColumnValuesRequest', columnName: facet.columnName, facetValues: facet.facetValues .filter(function (facet) { return facet.isSelected === true; }) .map(function (facet) { return facet.value; }), }); }; var convertFacetColumnRangeRequest = function (facet) { var result = { concreteType: 'org.sagebionetworks.repo.model.table.FacetColumnRangeRequest', columnName: facet.columnName, // The name of the faceted column }; if (facet.columnMin) { result = (0, tslib_1.__assign)((0, tslib_1.__assign)({}, result), { min: facet.columnMin, max: facet.columnMax }); } return result; }; var patchRequestFacets = function (changedFacet, lastRequest) { var _a, _b; var selections = (_b = (_a = lastRequest === null || lastRequest === void 0 ? void 0 : lastRequest.query) === null || _a === void 0 ? void 0 : _a.selectedFacets) !== null && _b !== void 0 ? _b : []; var changedFacetIndex = selections.findIndex(function (facet) { return facet.columnName === changedFacet.columnName; }); var isEmptyValuesFacet = changedFacet.concreteType === 'org.sagebionetworks.repo.model.table.FacetColumnValuesRequest' && (!changedFacet.facetValues || !changedFacet.facetValues.length); if (changedFacetIndex > -1) { if (isEmptyValuesFacet) { selections.splice(changedFacetIndex, 1); } else { selections[changedFacetIndex] = changedFacet; } } else { selections.push(changedFacet); } return selections; }; function applyChangesToValuesColumn(lastRequest, facet, onChangeFn, facetName, checked) { if (checked === void 0) { checked = false; } if (facetName) { facet.facetValues.forEach(function (facetValue) { if (facetValue.value === facetName) { facetValue.isSelected = checked; } }); } else { // else clear all facet.facetValues.forEach(function (facet) { facet.isSelected = false; }); } var changedFacet = convertFacetToFacetColumnValuesRequest(facet); var result = patchRequestFacets(changedFacet, lastRequest); onChangeFn(result); } exports.applyChangesToValuesColumn = applyChangesToValuesColumn; // This handles multiple checkbox selection with delay refresh var applyMultipleChangesToValuesColumn = function (lastRequest, facet, onChangeFn, facetNameMap) { var facetNames = (facetNameMap && Object.keys(facetNameMap)) || []; if (facetNames.length) { facet.facetValues.forEach(function (facetValue) { if (facetNames.includes(facetValue.value)) { facetValue.isSelected = facetNameMap ? facetNameMap[facetValue.value] : false; } }); } var changedFacet = convertFacetToFacetColumnValuesRequest(facet); var result = patchRequestFacets(changedFacet, lastRequest); onChangeFn(result); }; exports.applyMultipleChangesToValuesColumn = applyMultipleChangesToValuesColumn; //rangeChanges var applyChangesToRangeColumn = function (lastRequest, facet, onChangeFn, values) { facet.columnMin = values[0]; facet.columnMax = values[1]; var changedFacet = convertFacetColumnRangeRequest(facet); var result = patchRequestFacets(changedFacet, lastRequest); onChangeFn(result); }; exports.applyChangesToRangeColumn = applyChangesToRangeColumn; var QueryFilter = function (_a) { var data = _a.data, _b = _a.isLoading, isLoading = _b === void 0 ? false : _b, getLastQueryRequest = _a.getLastQueryRequest, executeQueryRequest = _a.executeQueryRequest, facetAliases = _a.facetAliases, facetsToFilter = _a.facetsToFilter, topLevelControlsState = _a.topLevelControlsState; if (!data) { return React.createElement(React.Fragment, null); } var showFacetFilter = topLevelControlsState.showFacetFilter; var columnModels = data.columnModels; var facets = data.facets; if (facetsToFilter) { facets = facets.filter(function (facet) { return facetsToFilter.includes(facet.columnName); }); } var lastRequest = getLastQueryRequest ? getLastQueryRequest() : undefined; var applyChanges = function (facets) { var queryRequest = getLastQueryRequest(); queryRequest.query.selectedFacets = facets; queryRequest.query.offset = 0; executeQueryRequest(queryRequest); }; return (React.createElement("div", { className: "QueryFilter " + (showFacetFilter ? QueryWrapper_1.QUERY_FILTERS_EXPANDED_CSS : QueryWrapper_1.QUERY_FILTERS_COLLAPSED_CSS) }, React.createElement("h4", { className: "QueryFilter__title" }, "Filter Data By"), isLoading && React.createElement("div", null, "Loading..."), !isLoading && facets.map(function (facet, index) { var columnModel = columnModels.find(function (model) { return model.name === facet.columnName; }); var shouldStartCollapsed = index > 2; return (React.createElement("div", { className: "QueryFilter__facet", key: facet.columnName }, facet.facetType === 'enumeration' && columnModel && (React.createElement(EnumFacetFilter_1.EnumFacetFilter, { containerAs: "Collapsible", collapsed: shouldStartCollapsed, facetValues: facet.facetValues, columnModel: columnModel, facetAliases: facetAliases, onChange: function (facetNamesMap) { return (0, exports.applyMultipleChangesToValuesColumn)(lastRequest, facet, applyChanges, facetNamesMap); }, onClear: function () { return applyChangesToValuesColumn(lastRequest, facet, applyChanges); } })), facet.facetType === 'range' && columnModel && (React.createElement(RangeFacetFilter_1.RangeFacetFilter, { facetResult: facet, columnModel: columnModel, facetAliases: facetAliases, collapsed: shouldStartCollapsed, onChange: function (values) { return (0, exports.applyChangesToRangeColumn)(lastRequest, facet, applyChanges, values); } })))); }))); }; exports.QueryFilter = QueryFilter; //# sourceMappingURL=QueryFilter.js.map