synapse-react-client
Version:
[](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [](https://badge.fury.io/js/synaps
72 lines • 4.38 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var utils_1 = require("../utils/");
var react_1 = (0, tslib_1.__importStar)(require("react"));
var moment_1 = (0, tslib_1.__importDefault)(require("moment"));
var MarkdownSynapse_1 = (0, tslib_1.__importDefault)(require("./MarkdownSynapse"));
var LoadingScreen_1 = (0, tslib_1.__importDefault)(require("./LoadingScreen"));
var react_bootstrap_1 = require("react-bootstrap");
var SynapseContext_1 = require("../utils/SynapseContext");
var TableFeedCards = function (_a) {
var tableEntityId = _a.tableEntityId;
var accessToken = (0, SynapseContext_1.useSynapseContext)().accessToken;
var _b = (0, react_1.useState)(), rowSet = _b[0], setRowSet = _b[1];
var _c = (0, react_1.useState)(3), itemCountShowing = _c[0], setItemCountShowing = _c[1];
var mounted = true;
(0, react_1.useEffect)(function () {
var executeQuery = function () {
if (mounted) {
if (rowSet) {
return;
}
var request = {
concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',
query: {
sql: "SELECT \"categories\", \"date\", \"title\", \"mdDescription\" FROM " + tableEntityId + " ORDER BY \"date\" desc",
},
entityId: tableEntityId,
partMask: utils_1.SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,
};
utils_1.SynapseClient.getQueryTableResults(request, accessToken).then(function (data) {
setRowSet(data.queryResult.queryResults);
});
}
};
executeQuery();
return function () {
mounted = false;
};
}, [tableEntityId, accessToken]);
if (!rowSet) {
return LoadingScreen_1.default;
}
var headers = rowSet.headers;
var categoriesColIndex = headers.findIndex(function (col) { return col.name === 'categories'; });
var dateColIndex = headers.findIndex(function (col) { return col.name === 'date'; });
var titleColIndex = headers.findIndex(function (col) { return col.name === 'title'; });
var descriptionColIndex = headers.findIndex(function (col) { return col.name === 'mdDescription'; });
return (react_1.default.createElement("div", { className: "Feed bootstrap-4-backport" },
react_1.default.createElement("div", { className: "FeedItems" }, rowSet.rows.map(function (row, index) {
if (index > itemCountShowing - 1) {
return;
}
var categoriesList = JSON.parse(row.values[categoriesColIndex]);
var dateStringTimestamp = row.values[dateColIndex];
var title = row.values[titleColIndex];
var description = row.values[descriptionColIndex];
return (react_1.default.createElement("div", { className: "FeedItem", key: "row-" + index },
react_1.default.createElement("div", null,
categoriesList && (react_1.default.createElement("div", { className: "FeedItemCategories" }, categoriesList.map(function (categoryName, categoryIndex) {
return (react_1.default.createElement("div", { key: "row-" + index + ",categoryIndex-" + categoryIndex, className: "FeedItemCategory" }, categoryName));
}))),
react_1.default.createElement("p", { className: "FeedItemDate" }, (0, moment_1.default)(new Date(parseInt(dateStringTimestamp))).format('MMMM YYYY')),
react_1.default.createElement("p", { className: "FeedItemTitle" }, title),
react_1.default.createElement("div", { className: "FeedItemDescription" },
react_1.default.createElement(MarkdownSynapse_1.default, { markdown: description })))));
})),
rowSet.rows.length > itemCountShowing && (react_1.default.createElement("div", { className: "FeedViewAllNewsButtonContainer" },
react_1.default.createElement(react_bootstrap_1.Button, { variant: "primary", size: "lg", className: "pill", onClick: function () { return setItemCountShowing(itemCountShowing + 3); } }, "VIEW MORE NEWS")))));
};
exports.default = TableFeedCards;
//# sourceMappingURL=TableFeedCards.js.map