@selfcommunity/react-ui 0.11.0-alpha.97 → 0.11.0-alpha.99
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/NavigationMenuIconButton/DefaultDrawerContent.d.ts +1 -0
- package/lib/cjs/components/NavigationMenuIconButton/DefaultDrawerContent.js +5 -5
- package/lib/cjs/components/NavigationMenuIconButton/NavigationMenuDrawer.js +3 -3
- package/lib/cjs/components/NavigationToolbar/NavigationToolbar.js +1 -1
- package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.d.ts +1 -0
- package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.js +5 -5
- package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js +3 -3
- package/lib/esm/components/NavigationToolbar/NavigationToolbar.js +1 -1
- package/lib/umd/react-ui.js +1 -1
- package/package.json +2 -2
|
@@ -3,6 +3,7 @@ import { CategoryProps } from '../Category';
|
|
|
3
3
|
export interface DefaultDrawerContentProps extends BoxProps {
|
|
4
4
|
CategoryItemProps?: CategoryProps;
|
|
5
5
|
tagImage?: string;
|
|
6
|
+
onClose?: () => void;
|
|
6
7
|
onClickHome?: () => void;
|
|
7
8
|
}
|
|
8
9
|
export default function DefaultDrawerContent(inProps: DefaultDrawerContentProps): JSX.Element;
|
|
@@ -32,7 +32,7 @@ function DefaultDrawerContent(inProps) {
|
|
|
32
32
|
props: inProps,
|
|
33
33
|
name: PREFIX
|
|
34
34
|
});
|
|
35
|
-
const { className, CategoryItemProps = { showTooltip: true }, tagImage = '/', onClickHome } = props, rest = tslib_1.__rest(props, ["className", "CategoryItemProps", "tagImage", "onClickHome"]);
|
|
35
|
+
const { className, CategoryItemProps = { showTooltip: true }, tagImage = '/', onClose, onClickHome } = props, rest = tslib_1.__rest(props, ["className", "CategoryItemProps", "tagImage", "onClose", "onClickHome"]);
|
|
36
36
|
// HOOKS
|
|
37
37
|
const { categories } = (0, react_core_1.useSCFetchCategories)();
|
|
38
38
|
const [categoriesOrdered, setCategoriesOrdered] = (0, react_1.useState)([]);
|
|
@@ -123,14 +123,14 @@ function DefaultDrawerContent(inProps) {
|
|
|
123
123
|
}
|
|
124
124
|
});
|
|
125
125
|
//order
|
|
126
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.List, Object.assign({ className: classes.navigation }, { children: [scUserContext.user && ((0, jsx_runtime_1.jsx)(material_1.ListItem, Object.assign({ disablePadding: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.HOME_ROUTE_NAME, {}),
|
|
126
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.List, Object.assign({ className: classes.navigation }, { children: [scUserContext.user && ((0, jsx_runtime_1.jsx)(material_1.ListItem, Object.assign({ disablePadding: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.HOME_ROUTE_NAME, {}), onClick: handleClickHome }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "home" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.home", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.home" }) })] })) }))), coursesEnabled && (scUserContext.user || contentAvailable) && ((0, jsx_runtime_1.jsx)(material_1.ListItem, Object.assign({ disablePadding: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "courses" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.courses", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.courses" }) })] })) }))), groupsEnabled && scUserContext.user && ((0, jsx_runtime_1.jsx)(material_1.ListItem, Object.assign({ disablePadding: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_ROUTE_NAME, {}) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.groups", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.groups" }) })] })) }))), eventsEnabled && (scUserContext.user || contentAvailable) && ((0, jsx_runtime_1.jsx)(material_1.ListItem, Object.assign({ disablePadding: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENTS_ROUTE_NAME, {}) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.events", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.events" }) })] })) }))), exploreStreamEnabled && (contentAvailable || scUserContext.user) && ((0, jsx_runtime_1.jsx)(material_1.ListItem, Object.assign({ disablePadding: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EXPLORE_ROUTE_NAME, {}) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "explore" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.explore", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.explore" }) })] })) })))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle1", className: classes.title }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.title", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.title" }) })), !categoriesOrdered.length && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.noResults }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.noResults", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.noResults" }) }))), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [Object.entries(taggedCategories).map(([tagName, categories]) => {
|
|
127
127
|
var _a;
|
|
128
128
|
if (!categories.length || !((_a = categories[0].tags) === null || _a === void 0 ? void 0 : _a.length))
|
|
129
129
|
return null;
|
|
130
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Accordion, Object.assign({ expanded: expanded === tagName, onChange: handleChange(tagName), elevation: 0, onFocus: (e) => e.stopPropagation()
|
|
130
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Accordion, Object.assign({ expanded: expanded === tagName, onChange: handleChange(tagName), elevation: 0, onFocus: (e) => e.stopPropagation() }, { children: [(0, jsx_runtime_1.jsx)(material_1.AccordionSummary, Object.assign({ expandIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) }, { children: (0, jsx_runtime_1.jsx)(BaseItem_1.default, { elevation: 0, image: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: tagName, src: tagName === DefaultDrawerContent_1.DefaultCategoryTagName ? formazione_1.default : tagImage, variant: "square" }), primary: tagName, disableTypography: false }) })), (0, jsx_runtime_1.jsx)(material_1.AccordionDetails, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: categories.map((c) => ((0, jsx_runtime_1.jsx)(material_1.Zoom, Object.assign({ in: true }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ ButtonBaseProps: {
|
|
131
131
|
component: react_core_1.Link,
|
|
132
132
|
to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, c)
|
|
133
|
-
}, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }) }), c.id))) }) })] }), tagName));
|
|
134
|
-
}), untaggedCategories.length > 0 && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: untaggedCategories.map((c, index) => ((0, jsx_runtime_1.jsx)(material_1.Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ ButtonBaseProps: { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }, c.id) }), index))) }))] })] })));
|
|
133
|
+
}, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)), { onClick: onClose })) }) }), c.id))) }) })] }), tagName));
|
|
134
|
+
}), untaggedCategories.length > 0 && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: untaggedCategories.map((c, index) => ((0, jsx_runtime_1.jsx)(material_1.Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ ButtonBaseProps: { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)), { onClick: onClose })) }, c.id) }), index))) }))] })] })));
|
|
135
135
|
}
|
|
136
136
|
exports.default = DefaultDrawerContent;
|
|
@@ -25,7 +25,7 @@ const classes = {
|
|
|
25
25
|
const Root = (0, material_1.styled)(material_1.Drawer, {
|
|
26
26
|
name: PREFIX,
|
|
27
27
|
slot: 'Root',
|
|
28
|
-
overridesResolver: (
|
|
28
|
+
overridesResolver: (_props, styles) => styles.root
|
|
29
29
|
})(({ theme }) => ({}));
|
|
30
30
|
function NavigationMenuDrawer(inProps) {
|
|
31
31
|
// PROPS
|
|
@@ -33,7 +33,7 @@ function NavigationMenuDrawer(inProps) {
|
|
|
33
33
|
props: inProps,
|
|
34
34
|
name: PREFIX
|
|
35
35
|
});
|
|
36
|
-
const { className = null, showDrawerHeader = true, defaultDrawerContentProps = null, drawerHeaderContent = (0, jsx_runtime_1.jsx)(DefaultHeaderContent_1.default, {}), drawerContent = (0, jsx_runtime_1.jsx)(DefaultDrawerContent_1.default, Object.assign({}, defaultDrawerContentProps)), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = { hideTracksWhenNotNeeded: true }, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = tslib_1.__rest(props, ["className", "showDrawerHeader", "defaultDrawerContentProps", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
|
|
36
|
+
const { className = null, showDrawerHeader = true, defaultDrawerContentProps = null, drawerHeaderContent = (0, jsx_runtime_1.jsx)(DefaultHeaderContent_1.default, {}), drawerContent = (0, jsx_runtime_1.jsx)(DefaultDrawerContent_1.default, Object.assign({ onClose: () => onClose({}, 'backdropClick') }, defaultDrawerContentProps)), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = { hideTracksWhenNotNeeded: true }, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = tslib_1.__rest(props, ["className", "showDrawerHeader", "defaultDrawerContentProps", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
|
|
37
37
|
const footerContent = (() => {
|
|
38
38
|
if (typeof drawerFooterContent === 'function') {
|
|
39
39
|
return drawerFooterContent({ handleCloseMenuDrawer: onClose });
|
|
@@ -45,6 +45,6 @@ function NavigationMenuDrawer(inProps) {
|
|
|
45
45
|
}
|
|
46
46
|
return drawerFooterContent;
|
|
47
47
|
})();
|
|
48
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ anchor: "left", className: (0, classnames_1.default)(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })), (0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: classes.drawerContent
|
|
48
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ anchor: "left", className: (0, classnames_1.default)(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })), (0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: classes.drawerContent }, { children: drawerContent })) })), showDrawerFooterContent && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: "div", className: classes.drawerFooter }, { children: footerContent || ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: (0, jsx_runtime_1.jsx)(CreateLiveStreamButton_1.default, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) })) }))] })));
|
|
49
49
|
}
|
|
50
50
|
exports.default = NavigationMenuDrawer;
|
|
@@ -175,7 +175,7 @@ function NavigationToolbar(inProps) {
|
|
|
175
175
|
}), "aria-label": "Groups", to: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), component: react_core_1.Link }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }) }))), eventsEnabled && (scUserContext.user || preferences[react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY]) && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: (0, classnames_1.default)(classes.events, {
|
|
176
176
|
[classes.active]: value.startsWith(scRoutingContext.url(react_core_1.SCRoutes.EVENTS_ROUTE_NAME, {}))
|
|
177
177
|
}), "aria-label": "Events", to: scRoutingContext.url(react_core_1.SCRoutes.EVENTS_ROUTE_NAME, {}), component: react_core_1.Link }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) })))] })));
|
|
178
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: [(0, jsx_runtime_1.jsx)(NavigationMenuIconButtonComponent, Object.assign({}, NavigationMenuIconButtonComponentProps)), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.HOME_ROUTE_NAME, {}), className: classes.logo
|
|
178
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: [(0, jsx_runtime_1.jsx)(NavigationMenuIconButtonComponent, Object.assign({}, NavigationMenuIconButtonComponentProps)), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.HOME_ROUTE_NAME, {}), className: classes.logo, onClick: handleClickHome }, { children: (0, jsx_runtime_1.jsx)("img", { src: preferences[react_core_1.SCPreferences.LOGO_NAVBAR_LOGO], alt: "logo" }) })), !scUserContext.user && !preferences[react_core_1.SCPreferences.ADDONS_CLOSED_COMMUNITY] && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ color: "inherit", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.SIGNUP_ROUTE_NAME, {}), className: classes.register }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.appBar.navigation.register", defaultMessage: "ui.appBar.navigation.register" }) }))), preferences[react_core_1.SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_ENABLED] && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: preferences[react_core_1.SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_TEXT] ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: preferences[react_core_1.SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_TEXT] }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ target: "blank", to: preferences[react_core_1.SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL], className: classes.customItem }, { children: (0, jsx_runtime_1.jsx)("img", { src: preferences[react_core_1.SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE], alt: "custom_item" }) })) }))) : ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ target: "blank", to: preferences[react_core_1.SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL], className: classes.customItem }, { children: (0, jsx_runtime_1.jsx)("img", { src: preferences[react_core_1.SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE], alt: "custom_item" }) }))) })), _children, (preferences[react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY] || scUserContext.user) && !disableSearch ? ((0, jsx_runtime_1.jsx)(SearchAutocomplete_1.default, Object.assign({ className: classes.search, blurOnSelect: true }, SearchAutocompleteComponentProps))) : ((0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.search })), startActions, scUserContext.user ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [showComposer && (0, jsx_runtime_1.jsx)(ComposerIconButton_1.default, Object.assign({ className: classes.composer }, ComposerIconButtonProps)), (0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: scUserContext.user.username }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user), "aria-label": "Profile", className: classes.profile }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUserContext.user.username, src: scUserContext.user.avatar }) })) })), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: (0, classnames_1.default)(classes.notification, {
|
|
179
179
|
[classes.active]: value.startsWith(scRoutingContext.url(react_core_1.SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}))
|
|
180
180
|
}), "aria-label": "Notification", onClick: handleOpenNotificationMenu }, { children: (0, jsx_runtime_1.jsx)(material_1.Badge, Object.assign({ badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "notifications_active" }) })) })), Boolean(anchorNotification) && ((0, jsx_runtime_1.jsx)(NotificationMenu_1.default, Object.assign({ className: classes.notificationsMenu, id: "notification-menu", anchorEl: anchorNotification, open: true, onClose: handleCloseNotificationMenu, onClick: handleCloseNotificationMenu, transformOrigin: { horizontal: 'right', vertical: 'top' }, anchorOrigin: { horizontal: 'right', vertical: 'bottom' } }, NotificationMenuProps)))] }), privateMessagingEnabled && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: (0, classnames_1.default)(classes.messages, {
|
|
181
181
|
[classes.active]: value.startsWith(scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}))
|
|
@@ -3,6 +3,7 @@ import { CategoryProps } from '../Category';
|
|
|
3
3
|
export interface DefaultDrawerContentProps extends BoxProps {
|
|
4
4
|
CategoryItemProps?: CategoryProps;
|
|
5
5
|
tagImage?: string;
|
|
6
|
+
onClose?: () => void;
|
|
6
7
|
onClickHome?: () => void;
|
|
7
8
|
}
|
|
8
9
|
export default function DefaultDrawerContent(inProps: DefaultDrawerContentProps): JSX.Element;
|
|
@@ -30,7 +30,7 @@ export default function DefaultDrawerContent(inProps) {
|
|
|
30
30
|
props: inProps,
|
|
31
31
|
name: PREFIX
|
|
32
32
|
});
|
|
33
|
-
const { className, CategoryItemProps = { showTooltip: true }, tagImage = '/', onClickHome } = props, rest = __rest(props, ["className", "CategoryItemProps", "tagImage", "onClickHome"]);
|
|
33
|
+
const { className, CategoryItemProps = { showTooltip: true }, tagImage = '/', onClose, onClickHome } = props, rest = __rest(props, ["className", "CategoryItemProps", "tagImage", "onClose", "onClickHome"]);
|
|
34
34
|
// HOOKS
|
|
35
35
|
const { categories } = useSCFetchCategories();
|
|
36
36
|
const [categoriesOrdered, setCategoriesOrdered] = useState([]);
|
|
@@ -121,13 +121,13 @@ export default function DefaultDrawerContent(inProps) {
|
|
|
121
121
|
}
|
|
122
122
|
});
|
|
123
123
|
//order
|
|
124
|
-
return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_jsxs(List, Object.assign({ className: classes.navigation }, { children: [scUserContext.user && (_jsx(ListItem, Object.assign({ disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}),
|
|
124
|
+
return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_jsxs(List, Object.assign({ className: classes.navigation }, { children: [scUserContext.user && (_jsx(ListItem, Object.assign({ disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), onClick: handleClickHome }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "home" }) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.home", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.home" }) })] })) }))), coursesEnabled && (scUserContext.user || contentAvailable) && (_jsx(ListItem, Object.assign({ disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.COURSES_ROUTE_NAME, {}) }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "courses" }) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.courses", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.courses" }) })] })) }))), groupsEnabled && scUserContext.user && (_jsx(ListItem, Object.assign({ disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.GROUPS_ROUTE_NAME, {}) }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "groups" }) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.groups", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.groups" }) })] })) }))), eventsEnabled && (scUserContext.user || contentAvailable) && (_jsx(ListItem, Object.assign({ disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}) }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "CalendarIcon" }) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.events", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.events" }) })] })) }))), exploreStreamEnabled && (contentAvailable || scUserContext.user) && (_jsx(ListItem, Object.assign({ disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.EXPLORE_ROUTE_NAME, {}) }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "explore" }) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.explore", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.navigation.explore" }) })] })) })))] })), _jsx(Divider, {}), _jsx(Typography, Object.assign({ variant: "subtitle1", className: classes.title }, { children: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.title", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.title" }) })), !categoriesOrdered.length && (_jsx(Typography, Object.assign({ variant: "body1", className: classes.noResults }, { children: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.noResults", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.noResults" }) }))), _jsxs(_Fragment, { children: [Object.entries(taggedCategories).map(([tagName, categories]) => {
|
|
125
125
|
var _a;
|
|
126
126
|
if (!categories.length || !((_a = categories[0].tags) === null || _a === void 0 ? void 0 : _a.length))
|
|
127
127
|
return null;
|
|
128
|
-
return (_jsxs(Accordion, Object.assign({ expanded: expanded === tagName, onChange: handleChange(tagName), elevation: 0, onFocus: (e) => e.stopPropagation()
|
|
128
|
+
return (_jsxs(Accordion, Object.assign({ expanded: expanded === tagName, onChange: handleChange(tagName), elevation: 0, onFocus: (e) => e.stopPropagation() }, { children: [_jsx(AccordionSummary, Object.assign({ expandIcon: _jsx(Icon, { children: "expand_more" }) }, { children: _jsx(BaseItem, { elevation: 0, image: _jsx(Avatar, { alt: tagName, src: tagName === DefaultCategoryTagName ? FormazionePlaceholder : tagImage, variant: "square" }), primary: tagName, disableTypography: false }) })), _jsx(AccordionDetails, { children: _jsx(List, { children: categories.map((c) => (_jsx(Zoom, Object.assign({ in: true }, { children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: {
|
|
129
129
|
component: Link,
|
|
130
130
|
to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c)
|
|
131
|
-
}, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }) }), c.id))) }) })] }), tagName));
|
|
132
|
-
}), untaggedCategories.length > 0 && (_jsx(_Fragment, { children: untaggedCategories.map((c, index) => (_jsx(Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }, c.id) }), index))) }))] })] })));
|
|
131
|
+
}, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)), { onClick: onClose })) }) }), c.id))) }) })] }), tagName));
|
|
132
|
+
}), untaggedCategories.length > 0 && (_jsx(_Fragment, { children: untaggedCategories.map((c, index) => (_jsx(Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)), { onClick: onClose })) }, c.id) }), index))) }))] })] })));
|
|
133
133
|
}
|
|
@@ -23,7 +23,7 @@ const classes = {
|
|
|
23
23
|
const Root = styled(Drawer, {
|
|
24
24
|
name: PREFIX,
|
|
25
25
|
slot: 'Root',
|
|
26
|
-
overridesResolver: (
|
|
26
|
+
overridesResolver: (_props, styles) => styles.root
|
|
27
27
|
})(({ theme }) => ({}));
|
|
28
28
|
export default function NavigationMenuDrawer(inProps) {
|
|
29
29
|
// PROPS
|
|
@@ -31,7 +31,7 @@ export default function NavigationMenuDrawer(inProps) {
|
|
|
31
31
|
props: inProps,
|
|
32
32
|
name: PREFIX
|
|
33
33
|
});
|
|
34
|
-
const { className = null, showDrawerHeader = true, defaultDrawerContentProps = null, drawerHeaderContent = _jsx(DefaultHeaderContent, {}), drawerContent = _jsx(DefaultDrawerContent, Object.assign({}, defaultDrawerContentProps)), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = { hideTracksWhenNotNeeded: true }, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = __rest(props, ["className", "showDrawerHeader", "defaultDrawerContentProps", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
|
|
34
|
+
const { className = null, showDrawerHeader = true, defaultDrawerContentProps = null, drawerHeaderContent = _jsx(DefaultHeaderContent, {}), drawerContent = _jsx(DefaultDrawerContent, Object.assign({ onClose: () => onClose({}, 'backdropClick') }, defaultDrawerContentProps)), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = { hideTracksWhenNotNeeded: true }, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = __rest(props, ["className", "showDrawerHeader", "defaultDrawerContentProps", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
|
|
35
35
|
const footerContent = (() => {
|
|
36
36
|
if (typeof drawerFooterContent === 'function') {
|
|
37
37
|
return drawerFooterContent({ handleCloseMenuDrawer: onClose });
|
|
@@ -43,5 +43,5 @@ export default function NavigationMenuDrawer(inProps) {
|
|
|
43
43
|
}
|
|
44
44
|
return drawerFooterContent;
|
|
45
45
|
})();
|
|
46
|
-
return (_jsxs(Root, Object.assign({ anchor: "left", className: classNames(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, _jsx(IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: _jsx(Icon, { children: "close" }) }))] })), _jsx(Divider, {})] })), _jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsx(List, Object.assign({ className: classes.drawerContent
|
|
46
|
+
return (_jsxs(Root, Object.assign({ anchor: "left", className: classNames(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, _jsx(IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: _jsx(Icon, { children: "close" }) }))] })), _jsx(Divider, {})] })), _jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsx(List, Object.assign({ className: classes.drawerContent }, { children: drawerContent })) })), showDrawerFooterContent && (_jsx(_Fragment, { children: _jsx(Box, Object.assign({ component: "div", className: classes.drawerFooter }, { children: footerContent || (_jsx(Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: _jsx(CreateLiveStreamButton, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) })) }))] })));
|
|
47
47
|
}
|
|
@@ -173,7 +173,7 @@ export default function NavigationToolbar(inProps) {
|
|
|
173
173
|
}), "aria-label": "Groups", to: scRoutingContext.url(SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "groups" }) }))), eventsEnabled && (scUserContext.user || preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY]) && (_jsx(IconButton, Object.assign({ className: classNames(classes.events, {
|
|
174
174
|
[classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}))
|
|
175
175
|
}), "aria-label": "Events", to: scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "CalendarIcon" }) })))] })));
|
|
176
|
-
return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_jsx(NavigationMenuIconButtonComponent, Object.assign({}, NavigationMenuIconButtonComponentProps)), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), className: classes.logo
|
|
176
|
+
return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_jsx(NavigationMenuIconButtonComponent, Object.assign({}, NavigationMenuIconButtonComponentProps)), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), className: classes.logo, onClick: handleClickHome }, { children: _jsx("img", { src: preferences[SCPreferences.LOGO_NAVBAR_LOGO], alt: "logo" }) })), !scUserContext.user && !preferences[SCPreferences.ADDONS_CLOSED_COMMUNITY] && (_jsx(Button, Object.assign({ color: "inherit", component: Link, to: scRoutingContext.url(SCRoutes.SIGNUP_ROUTE_NAME, {}), className: classes.register }, { children: _jsx(FormattedMessage, { id: "ui.appBar.navigation.register", defaultMessage: "ui.appBar.navigation.register" }) }))), preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_ENABLED] && (_jsx(_Fragment, { children: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_TEXT] ? (_jsx(Tooltip, Object.assign({ title: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_TEXT] }, { children: _jsx(Link, Object.assign({ target: "blank", to: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL], className: classes.customItem }, { children: _jsx("img", { src: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE], alt: "custom_item" }) })) }))) : (_jsx(Link, Object.assign({ target: "blank", to: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL], className: classes.customItem }, { children: _jsx("img", { src: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE], alt: "custom_item" }) }))) })), _children, (preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY] || scUserContext.user) && !disableSearch ? (_jsx(SearchAutocomplete, Object.assign({ className: classes.search, blurOnSelect: true }, SearchAutocompleteComponentProps))) : (_jsx(Box, { className: classes.search })), startActions, scUserContext.user ? (_jsxs(_Fragment, { children: [showComposer && _jsx(ComposerIconButton, Object.assign({ className: classes.composer }, ComposerIconButtonProps)), _jsx(Tooltip, Object.assign({ title: scUserContext.user.username }, { children: _jsx(IconButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user), "aria-label": "Profile", className: classes.profile }, { children: _jsx(Avatar, { alt: scUserContext.user.username, src: scUserContext.user.avatar }) })) })), _jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ className: classNames(classes.notification, {
|
|
177
177
|
[classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}))
|
|
178
178
|
}), "aria-label": "Notification", onClick: handleOpenNotificationMenu }, { children: _jsx(Badge, Object.assign({ badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary" }, { children: _jsx(Icon, { children: "notifications_active" }) })) })), Boolean(anchorNotification) && (_jsx(NotificationMenu, Object.assign({ className: classes.notificationsMenu, id: "notification-menu", anchorEl: anchorNotification, open: true, onClose: handleCloseNotificationMenu, onClick: handleCloseNotificationMenu, transformOrigin: { horizontal: 'right', vertical: 'top' }, anchorOrigin: { horizontal: 'right', vertical: 'bottom' } }, NotificationMenuProps)))] }), privateMessagingEnabled && (_jsx(IconButton, Object.assign({ className: classNames(classes.messages, {
|
|
179
179
|
[classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}))
|