synapse-react-client
Version:
[](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [](https://badge.fury.io/js/synaps
92 lines • 6.38 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.EvaluationCard = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importStar)(require("react"));
var SynapseClient_1 = require("../../utils/SynapseClient");
var react_bootstrap_1 = require("react-bootstrap");
var free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
var ErrorBanner_1 = require("../ErrorBanner");
var CreatedOnByUserDiv_1 = require("./CreatedOnByUserDiv");
var react_fontawesome_1 = require("@fortawesome/react-fontawesome");
var WarningModal_1 = (0, tslib_1.__importDefault)(require("../synapse_form_wrapper/WarningModal"));
var SynapseContext_1 = require("../../utils/SynapseContext");
/**
* This component is currently only intended to be used in Synapse.org.
* For this reason, the dropdown menu items are unimplemented as no components
* in this project implement their behavior. The dropdown options are also
* not shown if the current user does not have permissions for the action
*
* All Evaluation metadata must be provided to this component; it will not
* retrieve an Evaluation via a REST API call
*/
var EvaluationCard = function (_a) {
var evaluation = _a.evaluation, onEdit = _a.onEdit, onModifyAccess = _a.onModifyAccess, onSubmit = _a.onSubmit, onDeleteSuccess = _a.onDeleteSuccess;
var accessToken = (0, SynapseContext_1.useSynapseContext)().accessToken;
var _b = (0, react_1.useState)(), error = _b[0], setError = _b[1];
var _c = (0, react_1.useState)(), permissions = _c[0], setPermissions = _c[1];
(0, react_1.useEffect)(function () {
//clear error
setError(undefined);
(0, SynapseClient_1.getEvaluationPermissions)(evaluation.id, accessToken)
.then(function (retrievedPermissions) {
setPermissions(retrievedPermissions);
})
.catch(function (error) { return setError(error); });
}, [evaluation, accessToken]);
var onDelete = function () {
setError(undefined);
(0, SynapseClient_1.deleteEvaluation)(evaluation.id, accessToken)
.then(onDeleteSuccess)
.catch(setError);
};
return (react_1.default.createElement("div", { className: "bootstrap-4-backport evaluation-card" },
react_1.default.createElement(react_bootstrap_1.Card, null,
react_1.default.createElement(react_bootstrap_1.Card.Body, null,
error && react_1.default.createElement(ErrorBanner_1.ErrorBanner, { error: error }),
permissions && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(react_bootstrap_1.Row, null,
react_1.default.createElement(react_bootstrap_1.Col, null,
react_1.default.createElement("label", null, "EVALUATION QUEUE")),
react_1.default.createElement(react_bootstrap_1.Col, null,
react_1.default.createElement(EvaluationCardDropdown, { permissions: permissions, onDelete: onDelete, onEdit: onEdit, onModifyAccess: onModifyAccess }))),
react_1.default.createElement("h4", null,
evaluation.name,
" (",
evaluation.id,
")"),
react_1.default.createElement("label", null, "Description"),
react_1.default.createElement("p", null, evaluation.description),
react_1.default.createElement("label", null, "Instructions"),
react_1.default.createElement("p", null, evaluation.submissionInstructionsMessage),
react_1.default.createElement(CreatedOnByUserDiv_1.CreatedOnByUserDiv, { userId: evaluation.ownerId, date: new Date(evaluation.createdOn) }),
(permissions === null || permissions === void 0 ? void 0 : permissions.canSubmit) && (react_1.default.createElement(react_bootstrap_1.Button, { className: "submit-button", type: "primary", onClick: onSubmit }, "Submit"))))))));
};
exports.EvaluationCard = EvaluationCard;
var EvaluationCardDropdown = function (_a) {
var permissions = _a.permissions, onEdit = _a.onEdit, onModifyAccess = _a.onModifyAccess, onDelete = _a.onDelete;
var _b = (0, react_1.useState)(false), deleteWarningShow = _b[0], setDeleteWarningShow = _b[1];
if (!(permissions.canEdit ||
permissions.canChangePermissions ||
permissions.canDelete)) {
return null;
}
return (react_1.default.createElement(react_1.default.Fragment, null,
(permissions === null || permissions === void 0 ? void 0 : permissions.canDelete) && (react_1.default.createElement(WarningModal_1.default, { title: "Delete Evaluation Queue", modalBody: "Are you sure you want to delete the Evaluation Queue?", show: deleteWarningShow, confirmButtonText: "Delete", onConfirm: function () {
onDelete();
setDeleteWarningShow(false);
}, onConfirmCallbackArgs: [], onCancel: function () {
setDeleteWarningShow(false);
}, confirmButtonVariant: "danger" })),
react_1.default.createElement(react_bootstrap_1.Dropdown, { className: "float-right" },
react_1.default.createElement(react_bootstrap_1.Dropdown.Toggle, { variant: "link", className: "dropdown-no-caret" },
react_1.default.createElement(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faEllipsisV })),
react_1.default.createElement(react_bootstrap_1.Dropdown.Menu, { alignRight: true },
permissions.canEdit && (react_1.default.createElement(react_bootstrap_1.Dropdown.Item, { onClick: onEdit }, "Edit")),
permissions.canChangePermissions && (react_1.default.createElement(react_bootstrap_1.Dropdown.Item, { onClick: onModifyAccess }, "Modify Access")),
permissions.canDelete && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(react_bootstrap_1.Dropdown.Divider, null),
react_1.default.createElement(react_bootstrap_1.Dropdown.Item, { onClick: function () { return setDeleteWarningShow(true); } }, "Delete"),
' '))))));
};
//# sourceMappingURL=EvaluationCard.js.map