@selfcommunity/react-ui 0.7.9-alpha.55 → 0.7.9-alpha.56

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 (34) hide show
  1. package/lib/cjs/components/FeedObject/Contributors/Contributors.js +1 -1
  2. package/lib/cjs/components/Group/Group.d.ts +5 -0
  3. package/lib/cjs/components/Group/Group.js +2 -2
  4. package/lib/cjs/components/GroupMembersButton/GroupMembersButton.js +1 -1
  5. package/lib/cjs/components/Groups/Groups.js +1 -8
  6. package/lib/cjs/components/UserSubscribedGroupsWidget/Skeleton.d.ts +21 -0
  7. package/lib/cjs/components/UserSubscribedGroupsWidget/Skeleton.js +46 -0
  8. package/lib/cjs/components/UserSubscribedGroupsWidget/UserSubscribedGroupsWidget.d.ts +68 -0
  9. package/lib/cjs/components/UserSubscribedGroupsWidget/UserSubscribedGroupsWidget.js +183 -0
  10. package/lib/cjs/components/UserSubscribedGroupsWidget/constants.d.ts +1 -0
  11. package/lib/cjs/components/UserSubscribedGroupsWidget/constants.js +4 -0
  12. package/lib/cjs/components/UserSubscribedGroupsWidget/index.d.ts +4 -0
  13. package/lib/cjs/components/UserSubscribedGroupsWidget/index.js +8 -0
  14. package/lib/cjs/components/VoteAudienceButton/VoteAudienceButton.js +1 -1
  15. package/lib/cjs/index.d.ts +2 -1
  16. package/lib/cjs/index.js +5 -2
  17. package/lib/esm/components/FeedObject/Contributors/Contributors.js +1 -1
  18. package/lib/esm/components/Group/Group.d.ts +5 -0
  19. package/lib/esm/components/Group/Group.js +4 -4
  20. package/lib/esm/components/GroupMembersButton/GroupMembersButton.js +1 -1
  21. package/lib/esm/components/Groups/Groups.js +1 -8
  22. package/lib/esm/components/UserSubscribedGroupsWidget/Skeleton.d.ts +21 -0
  23. package/lib/esm/components/UserSubscribedGroupsWidget/Skeleton.js +42 -0
  24. package/lib/esm/components/UserSubscribedGroupsWidget/UserSubscribedGroupsWidget.d.ts +68 -0
  25. package/lib/esm/components/UserSubscribedGroupsWidget/UserSubscribedGroupsWidget.js +180 -0
  26. package/lib/esm/components/UserSubscribedGroupsWidget/constants.d.ts +1 -0
  27. package/lib/esm/components/UserSubscribedGroupsWidget/constants.js +1 -0
  28. package/lib/esm/components/UserSubscribedGroupsWidget/index.d.ts +4 -0
  29. package/lib/esm/components/UserSubscribedGroupsWidget/index.js +4 -0
  30. package/lib/esm/components/VoteAudienceButton/VoteAudienceButton.js +1 -1
  31. package/lib/esm/index.d.ts +2 -1
  32. package/lib/esm/index.js +2 -1
  33. package/lib/umd/react-ui.js +1 -1
  34. package/package.json +5 -5
@@ -60,6 +60,6 @@ function ContributorsFeedObject(props) {
60
60
  openContributorsDialog && (react_1.default.createElement(BaseDialog_1.default, { title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.feedObject.contributors.title", id: "ui.feedObject.contributors.title", values: { total: contributorsObject.total } }), onClose: () => setOpenContributorsDialog(false), open: openContributorsDialog }, contributorsObject.isLoadingNext ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: contributorsObject.contributors.length, next: contributorsObject.getNextPage(), hasMoreNext: Boolean(contributorsObject.next), loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: 400, endMessage: react_1.default.createElement(material_1.Typography, { variant: "body2", align: "center", fontWeight: "bold" },
61
61
  react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.feedObject.contributors.noOtherContributors", defaultMessage: "ui.feedObject.contributors.noOtherContributors" })) },
62
62
  react_1.default.createElement(material_1.List, null, contributorsObject.contributors.map((c, i) => (react_1.default.createElement(material_1.ListItem, { key: i },
63
- react_1.default.createElement(User_1.default, { elevation: 0, user: c, key: c.id, sx: { m: 0 } }))))))))))) : null)))));
63
+ react_1.default.createElement(User_1.default, { elevation: 0, user: c, key: c.id, sx: { m: 0 }, onClick: () => setOpenContributorsDialog(false) }))))))))))) : null)))));
64
64
  }
65
65
  exports.default = ContributorsFeedObject;
@@ -27,6 +27,11 @@ export interface GroupProps extends WidgetProps {
27
27
  * @default false
28
28
  */
29
29
  hideActions?: boolean;
30
+ /**
31
+ * Prop to redirect the user to the group page
32
+ * @default false
33
+ */
34
+ actionRedirect?: boolean;
30
35
  /**
31
36
  * Props to spread to the button
32
37
  * @default {}
@@ -69,7 +69,7 @@ function Group(inProps) {
69
69
  props: inProps,
70
70
  name: constants_1.PREFIX
71
71
  });
72
- const { groupId = null, group = null, className = null, elevation, hideActions = false, groupSubscribeButtonProps = {} } = props, rest = tslib_1.__rest(props, ["groupId", "group", "className", "elevation", "hideActions", "groupSubscribeButtonProps"]);
72
+ const { groupId = null, group = null, className = null, elevation, hideActions = false, actionRedirect = false, groupSubscribeButtonProps = {} } = props, rest = tslib_1.__rest(props, ["groupId", "group", "className", "elevation", "hideActions", "actionRedirect", "groupSubscribeButtonProps"]);
73
73
  // STATE
74
74
  const { scGroup } = (0, react_core_1.useSCFetchGroup)({ id: groupId, group });
75
75
  // CONTEXT
@@ -87,7 +87,7 @@ function Group(inProps) {
87
87
  function renderAuthenticatedActions() {
88
88
  return (react_1.default.createElement(material_1.Stack, { className: classes.actions, direction: "row", alignItems: "center", justifyContent: "center", spacing: 2 },
89
89
  isGroupAdmin && react_1.default.createElement(material_1.Icon, null, "face"),
90
- react_1.default.createElement(GroupSubscribeButton_1.default, Object.assign({ group: group, groupId: groupId }, groupSubscribeButtonProps))));
90
+ actionRedirect ? (react_1.default.createElement(material_1.Button, { size: "small", variant: "outlined", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, scGroup) }, scGroup.privacy === types_1.SCGroupPrivacyType.PUBLIC ? (react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.groupSubscribeButton.enter", id: "ui.groupSubscribeButton.enter" })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.groupSubscribeButton.requestAccess", id: "ui.groupSubscribeButton.requestAccess" })))) : (react_1.default.createElement(GroupSubscribeButton_1.default, Object.assign({ group: group, groupId: groupId }, groupSubscribeButtonProps)))));
91
91
  }
92
92
  /**
93
93
  * Renders group object
@@ -135,6 +135,6 @@ function GroupMembersButton(inProps) {
135
135
  react_1.default.createElement(InfiniteScroll_1.default, { dataLength: members.length, next: fetchMembers, hasMoreNext: next !== null || loading, loaderNext: react_1.default.createElement(User_1.UserSkeleton, { elevation: 0 }), height: isMobile ? '100%' : 400, endMessage: react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
136
136
  react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.groupMembersButton.noOtherMembers", defaultMessage: "ui.groupMembersButton.noOtherMembers" })) },
137
137
  react_1.default.createElement(material_1.List, null, members.map((member) => (react_1.default.createElement(material_1.ListItem, { key: member.id },
138
- react_1.default.createElement(User_1.default, { elevation: 0, user: member }))))))))));
138
+ react_1.default.createElement(User_1.default, { elevation: 0, user: member, onClick: handleToggleDialogOpen }))))))))));
139
139
  }
140
140
  exports.default = GroupMembersButton;
@@ -119,13 +119,6 @@ function Groups(inProps) {
119
119
  fetchGroups();
120
120
  }
121
121
  }, [contentAvailability, authUserId, search]);
122
- const handleSubscribe = (group) => {
123
- if (!general) {
124
- const newGroups = [...groups];
125
- const _updated = newGroups.filter((g) => g.id !== group.id);
126
- setGroups(_updated);
127
- }
128
- };
129
122
  const handleNext = (0, react_1.useMemo)(() => () => {
130
123
  if (!next) {
131
124
  return;
@@ -174,7 +167,7 @@ function Groups(inProps) {
174
167
  button: (chunk) => (react_1.default.createElement(material_1.Button, { color: "secondary", variant: "text", onClick: handleScrollUp }, chunk))
175
168
  } })) },
176
169
  react_1.default.createElement(material_1.Grid, { container: true, spacing: { xs: 2 }, className: classes.groups }, filteredGroups.map((group) => (react_1.default.createElement(material_1.Grid, { item: true, xs: 12, sm: 8, md: 6, key: group.id, className: classes.item },
177
- react_1.default.createElement(Group_1.default, Object.assign({ group: group, groupId: group.id, groupSubscribeButtonProps: { onSubscribe: handleSubscribe } }, GroupComponentProps)))))))))));
170
+ react_1.default.createElement(Group_1.default, Object.assign({ group: group, groupId: group.id, actionRedirect: true }, GroupComponentProps)))))))))));
178
171
  // RENDER
179
172
  if (!contentAvailability && !scUserContext.user) {
180
173
  return react_1.default.createElement(HiddenPlaceholder_1.default, null);
@@ -0,0 +1,21 @@
1
+ /**
2
+ * > API documentation for the Community-JS User Profile Categories Followed Widget Skeleton component. Learn about the available props and the CSS API.
3
+
4
+ #### Import
5
+
6
+ ```jsx
7
+ import {UserSubscribedGroupsWidgetSkeleton} from '@selfcommunity/react-ui';
8
+ ```
9
+
10
+ #### Component Name
11
+
12
+ The name `SCUserCategoriesFollowedWidget-skeleton-root` can be used when providing style overrides in the theme.
13
+
14
+ #### CSS
15
+
16
+ |Rule Name|Global class|Description|
17
+ |---|---|---|
18
+ |root|.SCUserSubscribedGroupsWidget-skeleton-root|Styles applied to the root element.|
19
+ *
20
+ */
21
+ export default function UserSubscribedGroupsWidgetSkeleton(props: any): JSX.Element;
@@ -0,0 +1,46 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const tslib_1 = require("tslib");
4
+ const react_1 = tslib_1.__importDefault(require("react"));
5
+ const Widget_1 = tslib_1.__importDefault(require("../Widget"));
6
+ const styles_1 = require("@mui/material/styles");
7
+ const material_1 = require("@mui/material");
8
+ const List_1 = tslib_1.__importDefault(require("@mui/material/List"));
9
+ const Skeleton_1 = tslib_1.__importDefault(require("../Group/Skeleton"));
10
+ const PREFIX = 'SCUserSubscribedGroupsWidgetSkeleton';
11
+ const classes = {
12
+ root: `${PREFIX}-skeleton-root`,
13
+ list: `${PREFIX}-list`
14
+ };
15
+ const Root = (0, styles_1.styled)(Widget_1.default, {
16
+ name: PREFIX,
17
+ slot: 'SkeletonRoot'
18
+ })(() => ({}));
19
+ /**
20
+ * > API documentation for the Community-JS User Profile Categories Followed Widget Skeleton component. Learn about the available props and the CSS API.
21
+
22
+ #### Import
23
+
24
+ ```jsx
25
+ import {UserSubscribedGroupsWidgetSkeleton} from '@selfcommunity/react-ui';
26
+ ```
27
+
28
+ #### Component Name
29
+
30
+ The name `SCUserCategoriesFollowedWidget-skeleton-root` can be used when providing style overrides in the theme.
31
+
32
+ #### CSS
33
+
34
+ |Rule Name|Global class|Description|
35
+ |---|---|---|
36
+ |root|.SCUserSubscribedGroupsWidget-skeleton-root|Styles applied to the root element.|
37
+ *
38
+ */
39
+ function UserSubscribedGroupsWidgetSkeleton(props) {
40
+ return (react_1.default.createElement(Root, Object.assign({ className: classes.root }, props),
41
+ react_1.default.createElement(material_1.CardContent, null,
42
+ react_1.default.createElement(List_1.default, { className: classes.list }, [...Array(3)].map((category, index) => (react_1.default.createElement(material_1.ListItem, { key: index },
43
+ react_1.default.createElement(Skeleton_1.default, { elevation: 0 })))))),
44
+ ");"));
45
+ }
46
+ exports.default = UserSubscribedGroupsWidgetSkeleton;
@@ -0,0 +1,68 @@
1
+ import { CacheStrategies } from '@selfcommunity/utils';
2
+ import { BaseDialogProps } from '../../shared/BaseDialog';
3
+ import { WidgetProps } from '../Widget';
4
+ import { VirtualScrollerItemProps } from '../../types/virtualScroller';
5
+ import { GroupProps } from '../Group';
6
+ export interface UserSubscribedGroupsWidgetProps extends VirtualScrollerItemProps, WidgetProps {
7
+ /**
8
+ * The user id
9
+ * @default null
10
+ */
11
+ userId: number;
12
+ /**
13
+ * Hides this component
14
+ * @default false
15
+ */
16
+ autoHide?: boolean;
17
+ /**
18
+ * Limit the number of groups to show
19
+ * @default false
20
+ */
21
+ limit?: number;
22
+ /**
23
+ * Props to spread to single group object
24
+ * @default empty object
25
+ */
26
+ GroupProps?: GroupProps;
27
+ /**
28
+ * Caching strategies
29
+ * @default CacheStrategies.CACHE_FIRST
30
+ */
31
+ cacheStrategy?: CacheStrategies;
32
+ /**
33
+ * Props to spread to subscribed groups dialog
34
+ * @default {}
35
+ */
36
+ DialogProps?: BaseDialogProps;
37
+ /**
38
+ * Other props
39
+ */
40
+ [p: string]: any;
41
+ }
42
+ /**
43
+ * > API documentation for the Community-JS User Profile Groups Subscribed Widget component. Learn about the available props and the CSS API.
44
+ *
45
+ *
46
+ * This component renders the list of the groups that the given user follows.
47
+ * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/UserSubscribedGroups)
48
+
49
+ #### Import
50
+ ```jsx
51
+ import {UserSubscribedGroupsWidget} from '@selfcommunity/react-ui';
52
+ ```
53
+ #### Component Name
54
+ The name `SCUserSubscribedGroupsWidget` can be used when providing style overrides in the theme.
55
+
56
+ #### CSS
57
+
58
+ |Rule Name|Global class|Description|
59
+ |---|---|---|
60
+ |root|.SCUserSubscribedGroupsWidget-root|Styles applied to the root element.|
61
+ |title|.SCUserSubscribedGroupsWidget-title|Styles applied to the title element.|
62
+ |noResults|.SCUserSubscribedGroupsWidget-no-results|Styles applied to no results section.|
63
+ |showMore|.SCUserSubscribedGroupsWidget-show-more|Styles applied to show more button element.|
64
+ |dialogRoot|.SCUserSubscribedGroupsWidget-dialog-root|Styles applied to the root dialog element.|
65
+ |endMessage|.SCUserSubscribedGroupsWidget-end-message|Styles applied to the end message element.|
66
+ * @param inProps
67
+ */
68
+ export default function UserSubscribedGroupsWidget(inProps: UserSubscribedGroupsWidgetProps): JSX.Element;
@@ -0,0 +1,183 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const tslib_1 = require("tslib");
4
+ const react_1 = tslib_1.__importStar(require("react"));
5
+ const styles_1 = require("@mui/material/styles");
6
+ const List_1 = tslib_1.__importDefault(require("@mui/material/List"));
7
+ const material_1 = require("@mui/material");
8
+ const api_services_1 = require("@selfcommunity/api-services");
9
+ const utils_1 = require("@selfcommunity/utils");
10
+ const react_core_1 = require("@selfcommunity/react-core");
11
+ const widget_1 = require("../../utils/widget");
12
+ const types_1 = require("@selfcommunity/types");
13
+ const Errors_1 = require("../../constants/Errors");
14
+ const react_intl_1 = require("react-intl");
15
+ const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
16
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
17
+ const BaseDialog_1 = tslib_1.__importDefault(require("../../shared/BaseDialog"));
18
+ const Widget_1 = tslib_1.__importDefault(require("../Widget"));
19
+ const system_1 = require("@mui/system");
20
+ const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
21
+ const constants_1 = require("./constants");
22
+ const Group_1 = tslib_1.__importStar(require("../Group"));
23
+ const classes = {
24
+ root: `${constants_1.PREFIX}-root`,
25
+ title: `${constants_1.PREFIX}-title`,
26
+ noResults: `${constants_1.PREFIX}-no-results`,
27
+ showMore: `${constants_1.PREFIX}-show-more`,
28
+ dialogRoot: `${constants_1.PREFIX}-dialog-root`,
29
+ endMessage: `${constants_1.PREFIX}-end-message`
30
+ };
31
+ const Root = (0, styles_1.styled)(Widget_1.default, {
32
+ name: constants_1.PREFIX,
33
+ slot: 'Root'
34
+ })(() => ({}));
35
+ const DialogRoot = (0, styles_1.styled)(BaseDialog_1.default, {
36
+ name: constants_1.PREFIX,
37
+ slot: 'DialogRoot'
38
+ })(() => ({}));
39
+ /**
40
+ * > API documentation for the Community-JS User Profile Groups Subscribed Widget component. Learn about the available props and the CSS API.
41
+ *
42
+ *
43
+ * This component renders the list of the groups that the given user follows.
44
+ * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/UserSubscribedGroups)
45
+
46
+ #### Import
47
+ ```jsx
48
+ import {UserSubscribedGroupsWidget} from '@selfcommunity/react-ui';
49
+ ```
50
+ #### Component Name
51
+ The name `SCUserSubscribedGroupsWidget` can be used when providing style overrides in the theme.
52
+
53
+ #### CSS
54
+
55
+ |Rule Name|Global class|Description|
56
+ |---|---|---|
57
+ |root|.SCUserSubscribedGroupsWidget-root|Styles applied to the root element.|
58
+ |title|.SCUserSubscribedGroupsWidget-title|Styles applied to the title element.|
59
+ |noResults|.SCUserSubscribedGroupsWidget-no-results|Styles applied to no results section.|
60
+ |showMore|.SCUserSubscribedGroupsWidget-show-more|Styles applied to show more button element.|
61
+ |dialogRoot|.SCUserSubscribedGroupsWidget-dialog-root|Styles applied to the root dialog element.|
62
+ |endMessage|.SCUserSubscribedGroupsWidget-end-message|Styles applied to the end message element.|
63
+ * @param inProps
64
+ */
65
+ function UserSubscribedGroupsWidget(inProps) {
66
+ // PROPS
67
+ const props = (0, system_1.useThemeProps)({
68
+ props: inProps,
69
+ name: constants_1.PREFIX
70
+ });
71
+ const { userId, autoHide, limit = 3, className, GroupProps = {}, cacheStrategy = utils_1.CacheStrategies.NETWORK_ONLY, onHeightChange, onStateChange, DialogProps = {} } = props, rest = tslib_1.__rest(props, ["userId", "autoHide", "limit", "className", "GroupProps", "cacheStrategy", "onHeightChange", "onStateChange", "DialogProps"]);
72
+ // CONTEXT
73
+ const scUserContext = (0, react_core_1.useSCUser)();
74
+ const isMe = (0, react_1.useMemo)(() => scUserContext.user && userId === scUserContext.user.id, [scUserContext.user, userId]);
75
+ const { features } = (0, react_core_1.useSCPreferences)();
76
+ const groupsEnabled = (0, react_1.useMemo)(() => features.includes(types_1.SCFeatureName.GROUPING), [features]);
77
+ // STATE
78
+ const [state, dispatch] = (0, react_1.useReducer)(widget_1.dataWidgetReducer, {
79
+ isLoadingNext: false,
80
+ next: null,
81
+ cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.GROUPS_SUBSCRIBED_TOOLS_STATE_CACHE_PREFIX_KEY, userId),
82
+ cacheStrategy
83
+ }, widget_1.stateWidgetInitializer);
84
+ const [openDialog, setOpenDialog] = (0, react_1.useState)(false);
85
+ /**
86
+ * Initialize component
87
+ * Fetch data only if the component is not initialized and it is not loading data
88
+ */
89
+ const _initComponent = (0, react_1.useMemo)(() => () => {
90
+ if (!state.initialized && !state.isLoadingNext) {
91
+ api_services_1.GroupService.getUserSubscribedGroups(userId)
92
+ .then((groups) => {
93
+ dispatch({
94
+ type: widget_1.actionWidgetTypes.LOAD_NEXT_SUCCESS,
95
+ payload: {
96
+ count: groups.count,
97
+ results: groups.results,
98
+ initialized: true
99
+ }
100
+ });
101
+ })
102
+ .catch((error) => {
103
+ dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
104
+ utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
105
+ });
106
+ }
107
+ }, [state.isLoadingNext, state.initialized, userId, dispatch]);
108
+ // EFFECTS
109
+ (0, react_1.useEffect)(() => {
110
+ let _t;
111
+ if (groupsEnabled || ((0, utils_1.isInteger)(userId) && scUserContext.user !== undefined)) {
112
+ _t = setTimeout(_initComponent);
113
+ return () => {
114
+ _t && clearTimeout(_t);
115
+ };
116
+ }
117
+ }, [scUserContext.user, groupsEnabled, userId]);
118
+ /**
119
+ * Virtual feed update
120
+ */
121
+ (0, react_1.useEffect)(() => {
122
+ onHeightChange && onHeightChange();
123
+ }, [state.results.length]);
124
+ (0, react_1.useEffect)(() => {
125
+ if ((!groupsEnabled && !scUserContext.user) || !(0, utils_1.isInteger)(userId)) {
126
+ return;
127
+ }
128
+ else if (cacheStrategy === utils_1.CacheStrategies.NETWORK_ONLY) {
129
+ onStateChange && onStateChange({ cacheStrategy: utils_1.CacheStrategies.CACHE_FIRST });
130
+ }
131
+ }, [groupsEnabled, cacheStrategy, scUserContext.user, userId]);
132
+ // HANDLERS
133
+ const handleOnSubscribe = (group) => {
134
+ if (isMe) {
135
+ const newGroups = [...state.results];
136
+ const index = newGroups.findIndex((u) => u.id === group.id);
137
+ if (index !== -1) {
138
+ if (group.subscription_status === types_1.SCGroupSubscriptionStatusType.SUBSCRIBED) {
139
+ newGroups[index].subscribers_counter = group.subscribers_counter - 1;
140
+ newGroups[index].subscription_status = null;
141
+ }
142
+ else {
143
+ newGroups[index].subscribers_counter =
144
+ group.privacy === types_1.SCGroupPrivacyType.PUBLIC ? group.subscribers_counter + 1 : group.subscribers_counter;
145
+ newGroups[index].subscription_status =
146
+ group.privacy === types_1.SCGroupPrivacyType.PUBLIC ? types_1.SCGroupSubscriptionStatusType.SUBSCRIBED : types_1.SCGroupSubscriptionStatusType.REQUESTED;
147
+ }
148
+ dispatch({ type: widget_1.actionWidgetTypes.SET_RESULTS, payload: { results: newGroups } });
149
+ }
150
+ }
151
+ };
152
+ const handleToggleDialogOpen = () => {
153
+ setOpenDialog((prev) => !prev);
154
+ };
155
+ // RENDER
156
+ if (!groupsEnabled || (autoHide && !state.count && state.initialized) || !userId) {
157
+ return react_1.default.createElement(HiddenPlaceholder_1.default, null);
158
+ }
159
+ if (!state.initialized) {
160
+ return react_1.default.createElement(Skeleton_1.default, null);
161
+ }
162
+ const content = (react_1.default.createElement(material_1.CardContent, null,
163
+ react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" },
164
+ react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.title", defaultMessage: "ui.userSubscribedGroupsWidget.title", values: {
165
+ total: isMe ? state.results.filter((g) => g.subscription_status === types_1.SCGroupSubscriptionStatusType.SUBSCRIBED).length : state.count
166
+ } })),
167
+ !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
168
+ react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.subtitle.noResults", defaultMessage: "ui.userSubscribedGroupsWidget.subtitle.noResults" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
169
+ react_1.default.createElement(List_1.default, null, state.results.slice(0, limit).map((group) => (react_1.default.createElement(material_1.ListItem, { key: group.id },
170
+ react_1.default.createElement(Group_1.default, Object.assign({ elevation: 0, group: group, groupSubscribeButtonProps: { onSubscribe: handleOnSubscribe } }, GroupProps)))))),
171
+ limit < state.count && (react_1.default.createElement(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen },
172
+ react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.button.showAll", defaultMessage: "ui.userSubscribedGroupsWidget.button.showAll" }))),
173
+ openDialog && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.title", defaultMessage: "ui.userSubscribedGroupsWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog, scroll: "paper" }, DialogProps),
174
+ react_1.default.createElement(List_1.default, null,
175
+ state.results.map((g) => (react_1.default.createElement(material_1.ListItem, { key: g.id },
176
+ react_1.default.createElement(Group_1.default, Object.assign({ elevation: 0, group: g, groupSubscribeButtonProps: { onSubscribe: handleOnSubscribe } }, GroupProps))))),
177
+ state.isLoadingNext && (react_1.default.createElement(material_1.ListItem, null,
178
+ react_1.default.createElement(Group_1.GroupSkeleton, Object.assign({ elevation: 0 }, GroupProps))))),
179
+ react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
180
+ react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.noMoreResults", defaultMessage: "ui.userSubscribedGroupsWidget.noMoreResults" }))))))));
181
+ return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), content));
182
+ }
183
+ exports.default = UserSubscribedGroupsWidget;
@@ -0,0 +1 @@
1
+ export declare const PREFIX = "SCUserSubscribedGroupsWidget";
@@ -0,0 +1,4 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.PREFIX = void 0;
4
+ exports.PREFIX = 'SCUserSubscribedGroupsWidget';
@@ -0,0 +1,4 @@
1
+ import UserSubscribedGroupsWidget, { UserSubscribedGroupsWidgetProps } from './UserSubscribedGroupsWidget';
2
+ import UserSubscribedGroupsWidgetSkeleton from './Skeleton';
3
+ export default UserSubscribedGroupsWidget;
4
+ export { UserSubscribedGroupsWidgetSkeleton, UserSubscribedGroupsWidgetProps };
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.UserSubscribedGroupsWidgetSkeleton = void 0;
4
+ const tslib_1 = require("tslib");
5
+ const UserSubscribedGroupsWidget_1 = tslib_1.__importDefault(require("./UserSubscribedGroupsWidget"));
6
+ const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
7
+ exports.UserSubscribedGroupsWidgetSkeleton = Skeleton_1.default;
8
+ exports.default = UserSubscribedGroupsWidget_1.default;
@@ -134,6 +134,6 @@ function VoteAudienceButton(inProps) {
134
134
  react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.voteAudienceButton.dialog.end", defaultMessage: "ui.voteAudienceButton.dialog.end" })) },
135
135
  react_1.default.createElement(material_1.List, null, voteList.map((vote) => (react_1.default.createElement(material_1.ListItem, { key: vote.user.id },
136
136
  react_1.default.createElement(User_1.default, { elevation: 0, user: vote.user, badgeContent: react_1.default.createElement(material_1.Avatar, { className: classes.dialogVoteBadge }, vote.reaction ? (react_1.default.createElement(Icon_1.default, null,
137
- react_1.default.createElement("img", { alt: vote.reaction.label, src: vote.reaction.image, width: "100%", height: "100%" }))) : (react_1.default.createElement(Icon_1.default, null, "thumb_up"))) })))))))))));
137
+ react_1.default.createElement("img", { alt: vote.reaction.label, src: vote.reaction.image, width: "100%", height: "100%" }))) : (react_1.default.createElement(Icon_1.default, null, "thumb_up"))), onClick: handleClose })))))))))));
138
138
  }
139
139
  exports.default = VoteAudienceButton;
@@ -121,6 +121,7 @@ import Groups, { GroupsProps, GroupsSkeleton } from './components/Groups';
121
121
  import GroupForm, { GroupFormProps } from './components/GroupForm';
122
122
  import GroupSettingsIconButton, { GroupSettingsIconButtonProps } from './components/GroupSettingsIconButton';
123
123
  import GroupInvitedWidget, { GroupInvitedWidgetProps, GroupInvitedWidgetSkeleton } from './components/GroupInvitedWidget';
124
+ import UserSubscribedGroupsWidget, { UserSubscribedGroupsWidgetProps, UserSubscribedGroupsWidgetSkeleton } from './components/UserSubscribedGroupsWidget';
124
125
  /**
125
126
  * Constants
126
127
  */
@@ -145,4 +146,4 @@ import FeedObjectMediaPreview, { FeedObjectMediaPreviewProps } from './component
145
146
  /**
146
147
  * List all exports
147
148
  */
148
- export { AccountDataPortability, AccountDataPortabilityProps, AccountDataPortabilityButton, AccountDataPortabilityButtonProps, AccountDelete, AccountDeleteProps, AccountDeleteButton, AccountDeleteButtonProps, AccountRecover, AccountRecoverProps, AccountReset, AccountResetProps, AccountVerify, AccountVerifyProps, AccountChangeMailValidation, AccountChangeMailValidationProps, NavigationSettingsIconButton, NavigationSettingsIconButtonProps, NavigationSettingsItem, NavigationToolbarMobile, NavigationToolbarMobileProps, NavigationToolbarMobileSkeleton, NavigationToolbar, NavigationToolbarProps, NavigationToolbarSkeleton, NavigationMenuIconButton, NavigationMenuContent, NavigationMenuIconButtonProps, BottomNavigation, BottomNavigationProps, BroadcastMessages, BroadcastMessagesProps, BroadcastMessagesSkeleton, Category, CategoryProps, CategorySkeleton, CategoryAutocomplete, CategoryAutocompleteProps, CategoryFollowersButton, CategoryFollowersButtonProps, CategoryHeader, CategoryHeaderProps, CategoryHeaderSkeleton, Categories, CategoriesProps, CategoriesSkeleton, CategoriesSkeletonProps, UserFollowedCategoriesWidget, UserFollowedCategoriesWidgetProps, UserFollowedCategoriesWidgetSkeleton, CategoriesPopularWidget, CategoriesPopularWidgetSkeleton, CategoriesSuggestionWidget, CategoriesSuggestionWidgetProps, CategoriesSuggestionWidgetSkeleton, ChangeCover, ChangePicture, ChangePictureProps, ChangeCoverProps, Composer, ComposerProps, ComposerIconButton, ComposerIconButtonProps, Editor, EditorProps, EditorSkeleton, FriendshipUserButton, FriendshipButtonProps, Feed, FeedRef, FeedProps, FeedSidebarProps, FeedSkeleton, CategoryFollowButton, CategoryFollowButtonProps, FollowUserButton, FollowUserButtonProps, ConnectionUserButton, FeedObject, FeedObjectProps, FeedObjectSkeleton, FeedObjectMediaPreview, FeedObjectMediaPreviewProps, FeedUpdatesWidget, FeedUpdatesWidgetProps, FeedUpdatesWidgetSkeleton, GenericSkeleton, AvatarGroupSkeleton, CommentObject, CommentsObject, CommentsObjectProps, CommentObjectProps, CommentsObjectSkeleton, CommentObjectSkeleton, CommentObjectReply, CommentObjectReplyProps, CommentsFeedObject, CommentsFeedObjectProps, CommentsFeedObjectSkeleton, ReplyComment, InlineComposerWidget, InlineComposerWidgetProps, InlineComposerWidgetSkeleton, Notification, NotificationProps, NotificationSkeleton, UserSuggestionWidget, UserSuggestionWidgetProps, UserSuggestionWidgetSkeleton, PlatformWidget, PlatformWidgetProps, PlatformWidgetSkeleton, LocationAutocomplete, LocationAutocompleteProps, LoyaltyProgramWidget, LoyaltyProgramWidgetProps, LoyaltyProgramWidgetSkeleton, CategoryTrendingFeedWidget, CategoryTrendingFeedWidgetProps, CategoryTrendingFeedWidgetSkeleton, CategoryTrendingUsersWidget, CategoryTrendingUsersWidgetProps, CategoryTrendingPeopleWidgetSkeleton, RelatedFeedObjectsWidget, RelatedFeedObjectWidgetProps, RelatedFeedObjectsWidgetSkeleton, UserActionIconButton, UserActionIconButtonProps, UserCounters, UserCountersProps, UserProfileHeader, UserProfileHeaderProps, UserProfileHeaderSkeleton, UserInfoDialog, UserInfoDialogProps, UserInfo, UserInfoProps, UserInfoSkeleton, UserProfileBlocked, UserProfileBlockedProps, SCUserProfileFields, SCUserProfileSettings, UserProfileEdit, UserProfileEditProps, UserProfileEditSkeleton, UserProfileEditSectionPublicInfo, UserProfileEditSectionPublicInfoProps, UserProfileEditSectionSettings, UserProfileEditSectionSettingsProps, UserProfileEditSectionAccount, UserProfileEditSectionAccountProps, UserFollowedUsersWidget, UserFollowedUsersWidgetProps, UserFollowedUsersWidgetSkeleton, UserFollowersWidget, UserFollowersWidgetProps, UserFollowersWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetProps, UserConnectionsWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetProps, UserConnectionsRequestsWidgetSkeleton, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetProps, UserConnectionsRequestsSentWidgetSkeleton, UserSocialAssociation, UserSocialAssociationProps, SCUserSocialAssociations, CustomAdv, CustomAdvProps, CustomAdvSkeleton, User, UserProps, UserSkeleton, PrivateMessageThread, PrivateMessageThreadProps, PrivateMessageThreadSkeleton, PrivateMessageThreadItem, PrivateMessageThreadItemProps, PrivateMessageThreadItemSkeleton, PrivateMessageSnippetItem, PrivateMessageSnippetItemProps, PrivateMessageSnippetItemSkeleton, PrivateMessageEditor, PrivateMessageEditorProps, PrivateMessageEditorSkeleton, PrivateMessageSnippets, PrivateMessageSnippetsProps, PrivateMessageSnippetsSkeleton, PrivateMessageComponent, PrivateMessageComponentProps, PrivateMessageComponentSkeleton, PrivateMessageSettingsIconButton, PrivateMessageSettingsIconButtonProps, ToastNotifications, ToastNotificationsProps, ToastNotificationsSkeleton, SnippetNotifications, SnippetNotificationsProps, SnippetNotificationsSkeleton, SearchAutocomplete, SearchAutocompleteProps, SearchDialog, SearchDialogProps, Widget, WidgetProps, SCFeedWidgetType, SCFeedObjectTemplateType, SCCommentsOrderBy, SCFeedObjectActivitiesType, SCMediaObjectType, SCMediaChunkType, SCNotificationObjectTemplateType, SCBroadcastMessageTemplateType, ChangeGroupCover, ChangeGroupCoverProps, ChangeGroupPicture, ChangeGroupPictureProps, GroupHeader, GroupHeaderProps, GroupHeaderSkeleton, GroupMembersButton, GroupMembersButtonProps, CreateGroupButton, CreateGroupButtonProps, EditGroupButton, EditGroupButtonProps, GroupInviteButton, GroupInviteButtonProps, GroupInfoWidget, GroupInfoWidgetProps, GroupInfoWidgetSkeleton, Group, GroupProps, GroupSkeleton, GroupSubscribeButton, GroupSubscribeButtonProps, GroupMembersWidget, GroupMembersWidgetProps, GroupMembersWidgetSkeleton, GroupRequestsWidget, GroupRequestsWidgetProps, GroupRequestsWidgetSkeleton, Groups, GroupsProps, GroupsSkeleton, GroupForm, GroupFormProps, GroupInvitedWidget, GroupInvitedWidgetProps, GroupInvitedWidgetSkeleton, HiddenPlaceholder, UrlTextField, UsernameTextField, EmailTextField, PasswordTextField, PhoneTextField, MetadataField, InfiniteScroll, StickyBox, useStickyBox, StickyBoxProps, StickyBoxComponent, UseStickyBoxProps, TagChip, TagChipProps, UserDeletedSnackBar, UserDeletedSnackBarProps, UserAvatar, UserAvatarProps, Lightbox, CentralProgress, ConfirmDialog, LanguageSwitcher, MediaChunkUploader, MediaChunkUploaderProps, File, Link, Share, EditMediaProps, MEDIA_TYPE_EMBED, FACEBOOK_SHARE, TWITTER_SHARE, LINKEDIN_SHARE, DEFAULT_PRELOAD_OFFSET_VIEWPORT, MIN_PRELOAD_OFFSET_VIEWPORT, MAX_PRELOAD_OFFSET_VIEWPORT, ConsentSolution, ConsentSolutionProps, ConsentSolutionSkeleton, ConsentSolutionButton, ConsentSolutionButtonProps, LEGAL_POLICIES, DEFAULT_FIELDS, DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PAGINATION_OFFSET, DEFAULT_PAGINATION_LIMIT, DEFAULT_WIDGETS_NUMBER, PollSuggestionWidget, PollSuggestionWidgetProps, Incubator, IncubatorSubscribeButton, IncubatorSubscribeButtonProps, IncubatorProps, IncubatorListWidget, IncubatorListWidgetProps, IncubatorDetail, IncubatorDetailProps, IncubatorSuggestionWidget, IncubatorSuggestionWidgetProps, ContributionUtils, bytesToSize, getUnseenNotification, getUnseenNotificationCounter, MessageUploaderUtils, getRelativeTime, Footer, FooterProps, FooterSkeleton, BaseItem, BaseItemProps, BaseDialog, BaseDialogProps, GroupSettingsIconButton, GroupSettingsIconButtonProps };
149
+ export { AccountDataPortability, AccountDataPortabilityProps, AccountDataPortabilityButton, AccountDataPortabilityButtonProps, AccountDelete, AccountDeleteProps, AccountDeleteButton, AccountDeleteButtonProps, AccountRecover, AccountRecoverProps, AccountReset, AccountResetProps, AccountVerify, AccountVerifyProps, AccountChangeMailValidation, AccountChangeMailValidationProps, NavigationSettingsIconButton, NavigationSettingsIconButtonProps, NavigationSettingsItem, NavigationToolbarMobile, NavigationToolbarMobileProps, NavigationToolbarMobileSkeleton, NavigationToolbar, NavigationToolbarProps, NavigationToolbarSkeleton, NavigationMenuIconButton, NavigationMenuContent, NavigationMenuIconButtonProps, BottomNavigation, BottomNavigationProps, BroadcastMessages, BroadcastMessagesProps, BroadcastMessagesSkeleton, Category, CategoryProps, CategorySkeleton, CategoryAutocomplete, CategoryAutocompleteProps, CategoryFollowersButton, CategoryFollowersButtonProps, CategoryHeader, CategoryHeaderProps, CategoryHeaderSkeleton, Categories, CategoriesProps, CategoriesSkeleton, CategoriesSkeletonProps, UserFollowedCategoriesWidget, UserFollowedCategoriesWidgetProps, UserFollowedCategoriesWidgetSkeleton, CategoriesPopularWidget, CategoriesPopularWidgetSkeleton, CategoriesSuggestionWidget, CategoriesSuggestionWidgetProps, CategoriesSuggestionWidgetSkeleton, ChangeCover, ChangePicture, ChangePictureProps, ChangeCoverProps, Composer, ComposerProps, ComposerIconButton, ComposerIconButtonProps, Editor, EditorProps, EditorSkeleton, FriendshipUserButton, FriendshipButtonProps, Feed, FeedRef, FeedProps, FeedSidebarProps, FeedSkeleton, CategoryFollowButton, CategoryFollowButtonProps, FollowUserButton, FollowUserButtonProps, ConnectionUserButton, FeedObject, FeedObjectProps, FeedObjectSkeleton, FeedObjectMediaPreview, FeedObjectMediaPreviewProps, FeedUpdatesWidget, FeedUpdatesWidgetProps, FeedUpdatesWidgetSkeleton, GenericSkeleton, AvatarGroupSkeleton, CommentObject, CommentsObject, CommentsObjectProps, CommentObjectProps, CommentsObjectSkeleton, CommentObjectSkeleton, CommentObjectReply, CommentObjectReplyProps, CommentsFeedObject, CommentsFeedObjectProps, CommentsFeedObjectSkeleton, ReplyComment, InlineComposerWidget, InlineComposerWidgetProps, InlineComposerWidgetSkeleton, Notification, NotificationProps, NotificationSkeleton, UserSuggestionWidget, UserSuggestionWidgetProps, UserSuggestionWidgetSkeleton, PlatformWidget, PlatformWidgetProps, PlatformWidgetSkeleton, LocationAutocomplete, LocationAutocompleteProps, LoyaltyProgramWidget, LoyaltyProgramWidgetProps, LoyaltyProgramWidgetSkeleton, CategoryTrendingFeedWidget, CategoryTrendingFeedWidgetProps, CategoryTrendingFeedWidgetSkeleton, CategoryTrendingUsersWidget, CategoryTrendingUsersWidgetProps, CategoryTrendingPeopleWidgetSkeleton, RelatedFeedObjectsWidget, RelatedFeedObjectWidgetProps, RelatedFeedObjectsWidgetSkeleton, UserActionIconButton, UserActionIconButtonProps, UserCounters, UserCountersProps, UserProfileHeader, UserProfileHeaderProps, UserProfileHeaderSkeleton, UserInfoDialog, UserInfoDialogProps, UserInfo, UserInfoProps, UserInfoSkeleton, UserProfileBlocked, UserProfileBlockedProps, SCUserProfileFields, SCUserProfileSettings, UserProfileEdit, UserProfileEditProps, UserProfileEditSkeleton, UserProfileEditSectionPublicInfo, UserProfileEditSectionPublicInfoProps, UserProfileEditSectionSettings, UserProfileEditSectionSettingsProps, UserProfileEditSectionAccount, UserProfileEditSectionAccountProps, UserFollowedUsersWidget, UserFollowedUsersWidgetProps, UserFollowedUsersWidgetSkeleton, UserFollowersWidget, UserFollowersWidgetProps, UserFollowersWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetProps, UserConnectionsWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetProps, UserConnectionsRequestsWidgetSkeleton, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetProps, UserConnectionsRequestsSentWidgetSkeleton, UserSocialAssociation, UserSocialAssociationProps, SCUserSocialAssociations, CustomAdv, CustomAdvProps, CustomAdvSkeleton, User, UserProps, UserSkeleton, PrivateMessageThread, PrivateMessageThreadProps, PrivateMessageThreadSkeleton, PrivateMessageThreadItem, PrivateMessageThreadItemProps, PrivateMessageThreadItemSkeleton, PrivateMessageSnippetItem, PrivateMessageSnippetItemProps, PrivateMessageSnippetItemSkeleton, PrivateMessageEditor, PrivateMessageEditorProps, PrivateMessageEditorSkeleton, PrivateMessageSnippets, PrivateMessageSnippetsProps, PrivateMessageSnippetsSkeleton, PrivateMessageComponent, PrivateMessageComponentProps, PrivateMessageComponentSkeleton, PrivateMessageSettingsIconButton, PrivateMessageSettingsIconButtonProps, ToastNotifications, ToastNotificationsProps, ToastNotificationsSkeleton, SnippetNotifications, SnippetNotificationsProps, SnippetNotificationsSkeleton, SearchAutocomplete, SearchAutocompleteProps, SearchDialog, SearchDialogProps, Widget, WidgetProps, SCFeedWidgetType, SCFeedObjectTemplateType, SCCommentsOrderBy, SCFeedObjectActivitiesType, SCMediaObjectType, SCMediaChunkType, SCNotificationObjectTemplateType, SCBroadcastMessageTemplateType, ChangeGroupCover, ChangeGroupCoverProps, ChangeGroupPicture, ChangeGroupPictureProps, GroupHeader, GroupHeaderProps, GroupHeaderSkeleton, GroupMembersButton, GroupMembersButtonProps, CreateGroupButton, CreateGroupButtonProps, EditGroupButton, EditGroupButtonProps, GroupInviteButton, GroupInviteButtonProps, GroupInfoWidget, GroupInfoWidgetProps, GroupInfoWidgetSkeleton, Group, GroupProps, GroupSkeleton, GroupSubscribeButton, GroupSubscribeButtonProps, GroupMembersWidget, GroupMembersWidgetProps, GroupMembersWidgetSkeleton, GroupRequestsWidget, GroupRequestsWidgetProps, GroupRequestsWidgetSkeleton, Groups, GroupsProps, GroupsSkeleton, GroupForm, GroupFormProps, GroupInvitedWidget, GroupInvitedWidgetProps, GroupInvitedWidgetSkeleton, UserSubscribedGroupsWidget, UserSubscribedGroupsWidgetProps, UserSubscribedGroupsWidgetSkeleton, HiddenPlaceholder, UrlTextField, UsernameTextField, EmailTextField, PasswordTextField, PhoneTextField, MetadataField, InfiniteScroll, StickyBox, useStickyBox, StickyBoxProps, StickyBoxComponent, UseStickyBoxProps, TagChip, TagChipProps, UserDeletedSnackBar, UserDeletedSnackBarProps, UserAvatar, UserAvatarProps, Lightbox, CentralProgress, ConfirmDialog, LanguageSwitcher, MediaChunkUploader, MediaChunkUploaderProps, File, Link, Share, EditMediaProps, MEDIA_TYPE_EMBED, FACEBOOK_SHARE, TWITTER_SHARE, LINKEDIN_SHARE, DEFAULT_PRELOAD_OFFSET_VIEWPORT, MIN_PRELOAD_OFFSET_VIEWPORT, MAX_PRELOAD_OFFSET_VIEWPORT, ConsentSolution, ConsentSolutionProps, ConsentSolutionSkeleton, ConsentSolutionButton, ConsentSolutionButtonProps, LEGAL_POLICIES, DEFAULT_FIELDS, DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PAGINATION_OFFSET, DEFAULT_PAGINATION_LIMIT, DEFAULT_WIDGETS_NUMBER, PollSuggestionWidget, PollSuggestionWidgetProps, Incubator, IncubatorSubscribeButton, IncubatorSubscribeButtonProps, IncubatorProps, IncubatorListWidget, IncubatorListWidgetProps, IncubatorDetail, IncubatorDetailProps, IncubatorSuggestionWidget, IncubatorSuggestionWidgetProps, ContributionUtils, bytesToSize, getUnseenNotification, getUnseenNotificationCounter, MessageUploaderUtils, getRelativeTime, Footer, FooterProps, FooterSkeleton, BaseItem, BaseItemProps, BaseDialog, BaseDialogProps, GroupSettingsIconButton, GroupSettingsIconButtonProps };
package/lib/cjs/index.js CHANGED
@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.GenericSkeleton = exports.FeedUpdatesWidgetSkeleton = exports.FeedUpdatesWidget = exports.FeedObjectMediaPreview = exports.FeedObjectSkeleton = exports.FeedObject = exports.ConnectionUserButton = exports.FollowUserButton = exports.CategoryFollowButton = exports.FeedSkeleton = exports.Feed = exports.FriendshipUserButton = exports.EditorSkeleton = exports.Editor = exports.ComposerIconButton = exports.Composer = exports.ChangePicture = exports.ChangeCover = exports.CategoriesSuggestionWidgetSkeleton = exports.CategoriesSuggestionWidget = exports.CategoriesPopularWidgetSkeleton = exports.CategoriesPopularWidget = exports.UserFollowedCategoriesWidgetSkeleton = exports.UserFollowedCategoriesWidget = exports.CategoriesSkeleton = exports.Categories = exports.CategoryHeaderSkeleton = exports.CategoryHeader = exports.CategoryFollowersButton = exports.CategoryAutocomplete = exports.CategorySkeleton = exports.Category = exports.BroadcastMessagesSkeleton = exports.BroadcastMessages = exports.BottomNavigation = exports.NavigationMenuContent = exports.NavigationMenuIconButton = exports.NavigationToolbarSkeleton = exports.NavigationToolbar = exports.NavigationToolbarMobileSkeleton = exports.NavigationToolbarMobile = exports.NavigationSettingsIconButton = exports.AccountChangeMailValidation = exports.AccountVerify = exports.AccountReset = exports.AccountRecover = exports.AccountDeleteButton = exports.AccountDelete = exports.AccountDataPortabilityButton = exports.AccountDataPortability = void 0;
4
4
  exports.UserConnectionsRequestsSentWidget = exports.UserConnectionsRequestsWidgetSkeleton = exports.UserConnectionsRequestsWidget = exports.UserConnectionsWidgetSkeleton = exports.UserConnectionsWidget = exports.UserFollowersWidgetSkeleton = exports.UserFollowersWidget = exports.UserFollowedUsersWidgetSkeleton = exports.UserFollowedUsersWidget = exports.UserProfileEditSectionAccount = exports.UserProfileEditSectionSettings = exports.UserProfileEditSectionPublicInfo = exports.UserProfileEditSkeleton = exports.UserProfileEdit = exports.SCUserProfileSettings = exports.SCUserProfileFields = exports.UserProfileBlocked = exports.UserInfoSkeleton = exports.UserInfo = exports.UserInfoDialog = exports.UserProfileHeaderSkeleton = exports.UserProfileHeader = exports.UserCounters = exports.UserActionIconButton = exports.RelatedFeedObjectsWidgetSkeleton = exports.RelatedFeedObjectsWidget = exports.CategoryTrendingPeopleWidgetSkeleton = exports.CategoryTrendingUsersWidget = exports.CategoryTrendingFeedWidgetSkeleton = exports.CategoryTrendingFeedWidget = exports.LoyaltyProgramWidgetSkeleton = exports.LoyaltyProgramWidget = exports.LocationAutocomplete = exports.PlatformWidgetSkeleton = exports.PlatformWidget = exports.UserSuggestionWidgetSkeleton = exports.UserSuggestionWidget = exports.NotificationSkeleton = exports.Notification = exports.InlineComposerWidgetSkeleton = exports.InlineComposerWidget = exports.ReplyComment = exports.CommentsFeedObjectSkeleton = exports.CommentsFeedObject = exports.CommentObjectReply = exports.CommentObjectSkeleton = exports.CommentsObjectSkeleton = exports.CommentsObject = exports.CommentObject = exports.AvatarGroupSkeleton = void 0;
5
5
  exports.Groups = exports.GroupRequestsWidgetSkeleton = exports.GroupRequestsWidget = exports.GroupMembersWidgetSkeleton = exports.GroupMembersWidget = exports.GroupSubscribeButton = exports.GroupSkeleton = exports.Group = exports.GroupInfoWidgetSkeleton = exports.GroupInfoWidget = exports.GroupInviteButton = exports.EditGroupButton = exports.CreateGroupButton = exports.GroupMembersButton = exports.GroupHeaderSkeleton = exports.GroupHeader = exports.ChangeGroupPicture = exports.ChangeGroupCover = exports.SCBroadcastMessageTemplateType = exports.SCNotificationObjectTemplateType = exports.SCFeedObjectActivitiesType = exports.SCCommentsOrderBy = exports.SCFeedObjectTemplateType = exports.Widget = exports.SearchDialog = exports.SearchAutocomplete = exports.SnippetNotificationsSkeleton = exports.SnippetNotifications = exports.ToastNotificationsSkeleton = exports.ToastNotifications = exports.PrivateMessageSettingsIconButton = exports.PrivateMessageComponentSkeleton = exports.PrivateMessageComponent = exports.PrivateMessageSnippetsSkeleton = exports.PrivateMessageSnippets = exports.PrivateMessageEditorSkeleton = exports.PrivateMessageEditor = exports.PrivateMessageSnippetItemSkeleton = exports.PrivateMessageSnippetItem = exports.PrivateMessageThreadItemSkeleton = exports.PrivateMessageThreadItem = exports.PrivateMessageThreadSkeleton = exports.PrivateMessageThread = exports.UserSkeleton = exports.User = exports.CustomAdvSkeleton = exports.CustomAdv = exports.SCUserSocialAssociations = exports.UserSocialAssociation = exports.UserConnectionsRequestsSentWidgetSkeleton = void 0;
6
- exports.getUnseenNotification = exports.bytesToSize = exports.ContributionUtils = exports.IncubatorSuggestionWidget = exports.IncubatorDetail = exports.IncubatorListWidget = exports.IncubatorSubscribeButton = exports.Incubator = exports.PollSuggestionWidget = exports.DEFAULT_WIDGETS_NUMBER = exports.DEFAULT_PAGINATION_LIMIT = exports.DEFAULT_PAGINATION_OFFSET = exports.DEFAULT_PAGINATION_QUERY_PARAM_NAME = exports.DEFAULT_FIELDS = exports.LEGAL_POLICIES = exports.ConsentSolutionButton = exports.ConsentSolutionSkeleton = exports.ConsentSolution = exports.MAX_PRELOAD_OFFSET_VIEWPORT = exports.MIN_PRELOAD_OFFSET_VIEWPORT = exports.DEFAULT_PRELOAD_OFFSET_VIEWPORT = exports.LINKEDIN_SHARE = exports.TWITTER_SHARE = exports.FACEBOOK_SHARE = exports.MEDIA_TYPE_EMBED = exports.Share = exports.Link = exports.File = exports.MediaChunkUploader = exports.LanguageSwitcher = exports.ConfirmDialog = exports.CentralProgress = exports.Lightbox = exports.UserAvatar = exports.UserDeletedSnackBar = exports.TagChip = exports.useStickyBox = exports.StickyBox = exports.InfiniteScroll = exports.MetadataField = exports.PhoneTextField = exports.PasswordTextField = exports.EmailTextField = exports.UsernameTextField = exports.UrlTextField = exports.HiddenPlaceholder = exports.GroupInvitedWidgetSkeleton = exports.GroupInvitedWidget = exports.GroupForm = exports.GroupsSkeleton = void 0;
7
- exports.GroupSettingsIconButton = exports.BaseDialog = exports.BaseItem = exports.FooterSkeleton = exports.Footer = exports.getRelativeTime = exports.MessageUploaderUtils = exports.getUnseenNotificationCounter = void 0;
6
+ exports.ContributionUtils = exports.IncubatorSuggestionWidget = exports.IncubatorDetail = exports.IncubatorListWidget = exports.IncubatorSubscribeButton = exports.Incubator = exports.PollSuggestionWidget = exports.DEFAULT_WIDGETS_NUMBER = exports.DEFAULT_PAGINATION_LIMIT = exports.DEFAULT_PAGINATION_OFFSET = exports.DEFAULT_PAGINATION_QUERY_PARAM_NAME = exports.DEFAULT_FIELDS = exports.LEGAL_POLICIES = exports.ConsentSolutionButton = exports.ConsentSolutionSkeleton = exports.ConsentSolution = exports.MAX_PRELOAD_OFFSET_VIEWPORT = exports.MIN_PRELOAD_OFFSET_VIEWPORT = exports.DEFAULT_PRELOAD_OFFSET_VIEWPORT = exports.LINKEDIN_SHARE = exports.TWITTER_SHARE = exports.FACEBOOK_SHARE = exports.MEDIA_TYPE_EMBED = exports.Share = exports.Link = exports.File = exports.MediaChunkUploader = exports.LanguageSwitcher = exports.ConfirmDialog = exports.CentralProgress = exports.Lightbox = exports.UserAvatar = exports.UserDeletedSnackBar = exports.TagChip = exports.useStickyBox = exports.StickyBox = exports.InfiniteScroll = exports.MetadataField = exports.PhoneTextField = exports.PasswordTextField = exports.EmailTextField = exports.UsernameTextField = exports.UrlTextField = exports.HiddenPlaceholder = exports.UserSubscribedGroupsWidgetSkeleton = exports.UserSubscribedGroupsWidget = exports.GroupInvitedWidgetSkeleton = exports.GroupInvitedWidget = exports.GroupForm = exports.GroupsSkeleton = void 0;
7
+ exports.GroupSettingsIconButton = exports.BaseDialog = exports.BaseItem = exports.FooterSkeleton = exports.Footer = exports.getRelativeTime = exports.MessageUploaderUtils = exports.getUnseenNotificationCounter = exports.getUnseenNotification = exports.bytesToSize = void 0;
8
8
  const tslib_1 = require("tslib");
9
9
  /**
10
10
  * Components
@@ -315,6 +315,9 @@ exports.GroupSettingsIconButton = GroupSettingsIconButton_1.default;
315
315
  const GroupInvitedWidget_1 = tslib_1.__importStar(require("./components/GroupInvitedWidget"));
316
316
  exports.GroupInvitedWidget = GroupInvitedWidget_1.default;
317
317
  Object.defineProperty(exports, "GroupInvitedWidgetSkeleton", { enumerable: true, get: function () { return GroupInvitedWidget_1.GroupInvitedWidgetSkeleton; } });
318
+ const UserSubscribedGroupsWidget_1 = tslib_1.__importStar(require("./components/UserSubscribedGroupsWidget"));
319
+ exports.UserSubscribedGroupsWidget = UserSubscribedGroupsWidget_1.default;
320
+ Object.defineProperty(exports, "UserSubscribedGroupsWidgetSkeleton", { enumerable: true, get: function () { return UserSubscribedGroupsWidget_1.UserSubscribedGroupsWidgetSkeleton; } });
318
321
  /**
319
322
  * Constants
320
323
  */
@@ -58,5 +58,5 @@ export default function ContributorsFeedObject(props) {
58
58
  openContributorsDialog && (React.createElement(BaseDialog, { title: React.createElement(FormattedMessage, { defaultMessage: "ui.feedObject.contributors.title", id: "ui.feedObject.contributors.title", values: { total: contributorsObject.total } }), onClose: () => setOpenContributorsDialog(false), open: openContributorsDialog }, contributorsObject.isLoadingNext ? (React.createElement(CentralProgress, { size: 50 })) : (React.createElement(InfiniteScroll, { dataLength: contributorsObject.contributors.length, next: contributorsObject.getNextPage(), hasMoreNext: Boolean(contributorsObject.next), loaderNext: React.createElement(CentralProgress, { size: 30 }), height: 400, endMessage: React.createElement(Typography, { variant: "body2", align: "center", fontWeight: "bold" },
59
59
  React.createElement(FormattedMessage, { id: "ui.feedObject.contributors.noOtherContributors", defaultMessage: "ui.feedObject.contributors.noOtherContributors" })) },
60
60
  React.createElement(List, null, contributorsObject.contributors.map((c, i) => (React.createElement(ListItem, { key: i },
61
- React.createElement(User, { elevation: 0, user: c, key: c.id, sx: { m: 0 } }))))))))))) : null)))));
61
+ React.createElement(User, { elevation: 0, user: c, key: c.id, sx: { m: 0 }, onClick: () => setOpenContributorsDialog(false) }))))))))))) : null)))));
62
62
  }
@@ -27,6 +27,11 @@ export interface GroupProps extends WidgetProps {
27
27
  * @default false
28
28
  */
29
29
  hideActions?: boolean;
30
+ /**
31
+ * Prop to redirect the user to the group page
32
+ * @default false
33
+ */
34
+ actionRedirect?: boolean;
30
35
  /**
31
36
  * Props to spread to the button
32
37
  * @default {}
@@ -1,10 +1,10 @@
1
1
  import { __rest } from "tslib";
2
2
  import React, { useMemo, useState } from 'react';
3
3
  import { styled } from '@mui/material/styles';
4
- import { Avatar, Icon, Stack } from '@mui/material';
4
+ import { Avatar, Button, Icon, Stack } from '@mui/material';
5
5
  import { SCGroupPrivacyType } from '@selfcommunity/types';
6
6
  import { Link, SCRoutes, useSCFetchGroup, useSCRouting, useSCUser } from '@selfcommunity/react-core';
7
- import { defineMessages, useIntl } from 'react-intl';
7
+ import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
8
8
  import classNames from 'classnames';
9
9
  import { useThemeProps } from '@mui/system';
10
10
  import BaseItemButton from '../../shared/BaseItemButton';
@@ -67,7 +67,7 @@ export default function Group(inProps) {
67
67
  props: inProps,
68
68
  name: PREFIX
69
69
  });
70
- const { groupId = null, group = null, className = null, elevation, hideActions = false, groupSubscribeButtonProps = {} } = props, rest = __rest(props, ["groupId", "group", "className", "elevation", "hideActions", "groupSubscribeButtonProps"]);
70
+ const { groupId = null, group = null, className = null, elevation, hideActions = false, actionRedirect = false, groupSubscribeButtonProps = {} } = props, rest = __rest(props, ["groupId", "group", "className", "elevation", "hideActions", "actionRedirect", "groupSubscribeButtonProps"]);
71
71
  // STATE
72
72
  const { scGroup } = useSCFetchGroup({ id: groupId, group });
73
73
  // CONTEXT
@@ -85,7 +85,7 @@ export default function Group(inProps) {
85
85
  function renderAuthenticatedActions() {
86
86
  return (React.createElement(Stack, { className: classes.actions, direction: "row", alignItems: "center", justifyContent: "center", spacing: 2 },
87
87
  isGroupAdmin && React.createElement(Icon, null, "face"),
88
- React.createElement(GroupSubscribeButton, Object.assign({ group: group, groupId: groupId }, groupSubscribeButtonProps))));
88
+ actionRedirect ? (React.createElement(Button, { size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, scGroup) }, scGroup.privacy === SCGroupPrivacyType.PUBLIC ? (React.createElement(FormattedMessage, { defaultMessage: "ui.groupSubscribeButton.enter", id: "ui.groupSubscribeButton.enter" })) : (React.createElement(FormattedMessage, { defaultMessage: "ui.groupSubscribeButton.requestAccess", id: "ui.groupSubscribeButton.requestAccess" })))) : (React.createElement(GroupSubscribeButton, Object.assign({ group: group, groupId: groupId }, groupSubscribeButtonProps)))));
89
89
  }
90
90
  /**
91
91
  * Renders group object
@@ -133,5 +133,5 @@ export default function GroupMembersButton(inProps) {
133
133
  React.createElement(InfiniteScroll, { dataLength: members.length, next: fetchMembers, hasMoreNext: next !== null || loading, loaderNext: React.createElement(UserSkeleton, { elevation: 0 }), height: isMobile ? '100%' : 400, endMessage: React.createElement(Typography, { className: classes.endMessage },
134
134
  React.createElement(FormattedMessage, { id: "ui.groupMembersButton.noOtherMembers", defaultMessage: "ui.groupMembersButton.noOtherMembers" })) },
135
135
  React.createElement(List, null, members.map((member) => (React.createElement(ListItem, { key: member.id },
136
- React.createElement(User, { elevation: 0, user: member }))))))))));
136
+ React.createElement(User, { elevation: 0, user: member, onClick: handleToggleDialogOpen }))))))))));
137
137
  }
@@ -117,13 +117,6 @@ export default function Groups(inProps) {
117
117
  fetchGroups();
118
118
  }
119
119
  }, [contentAvailability, authUserId, search]);
120
- const handleSubscribe = (group) => {
121
- if (!general) {
122
- const newGroups = [...groups];
123
- const _updated = newGroups.filter((g) => g.id !== group.id);
124
- setGroups(_updated);
125
- }
126
- };
127
120
  const handleNext = useMemo(() => () => {
128
121
  if (!next) {
129
122
  return;
@@ -172,7 +165,7 @@ export default function Groups(inProps) {
172
165
  button: (chunk) => (React.createElement(Button, { color: "secondary", variant: "text", onClick: handleScrollUp }, chunk))
173
166
  } })) },
174
167
  React.createElement(Grid, { container: true, spacing: { xs: 2 }, className: classes.groups }, filteredGroups.map((group) => (React.createElement(Grid, { item: true, xs: 12, sm: 8, md: 6, key: group.id, className: classes.item },
175
- React.createElement(Group, Object.assign({ group: group, groupId: group.id, groupSubscribeButtonProps: { onSubscribe: handleSubscribe } }, GroupComponentProps)))))))))));
168
+ React.createElement(Group, Object.assign({ group: group, groupId: group.id, actionRedirect: true }, GroupComponentProps)))))))))));
176
169
  // RENDER
177
170
  if (!contentAvailability && !scUserContext.user) {
178
171
  return React.createElement(HiddenPlaceholder, null);
@@ -0,0 +1,21 @@
1
+ /**
2
+ * > API documentation for the Community-JS User Profile Categories Followed Widget Skeleton component. Learn about the available props and the CSS API.
3
+
4
+ #### Import
5
+
6
+ ```jsx
7
+ import {UserSubscribedGroupsWidgetSkeleton} from '@selfcommunity/react-ui';
8
+ ```
9
+
10
+ #### Component Name
11
+
12
+ The name `SCUserCategoriesFollowedWidget-skeleton-root` can be used when providing style overrides in the theme.
13
+
14
+ #### CSS
15
+
16
+ |Rule Name|Global class|Description|
17
+ |---|---|---|
18
+ |root|.SCUserSubscribedGroupsWidget-skeleton-root|Styles applied to the root element.|
19
+ *
20
+ */
21
+ export default function UserSubscribedGroupsWidgetSkeleton(props: any): JSX.Element;