synapse-react-client
Version:
[](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [](https://badge.fury.io/js/synaps
72 lines • 4.41 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CreateProjectModal = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importStar)(require("react"));
var react_bootstrap_1 = require("react-bootstrap");
var utils_1 = require("../utils");
var SynapseContext_1 = require("../utils/SynapseContext");
var FullWidthAlert_1 = (0, tslib_1.__importDefault)(require("./FullWidthAlert"));
var react_bootstrap_2 = require("react-bootstrap");
var CreateProjectModal = function (_a) {
var _b = _a.isShowingModal, isShowingModal = _b === void 0 ? false : _b, onClose = _a.onClose;
var accessToken = (0, SynapseContext_1.useSynapseContext)().accessToken;
var _c = (0, react_1.useState)(''), projectName = _c[0], setProjectName = _c[1];
var _d = (0, react_1.useState)(false), isShowingSuccessAlert = _d[0], setIsShowingSuccessAlert = _d[1];
var _e = (0, react_1.useState)(), errorMessage = _e[0], setErrorMessage = _e[1];
var hide = function () {
setProjectName('');
setErrorMessage(undefined);
onClose();
};
var onCreateProject = function () { return (0, tslib_1.__awaiter)(void 0, void 0, void 0, function () {
var newProject, err_1;
return (0, tslib_1.__generator)(this, function (_a) {
switch (_a.label) {
case 0:
_a.trys.push([0, 2, , 3]);
return [4 /*yield*/, utils_1.SynapseClient.createProject(projectName, accessToken)];
case 1:
newProject = _a.sent();
setIsShowingSuccessAlert(true);
hide();
window.location.href = "/#!Synapse:" + newProject.id;
return [3 /*break*/, 3];
case 2:
err_1 = _a.sent();
if (err_1.reason) {
setErrorMessage(err_1.reason);
}
else {
setErrorMessage(err_1.toString());
}
return [3 /*break*/, 3];
case 3: return [2 /*return*/];
}
});
}); };
return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(react_bootstrap_1.Modal, { className: "CreateProjectModal bootstrap-4-backport", show: isShowingModal, animation: false, onHide: hide },
react_1.default.createElement(react_bootstrap_1.Modal.Header, { closeButton: true },
react_1.default.createElement(react_bootstrap_1.Modal.Title, null, "Create a new Project")),
react_1.default.createElement(react_bootstrap_1.Modal.Body, null,
react_1.default.createElement(react_bootstrap_2.Form.Group, null,
react_1.default.createElement(react_bootstrap_2.Form.Label, { htmlFor: 'projectInput' }, "Project Name"),
react_1.default.createElement(react_bootstrap_2.Form.Control, { id: "projectInput", "data-testid": "projectInput", value: projectName, onChange: function (event) {
setProjectName(event.target.value);
}, onKeyDown: function (event) {
if (event.key === 'Enter') {
if (projectName !== '') {
onCreateProject();
}
}
} })),
errorMessage && react_1.default.createElement(react_bootstrap_1.Alert, { variant: 'danger' }, errorMessage)),
react_1.default.createElement(react_bootstrap_1.Modal.Footer, null,
react_1.default.createElement("div", { className: "ButtonContainer" },
react_1.default.createElement(react_bootstrap_1.Button, { variant: "default", onClick: onClose }, "Cancel"),
react_1.default.createElement(react_bootstrap_1.Button, { variant: "primary", onClick: onCreateProject }, "Save")))),
react_1.default.createElement(FullWidthAlert_1.default, { show: isShowingSuccessAlert, variant: 'info', title: 'Project created', description: '', autoCloseAfterDelayInSeconds: 10, onClose: function () { setIsShowingSuccessAlert(false); } })));
};
exports.CreateProjectModal = CreateProjectModal;
//# sourceMappingURL=CreateProjectModal.js.map