synapse-react-client
Version:
[](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [](https://badge.fury.io/js/synaps
60 lines • 3.9 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.UserProfileLinksTabs = void 0;
var tslib_1 = require("tslib");
var Skeleton_1 = (0, tslib_1.__importDefault)(require("@material-ui/lab/Skeleton"));
var react_1 = (0, tslib_1.__importStar)(require("react"));
var useUserBundle_1 = require("../../utils/hooks/SynapseAPI/useUserBundle");
var Typography_1 = (0, tslib_1.__importDefault)(require("../../utils/typography/Typography"));
var ErrorBanner_1 = require("../ErrorBanner");
var IconSvg_1 = (0, tslib_1.__importDefault)(require("../IconSvg"));
var UserChallenges_1 = (0, tslib_1.__importDefault)(require("./UserChallenges"));
var UserProjects_1 = (0, tslib_1.__importDefault)(require("./UserProjects"));
var UserTeams_1 = (0, tslib_1.__importDefault)(require("./UserTeams"));
var UserProfileLinksTabs;
(function (UserProfileLinksTabs) {
UserProfileLinksTabs["PROJECTS"] = "Projects";
UserProfileLinksTabs["TEAMS"] = "Teams";
UserProfileLinksTabs["CHALLENGES"] = "Challenges";
})(UserProfileLinksTabs = exports.UserProfileLinksTabs || (exports.UserProfileLinksTabs = {}));
function UserProfileLinks(_a) {
var userId = _a.userId;
var _b = (0, react_1.useState)(UserProfileLinksTabs.PROJECTS), currentTab = _b[0], setCurrentTab = _b[1];
var userProfile = (0, useUserBundle_1.useGetUserProfile)(userId).data;
function getIconName(currentTab) {
switch (currentTab) {
case UserProfileLinksTabs.PROJECTS:
return 'dashboard';
case UserProfileLinksTabs.TEAMS:
return 'peopleTwoTone';
case UserProfileLinksTabs.CHALLENGES:
return 'challengesTwoTone';
}
}
return (react_1.default.createElement("div", { className: "UserProfileLinks" },
react_1.default.createElement(Typography_1.default, { variant: "headline2", className: "title" },
userProfile && react_1.default.createElement(react_1.default.Fragment, null, userProfile === null || userProfile === void 0 ? void 0 :
userProfile.userName,
"'s Items"),
!userProfile && react_1.default.createElement(Skeleton_1.default, { width: '75%' })),
react_1.default.createElement("div", { className: "Tabs" }, Object.keys(UserProfileLinksTabs).map(function (keyName) {
return (react_1.default.createElement("div", { className: "Tab", role: "tab", key: keyName, onClick: function (e) {
e.stopPropagation();
setCurrentTab(UserProfileLinksTabs[keyName]);
}, "aria-selected": UserProfileLinksTabs[keyName] === currentTab },
react_1.default.createElement(Typography_1.default, { variant: "buttonLink" },
react_1.default.createElement(IconSvg_1.default, { options: { icon: getIconName(UserProfileLinksTabs[keyName]) } }),
" ",
UserProfileLinksTabs[keyName])));
})),
react_1.default.createElement("div", { className: "TabContent" },
react_1.default.createElement(ErrorBanner_1.SynapseErrorBoundary, null,
currentTab === UserProfileLinksTabs.PROJECTS && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(UserProjects_1.default, { userId: userId }))),
currentTab === UserProfileLinksTabs.TEAMS && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(UserTeams_1.default, { userId: userId }))),
currentTab === UserProfileLinksTabs.CHALLENGES && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(UserChallenges_1.default, { userId: userId })))))));
}
exports.default = UserProfileLinks;
//# sourceMappingURL=UserProfileLinks.js.map