@selfcommunity/react-ui 0.7.9-alpha.1 → 0.7.9-alpha.2
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/ChangeGroupCover/ChangeGroupCover.d.ts +55 -0
- package/lib/cjs/components/ChangeGroupCover/ChangeGroupCover.js +117 -0
- package/lib/cjs/components/ChangeGroupCover/constants.d.ts +1 -0
- package/lib/cjs/components/ChangeGroupCover/constants.js +4 -0
- package/lib/cjs/components/ChangeGroupCover/index.d.ts +3 -0
- package/lib/cjs/components/ChangeGroupCover/index.js +5 -0
- package/lib/cjs/components/ChangeGroupPicture/ChangeGroupPicture.d.ts +57 -0
- package/lib/cjs/components/ChangeGroupPicture/ChangeGroupPicture.js +117 -0
- package/lib/cjs/components/ChangeGroupPicture/constants.d.ts +1 -0
- package/lib/cjs/components/ChangeGroupPicture/constants.js +4 -0
- package/lib/cjs/components/ChangeGroupPicture/index.d.ts +3 -0
- package/lib/cjs/components/ChangeGroupPicture/index.js +5 -0
- package/lib/cjs/components/CreateGroup/CreateGroup.d.ts +48 -0
- package/lib/cjs/components/CreateGroup/CreateGroup.js +187 -0
- package/lib/cjs/components/CreateGroup/constants.d.ts +1 -0
- package/lib/cjs/components/CreateGroup/constants.js +4 -0
- package/lib/cjs/components/CreateGroup/index.d.ts +3 -0
- package/lib/cjs/components/CreateGroup/index.js +5 -0
- package/lib/cjs/components/CreateGroupButton/CreateGroupButton.d.ts +38 -0
- package/lib/cjs/components/CreateGroupButton/CreateGroupButton.js +73 -0
- package/lib/cjs/components/CreateGroupButton/index.d.ts +3 -0
- package/lib/cjs/components/CreateGroupButton/index.js +5 -0
- package/lib/cjs/components/Group/Group.d.ts +67 -0
- package/lib/cjs/components/Group/Group.js +96 -0
- package/lib/cjs/components/Group/Skeleton.d.ts +22 -0
- package/lib/cjs/components/Group/Skeleton.js +42 -0
- package/lib/cjs/components/Group/constants.d.ts +1 -0
- package/lib/cjs/components/Group/constants.js +4 -0
- package/lib/cjs/components/Group/index.d.ts +4 -0
- package/lib/cjs/components/Group/index.js +8 -0
- package/lib/cjs/components/GroupHeader/GroupHeader.d.ts +83 -0
- package/lib/cjs/components/GroupHeader/GroupHeader.js +137 -0
- package/lib/cjs/components/GroupHeader/Skeleton.d.ts +27 -0
- package/lib/cjs/components/GroupHeader/Skeleton.js +56 -0
- package/lib/cjs/components/GroupHeader/constants.d.ts +1 -0
- package/lib/cjs/components/GroupHeader/constants.js +4 -0
- package/lib/cjs/components/GroupHeader/index.d.ts +4 -0
- package/lib/cjs/components/GroupHeader/index.js +8 -0
- package/lib/cjs/components/GroupInfoWidget/GroupInfoWidget.d.ts +52 -0
- package/lib/cjs/components/GroupInfoWidget/GroupInfoWidget.js +100 -0
- package/lib/cjs/components/GroupInfoWidget/Skeleton.d.ts +21 -0
- package/lib/cjs/components/GroupInfoWidget/Skeleton.js +38 -0
- package/lib/cjs/components/GroupInfoWidget/constants.d.ts +1 -0
- package/lib/cjs/components/GroupInfoWidget/constants.js +4 -0
- package/lib/cjs/components/GroupInfoWidget/index.d.ts +4 -0
- package/lib/cjs/components/GroupInfoWidget/index.js +8 -0
- package/lib/cjs/components/GroupInviteButton/GroupInviteButton.d.ts +57 -0
- package/lib/cjs/components/GroupInviteButton/GroupInviteButton.js +259 -0
- package/lib/cjs/components/GroupInviteButton/index.d.ts +3 -0
- package/lib/cjs/components/GroupInviteButton/index.js +5 -0
- package/lib/cjs/components/GroupMembersButton/GroupMembersButton.d.ts +46 -0
- package/lib/cjs/components/GroupMembersButton/GroupMembersButton.js +135 -0
- package/lib/cjs/components/GroupMembersButton/index.d.ts +3 -0
- package/lib/cjs/components/GroupMembersButton/index.js +5 -0
- package/lib/cjs/components/GroupMembersWidget/GroupMembersWidget.d.ts +79 -0
- package/lib/cjs/components/GroupMembersWidget/GroupMembersWidget.js +194 -0
- package/lib/cjs/components/GroupMembersWidget/Skeleton.d.ts +22 -0
- package/lib/cjs/components/GroupMembersWidget/Skeleton.js +38 -0
- package/lib/cjs/components/GroupMembersWidget/constants.d.ts +1 -0
- package/lib/cjs/components/GroupMembersWidget/constants.js +4 -0
- package/lib/cjs/components/GroupMembersWidget/index.d.ts +4 -0
- package/lib/cjs/components/GroupMembersWidget/index.js +8 -0
- package/lib/cjs/components/GroupRequestsWidget/GroupRequestsWidget.d.ts +79 -0
- package/lib/cjs/components/GroupRequestsWidget/GroupRequestsWidget.js +194 -0
- package/lib/cjs/components/GroupRequestsWidget/Skeleton.d.ts +22 -0
- package/lib/cjs/components/GroupRequestsWidget/Skeleton.js +38 -0
- package/lib/cjs/components/GroupRequestsWidget/constants.d.ts +1 -0
- package/lib/cjs/components/GroupRequestsWidget/constants.js +4 -0
- package/lib/cjs/components/GroupRequestsWidget/index.d.ts +4 -0
- package/lib/cjs/components/GroupRequestsWidget/index.js +8 -0
- package/lib/cjs/components/GroupSubscribeButton/GroupSubscribeButton.d.ts +51 -0
- package/lib/cjs/components/GroupSubscribeButton/GroupSubscribeButton.js +117 -0
- package/lib/cjs/components/GroupSubscribeButton/index.d.ts +3 -0
- package/lib/cjs/components/GroupSubscribeButton/index.js +5 -0
- package/lib/cjs/components/InlineComposerWidget/InlineComposerWidget.d.ts +4 -0
- package/lib/cjs/components/InlineComposerWidget/InlineComposerWidget.js +2 -3
- package/lib/cjs/components/User/User.d.ts +12 -0
- package/lib/cjs/components/User/User.js +5 -3
- package/lib/cjs/constants/Group.d.ts +2 -0
- package/lib/cjs/constants/Group.js +5 -0
- package/lib/cjs/index.d.ts +13 -1
- package/lib/cjs/index.js +30 -2
- package/lib/esm/components/ChangeGroupCover/ChangeGroupCover.d.ts +55 -0
- package/lib/esm/components/ChangeGroupCover/ChangeGroupCover.js +114 -0
- package/lib/esm/components/ChangeGroupCover/constants.d.ts +1 -0
- package/lib/esm/components/ChangeGroupCover/constants.js +1 -0
- package/lib/esm/components/ChangeGroupCover/index.d.ts +3 -0
- package/lib/esm/components/ChangeGroupCover/index.js +2 -0
- package/lib/esm/components/ChangeGroupPicture/ChangeGroupPicture.d.ts +57 -0
- package/lib/esm/components/ChangeGroupPicture/ChangeGroupPicture.js +114 -0
- package/lib/esm/components/ChangeGroupPicture/constants.d.ts +1 -0
- package/lib/esm/components/ChangeGroupPicture/constants.js +1 -0
- package/lib/esm/components/ChangeGroupPicture/index.d.ts +3 -0
- package/lib/esm/components/ChangeGroupPicture/index.js +2 -0
- package/lib/esm/components/CreateGroup/CreateGroup.d.ts +48 -0
- package/lib/esm/components/CreateGroup/CreateGroup.js +184 -0
- package/lib/esm/components/CreateGroup/constants.d.ts +1 -0
- package/lib/esm/components/CreateGroup/constants.js +1 -0
- package/lib/esm/components/CreateGroup/index.d.ts +3 -0
- package/lib/esm/components/CreateGroup/index.js +2 -0
- package/lib/esm/components/CreateGroupButton/CreateGroupButton.d.ts +38 -0
- package/lib/esm/components/CreateGroupButton/CreateGroupButton.js +70 -0
- package/lib/esm/components/CreateGroupButton/index.d.ts +3 -0
- package/lib/esm/components/CreateGroupButton/index.js +2 -0
- package/lib/esm/components/Group/Group.d.ts +67 -0
- package/lib/esm/components/Group/Group.js +93 -0
- package/lib/esm/components/Group/Skeleton.d.ts +22 -0
- package/lib/esm/components/Group/Skeleton.js +38 -0
- package/lib/esm/components/Group/constants.d.ts +1 -0
- package/lib/esm/components/Group/constants.js +1 -0
- package/lib/esm/components/Group/index.d.ts +4 -0
- package/lib/esm/components/Group/index.js +4 -0
- package/lib/esm/components/GroupHeader/GroupHeader.d.ts +83 -0
- package/lib/esm/components/GroupHeader/GroupHeader.js +134 -0
- package/lib/esm/components/GroupHeader/Skeleton.d.ts +27 -0
- package/lib/esm/components/GroupHeader/Skeleton.js +53 -0
- package/lib/esm/components/GroupHeader/constants.d.ts +1 -0
- package/lib/esm/components/GroupHeader/constants.js +1 -0
- package/lib/esm/components/GroupHeader/index.d.ts +4 -0
- package/lib/esm/components/GroupHeader/index.js +4 -0
- package/lib/esm/components/GroupInfoWidget/GroupInfoWidget.d.ts +52 -0
- package/lib/esm/components/GroupInfoWidget/GroupInfoWidget.js +97 -0
- package/lib/esm/components/GroupInfoWidget/Skeleton.d.ts +21 -0
- package/lib/esm/components/GroupInfoWidget/Skeleton.js +34 -0
- package/lib/esm/components/GroupInfoWidget/constants.d.ts +1 -0
- package/lib/esm/components/GroupInfoWidget/constants.js +1 -0
- package/lib/esm/components/GroupInfoWidget/index.d.ts +4 -0
- package/lib/esm/components/GroupInfoWidget/index.js +4 -0
- package/lib/esm/components/GroupInviteButton/GroupInviteButton.d.ts +57 -0
- package/lib/esm/components/GroupInviteButton/GroupInviteButton.js +256 -0
- package/lib/esm/components/GroupInviteButton/index.d.ts +3 -0
- package/lib/esm/components/GroupInviteButton/index.js +2 -0
- package/lib/esm/components/GroupMembersButton/GroupMembersButton.d.ts +46 -0
- package/lib/esm/components/GroupMembersButton/GroupMembersButton.js +132 -0
- package/lib/esm/components/GroupMembersButton/index.d.ts +3 -0
- package/lib/esm/components/GroupMembersButton/index.js +2 -0
- package/lib/esm/components/GroupMembersWidget/GroupMembersWidget.d.ts +79 -0
- package/lib/esm/components/GroupMembersWidget/GroupMembersWidget.js +191 -0
- package/lib/esm/components/GroupMembersWidget/Skeleton.d.ts +22 -0
- package/lib/esm/components/GroupMembersWidget/Skeleton.js +34 -0
- package/lib/esm/components/GroupMembersWidget/constants.d.ts +1 -0
- package/lib/esm/components/GroupMembersWidget/constants.js +1 -0
- package/lib/esm/components/GroupMembersWidget/index.d.ts +4 -0
- package/lib/esm/components/GroupMembersWidget/index.js +4 -0
- package/lib/esm/components/GroupRequestsWidget/GroupRequestsWidget.d.ts +79 -0
- package/lib/esm/components/GroupRequestsWidget/GroupRequestsWidget.js +191 -0
- package/lib/esm/components/GroupRequestsWidget/Skeleton.d.ts +22 -0
- package/lib/esm/components/GroupRequestsWidget/Skeleton.js +34 -0
- package/lib/esm/components/GroupRequestsWidget/constants.d.ts +1 -0
- package/lib/esm/components/GroupRequestsWidget/constants.js +1 -0
- package/lib/esm/components/GroupRequestsWidget/index.d.ts +4 -0
- package/lib/esm/components/GroupRequestsWidget/index.js +4 -0
- package/lib/esm/components/GroupSubscribeButton/GroupSubscribeButton.d.ts +51 -0
- package/lib/esm/components/GroupSubscribeButton/GroupSubscribeButton.js +114 -0
- package/lib/esm/components/GroupSubscribeButton/index.d.ts +3 -0
- package/lib/esm/components/GroupSubscribeButton/index.js +2 -0
- package/lib/esm/components/InlineComposerWidget/InlineComposerWidget.d.ts +4 -0
- package/lib/esm/components/InlineComposerWidget/InlineComposerWidget.js +3 -4
- package/lib/esm/components/User/User.d.ts +12 -0
- package/lib/esm/components/User/User.js +5 -3
- package/lib/esm/constants/Group.d.ts +2 -0
- package/lib/esm/constants/Group.js +2 -0
- package/lib/esm/index.d.ts +13 -1
- package/lib/esm/index.js +13 -1
- package/lib/umd/react-ui.js +1 -1
- package/package.json +6 -6
|
@@ -0,0 +1,194 @@
|
|
|
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 Widget_1 = tslib_1.__importDefault(require("../Widget"));
|
|
9
|
+
const api_services_1 = require("@selfcommunity/api-services");
|
|
10
|
+
const utils_1 = require("@selfcommunity/utils");
|
|
11
|
+
const react_core_1 = require("@selfcommunity/react-core");
|
|
12
|
+
const widget_1 = require("../../utils/widget");
|
|
13
|
+
const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
|
|
14
|
+
const react_intl_1 = require("react-intl");
|
|
15
|
+
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
16
|
+
const Errors_1 = require("../../constants/Errors");
|
|
17
|
+
const BaseDialog_1 = tslib_1.__importDefault(require("../../shared/BaseDialog"));
|
|
18
|
+
const InfiniteScroll_1 = tslib_1.__importDefault(require("../../shared/InfiniteScroll"));
|
|
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 User_1 = tslib_1.__importStar(require("../User"));
|
|
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 Group Requests Widget component. Learn about the available props and the CSS API.
|
|
41
|
+
*
|
|
42
|
+
*
|
|
43
|
+
* This component renders the list of the follows of the given group.
|
|
44
|
+
* Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/GroupRequests)
|
|
45
|
+
|
|
46
|
+
#### Import
|
|
47
|
+
|
|
48
|
+
```jsx
|
|
49
|
+
import {GroupRequestsWidget} from '@selfcommunity/react-ui';
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
#### Component Name
|
|
53
|
+
|
|
54
|
+
The name `SCGroupRequestsWidget` can be used when providing style overrides in the theme.
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
#### CSS
|
|
58
|
+
|
|
59
|
+
|Rule Name|Global class|Description|
|
|
60
|
+
|---|---|---|
|
|
61
|
+
|root|.SCGroupRequestsWidget-root|Styles applied to the root element.|
|
|
62
|
+
|title|.SCGroupRequestsWidget-title|Styles applied to the title element.|
|
|
63
|
+
|noResults|.SCGroupRequestsWidget-no-results|Styles applied to no results section.|
|
|
64
|
+
|showMore|.SCGroupRequestsWidget-show-more|Styles applied to show more button element.|
|
|
65
|
+
|dialogRoot|.SCGroupRequestsWidget-dialog-root|Styles applied to the dialog root element.|
|
|
66
|
+
|endMessage|.SCGroupRequestsWidget-end-message|Styles applied to the end message element.|
|
|
67
|
+
|
|
68
|
+
* @param inProps
|
|
69
|
+
*/
|
|
70
|
+
function GroupRequestsWidget(inProps) {
|
|
71
|
+
// PROPS
|
|
72
|
+
const props = (0, system_1.useThemeProps)({
|
|
73
|
+
props: inProps,
|
|
74
|
+
name: constants_1.PREFIX
|
|
75
|
+
});
|
|
76
|
+
const { groupId, group, autoHide = false, limit = 5, className, cacheStrategy = utils_1.CacheStrategies.NETWORK_ONLY, onHeightChange, onStateChange, UserProps = {}, DialogProps = {} } = props, rest = tslib_1.__rest(props, ["groupId", "group", "autoHide", "limit", "className", "cacheStrategy", "onHeightChange", "onStateChange", "UserProps", "DialogProps"]);
|
|
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.GROUP_REQUESTS_TOOLS_STATE_CACHE_PREFIX_KEY, (0, utils_1.isInteger)(groupId) ? groupId : group.id),
|
|
82
|
+
cacheStrategy,
|
|
83
|
+
visibleItems: limit
|
|
84
|
+
}, widget_1.stateWidgetInitializer);
|
|
85
|
+
const [openDialog, setOpenDialog] = (0, react_1.useState)(false);
|
|
86
|
+
// CONTEXT
|
|
87
|
+
const scUserContext = (0, react_core_1.useSCUser)();
|
|
88
|
+
const scPreferencesContext = (0, react_core_1.useSCPreferences)();
|
|
89
|
+
const { scGroup } = (0, react_core_1.useSCFetchGroup)({ id: groupId, group });
|
|
90
|
+
// MEMO
|
|
91
|
+
const contentAvailability = (0, react_1.useMemo)(() => react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY in scPreferencesContext.preferences &&
|
|
92
|
+
scPreferencesContext.preferences[react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY].value, [scPreferencesContext.preferences]);
|
|
93
|
+
// HOOKS
|
|
94
|
+
const theme = (0, material_1.useTheme)();
|
|
95
|
+
const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
|
|
96
|
+
/**
|
|
97
|
+
* Initialize component
|
|
98
|
+
* Fetch data only if the component is not initialized and it is not loading data
|
|
99
|
+
*/
|
|
100
|
+
const _initComponent = (0, react_1.useMemo)(() => () => {
|
|
101
|
+
if (!state.initialized && !state.isLoadingNext) {
|
|
102
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
|
|
103
|
+
api_services_1.GroupService.getGroupWaitingApprovalSubscribers(scGroup.id, { limit })
|
|
104
|
+
.then((payload) => {
|
|
105
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_SUCCESS, payload: Object.assign(Object.assign({}, payload), { initialized: true }) });
|
|
106
|
+
})
|
|
107
|
+
.catch((error) => {
|
|
108
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
109
|
+
utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
|
|
110
|
+
});
|
|
111
|
+
}
|
|
112
|
+
}, [state.isLoadingNext, state.initialized, scGroup, limit, dispatch]);
|
|
113
|
+
// EFFECTS
|
|
114
|
+
(0, react_1.useEffect)(() => {
|
|
115
|
+
var _a;
|
|
116
|
+
let _t;
|
|
117
|
+
if ((contentAvailability || (!contentAvailability && ((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id))) && scGroup && scUserContext.user !== undefined) {
|
|
118
|
+
_t = setTimeout(_initComponent);
|
|
119
|
+
return () => {
|
|
120
|
+
_t && clearTimeout(_t);
|
|
121
|
+
};
|
|
122
|
+
}
|
|
123
|
+
}, [scUserContext.user, contentAvailability, scGroup]);
|
|
124
|
+
(0, react_1.useEffect)(() => {
|
|
125
|
+
if (openDialog && state.next && state.results.length === limit && state.initialized) {
|
|
126
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
|
|
127
|
+
api_services_1.GroupService.getGroupWaitingApprovalSubscribers(scGroup.id, { offset: limit, limit: 10 })
|
|
128
|
+
.then((payload) => {
|
|
129
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_SUCCESS, payload: payload });
|
|
130
|
+
})
|
|
131
|
+
.catch((error) => {
|
|
132
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
133
|
+
utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
|
|
134
|
+
});
|
|
135
|
+
}
|
|
136
|
+
}, [openDialog, state.next, state.results.length, state.initialized, limit]);
|
|
137
|
+
/**
|
|
138
|
+
* Virtual feed update
|
|
139
|
+
*/
|
|
140
|
+
(0, react_1.useEffect)(() => {
|
|
141
|
+
onHeightChange && onHeightChange();
|
|
142
|
+
}, [state.results]);
|
|
143
|
+
(0, react_1.useEffect)(() => {
|
|
144
|
+
if (!scGroup || (!contentAvailability && !scUserContext.user)) {
|
|
145
|
+
return;
|
|
146
|
+
}
|
|
147
|
+
else if (cacheStrategy === utils_1.CacheStrategies.NETWORK_ONLY) {
|
|
148
|
+
onStateChange && onStateChange({ cacheStrategy: utils_1.CacheStrategies.CACHE_FIRST });
|
|
149
|
+
}
|
|
150
|
+
}, [scUserContext.user, scGroup, contentAvailability]);
|
|
151
|
+
(0, react_1.useEffect)(() => {
|
|
152
|
+
if (!scGroup || !scUserContext.user || !state.initialized) {
|
|
153
|
+
return;
|
|
154
|
+
}
|
|
155
|
+
}, []);
|
|
156
|
+
// HANDLERS
|
|
157
|
+
const handleNext = (0, react_1.useMemo)(() => () => {
|
|
158
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
|
|
159
|
+
api_services_1.http
|
|
160
|
+
.request({
|
|
161
|
+
url: state.next,
|
|
162
|
+
method: api_services_1.Endpoints.GetGroupWaitingApprovalSubscribers.method
|
|
163
|
+
})
|
|
164
|
+
.then((res) => {
|
|
165
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_SUCCESS, payload: res.data });
|
|
166
|
+
});
|
|
167
|
+
}, [dispatch, state.next, state.isLoadingNext, state.initialized]);
|
|
168
|
+
const handleToggleDialogOpen = () => {
|
|
169
|
+
setOpenDialog((prev) => !prev);
|
|
170
|
+
};
|
|
171
|
+
// RENDER
|
|
172
|
+
if ((autoHide && !state.count && state.initialized) || (!contentAvailability && !scUserContext.user) || !scGroup) {
|
|
173
|
+
return react_1.default.createElement(HiddenPlaceholder_1.default, null);
|
|
174
|
+
}
|
|
175
|
+
if (!state.initialized) {
|
|
176
|
+
return react_1.default.createElement(Skeleton_1.default, null);
|
|
177
|
+
}
|
|
178
|
+
const content = (react_1.default.createElement(material_1.CardContent, null,
|
|
179
|
+
react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" },
|
|
180
|
+
react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.groupRequestsWidget.title", defaultMessage: "ui.groupRequestsWidget.title" })),
|
|
181
|
+
!state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
|
|
182
|
+
react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.groupRequestsWidget.subtitle.noResults", defaultMessage: "" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
|
|
183
|
+
react_1.default.createElement(List_1.default, null, state.results.slice(0, state.visibleItems).map((user) => (react_1.default.createElement(material_1.ListItem, { key: user.id },
|
|
184
|
+
react_1.default.createElement(User_1.default, { elevation: 0, actions: react_1.default.createElement(react_1.default.Fragment, null), user: user, userId: user.id, buttonProps: { onClick: () => console.log(user) } }))))),
|
|
185
|
+
state.count > state.visibleItems && (react_1.default.createElement(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen },
|
|
186
|
+
react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.groupRequestsWidget.button.showMore", defaultMessage: "ui.groupRequestsWidget.button.showMore" }))))),
|
|
187
|
+
openDialog && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.groupRequestsWidget.dialogTitle", id: "ui.groupRequestsWidget.dialogTitle", values: { total: scGroup.subscribers_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps),
|
|
188
|
+
react_1.default.createElement(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: react_1.default.createElement(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
|
|
189
|
+
react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.groupRequestsWidget.noMoreResults", defaultMessage: "ui.groupRequestsWidget.noMoreResults" })) },
|
|
190
|
+
react_1.default.createElement(List_1.default, null, state.results.map((user) => (react_1.default.createElement(material_1.ListItem, { key: user.id },
|
|
191
|
+
react_1.default.createElement(User_1.default, { elevation: 0, actions: react_1.default.createElement(react_1.default.Fragment, null), user: user, userId: user.id, buttonProps: { onClick: () => console.log(user) } }))))))))));
|
|
192
|
+
return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), content));
|
|
193
|
+
}
|
|
194
|
+
exports.default = GroupRequestsWidget;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { WidgetProps } from '../Widget';
|
|
2
|
+
/**
|
|
3
|
+
* > API documentation for the Community-JS Group Requests Widget Skeleton component. Learn about the available props and the CSS API.
|
|
4
|
+
|
|
5
|
+
#### Import
|
|
6
|
+
|
|
7
|
+
```jsx
|
|
8
|
+
import {GroupRequestsWidgetSkeleton} from '@selfcommunity/react-ui';
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
#### Component Name
|
|
12
|
+
|
|
13
|
+
The name `SCGroupRequestsWidget-skeleton-root` can be used when providing style overrides in the theme.
|
|
14
|
+
|
|
15
|
+
#### CSS
|
|
16
|
+
|
|
17
|
+
|Rule Name|Global class|Description|
|
|
18
|
+
|---|---|---|
|
|
19
|
+
|root|.SCGroupRequestsWidget-skeleton-root|Styles applied to the root element.|
|
|
20
|
+
*
|
|
21
|
+
*/
|
|
22
|
+
export default function GroupRequestsWidgetSkeleton(props: WidgetProps): JSX.Element;
|
|
@@ -0,0 +1,38 @@
|
|
|
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 CategoryTrendingUsersWidget_1 = require("../CategoryTrendingUsersWidget");
|
|
6
|
+
const styles_1 = require("@mui/material/styles");
|
|
7
|
+
const constants_1 = require("./constants");
|
|
8
|
+
const classes = {
|
|
9
|
+
root: `${constants_1.PREFIX}-skeleton-root`
|
|
10
|
+
};
|
|
11
|
+
const Root = (0, styles_1.styled)(CategoryTrendingUsersWidget_1.CategoryTrendingPeopleWidgetSkeleton, {
|
|
12
|
+
name: constants_1.PREFIX,
|
|
13
|
+
slot: 'SkeletonRoot'
|
|
14
|
+
})(() => ({}));
|
|
15
|
+
/**
|
|
16
|
+
* > API documentation for the Community-JS Group Requests Widget Skeleton component. Learn about the available props and the CSS API.
|
|
17
|
+
|
|
18
|
+
#### Import
|
|
19
|
+
|
|
20
|
+
```jsx
|
|
21
|
+
import {GroupRequestsWidgetSkeleton} from '@selfcommunity/react-ui';
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
#### Component Name
|
|
25
|
+
|
|
26
|
+
The name `SCGroupRequestsWidget-skeleton-root` can be used when providing style overrides in the theme.
|
|
27
|
+
|
|
28
|
+
#### CSS
|
|
29
|
+
|
|
30
|
+
|Rule Name|Global class|Description|
|
|
31
|
+
|---|---|---|
|
|
32
|
+
|root|.SCGroupRequestsWidget-skeleton-root|Styles applied to the root element.|
|
|
33
|
+
*
|
|
34
|
+
*/
|
|
35
|
+
function GroupRequestsWidgetSkeleton(props) {
|
|
36
|
+
return react_1.default.createElement(Root, Object.assign({ className: classes.root }, props));
|
|
37
|
+
}
|
|
38
|
+
exports.default = GroupRequestsWidgetSkeleton;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const PREFIX = "SCGroupRequestsWidget";
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.GroupRequestsWidgetSkeleton = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const GroupRequestsWidget_1 = tslib_1.__importDefault(require("./GroupRequestsWidget"));
|
|
6
|
+
const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
|
|
7
|
+
exports.GroupRequestsWidgetSkeleton = Skeleton_1.default;
|
|
8
|
+
exports.default = GroupRequestsWidget_1.default;
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { SCGroupType } from '@selfcommunity/types';
|
|
2
|
+
export interface GroupSubscribeButtonProps {
|
|
3
|
+
/**
|
|
4
|
+
* Overrides or extends the styles applied to the component.
|
|
5
|
+
* @default null
|
|
6
|
+
*/
|
|
7
|
+
className?: string;
|
|
8
|
+
/**
|
|
9
|
+
* Group Object
|
|
10
|
+
* @default null
|
|
11
|
+
*/
|
|
12
|
+
group?: SCGroupType;
|
|
13
|
+
/**
|
|
14
|
+
* Id of the group
|
|
15
|
+
* @default null
|
|
16
|
+
*/
|
|
17
|
+
groupId?: number;
|
|
18
|
+
/**
|
|
19
|
+
* onJoin callback
|
|
20
|
+
* @param user
|
|
21
|
+
* @param joined
|
|
22
|
+
*/
|
|
23
|
+
onJoin?: (group: SCGroupType, member: boolean) => any;
|
|
24
|
+
/**
|
|
25
|
+
* Others properties
|
|
26
|
+
*/
|
|
27
|
+
[p: string]: any;
|
|
28
|
+
}
|
|
29
|
+
/**
|
|
30
|
+
* > API documentation for the Community-JS Group Subscribe Button component. Learn about the available props and the CSS API.
|
|
31
|
+
|
|
32
|
+
#### Import
|
|
33
|
+
|
|
34
|
+
```jsx
|
|
35
|
+
import {GroupSubscribeButton} from '@selfcommunity/react-ui';
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
#### Component Name
|
|
39
|
+
|
|
40
|
+
The name `SCGroupSubscribeButton` can be used when providing style overrides in the theme.
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
#### CSS
|
|
44
|
+
|
|
45
|
+
|Rule Name|Global class|Description|
|
|
46
|
+
|---|---|---|
|
|
47
|
+
|root|.SCGroupSubscribeButton-root|Styles applied to the root element.|
|
|
48
|
+
|
|
49
|
+
* @param inProps
|
|
50
|
+
*/
|
|
51
|
+
export default function GroupSubscribeButton(inProps: GroupSubscribeButtonProps): JSX.Element;
|
|
@@ -0,0 +1,117 @@
|
|
|
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 utils_1 = require("@selfcommunity/utils");
|
|
7
|
+
const react_core_1 = require("@selfcommunity/react-core");
|
|
8
|
+
const types_1 = require("@selfcommunity/types");
|
|
9
|
+
const lab_1 = require("@mui/lab");
|
|
10
|
+
const react_intl_1 = require("react-intl");
|
|
11
|
+
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
12
|
+
const system_1 = require("@mui/system");
|
|
13
|
+
const Errors_1 = require("../../constants/Errors");
|
|
14
|
+
const PREFIX = 'SCGroupSubscribeButton';
|
|
15
|
+
const classes = {
|
|
16
|
+
root: `${PREFIX}-root`
|
|
17
|
+
};
|
|
18
|
+
const Root = (0, styles_1.styled)(lab_1.LoadingButton, {
|
|
19
|
+
name: PREFIX,
|
|
20
|
+
slot: 'Root',
|
|
21
|
+
overridesResolver: (props, styles) => styles.root
|
|
22
|
+
})(({ theme }) => ({}));
|
|
23
|
+
/**
|
|
24
|
+
* > API documentation for the Community-JS Group Subscribe Button component. Learn about the available props and the CSS API.
|
|
25
|
+
|
|
26
|
+
#### Import
|
|
27
|
+
|
|
28
|
+
```jsx
|
|
29
|
+
import {GroupSubscribeButton} from '@selfcommunity/react-ui';
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
#### Component Name
|
|
33
|
+
|
|
34
|
+
The name `SCGroupSubscribeButton` can be used when providing style overrides in the theme.
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
#### CSS
|
|
38
|
+
|
|
39
|
+
|Rule Name|Global class|Description|
|
|
40
|
+
|---|---|---|
|
|
41
|
+
|root|.SCGroupSubscribeButton-root|Styles applied to the root element.|
|
|
42
|
+
|
|
43
|
+
* @param inProps
|
|
44
|
+
*/
|
|
45
|
+
function GroupSubscribeButton(inProps) {
|
|
46
|
+
// PROPS
|
|
47
|
+
const props = (0, system_1.useThemeProps)({
|
|
48
|
+
props: inProps,
|
|
49
|
+
name: PREFIX
|
|
50
|
+
});
|
|
51
|
+
const { className, groupId, group, onJoin } = props, rest = tslib_1.__rest(props, ["className", "groupId", "group", "onJoin"]);
|
|
52
|
+
// STATE
|
|
53
|
+
const [status, setStatus] = (0, react_1.useState)(null);
|
|
54
|
+
// CONTEXT
|
|
55
|
+
const scContext = (0, react_core_1.useSCContext)();
|
|
56
|
+
const scUserContext = (0, react_core_1.useSCUser)();
|
|
57
|
+
const scGroupsManager = scUserContext.managers.groups;
|
|
58
|
+
// CONST
|
|
59
|
+
const authUserId = scUserContext.user ? scUserContext.user.id : null;
|
|
60
|
+
const { scGroup } = (0, react_core_1.useSCFetchGroup)({
|
|
61
|
+
id: groupId,
|
|
62
|
+
group,
|
|
63
|
+
cacheStrategy: authUserId ? utils_1.CacheStrategies.CACHE_FIRST : utils_1.CacheStrategies.STALE_WHILE_REVALIDATE
|
|
64
|
+
});
|
|
65
|
+
(0, react_1.useEffect)(() => {
|
|
66
|
+
/**
|
|
67
|
+
* Call scGroupsManager.subscriptionStatus inside an effect
|
|
68
|
+
* to avoid warning rendering child during update parent state
|
|
69
|
+
*/
|
|
70
|
+
if (authUserId) {
|
|
71
|
+
setStatus(scGroupsManager.subscriptionStatus(scGroup));
|
|
72
|
+
}
|
|
73
|
+
}, [authUserId, scGroupsManager.subscriptionStatus]);
|
|
74
|
+
const subscribe = () => {
|
|
75
|
+
scGroupsManager
|
|
76
|
+
.subscribe(scGroup)
|
|
77
|
+
.then(() => {
|
|
78
|
+
// onJoin && onJoin(scGroup, !joined);
|
|
79
|
+
})
|
|
80
|
+
.catch((e) => {
|
|
81
|
+
utils_1.Logger.error(Errors_1.SCOPE_SC_UI, e);
|
|
82
|
+
});
|
|
83
|
+
};
|
|
84
|
+
const handleSubscribeAction = () => {
|
|
85
|
+
if (!scUserContext.user) {
|
|
86
|
+
scContext.settings.handleAnonymousAction();
|
|
87
|
+
}
|
|
88
|
+
else {
|
|
89
|
+
subscribe();
|
|
90
|
+
}
|
|
91
|
+
};
|
|
92
|
+
/**
|
|
93
|
+
* Get current translated status
|
|
94
|
+
*/
|
|
95
|
+
const getStatus = () => {
|
|
96
|
+
let _status;
|
|
97
|
+
switch (status) {
|
|
98
|
+
case types_1.SCGroupSubscriptionStatusType.REQUESTED:
|
|
99
|
+
_status = react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.groupJoinButton.waitingApproval", id: "ui.groupJoinButton.waitingApproval" });
|
|
100
|
+
break;
|
|
101
|
+
case types_1.SCGroupSubscriptionStatusType.SUBSCRIBED:
|
|
102
|
+
_status = react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.groupSubscribeButton.exit", id: "ui.groupSubscribeButton.exit" });
|
|
103
|
+
break;
|
|
104
|
+
default:
|
|
105
|
+
scGroup.privacy === types_1.SCGroupPrivacyType.PUBLIC
|
|
106
|
+
? (_status = react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.groupSubscribeButton.enter", id: "ui.groupSubscribeButton.enter" }))
|
|
107
|
+
: (_status = react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.groupJoinButton.requestAccess", id: "ui.groupJoinButton.requestAccess" }));
|
|
108
|
+
break;
|
|
109
|
+
}
|
|
110
|
+
return _status;
|
|
111
|
+
};
|
|
112
|
+
if (!scGroup || (scGroup && !scGroup.subscription_status)) {
|
|
113
|
+
return null;
|
|
114
|
+
}
|
|
115
|
+
return (react_1.default.createElement(Root, Object.assign({ size: "small", variant: "outlined", onClick: handleSubscribeAction, loading: scUserContext.user ? scGroupsManager.isLoading(scGroup) : null, className: (0, classnames_1.default)(classes.root, className) }, rest), getStatus()));
|
|
116
|
+
}
|
|
117
|
+
exports.default = GroupSubscribeButton;
|
|
@@ -26,6 +26,10 @@ export interface InlineComposerWidgetProps extends Omit<WidgetProps, 'defaultVal
|
|
|
26
26
|
* @default null
|
|
27
27
|
*/
|
|
28
28
|
onSuccess?: (res: any) => void;
|
|
29
|
+
/**
|
|
30
|
+
* The label showed inside the composer
|
|
31
|
+
*/
|
|
32
|
+
label?: any;
|
|
29
33
|
}
|
|
30
34
|
/**
|
|
31
35
|
* > API documentation for the Community-JS Inline Composer component. Learn about the available props and the CSS API.
|
|
@@ -54,7 +54,7 @@ function InlineComposerWidget(inProps) {
|
|
|
54
54
|
props: inProps,
|
|
55
55
|
name: constants_1.PREFIX
|
|
56
56
|
});
|
|
57
|
-
const { mediaObjectTypes = [Media_1.File, Media_1.Link], defaultValue, onSuccess = null } = props, rest = tslib_1.__rest(props, ["mediaObjectTypes", "defaultValue", "onSuccess"]);
|
|
57
|
+
const { mediaObjectTypes = [Media_1.File, Media_1.Link], defaultValue, onSuccess = null, label } = props, rest = tslib_1.__rest(props, ["mediaObjectTypes", "defaultValue", "onSuccess", "label"]);
|
|
58
58
|
// Context
|
|
59
59
|
const scContext = (0, react_core_1.useSCContext)();
|
|
60
60
|
const scUserContext = (0, react_core_1.useSCUser)();
|
|
@@ -98,8 +98,7 @@ function InlineComposerWidget(inProps) {
|
|
|
98
98
|
react_1.default.createElement(Root, Object.assign({ className: classes.root }, rest),
|
|
99
99
|
react_1.default.createElement(material_1.CardContent, { className: classes.content },
|
|
100
100
|
react_1.default.createElement(material_1.Box, { className: classes.input },
|
|
101
|
-
react_1.default.createElement(material_1.Button, { variant: "text", disableFocusRipple: true, disableRipple: true, disableElevation: true, onClick: handleOpen, fullWidth: true, color: "inherit" },
|
|
102
|
-
react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.inlineComposerWidget.label", defaultMessage: "ui.inlineComposerWidget.label" }))),
|
|
101
|
+
react_1.default.createElement(material_1.Button, { variant: "text", disableFocusRipple: true, disableRipple: true, disableElevation: true, onClick: handleOpen, fullWidth: true, color: "inherit" }, label !== null && label !== void 0 ? label : react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.inlineComposerWidget.label", defaultMessage: "ui.inlineComposerWidget.label" }))),
|
|
103
102
|
react_1.default.createElement(material_1.Box, { className: classes.avatar }, !scUserContext.user ? (react_1.default.createElement(material_1.Avatar, { variant: "circular" })) : (react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user) },
|
|
104
103
|
react_1.default.createElement(material_1.Avatar, { alt: scUserContext.user.username, variant: "circular", src: scUserContext.user.avatar })))))),
|
|
105
104
|
react_1.default.createElement(Composer_1.default, { open: open, mediaObjectTypes: mediaObjectTypes, defaultValue: defaultValue, fullWidth: true, onClose: handleClose, onSuccess: handleSuccess })));
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ButtonBaseProps } from '@mui/material';
|
|
1
3
|
import { SCUserType } from '@selfcommunity/types';
|
|
2
4
|
import { FollowUserButtonProps } from '../FollowUserButton/FollowUserButton';
|
|
3
5
|
import { FriendshipButtonProps } from '../FriendshipUserButton/FriendshipUserButton';
|
|
@@ -32,6 +34,16 @@ export interface UserProps extends WidgetProps {
|
|
|
32
34
|
* Badge content to show as user avatar badge if show reaction is true.
|
|
33
35
|
*/
|
|
34
36
|
badgeContent?: any;
|
|
37
|
+
/**
|
|
38
|
+
* Prop to add actions
|
|
39
|
+
* @default null
|
|
40
|
+
*/
|
|
41
|
+
actions?: React.ReactNode;
|
|
42
|
+
/**
|
|
43
|
+
* Props to spread to the button
|
|
44
|
+
* @default {}
|
|
45
|
+
*/
|
|
46
|
+
buttonProps?: ButtonBaseProps;
|
|
35
47
|
/**
|
|
36
48
|
* Any other properties
|
|
37
49
|
*/
|
|
@@ -66,7 +66,7 @@ function User(inProps) {
|
|
|
66
66
|
props: inProps,
|
|
67
67
|
name: constants_1.PREFIX
|
|
68
68
|
});
|
|
69
|
-
const { userId = null, user = null, handleIgnoreAction, className = null, followConnectUserButtonProps = {}, showFollowers = false, elevation, badgeContent = null } = props, rest = tslib_1.__rest(props, ["userId", "user", "handleIgnoreAction", "className", "followConnectUserButtonProps", "showFollowers", "elevation", "badgeContent"]);
|
|
69
|
+
const { userId = null, user = null, handleIgnoreAction, className = null, followConnectUserButtonProps = {}, showFollowers = false, elevation, badgeContent = null, actions = null, buttonProps = {} } = props, rest = tslib_1.__rest(props, ["userId", "user", "handleIgnoreAction", "className", "followConnectUserButtonProps", "showFollowers", "elevation", "badgeContent", "actions", "buttonProps"]);
|
|
70
70
|
// STATE
|
|
71
71
|
const { scUser, setSCUser } = (0, react_core_1.useSCFetchUser)({ id: userId, user });
|
|
72
72
|
// CONTEXT
|
|
@@ -102,11 +102,13 @@ function User(inProps) {
|
|
|
102
102
|
* Renders root object
|
|
103
103
|
*/
|
|
104
104
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
105
|
-
react_1.default.createElement(Root, Object.assign({ elevation: elevation }, rest, { className: (0, classnames_1.default)(classes.root, className), ButtonBaseProps:
|
|
105
|
+
react_1.default.createElement(Root, Object.assign({ elevation: elevation }, rest, { className: (0, classnames_1.default)(classes.root, className), ButtonBaseProps: buttonProps !== null && buttonProps !== void 0 ? buttonProps : (scUser.deleted
|
|
106
|
+
? { onClick: () => setOpenAlert(true) }
|
|
107
|
+
: { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? (react_1.default.createElement(material_1.Badge, { overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent },
|
|
106
108
|
react_1.default.createElement(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }))) : (react_1.default.createElement(UserAvatar_1.default, { hide: !hasBadge },
|
|
107
109
|
react_1.default.createElement(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }))), primary: hasBadge && preferences ? (react_1.default.createElement(react_1.default.Fragment, null,
|
|
108
110
|
scUser.username,
|
|
109
|
-
react_1.default.createElement(material_1.Chip, { component: "span", className: classes.staffBadgeLabel, size: "small", label: preferences[react_core_1.SCPreferences.STAFF_STAFF_BADGE_LABEL] }))) : (scUser.username), secondary: showFollowers ? `${intl.formatMessage(messages.userFollowers, { total: scUser.followers_counter })}` : scUser.description, actions: renderAuthenticatedActions() })),
|
|
111
|
+
react_1.default.createElement(material_1.Chip, { component: "span", className: classes.staffBadgeLabel, size: "small", label: preferences[react_core_1.SCPreferences.STAFF_STAFF_BADGE_LABEL] }))) : (scUser.username), secondary: showFollowers ? `${intl.formatMessage(messages.userFollowers, { total: scUser.followers_counter })}` : scUser.description, actions: actions !== null && actions !== void 0 ? actions : renderAuthenticatedActions() })),
|
|
110
112
|
openAlert && react_1.default.createElement(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })));
|
|
111
113
|
}
|
|
112
114
|
exports.default = User;
|
package/lib/cjs/index.d.ts
CHANGED
|
@@ -104,6 +104,18 @@ import SearchAutocomplete, { SearchAutocompleteProps } from './components/Search
|
|
|
104
104
|
import SearchDialog, { SearchDialogProps } from './components/SearchDialog';
|
|
105
105
|
import PrivateMessageSettingsIconButton, { PrivateMessageSettingsIconButtonProps } from './components/PrivateMessageSettingsIconButton';
|
|
106
106
|
import PrivateMessageComponent, { PrivateMessageComponentProps, PrivateMessageComponentSkeleton } from './components/PrivateMessageComponent';
|
|
107
|
+
import ChangeGroupCover, { ChangeGroupCoverProps } from './components/ChangeGroupCover';
|
|
108
|
+
import ChangeGroupPicture, { ChangeGroupPictureProps } from './components/ChangeGroupPicture';
|
|
109
|
+
import GroupHeader, { GroupHeaderProps, GroupHeaderSkeleton } from './components/GroupHeader';
|
|
110
|
+
import GroupMembersButton, { GroupMembersButtonProps } from './components/GroupMembersButton';
|
|
111
|
+
import CreateGroupButton from './components/CreateGroupButton';
|
|
112
|
+
import CreateButton, { CreateGroupButtonProps } from './components/CreateGroupButton';
|
|
113
|
+
import GroupInviteButton, { GroupInviteButtonProps } from './components/GroupInviteButton';
|
|
114
|
+
import GroupInfoWidget, { GroupInfoWidgetProps, GroupInfoWidgetSkeleton } from './components/GroupInfoWidget';
|
|
115
|
+
import Group, { GroupProps } from './components/Group';
|
|
116
|
+
import GroupSubscribeButton, { GroupSubscribeButtonProps } from './components/GroupSubscribeButton';
|
|
117
|
+
import GroupMembersWidget, { GroupMembersWidgetProps, GroupMembersWidgetSkeleton } from './components/GroupMembersWidget';
|
|
118
|
+
import GroupRequestsWidget, { GroupRequestsWidgetProps, GroupRequestsWidgetSkeleton } from './components/GroupRequestsWidget';
|
|
107
119
|
/**
|
|
108
120
|
* Constants
|
|
109
121
|
*/
|
|
@@ -128,4 +140,4 @@ import FeedObjectMediaPreview, { FeedObjectMediaPreviewProps } from './component
|
|
|
128
140
|
/**
|
|
129
141
|
* List all exports
|
|
130
142
|
*/
|
|
131
|
-
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, 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 };
|
|
143
|
+
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, CreateButton, CreateGroupButtonProps, GroupInviteButton, GroupInviteButtonProps, GroupInfoWidget, GroupInfoWidgetProps, GroupInfoWidgetSkeleton, Group, GroupProps, GroupSubscribeButton, GroupSubscribeButtonProps, GroupMembersWidget, GroupMembersWidgetProps, GroupMembersWidgetSkeleton, GroupRequestsWidget, GroupRequestsWidgetProps, GroupRequestsWidgetSkeleton, 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 };
|