@learningpool/ui 1.6.0-beta.5 → 1.6.0-beta.7

package/components/navigation/VerticalNavigation/AvatarPanel.js

@@ -1,97 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useEffect } from 'react';
-import { Avatar, Box, Typography, IconButton, Button, Link, List, ListItem, ListItemButton, ListItemIcon, ListItemText, Tooltip } from '../../../index';
-import { useTheme } from '@mui/material/styles';
-import EditIcon from '@mui/icons-material/Edit';
-import GroupIcon from '@mui/icons-material/Group';
-import BarChartIcon from '@mui/icons-material/BarChart';
-import ArchiveIcon from '@mui/icons-material/Archive';
-import LogoutIcon from '@mui/icons-material/Logout';
-import { tooltipDelay } from '../../../utils/theme';
-var AvatarPanel = function (props) {
-    var _a;
-    var theme = useTheme();
-    var avatarName = props.avatarName, editProfileText = props.editProfileText, logoutText = props.logoutText, rest = __rest(props, ["avatarName", "editProfileText", "logoutText"]);
-    useEffect(function () { return setAvatarInitials(handleAvatarInitials(avatarName)); }, [
-        avatarName
-    ]);
-    var handleAvatarInitials = function (avatar) {
-        var _a, _b;
-        var firstInitial = avatar.split('')[0] || '';
-        var secondInitial = '';
-        if (((_a = avatarName.split(' ')) === null || _a === void 0 ? void 0 : _a.length) > 1) {
-            firstInitial = avatarName.split(' ')[0][0];
-            if (((_b = avatar.split(' ')[1]) === null || _b === void 0 ? void 0 : _b.length) > 0) {
-                secondInitial = avatar === null || avatar === void 0 ? void 0 : avatar.split(' ')[1][0];
-            }
-        }
-        return "".concat(firstInitial).concat(secondInitial);
-    };
-    var _b = React.useState((_a = handleAvatarInitials(avatarName)) !== null && _a !== void 0 ? _a : 'AN'), avatarInitials = _b[0], setAvatarInitials = _b[1];
-    return (_jsxs(Box, __assign({ style: {
-            alignItems: 'center',
-            backgroundColor: theme.palette.mode === 'dark'
-                ? theme.palette.primary.dark
-                : '#E6EAF0',
-            boxSizing: 'border-box',
-            display: 'flex',
-            flexDirection: 'column',
-            height: '100%',
-            justifyContent: 'space-between',
-            overflow: 'hidden',
-            padding: theme.spacing(2),
-            width: '100%',
-            zIndex: '1'
-        } }, rest, { children: [_jsx(Tooltip, __assign({ title: logoutText !== null && logoutText !== void 0 ? logoutText : 'Log out', placement: 'bottom', enterDelay: tooltipDelay.start, leaveDelay: tooltipDelay.end }, { children: _jsx(IconButton, __assign({ style: {
-                        left: theme.direction === 'rtl' ? theme.spacing(1) : 'auto',
-                        position: 'absolute',
-                        right: theme.direction === 'rtl' ? 'auto' : theme.spacing(1),
-                        top: theme.spacing(1)
-                    } }, { children: _jsx(LogoutIcon, {}) })) })), _jsxs(Box, __assign({ style: {
-                    alignItems: 'center',
-                    display: 'flex',
-                    flexDirection: 'column'
-                } }, { children: [_jsx(Avatar, __assign({ style: {
-                            fontSize: '3.75rem',
-                            height: 150,
-                            marginBottom: theme.spacing(2),
-                            width: 150
-                        } }, { children: avatarInitials })), _jsxs(Typography, __assign({ component: "h3", variant: "h4", style: {
-                            marginBottom: theme.spacing(2)
-                        } }, { children: [_jsx("span", __assign({ style: { fontWeight: 300 } }, { children: "Hi," })), " ", _jsx("strong", { children: avatarName.split(' ')[0] })] })), _jsxs(Box, __assign({ style: {
-                            marginBottom: theme.spacing(1)
-                        } }, { children: [_jsx(Button, __assign({ variant: 'contained', color: 'primary', size: 'medium', style: { marginRight: '0.5rem' } }, { children: "View Profile" })), _jsx(Tooltip, __assign({ title: editProfileText !== null && editProfileText !== void 0 ? editProfileText : 'Edit profile', placement: 'bottom', enterDelay: tooltipDelay.start, leaveDelay: tooltipDelay.end }, { children: _jsx(IconButton, { children: _jsx(EditIcon, {}) }) }))] }))] })), _jsxs(Box, __assign({ style: {
-                    alignItems: 'center',
-                    display: 'flex',
-                    flexDirection: 'column'
-                } }, { children: [_jsxs(List, __assign({ style: { marginBottom: theme.spacing(2) } }, { children: [_jsx(ListItem, __assign({ disablePadding: true }, { children: _jsxs(ListItemButton, __assign({ component: Link, role: 'link' }, { children: [_jsx(ListItemIcon, __assign({ "aria-hidden": true, style: {
-                                                minWidth: theme.spacing(5)
-                                            } }, { children: _jsx(GroupIcon, {}) })), _jsx(ListItemText, { children: "My Team" })] })) })), _jsx(ListItem, __assign({ disablePadding: true }, { children: _jsxs(ListItemButton, __assign({ component: Link, role: 'link' }, { children: [_jsx(ListItemIcon, __assign({ "aria-hidden": true, style: {
-                                                minWidth: theme.spacing(5)
-                                            } }, { children: _jsx(BarChartIcon, {}) })), _jsx(ListItemText, { children: "My Reports" })] })) })), _jsx(ListItem, __assign({ disablePadding: true }, { children: _jsxs(ListItemButton, __assign({ component: Link, role: 'link' }, { children: [_jsx(ListItemIcon, __assign({ "aria-hidden": true, style: {
-                                                minWidth: theme.spacing(5)
-                                            } }, { children: _jsx(ArchiveIcon, {}) })), _jsx(ListItemText, { children: "Archived Playlists" })] })) }))] })), _jsx(Button, __assign({ variant: 'outlined', color: 'primary', size: 'medium' }, { children: "Admin Portal" }))] }))] })));
-};
-export default AvatarPanel;