@selfcommunity/react-ui 0.7.5-alpha.3 → 0.7.5-alpha.5

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.
Files changed (6) hide show
  1. package/lib/cjs/components/NavigationMenuIconButton/DefaultDrawerContent.js +10 -3
  2. package/lib/cjs/components/UserProfileHeader/UserProfileHeader.js +5 -1
  3. package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.js +11 -4
  4. package/lib/esm/components/UserProfileHeader/UserProfileHeader.js +5 -1
  5. package/lib/umd/react-ui.js +1 -1
  6. package/package.json +4 -4
package/lib/cjs/components/NavigationMenuIconButton/DefaultDrawerContent.js CHANGED
@@ -5,6 +5,7 @@ const material_1 = require("@mui/material");
5
5
  const react_core_1 = require("@selfcommunity/react-core");
6
6
  const react_1 = tslib_1.__importStar(require("react"));
7
7
  const Category_1 = tslib_1.__importDefault(require("../Category"));
8
+ const react_intl_1 = require("react-intl");
8
9
  function DefaultDrawerContent() {
9
10
  // HOOKS
10
11
  const { categories } = (0, react_core_1.useSCFetchCategories)();
@@ -29,8 +30,14 @@ function DefaultDrawerContent() {
29
30
  onTouchStart: mouseEnter,
30
31
  onTouchMove: mouseLeave
31
32
  });
32
- return (react_1.default.createElement(react_1.default.Fragment, null, categories.map((c, index) => (react_1.default.createElement(material_1.Zoom, { in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' }, key: index },
33
- react_1.default.createElement(material_1.ListItem, { key: c.id },
34
- react_1.default.createElement(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 }, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id))))))))));
33
+ return (react_1.default.createElement(react_1.default.Fragment, null,
34
+ react_1.default.createElement(material_1.Typography, { variant: "subtitle1" },
35
+ react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.title", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.title" }),
36
+ " ",
37
+ react_1.default.createElement(material_1.Button, { variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORIES_LIST_ROUTE_NAME, {}) },
38
+ react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.seeAll", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.seeAll" }))),
39
+ categories.map((c, index) => (react_1.default.createElement(material_1.Zoom, { in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' }, key: index },
40
+ react_1.default.createElement(material_1.ListItem, { key: c.id },
41
+ react_1.default.createElement(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 }, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id))))))))));
35
42
  }
36
43
  exports.default = DefaultDrawerContent;
package/lib/cjs/components/UserProfileHeader/UserProfileHeader.js CHANGED
@@ -11,6 +11,7 @@ const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
11
11
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
12
12
  const system_1 = require("@mui/system");
13
13
  const constants_1 = require("./constants");
14
+ const UserAvatar_1 = tslib_1.__importDefault(require("../../shared/UserAvatar"));
14
15
  const classes = {
15
16
  root: `${constants_1.PREFIX}-root`,
16
17
  cover: `${constants_1.PREFIX}-cover`,
@@ -108,9 +109,12 @@ function UserProfileHeader(inProps) {
108
109
  ? { background: `url('${scUser.cover}') center / cover` }
109
110
  : { background: `url('${scPreferences.preferences[react_core_1.SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
110
111
  const realName = (isMe && scUserContext.user.real_name) || scUser.real_name;
112
+ const hasBadge = scUser && scUser.community_badge;
111
113
  return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest),
112
114
  react_1.default.createElement(material_1.Paper, { style: _backgroundCover, classes: { root: classes.cover } },
113
- react_1.default.createElement("img", { src: scUser.avatar ? scUser.avatar : '', className: classes.avatar }),
115
+ react_1.default.createElement(material_1.Box, { className: classes.avatar },
116
+ react_1.default.createElement(UserAvatar_1.default, { hide: !hasBadge },
117
+ react_1.default.createElement("img", { src: scUser.avatar ? scUser.avatar : '' }))),
114
118
  isMe && (react_1.default.createElement(react_1.default.Fragment, null,
115
119
  react_1.default.createElement(ChangePicture_1.default, Object.assign({ iconButton: true, onChange: handleChangeAvatar, className: classes.changePicture }, ChangePictureProps)),
116
120
  react_1.default.createElement("div", { className: classes.changeCover },
package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.js CHANGED
@@ -1,7 +1,8 @@
1
- import { ListItem, Zoom } from '@mui/material';
1
+ import { Button, ListItem, Typography, Zoom } from '@mui/material';
2
2
  import { Link, SCRoutes, useSCFetchCategories, useSCRouting } from '@selfcommunity/react-core';
3
3
  import React, { useState } from 'react';
4
4
  import Category from '../Category';
5
+ import { FormattedMessage } from 'react-intl';
5
6
  export default function DefaultDrawerContent() {
6
7
  // HOOKS
7
8
  const { categories } = useSCFetchCategories();
@@ -26,7 +27,13 @@ export default function DefaultDrawerContent() {
26
27
  onTouchStart: mouseEnter,
27
28
  onTouchMove: mouseLeave
28
29
  });
29
- return (React.createElement(React.Fragment, null, categories.map((c, index) => (React.createElement(Zoom, { in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' }, key: index },
30
- React.createElement(ListItem, { key: c.id },
31
- React.createElement(Category, Object.assign({ ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id))))))))));
30
+ return (React.createElement(React.Fragment, null,
31
+ React.createElement(Typography, { variant: "subtitle1" },
32
+ React.createElement(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.title", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.title" }),
33
+ " ",
34
+ React.createElement(Button, { variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.CATEGORIES_LIST_ROUTE_NAME, {}) },
35
+ React.createElement(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.seeAll", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.seeAll" }))),
36
+ categories.map((c, index) => (React.createElement(Zoom, { in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' }, key: index },
37
+ React.createElement(ListItem, { key: c.id },
38
+ React.createElement(Category, Object.assign({ ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id))))))))));
32
39
  }
package/lib/esm/components/UserProfileHeader/UserProfileHeader.js CHANGED
@@ -9,6 +9,7 @@ import UserProfileHeaderSkeleton from './Skeleton';
9
9
  import classNames from 'classnames';
10
10
  import { useThemeProps } from '@mui/system';
11
11
  import { PREFIX } from './constants';
12
+ import UserAvatar from '../../shared/UserAvatar';
12
13
  const classes = {
13
14
  root: `${PREFIX}-root`,
14
15
  cover: `${PREFIX}-cover`,
@@ -106,9 +107,12 @@ export default function UserProfileHeader(inProps) {
106
107
  ? { background: `url('${scUser.cover}') center / cover` }
107
108
  : { background: `url('${scPreferences.preferences[SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
108
109
  const realName = (isMe && scUserContext.user.real_name) || scUser.real_name;
110
+ const hasBadge = scUser && scUser.community_badge;
109
111
  return (React.createElement(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest),
110
112
  React.createElement(Paper, { style: _backgroundCover, classes: { root: classes.cover } },
111
- React.createElement("img", { src: scUser.avatar ? scUser.avatar : '', className: classes.avatar }),
113
+ React.createElement(Box, { className: classes.avatar },
114
+ React.createElement(UserAvatar, { hide: !hasBadge },
115
+ React.createElement("img", { src: scUser.avatar ? scUser.avatar : '' }))),
112
116
  isMe && (React.createElement(React.Fragment, null,
113
117
  React.createElement(ChangePicture, Object.assign({ iconButton: true, onChange: handleChangeAvatar, className: classes.changePicture }, ChangePictureProps)),
114
118
  React.createElement("div", { className: classes.changeCover },