synapse-react-client
Version:
[](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [](https://badge.fury.io/js/synaps
161 lines • 7.39 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var lodash_es_1 = require("lodash-es");
var React = (0, tslib_1.__importStar)(require("react"));
var utils_1 = require("../utils");
var queryUtils_1 = require("../utils/functions/queryUtils");
var sqlFunctions_1 = require("../utils/functions/sqlFunctions");
var SynapseConstants_1 = require("../utils/SynapseConstants");
var CardContainer_1 = (0, tslib_1.__importDefault)(require("./CardContainer"));
/**
* Class wraps around CardContainer and serves as a standalone logic container for rendering cards.
* This same logic exists in QueryWrapper, but the two serve two distinct purposes, making this component
* sufficiently distinct.
*
* @class CardContainerLogic
* @extends {React.Component}
*/
var CardContainerLogic = /** @class */ (function (_super) {
(0, tslib_1.__extends)(CardContainerLogic, _super);
function CardContainerLogic(props) {
var _this = _super.call(this, props) || this;
_this.executeInitialQueryRequest = _this.executeInitialQueryRequest.bind(_this);
_this.getLastQueryRequest = _this.getLastQueryRequest.bind(_this);
_this.getNextPageOfData = _this.getNextPageOfData.bind(_this);
_this.state = CardContainerLogic.defaultState;
return _this;
}
/**
* Compute default query request
*
* @memberof QueryWrapper
*/
CardContainerLogic.prototype.componentDidMount = function () {
this.executeInitialQueryRequest();
};
/**
* @memberof QueryWrapper
*
*/
CardContainerLogic.prototype.componentDidUpdate = function (prevProps) {
/**
* If token has changed (they signed in) or sql query has changed
* or search params have updated then perform an update.
*/
var _a = prevProps.searchParams, prevSearchParams = _a === void 0 ? {} : _a;
var _b = this.props.searchParams, currentSearchParams = _b === void 0 ? {} : _b;
var hasSearchParamsChanged = !(0, lodash_es_1.isEqual)(prevSearchParams, currentSearchParams);
var hasTokenChanged = this.props.token !== prevProps.token;
var hasSqlChanged = this.props.sql !== prevProps.sql;
if (hasTokenChanged || hasSqlChanged || hasSearchParamsChanged) {
this.executeInitialQueryRequest();
}
};
/**
* Pass down a deep clone (so no side affects on the child's part) of the
* last query request made
*
* @returns
* @memberof QueryWrapper
*/
CardContainerLogic.prototype.getLastQueryRequest = function () {
return (0, lodash_es_1.cloneDeep)(this.state.queryRequest);
};
/**
* Grab the next page of data, pulling in 25 more rows.
*
* @param {*} queryRequest Query request as specified by
* https://rest-docs.synapse.org/rest/org/sagebionetworks/repo/model/table/Query.html
* @memberof QueryWrapper
*/
CardContainerLogic.prototype.getNextPageOfData = function (queryRequest) {
return (0, tslib_1.__awaiter)(this, void 0, void 0, function () {
var _this = this;
return (0, tslib_1.__generator)(this, function (_a) {
switch (_a.label) {
case 0:
this.setState({
isLoading: true,
});
return [4 /*yield*/, (0, queryUtils_1.getNextPageOfData)(queryRequest, this.state.data, this.props.token).then(function (newState) {
_this.setState((0, tslib_1.__assign)((0, tslib_1.__assign)({}, newState), { isLoading: false, queryRequest: (0, lodash_es_1.cloneDeep)(queryRequest) }));
})];
case 1:
_a.sent();
return [2 /*return*/];
}
});
});
};
/**
* Execute the initial query passed into the component
*
* @param {*} queryRequest Query request as specified by
* https://rest-docs.synapse.org/rest/org/sagebionetworks/repo/model/table/Query.html
* @memberof QueryWrapper
*/
CardContainerLogic.prototype.executeInitialQueryRequest = function () {
var _this = this;
var _a;
this.setState({
isLoading: true,
});
var sqlUsed = (0, sqlFunctions_1.insertConditionsFromSearchParams)(this.props.sql, this.props.searchParams, this.props.sqlOperator);
var entityId = (0, sqlFunctions_1.parseEntityIdFromSqlStatement)(sqlUsed);
var limit = (_a = this.props.limit) !== null && _a !== void 0 ? _a : SynapseConstants_1.DEFAULT_PAGE_SIZE;
// we don't set this in the state because it hardcodes the sql query, on componentDidUpdate
// we need the sql to change
var initQueryRequest = {
concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',
partMask: utils_1.SynapseConstants.BUNDLE_MASK_QUERY_COLUMN_MODELS |
utils_1.SynapseConstants.BUNDLE_MASK_QUERY_FACETS |
utils_1.SynapseConstants.BUNDLE_MASK_QUERY_RESULTS |
utils_1.SynapseConstants.BUNDLE_MASK_QUERY_COUNT,
entityId: entityId,
query: {
sql: sqlUsed,
limit: limit,
offset: 0,
},
};
utils_1.SynapseClient.getQueryTableResults(initQueryRequest, this.props.token)
.then(function (data) {
var queryRequestWithoutCount = (0, lodash_es_1.cloneDeep)(initQueryRequest);
queryRequestWithoutCount.partMask =
utils_1.SynapseConstants.BUNDLE_MASK_QUERY_COLUMN_MODELS |
utils_1.SynapseConstants.BUNDLE_MASK_QUERY_FACETS |
utils_1.SynapseConstants.BUNDLE_MASK_QUERY_RESULTS;
var hasMoreData = data.queryResult.queryResults.rows.length === limit;
var newState = {
hasMoreData: hasMoreData,
data: data,
queryRequest: queryRequestWithoutCount,
isLoading: false,
totalResultsNoFacet: data.queryCount,
};
_this.setState(newState);
})
.catch(function (err) {
console.log('Failed to get data ', err);
});
};
/**
* Render the children without any formatting
*/
CardContainerLogic.prototype.render = function () {
// only forward the necessary props
var _a = this.props, sql = _a.sql, searchParams = _a.searchParams, token = _a.token, rest = (0, tslib_1.__rest)(_a, ["sql", "searchParams", "token"]);
return (React.createElement(CardContainer_1.default, (0, tslib_1.__assign)({}, rest, { data: this.state.data, getLastQueryRequest: this.getLastQueryRequest, getNextPageOfData: this.getNextPageOfData, hasMoreData: this.state.hasMoreData, isLoading: this.state.isLoading })));
};
CardContainerLogic.defaultState = {
data: undefined,
isLoading: true,
queryRequest: {},
totalResultsNoFacet: 0,
hasMoreData: true,
};
return CardContainerLogic;
}(React.Component));
exports.default = CardContainerLogic;
//# sourceMappingURL=CardContainerLogic.js.map