@selfcommunity/react-ui 0.11.0-alpha.80 → 0.11.0-alpha.82
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/Composer/Attributes/Attributes.d.ts +1 -1
- package/lib/cjs/components/Composer/Attributes/Attributes.js +7 -1
- package/lib/cjs/components/Composer/Composer.d.ts +1 -0
- package/lib/cjs/components/Composer/Composer.js +49 -25
- package/lib/cjs/components/Composer/Content/ContentDiscussion/ContentDiscussion.js +2 -1
- package/lib/cjs/components/Composer/Content/ContentPost/ContentPost.js +1 -0
- package/lib/cjs/components/Composer/Layer/AudienceLayer/AudienceLayer.d.ts +2 -1
- package/lib/cjs/components/Composer/Layer/AudienceLayer/AudienceLayer.js +27 -8
- package/lib/cjs/components/Feed/prefetchedData.js +5 -5
- package/lib/cjs/components/FeedObject/FeedObject.js +10 -8
- package/lib/cjs/components/UserAutocomplete/UserAutocomplete.d.ts +22 -0
- package/lib/cjs/components/UserAutocomplete/UserAutocomplete.js +82 -0
- package/lib/cjs/components/UserAutocomplete/index.d.ts +3 -0
- package/lib/cjs/components/UserAutocomplete/index.js +5 -0
- package/lib/cjs/index.d.ts +2 -1
- package/lib/cjs/index.js +4 -2
- package/lib/esm/components/Composer/Attributes/Attributes.d.ts +1 -1
- package/lib/esm/components/Composer/Attributes/Attributes.js +8 -2
- package/lib/esm/components/Composer/Composer.d.ts +1 -0
- package/lib/esm/components/Composer/Composer.js +49 -25
- package/lib/esm/components/Composer/Content/ContentDiscussion/ContentDiscussion.js +2 -1
- package/lib/esm/components/Composer/Content/ContentPost/ContentPost.js +1 -0
- package/lib/esm/components/Composer/Layer/AudienceLayer/AudienceLayer.d.ts +2 -1
- package/lib/esm/components/Composer/Layer/AudienceLayer/AudienceLayer.js +27 -8
- package/lib/esm/components/Feed/prefetchedData.js +5 -5
- package/lib/esm/components/FeedObject/FeedObject.js +11 -9
- package/lib/esm/components/UserAutocomplete/UserAutocomplete.d.ts +22 -0
- package/lib/esm/components/UserAutocomplete/UserAutocomplete.js +80 -0
- package/lib/esm/components/UserAutocomplete/index.d.ts +3 -0
- package/lib/esm/components/UserAutocomplete/index.js +2 -0
- package/lib/esm/index.d.ts +2 -1
- package/lib/esm/index.js +2 -1
- package/lib/umd/react-ui.js +1 -1
- package/package.json +6 -6
|
@@ -16,7 +16,7 @@ export interface AttributesProps extends Omit<BoxProps, 'value' | 'onChange' | '
|
|
|
16
16
|
* @param value
|
|
17
17
|
* @default empty object
|
|
18
18
|
*/
|
|
19
|
-
onClick?: (attribute: 'categories' | 'event' | 'group' | 'addressing' | 'location') => void;
|
|
19
|
+
onClick?: (attribute: 'categories' | 'event' | 'group' | 'addressing' | 'location' | 'recipients') => void;
|
|
20
20
|
}
|
|
21
21
|
declare const _default: (props: AttributesProps) => JSX.Element;
|
|
22
22
|
export default _default;
|
|
@@ -49,7 +49,13 @@ exports.default = (props) => {
|
|
|
49
49
|
const handleClickLocation = (0, react_1.useCallback)(() => {
|
|
50
50
|
onClick && onClick('location');
|
|
51
51
|
}, [onClick]);
|
|
52
|
+
const handleDeleteRecipient = (0, react_1.useCallback)((id) => () => {
|
|
53
|
+
onChange && onChange(Object.assign(Object.assign({}, value), { recipients: value.recipients.filter((r) => r.id !== id) }));
|
|
54
|
+
}, [value, onChange]);
|
|
55
|
+
const handleClickRecipient = (0, react_1.useCallback)(() => {
|
|
56
|
+
onClick && onClick('recipients');
|
|
57
|
+
}, [onClick]);
|
|
52
58
|
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: [((_a = value === null || value === void 0 ? void 0 : value.categories) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
|
|
53
59
|
(value === null || value === void 0 ? void 0 : value.categories.map((c) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { label: c.name, onDelete: handleDeleteCategory(c.id), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "category" }), onClick: handleClickCategory }, c.id)))), (value === null || value === void 0 ? void 0 : value.group) && ((0, jsx_runtime_1.jsx)(material_1.Chip, { label: value === null || value === void 0 ? void 0 : value.group.name, onDelete: handleDeleteGroup, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }), onClick: handleClickGroup, disabled: !((_b = value === null || value === void 0 ? void 0 : value.group) === null || _b === void 0 ? void 0 : _b.subscription_status) }, value === null || value === void 0 ? void 0 : value.group.id)), (value === null || value === void 0 ? void 0 : value.event) && ((0, jsx_runtime_1.jsx)(material_1.Chip, { label: value === null || value === void 0 ? void 0 : value.event.name, onDelete: handleDeleteEvent, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }), onClick: handleClickEvent, disabled: !((_c = value === null || value === void 0 ? void 0 : value.event) === null || _c === void 0 ? void 0 : _c.subscription_status) }, value === null || value === void 0 ? void 0 : value.event.id)), ((_d = value === null || value === void 0 ? void 0 : value.addressing) === null || _d === void 0 ? void 0 : _d.length) > 0 &&
|
|
54
|
-
(value === null || value === void 0 ? void 0 : value.addressing.map((t) => ((0, jsx_runtime_1.jsx)(TagChip_1.default, { tag: t, onDelete: handleDeleteTag(t.id), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "label" }), onClick: handleClickTag }, t.id)))), (value === null || value === void 0 ? void 0 : value.location) && ((0, jsx_runtime_1.jsx)(material_1.Chip, { icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }), label: value === null || value === void 0 ? void 0 : value.location.location, onDelete: handleDeleteLocation, onClick: handleClickLocation }))] })));
|
|
60
|
+
(value === null || value === void 0 ? void 0 : value.addressing.map((t) => ((0, jsx_runtime_1.jsx)(TagChip_1.default, { tag: t, onDelete: handleDeleteTag(t.id), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "label" }), onClick: handleClickTag }, t.id)))), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (value === null || value === void 0 ? void 0 : value.recipients.length) > 0 && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [value.recipients.slice(0, 3).map((r) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { label: r.username, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "people_alt" }), onClick: handleClickRecipient, onDelete: handleDeleteRecipient(r.id) }, r.id))), value.recipients.length > 3 && (0, jsx_runtime_1.jsx)(material_1.Chip, { label: `+${value.recipients.length - 3}` })] })) }), (value === null || value === void 0 ? void 0 : value.location) && ((0, jsx_runtime_1.jsx)(material_1.Chip, { icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }), label: value === null || value === void 0 ? void 0 : value.location.location, onDelete: handleDeleteLocation, onClick: handleClickLocation }))] })));
|
|
55
61
|
};
|
|
@@ -69,6 +69,7 @@ const COMPOSER_INITIAL_STATE = {
|
|
|
69
69
|
groupsError: null,
|
|
70
70
|
addressing: null,
|
|
71
71
|
addressingError: null,
|
|
72
|
+
recipients: [],
|
|
72
73
|
medias: [],
|
|
73
74
|
poll: null,
|
|
74
75
|
location: null,
|
|
@@ -147,7 +148,7 @@ function Composer(inProps) {
|
|
|
147
148
|
const [isSubmitting, setIsSubmitting] = (0, react_1.useState)(false);
|
|
148
149
|
const [layer, setLayer] = (0, react_1.useState)();
|
|
149
150
|
const [state, dispatch] = (0, react_1.useReducer)(reducer, Object.assign(Object.assign(Object.assign({}, COMPOSER_INITIAL_STATE), defaultValue), { key: (0, utils_1.random)() }));
|
|
150
|
-
const { key, id, type, title, titleError, html, categories, categoriesError, event, group, addressing, addressingError, audience, medias, poll, pollError, location, scheduled_at, error } = state;
|
|
151
|
+
const { key, id, type, title, titleError, html, categories, categoriesError, event, group, addressing, addressingError, recipients, audience, medias, poll, pollError, location, scheduled_at, error } = state;
|
|
151
152
|
//MEMO
|
|
152
153
|
const scheduledPostsEnabled = (0, react_1.useMemo)(() => preferences &&
|
|
153
154
|
react_core_1.SCPreferences.CONFIGURATIONS_SCHEDULED_POSTS_ENABLED in preferences &&
|
|
@@ -180,6 +181,7 @@ function Composer(inProps) {
|
|
|
180
181
|
event: _feedObject.event,
|
|
181
182
|
group: _feedObject.group,
|
|
182
183
|
addressing: _feedObject.addressing,
|
|
184
|
+
recipients: _feedObject.recipients,
|
|
183
185
|
medias: _feedObject.medias,
|
|
184
186
|
poll: _feedObject.poll,
|
|
185
187
|
location: _feedObject.location,
|
|
@@ -212,9 +214,9 @@ function Composer(inProps) {
|
|
|
212
214
|
((type === types_1.SCContributionType.DISCUSSION && title.length > 0 && title.length < Composer_1.COMPOSER_TITLE_MAX_LENGTH) ||
|
|
213
215
|
(type === types_1.SCContributionType.POST && ((0, utils_1.stripHtml)(html).length > 0 || medias.length > 0 || hasPoll)) ||
|
|
214
216
|
(type === Composer_1.COMPOSER_TYPE_POLL && hasPoll)) &&
|
|
215
|
-
(!addressingRequiredEnabled || (addressing && addressing.length > 0)) &&
|
|
217
|
+
(!addressingRequiredEnabled || (addressing && addressing.length > 0) || (recipients && recipients.length > 0)) &&
|
|
216
218
|
(!categoryRequiredEnabled || (categories && categories.length > 0)));
|
|
217
|
-
}, [isLoading, type, title, html, medias, hasPoll, addressing, addressingRequiredEnabled, categories, categoryRequiredEnabled]);
|
|
219
|
+
}, [isLoading, type, title, html, medias, hasPoll, addressing, recipients, addressingRequiredEnabled, categories, categoryRequiredEnabled]);
|
|
218
220
|
const isIOS = (0, react_1.useMemo)(() => (0, utils_1.iOS)(), []);
|
|
219
221
|
// Load feed object
|
|
220
222
|
(0, react_1.useEffect)(() => {
|
|
@@ -322,19 +324,22 @@ function Composer(inProps) {
|
|
|
322
324
|
type: 'multiple',
|
|
323
325
|
value: Object.assign(Object.assign({}, content), { pollError: content.poll.title.length > Composer_1.COMPOSER_TITLE_MAX_LENGTH
|
|
324
326
|
? { titleError: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.title.error.maxlength", defaultMessage: "ui.composer.title.error.maxlength" }) }
|
|
325
|
-
: null, addressingError: addressingRequiredEnabled &&
|
|
327
|
+
: null, addressingError: addressingRequiredEnabled &&
|
|
328
|
+
(!content.addressing || content.addressing.length === 0 || !content.recipients || content.recipients.length === 0) ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.addressing.error.missing", defaultMessage: "ui.composer.addressing.error.missing" })) : null })
|
|
326
329
|
});
|
|
327
330
|
}, []);
|
|
328
331
|
const handleChangeDiscussion = (0, react_1.useCallback)((content) => {
|
|
329
332
|
dispatch({
|
|
330
333
|
type: 'multiple',
|
|
331
|
-
value: Object.assign(Object.assign({}, content), { titleError: content.title.length > Composer_1.COMPOSER_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.title.error.maxlength", defaultMessage: "ui.composer.title.error.maxlength" })) : null, addressingError: addressingRequiredEnabled &&
|
|
334
|
+
value: Object.assign(Object.assign({}, content), { titleError: content.title.length > Composer_1.COMPOSER_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.title.error.maxlength", defaultMessage: "ui.composer.title.error.maxlength" })) : null, addressingError: addressingRequiredEnabled &&
|
|
335
|
+
(!content.addressing || content.addressing.length === 0 || !content.recipients || content.recipients.length === 0) ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.addressing.error.missing", defaultMessage: "ui.composer.addressing.error.missing" })) : null, categoriesError: categoryRequiredEnabled && content.categories.length === 0 ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.categories.error.missing", defaultMessage: "ui.composer.categories.error.missing" })) : null })
|
|
332
336
|
});
|
|
333
337
|
}, []);
|
|
334
338
|
const handleChangePost = (0, react_1.useCallback)((content) => {
|
|
335
339
|
dispatch({
|
|
336
340
|
type: 'multiple',
|
|
337
|
-
value: Object.assign(Object.assign({}, content), { addressingError: addressingRequiredEnabled &&
|
|
341
|
+
value: Object.assign(Object.assign({}, content), { addressingError: addressingRequiredEnabled &&
|
|
342
|
+
(!content.addressing || content.addressing.length === 0 || !content.recipients || content.recipients.length === 0) ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.addressing.error.missing", defaultMessage: "ui.composer.addressing.error.missing" })) : null, categoriesError: categoryRequiredEnabled && content.categories.length === 0 ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.categories.error.missing", defaultMessage: "ui.composer.categories.error.missing" })) : null })
|
|
338
343
|
});
|
|
339
344
|
}, []);
|
|
340
345
|
const handleChangeCategories = (0, react_1.useCallback)((value) => {
|
|
@@ -363,6 +368,15 @@ function Composer(inProps) {
|
|
|
363
368
|
else if (event || (value && Object.prototype.hasOwnProperty.call(value, 'recurring'))) {
|
|
364
369
|
dispatch({ type: 'event', value });
|
|
365
370
|
}
|
|
371
|
+
else if ((recipients === null || recipients === void 0 ? void 0 : recipients.length) !== 0 || (value && Array.isArray(value) && value.some((obj) => !('color' in obj)))) {
|
|
372
|
+
dispatch({
|
|
373
|
+
type: 'multiple',
|
|
374
|
+
value: {
|
|
375
|
+
recipients: value,
|
|
376
|
+
addressingError: addressingRequiredEnabled && !value ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.addressing.error.missing", defaultMessage: "ui.composer.addressing.error.missing" })) : null
|
|
377
|
+
}
|
|
378
|
+
});
|
|
379
|
+
}
|
|
366
380
|
else {
|
|
367
381
|
dispatch({
|
|
368
382
|
type: 'multiple',
|
|
@@ -373,20 +387,24 @@ function Composer(inProps) {
|
|
|
373
387
|
});
|
|
374
388
|
}
|
|
375
389
|
setLayer(null);
|
|
376
|
-
}, [group]);
|
|
377
|
-
const handleAddAudienceLayer = (0, react_1.useCallback)(() =>
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
+
}, [group, event, recipients]);
|
|
391
|
+
const handleAddAudienceLayer = (0, react_1.useCallback)(() => {
|
|
392
|
+
handleAddLayer({
|
|
393
|
+
name: 'audience',
|
|
394
|
+
Component: AudienceLayer_1.default,
|
|
395
|
+
ComponentProps: {
|
|
396
|
+
onClose: handleRemoveLayer,
|
|
397
|
+
onSave: handleChangeAudience,
|
|
398
|
+
defaultValue: group || (addressing && Object.prototype.hasOwnProperty.call(addressing, 'emotional_image_position'))
|
|
399
|
+
? group
|
|
400
|
+
: event || (addressing && Object.prototype.hasOwnProperty.call(addressing, 'recurring'))
|
|
401
|
+
? event
|
|
402
|
+
: (recipients === null || recipients === void 0 ? void 0 : recipients.length) && !recipients.some((r) => 'color' in r)
|
|
403
|
+
? recipients
|
|
404
|
+
: addressing
|
|
405
|
+
}
|
|
406
|
+
});
|
|
407
|
+
}, [handleAddLayer, handleRemoveLayer, handleChangeAudience, addressing, event, group, recipients]);
|
|
390
408
|
const handleChangeLocation = (0, react_1.useCallback)((value) => {
|
|
391
409
|
dispatch({ type: 'location', value });
|
|
392
410
|
setLayer(null);
|
|
@@ -446,7 +464,8 @@ function Composer(inProps) {
|
|
|
446
464
|
const handleChangeAttributes = (0, react_1.useCallback)((content) => {
|
|
447
465
|
dispatch({
|
|
448
466
|
type: 'multiple',
|
|
449
|
-
value: Object.assign(Object.assign({}, content), { addressingError: addressingRequiredEnabled &&
|
|
467
|
+
value: Object.assign(Object.assign({}, content), { addressingError: addressingRequiredEnabled &&
|
|
468
|
+
(!content.addressing || content.addressing.length === 0 || !content.recipients || content.recipients.length === 0) ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.addressing.error.missing", defaultMessage: "ui.composer.addressing.error.missing" })) : null, categoriesError: categoryRequiredEnabled && content.categories.length === 0 ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.categories.error.missing", defaultMessage: "ui.composer.categories.error.missing" })) : null })
|
|
450
469
|
});
|
|
451
470
|
}, []);
|
|
452
471
|
const handleClickAttributes = (0, react_1.useCallback)((attr) => {
|
|
@@ -499,6 +518,9 @@ function Composer(inProps) {
|
|
|
499
518
|
if (features.includes(types_1.SCFeatureName.TAGGING) && addressing !== null) {
|
|
500
519
|
data.addressing = addressing.map((t) => t.id);
|
|
501
520
|
}
|
|
521
|
+
if (features.includes(types_1.SCFeatureName.TAGGING) && recipients !== null) {
|
|
522
|
+
data.recipients = recipients.map((r) => r.username);
|
|
523
|
+
}
|
|
502
524
|
if (features.includes(types_1.SCFeatureName.TAGGING) &&
|
|
503
525
|
features.includes(types_1.SCFeatureName.GROUPING) &&
|
|
504
526
|
preferences[react_core_1.SCPreferences.CONFIGURATIONS_GROUPS_ENABLED].value &&
|
|
@@ -555,6 +577,7 @@ function Composer(inProps) {
|
|
|
555
577
|
event,
|
|
556
578
|
group,
|
|
557
579
|
addressing,
|
|
580
|
+
recipients,
|
|
558
581
|
audience,
|
|
559
582
|
medias,
|
|
560
583
|
poll,
|
|
@@ -626,11 +649,11 @@ function Composer(inProps) {
|
|
|
626
649
|
}
|
|
627
650
|
switch (type) {
|
|
628
651
|
case Composer_1.COMPOSER_TYPE_POLL:
|
|
629
|
-
return ((0, jsx_runtime_1.jsx)(ContentPoll_1.default, { onChange: handleChangePoll, value: { html, event, group, addressing, medias, poll, location, scheduled_at }, error: { pollError, categoriesError, addressingError }, disabled: isSubmitting }, key));
|
|
652
|
+
return ((0, jsx_runtime_1.jsx)(ContentPoll_1.default, { onChange: handleChangePoll, value: { html, event, group, addressing, recipients, medias, poll, location, scheduled_at }, error: { pollError, categoriesError, addressingError }, disabled: isSubmitting }, key));
|
|
630
653
|
case types_1.SCContributionType.DISCUSSION:
|
|
631
|
-
return ((0, jsx_runtime_1.jsx)(ContentDiscussion_1.default, { value: { title, html, categories, event, group, addressing, medias, poll, location, scheduled_at }, error: { titleError, categoriesError, addressingError, error }, onChange: handleChangeDiscussion, disabled: isSubmitting, isContentSwitchButtonVisible: !canSubmit && !editMode, EditorProps: Object.assign({ toolbar: true, uploadImage: true }, EditorProps) }, key));
|
|
654
|
+
return ((0, jsx_runtime_1.jsx)(ContentDiscussion_1.default, { value: { title, html, categories, event, group, addressing, recipients, medias, poll, location, scheduled_at }, error: { titleError, categoriesError, addressingError, error }, onChange: handleChangeDiscussion, disabled: isSubmitting, isContentSwitchButtonVisible: !canSubmit && !editMode, EditorProps: Object.assign({ toolbar: true, uploadImage: true }, EditorProps) }, key));
|
|
632
655
|
default:
|
|
633
|
-
return ((0, jsx_runtime_1.jsx)(ContentPost_1.default, { value: { html, categories, event, group, addressing, medias, poll, location, scheduled_at }, error: { error, categoriesError, addressingError }, onChange: handleChangePost, disabled: isSubmitting, EditorProps: Object.assign({ toolbar: false, uploadImage: false }, EditorProps) }, key));
|
|
656
|
+
return ((0, jsx_runtime_1.jsx)(ContentPost_1.default, { value: { html, categories, event, group, addressing, recipients, medias, poll, location, scheduled_at }, error: { error, categoriesError, addressingError }, onChange: handleChangePost, disabled: isSubmitting, EditorProps: Object.assign({ toolbar: false, uploadImage: false }, EditorProps) }, key));
|
|
634
657
|
}
|
|
635
658
|
}, [
|
|
636
659
|
key,
|
|
@@ -641,6 +664,7 @@ function Composer(inProps) {
|
|
|
641
664
|
event,
|
|
642
665
|
group,
|
|
643
666
|
addressing,
|
|
667
|
+
recipients,
|
|
644
668
|
medias,
|
|
645
669
|
poll,
|
|
646
670
|
pollError,
|
|
@@ -656,7 +680,7 @@ function Composer(inProps) {
|
|
|
656
680
|
if (!scUserContext.user && !(scUserContext.loading && open)) {
|
|
657
681
|
return null;
|
|
658
682
|
}
|
|
659
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ ref: dialogRef, TransitionComponent: DialogTransition, slots: { backdrop: BackdropScrollDisabled_1.default }, onClose: handleClose }, rest, { disableEscapeKeyDown: true, className: (0, classnames_1.default)(classes.root, { [classes.ios]: isIOS }), scroll: "body", fullScreen: fullScreen, tabIndex: -1 }, { children: [(0, jsx_runtime_1.jsxs)("form", Object.assign({ onSubmit: handleSubmit, method: "post" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogTitle, Object.assign({ className: classes.title }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleClosePrompt }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) })), (0, jsx_runtime_1.jsx)(LoadingButton_1.default, Object.assign({ size: "small", type: "submit", color: "secondary", variant: "contained", disabled: !canSubmit, loading: isSubmitting }, { children: scheduledPostsEnabled && !scheduled_at ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.submit.now", defaultMessage: "ui.composer.submit.now" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.submit", defaultMessage: "ui.composer.submit" })) }))] })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(Attributes_1.default, { value: { categories, event, group, addressing, location }, className: classes.attributes, onChange: handleChangeAttributes, onClick: handleClickAttributes }), content, medias && medias.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.medias }, { children: mediaObjectTypes.map((mediaObjectType) => {
|
|
683
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ ref: dialogRef, TransitionComponent: DialogTransition, slots: { backdrop: BackdropScrollDisabled_1.default }, onClose: handleClose }, rest, { disableEscapeKeyDown: true, className: (0, classnames_1.default)(classes.root, { [classes.ios]: isIOS }), scroll: "body", fullScreen: fullScreen, tabIndex: -1 }, { children: [(0, jsx_runtime_1.jsxs)("form", Object.assign({ onSubmit: handleSubmit, method: "post" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogTitle, Object.assign({ className: classes.title }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleClosePrompt }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) })), (0, jsx_runtime_1.jsx)(LoadingButton_1.default, Object.assign({ size: "small", type: "submit", color: "secondary", variant: "contained", disabled: !canSubmit, loading: isSubmitting }, { children: scheduledPostsEnabled && !scheduled_at ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.submit.now", defaultMessage: "ui.composer.submit.now" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.submit", defaultMessage: "ui.composer.submit" })) }))] })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(Attributes_1.default, { value: { categories, event, group, addressing, recipients, location }, className: classes.attributes, onChange: handleChangeAttributes, onClick: handleClickAttributes }), content, medias && medias.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.medias }, { children: mediaObjectTypes.map((mediaObjectType) => {
|
|
660
684
|
if (mediaObjectType.previewComponent) {
|
|
661
685
|
return (0, jsx_runtime_1.jsx)(mediaObjectType.previewComponent, { value: medias, onChange: handleChangeMedias }, mediaObjectType.name);
|
|
662
686
|
}
|
|
@@ -7,7 +7,8 @@ export declare enum AudienceTypes {
|
|
|
7
7
|
AUDIENCE_ALL = "all",
|
|
8
8
|
AUDIENCE_TAG = "tag",
|
|
9
9
|
AUDIENCE_GROUP = "group",
|
|
10
|
-
AUDIENCE_EVENT = "event"
|
|
10
|
+
AUDIENCE_EVENT = "event",
|
|
11
|
+
AUDIENCE_USERS = "users"
|
|
11
12
|
}
|
|
12
13
|
export interface AudienceLayerProps extends Omit<BoxProps, 'defaultValue'>, ComposerLayerProps {
|
|
13
14
|
defaultValue: SCTagType[] | SCGroupType | any;
|
|
@@ -15,12 +15,14 @@ const constants_1 = require("../../constants");
|
|
|
15
15
|
const GroupAutocomplete_1 = tslib_1.__importDefault(require("../../../GroupAutocomplete"));
|
|
16
16
|
const types_1 = require("@selfcommunity/types");
|
|
17
17
|
const EventAutocomplete_1 = tslib_1.__importDefault(require("../../../EventAutocomplete"));
|
|
18
|
+
const UserAutocomplete_1 = tslib_1.__importDefault(require("../../../UserAutocomplete"));
|
|
18
19
|
var AudienceTypes;
|
|
19
20
|
(function (AudienceTypes) {
|
|
20
21
|
AudienceTypes["AUDIENCE_ALL"] = "all";
|
|
21
22
|
AudienceTypes["AUDIENCE_TAG"] = "tag";
|
|
22
23
|
AudienceTypes["AUDIENCE_GROUP"] = "group";
|
|
23
24
|
AudienceTypes["AUDIENCE_EVENT"] = "event";
|
|
25
|
+
AudienceTypes["AUDIENCE_USERS"] = "users";
|
|
24
26
|
})(AudienceTypes = exports.AudienceTypes || (exports.AudienceTypes = {}));
|
|
25
27
|
const classes = {
|
|
26
28
|
root: `${constants_1.PREFIX}-layer-audience-root`,
|
|
@@ -34,8 +36,9 @@ const Root = (0, material_1.styled)(material_1.Box, {
|
|
|
34
36
|
slot: 'LayerAudienceRoot'
|
|
35
37
|
})(() => ({}));
|
|
36
38
|
const AudienceLayer = react_1.default.forwardRef((props, ref) => {
|
|
39
|
+
var _a;
|
|
37
40
|
// Props
|
|
38
|
-
const { className, onClose, onSave, defaultValue = AudienceTypes.AUDIENCE_TAG ? [] : null, TextFieldProps = {
|
|
41
|
+
const { className, onClose, onSave, defaultValue = AudienceTypes.AUDIENCE_TAG || AudienceTypes.AUDIENCE_USERS ? [] : null, TextFieldProps = {
|
|
39
42
|
variant: 'outlined',
|
|
40
43
|
label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.tags.label", defaultMessage: "ui.composer.layer.audience.tags.label" })
|
|
41
44
|
} } = props, rest = tslib_1.__rest(props, ["className", "onClose", "onSave", "defaultValue", "TextFieldProps"]);
|
|
@@ -59,6 +62,11 @@ const AudienceLayer = react_1.default.forwardRef((props, ref) => {
|
|
|
59
62
|
features.includes(types_1.SCFeatureName.TAGGING) &&
|
|
60
63
|
react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_ENABLED in preferences &&
|
|
61
64
|
preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_ENABLED].value, [preferences, features]);
|
|
65
|
+
const usersTaggingEnabled = (0, react_1.useMemo)(() => preferences &&
|
|
66
|
+
features &&
|
|
67
|
+
features.includes(types_1.SCFeatureName.TAGGING) &&
|
|
68
|
+
react_core_1.SCPreferences.CONFIGURATIONS_POST_USER_ADDRESSING_ENABLED in preferences &&
|
|
69
|
+
preferences[react_core_1.SCPreferences.CONFIGURATIONS_POST_USER_ADDRESSING_ENABLED].value, [preferences, features]);
|
|
62
70
|
const taggingRequiredEnabled = (0, react_1.useMemo)(() => preferences &&
|
|
63
71
|
features &&
|
|
64
72
|
features.includes(types_1.SCFeatureName.TAGGING) &&
|
|
@@ -75,16 +83,22 @@ const AudienceLayer = react_1.default.forwardRef((props, ref) => {
|
|
|
75
83
|
? AudienceTypes.AUDIENCE_EVENT
|
|
76
84
|
: Object.prototype.hasOwnProperty.call(defaultValue, 'managed_by')
|
|
77
85
|
? AudienceTypes.AUDIENCE_GROUP
|
|
78
|
-
:
|
|
86
|
+
: Array.isArray(defaultValue) && defaultValue.length && ((_a = defaultValue[0]) === null || _a === void 0 ? void 0 : _a.username)
|
|
87
|
+
? AudienceTypes.AUDIENCE_USERS
|
|
88
|
+
: AudienceTypes.AUDIENCE_TAG);
|
|
79
89
|
// HANDLERS
|
|
80
90
|
const handleSave = (0, react_1.useCallback)(() => {
|
|
81
|
-
audience === AudienceTypes.AUDIENCE_GROUP || audience === AudienceTypes.AUDIENCE_EVENT
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
91
|
+
if (audience === AudienceTypes.AUDIENCE_GROUP || audience === AudienceTypes.AUDIENCE_EVENT) {
|
|
92
|
+
onSave(value);
|
|
93
|
+
}
|
|
94
|
+
else {
|
|
95
|
+
onSave((value === null || value === void 0 ? void 0 : value.length) && (value === null || value === void 0 ? void 0 : value.length) > 0 ? value : null);
|
|
96
|
+
}
|
|
97
|
+
}, [audience, value, onSave]);
|
|
85
98
|
const handleChange = (0, react_1.useCallback)((_event, tags) => setValue(tags), []);
|
|
86
99
|
const handleEventChange = (0, react_1.useCallback)((event) => setValue(event), []);
|
|
87
100
|
const handleGroupChange = (0, react_1.useCallback)((group) => setValue(group), []);
|
|
101
|
+
const handleUsersChange = (0, react_1.useCallback)((users) => setValue(users), []);
|
|
88
102
|
const handleChangeAudience = (0, react_1.useCallback)((_event, data) => setAudience(data), []);
|
|
89
103
|
const handleAutocompleteOpen = (0, react_1.useCallback)(() => setAutocompleteOpen(true), []);
|
|
90
104
|
const handleAutocompleteClose = (0, react_1.useCallback)(() => setAutocompleteOpen(false), []);
|
|
@@ -92,7 +106,12 @@ const AudienceLayer = react_1.default.forwardRef((props, ref) => {
|
|
|
92
106
|
(value !== undefined && Boolean(!(value === null || value === void 0 ? void 0 : value.length)) && audience !== AudienceTypes.AUDIENCE_ALL) ||
|
|
93
107
|
(Boolean((value === null || value === void 0 ? void 0 : value.length) === 0) && audience === AudienceTypes.AUDIENCE_ALL && Boolean((defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.length) !== 0)), value: AudienceTypes.AUDIENCE_EVENT, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.event", defaultMessage: "ui.composer.layer.audience.event" }) })), groupsEnabled && ((0, jsx_runtime_1.jsx)(material_1.Tab, { disabled: (Boolean(value === null || value === void 0 ? void 0 : value.length) && !Object.prototype.hasOwnProperty.call(value, 'managed_by')) ||
|
|
94
108
|
(value !== undefined && Boolean(!(value === null || value === void 0 ? void 0 : value.length)) && audience !== AudienceTypes.AUDIENCE_ALL) ||
|
|
95
|
-
(Boolean((value === null || value === void 0 ? void 0 : value.length) === 0) && audience === AudienceTypes.AUDIENCE_ALL && Boolean((defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.length) !== 0)), value: AudienceTypes.AUDIENCE_GROUP, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.group", defaultMessage: "ui.composer.layer.audience.group" }) })), (0, jsx_runtime_1.jsx)(material_1.Tab, { disabled: value &&
|
|
109
|
+
(Boolean((value === null || value === void 0 ? void 0 : value.length) === 0) && audience === AudienceTypes.AUDIENCE_ALL && Boolean((defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.length) !== 0)), value: AudienceTypes.AUDIENCE_GROUP, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.group", defaultMessage: "ui.composer.layer.audience.group" }) })), (0, jsx_runtime_1.jsx)(material_1.Tab, { disabled: value &&
|
|
110
|
+
((Array.isArray(value) && value.some((v) => v === null || v === void 0 ? void 0 : v.username)) ||
|
|
111
|
+
(!Array.isArray(value) && Object.prototype.hasOwnProperty.call(value, 'managed_by'))), value: AudienceTypes.AUDIENCE_TAG, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "label" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.tag", defaultMessage: "ui.composer.layer.audience.tag" }) }), usersTaggingEnabled && ((0, jsx_runtime_1.jsx)(material_1.Tab, { disabled: value &&
|
|
112
|
+
((Array.isArray(value) && value.length && !value.some((v) => v === null || v === void 0 ? void 0 : v.username)) ||
|
|
113
|
+
(!Array.isArray(value) && Object.keys(value).length && Object.prototype.hasOwnProperty.call(value, 'managed_by')) ||
|
|
114
|
+
(!Array.isArray(value) && Object.keys(value).length && Object.prototype.hasOwnProperty.call(value, 'recurring'))), value: AudienceTypes.AUDIENCE_USERS, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "people_alt" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.users", defaultMessage: "ui.composer.layer.audience.users" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.message }, { children: [audience === AudienceTypes.AUDIENCE_ALL && !taggingRequiredEnabled && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.all.message", defaultMessage: "ui.composer.layer.audience.all.message" })), audience === AudienceTypes.AUDIENCE_EVENT && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.event.message", defaultMessage: "ui.composer.layer.audience.event.message" })), audience === AudienceTypes.AUDIENCE_GROUP && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.group.message", defaultMessage: "ui.composer.layer.audience.group.message" })), audience === AudienceTypes.AUDIENCE_TAG && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.tag.message", defaultMessage: "ui.composer.layer.audience.tag.message" })), audience === AudienceTypes.AUDIENCE_USERS && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.users.message", defaultMessage: "ui.composer.layer.audience.users.message" }))] })), audience === AudienceTypes.AUDIENCE_TAG && ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { className: classes.autocomplete, open: autocompleteOpen, onOpen: handleAutocompleteOpen, onClose: handleAutocompleteClose, multiple: true, options: scAddressingTags || [], getOptionLabel: (option) => option.name || '', value: value, selectOnFocus: true, clearOnBlur: true, handleHomeEndKeys: true, clearIcon: null, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.audience.tags.empty", defaultMessage: "ui.composer.layer.audience.tags.empty" }), onChange: handleChange, isOptionEqualToValue: (option, value) => value.id === option.id, renderTags: (value, getTagProps) => {
|
|
96
115
|
return value.map((option, index) => (0, jsx_runtime_1.jsx)(TagChip_1.default, Object.assign({ tag: option }, getTagProps({ index })), option.id));
|
|
97
116
|
}, renderOption: (props, option, { selected, inputValue }) => {
|
|
98
117
|
const matches = (0, match_1.default)(option.name, inputValue);
|
|
@@ -100,6 +119,6 @@ const AudienceLayer = react_1.default.forwardRef((props, ref) => {
|
|
|
100
119
|
return ((0, jsx_runtime_1.jsx)("li", Object.assign({}, props, { children: (0, jsx_runtime_1.jsx)(TagChip_1.default, { disposable: false, tag: option, label: (0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: parts.map((part, index) => ((0, jsx_runtime_1.jsx)("span", Object.assign({ style: { fontWeight: part.highlight ? 700 : 400 } }, { children: part.text }), index))) }) }, option.id) })));
|
|
101
120
|
}, renderInput: (params) => {
|
|
102
121
|
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, TextFieldProps, { InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'addressing', endAdornment: (0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: params.InputProps.endAdornment }) }) })));
|
|
103
|
-
} })), audience === AudienceTypes.AUDIENCE_GROUP && (0, jsx_runtime_1.jsx)(GroupAutocomplete_1.default, { onChange: handleGroupChange, defaultValue: defaultValue }), audience === AudienceTypes.AUDIENCE_EVENT && (0, jsx_runtime_1.jsx)(EventAutocomplete_1.default, { onChange: handleEventChange, defaultValue: defaultValue })] }))] })));
|
|
122
|
+
} })), audience === AudienceTypes.AUDIENCE_USERS && (0, jsx_runtime_1.jsx)(UserAutocomplete_1.default, { onChange: handleUsersChange, defaultValue: defaultValue }), audience === AudienceTypes.AUDIENCE_GROUP && (0, jsx_runtime_1.jsx)(GroupAutocomplete_1.default, { onChange: handleGroupChange, defaultValue: defaultValue }), audience === AudienceTypes.AUDIENCE_EVENT && (0, jsx_runtime_1.jsx)(EventAutocomplete_1.default, { onChange: handleEventChange, defaultValue: defaultValue })] }))] })));
|
|
104
123
|
});
|
|
105
124
|
exports.default = AudienceLayer;
|
|
@@ -83,7 +83,7 @@ const exampleExploreData = {
|
|
|
83
83
|
addressing: [],
|
|
84
84
|
poll: null
|
|
85
85
|
},
|
|
86
|
-
|
|
86
|
+
seen: true,
|
|
87
87
|
has_boost: false
|
|
88
88
|
},
|
|
89
89
|
{
|
|
@@ -194,7 +194,7 @@ const exampleExploreData = {
|
|
|
194
194
|
poll: null,
|
|
195
195
|
title: "Socioterapeuti dicono che l'Italia ha inglobato secondo un'analisi storica con tanto di bibliografia. Senno' ha a che fare con le pellicce, ovviamente. Ritengo che vedere cio' che si semina.."
|
|
196
196
|
},
|
|
197
|
-
|
|
197
|
+
seen: true,
|
|
198
198
|
has_boost: false
|
|
199
199
|
},
|
|
200
200
|
{
|
|
@@ -330,7 +330,7 @@ const exampleExploreData = {
|
|
|
330
330
|
poll: null,
|
|
331
331
|
title: "Prima, mentre che io facevo le derapate, popo a sfonna' 'a bariera der sono, co'a machina de mi'fratello su 'a prenestina... aho'... a'n certo punto... nun te vado a sbatte co er Siringa???!! Ve dico... 'na grezza da paura! E allora je strillo \"Vie'"
|
|
332
332
|
},
|
|
333
|
-
|
|
333
|
+
seen: true,
|
|
334
334
|
has_boost: false
|
|
335
335
|
},
|
|
336
336
|
{
|
|
@@ -415,7 +415,7 @@ const exampleExploreData = {
|
|
|
415
415
|
poll: null,
|
|
416
416
|
title: "Un mattino P'an-shan fece visita a Seng-ts'an e lo preg\u00f2 di mostrargli la strada pi\u00f9 facile per conseguire l'illuminazione. Il maestro indic\u00f2 una consunta statua di platino e disse: \"Se davvero desideri diventare saggio devi riuscire a comprendere la"
|
|
417
417
|
},
|
|
418
|
-
|
|
418
|
+
seen: true,
|
|
419
419
|
has_boost: false
|
|
420
420
|
},
|
|
421
421
|
{
|
|
@@ -510,7 +510,7 @@ const exampleExploreData = {
|
|
|
510
510
|
addressing: [],
|
|
511
511
|
poll: null
|
|
512
512
|
},
|
|
513
|
-
|
|
513
|
+
seen: true,
|
|
514
514
|
has_boost: false
|
|
515
515
|
}
|
|
516
516
|
]
|
|
@@ -46,6 +46,10 @@ const messages = (0, react_intl_1.defineMessages)({
|
|
|
46
46
|
visibleToGroup: {
|
|
47
47
|
id: 'ui.feedObject.visibleToGroup',
|
|
48
48
|
defaultMessage: 'ui.feedObject.visibleToGroup'
|
|
49
|
+
},
|
|
50
|
+
visibleToRecipients: {
|
|
51
|
+
id: 'ui.feedObject.visibleToRecipients',
|
|
52
|
+
defaultMessage: 'ui.feedObject.visibleToRecipients'
|
|
49
53
|
}
|
|
50
54
|
});
|
|
51
55
|
const classes = {
|
|
@@ -78,7 +82,6 @@ const classes = {
|
|
|
78
82
|
activitiesContent: `${constants_1.PREFIX}-activities-content`,
|
|
79
83
|
followButton: `${constants_1.PREFIX}-follow-button`,
|
|
80
84
|
vote: `${constants_1.PREFIX}-vote`,
|
|
81
|
-
objElement: `${constants_1.PREFIX}-obj-element`,
|
|
82
85
|
new: `${constants_1.PREFIX}-new`
|
|
83
86
|
};
|
|
84
87
|
const Root = (0, material_1.styled)(Widget_1.default, {
|
|
@@ -138,7 +141,7 @@ const Root = (0, material_1.styled)(Widget_1.default, {
|
|
|
138
141
|
* @param inProps
|
|
139
142
|
*/
|
|
140
143
|
function FeedObject(inProps) {
|
|
141
|
-
var _a, _b, _c, _d, _f, _g, _h, _j;
|
|
144
|
+
var _a, _b, _c, _d, _f, _g, _h, _j, _k;
|
|
142
145
|
// PROPS
|
|
143
146
|
const props = (0, system_1.useThemeProps)({
|
|
144
147
|
props: inProps,
|
|
@@ -153,8 +156,6 @@ function FeedObject(inProps) {
|
|
|
153
156
|
const { preferences } = (0, react_core_1.useSCPreferences)();
|
|
154
157
|
const allShareEnabled = react_core_1.SCPreferences.ADDONS_SHARE_POST_ENABLED in preferences && preferences[react_core_1.SCPreferences.ADDONS_SHARE_POST_ENABLED].value;
|
|
155
158
|
const commentsEnabled = react_core_1.SCPreferences.CONFIGURATIONS_COMMENTS_ENABLED in preferences && preferences[react_core_1.SCPreferences.CONFIGURATIONS_COMMENTS_ENABLED].value;
|
|
156
|
-
// HOOKS
|
|
157
|
-
const theme = (0, material_1.useTheme)();
|
|
158
159
|
// OBJECTS
|
|
159
160
|
const { obj, setObj, error } = (0, react_core_1.useSCFetchFeedObject)({ id: feedObjectId, feedObject, feedObjectType, cacheStrategy });
|
|
160
161
|
const objId = obj ? obj.id : null;
|
|
@@ -436,6 +437,7 @@ function FeedObject(inProps) {
|
|
|
436
437
|
* SNIPPET, PREVIEW, DETAIL, SEARCH, SHARE
|
|
437
438
|
*/
|
|
438
439
|
let objElement;
|
|
440
|
+
console.log(obj);
|
|
439
441
|
if ((!obj && error) ||
|
|
440
442
|
((obj === null || obj === void 0 ? void 0 : obj.deleted) && !scUserContext.user && !(react_core_1.UserUtils.isAdmin(scUserContext.user) || react_core_1.UserUtils.isModerator(scUserContext.user)))) {
|
|
441
443
|
objElement = ((0, jsx_runtime_1.jsx)(material_1.CardContent, Object.assign({ className: (0, classnames_1.default)(classes.error, classes.content) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.feedObject.error", defaultMessage: "ui.feedObject.error" }) })));
|
|
@@ -443,10 +445,10 @@ function FeedObject(inProps) {
|
|
|
443
445
|
else if (template === feedObject_1.SCFeedObjectTemplateType.PREVIEW ||
|
|
444
446
|
template === feedObject_1.SCFeedObjectTemplateType.DETAIL ||
|
|
445
447
|
template === feedObject_1.SCFeedObjectTemplateType.SEARCH) {
|
|
446
|
-
objElement = ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: obj ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: (0, classnames_1.default)({ [classes.deleted]: obj && obj.deleted }
|
|
448
|
+
objElement = ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: obj ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: (0, classnames_1.default)({ [classes.deleted]: obj && obj.deleted }) }, { children: [obj.categories.length > 0 && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: classes.category }, { children: [(0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [obj.group && ((0, jsx_runtime_1.jsx)(material_1.Chip, { className: classes.group, color: "secondary", size: "small", icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }), component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, obj.group), clickable: true }, obj.group.id)), obj.event && ((0, jsx_runtime_1.jsx)(material_1.Chip, { className: classes.event, color: "secondary", size: "small", label: obj.event.name, icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }), component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, obj.event), clickable: true }, obj.event.id))] }), obj.categories.map((c) => ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, c) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "overline" }, { children: c.name })) }), c.id)))] }))), obj.group && !obj.categories.length && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes.group }, { children: (0, jsx_runtime_1.jsx)(material_1.Chip, { color: "secondary", size: "small", icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }), label: obj.group.name, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, obj.group), clickable: true }, obj.group.id) }))), obj.event && !obj.categories.length && ((0, jsx_runtime_1.jsx)(material_1.Chip, { className: classes.event, color: "secondary", size: "small", icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }), label: obj.event.name, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, obj.event), clickable: true }, obj.event.id)), (0, jsx_runtime_1.jsx)(material_1.CardHeader, { className: classes.header, avatar: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!obj.author.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, obj.author) }), { onClick: obj.author.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !obj.author.community_badge }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, Object.assign({ "aria-label": "recipe", src: obj.author.avatar, className: classes.avatar }, { children: obj.author.username })) })) })), title: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!obj.author.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, obj.author) }), { onClick: obj.author.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: obj.author.username })), subheader: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [scUserContext.user && markRead && (0, jsx_runtime_1.jsx)("span", Object.assign({ className: classes.new }, { children: "NEW" })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url((0, contribution_1.getContributionRouteName)(obj), (0, contribution_1.getRouteData)(obj)), className: classes.activityAt }, { children: (0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { component: "span", date: obj.added_at }) })), obj.location && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.location }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }), (_a = obj.location) === null || _a === void 0 ? void 0 : _a.location] }))] })), (((_b = obj.addressing) !== null && _b !== void 0 ? _b : []).filter((tag) => tag.visible).length > 0 || (obj === null || obj === void 0 ? void 0 : obj.group)) && (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.tag }, { children: obj.addressing.length > 0 ? ((0, jsx_runtime_1.jsx)(Tags_1.default, { tags: obj.addressing, TagChipProps: { disposable: false, clickable: false } })) : obj.group ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: `${intl.formatMessage(messages.visibleToGroup, { group: obj.group.name })}` }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "disabled", fontSize: "small" }, { children: "groups" })) }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Bullet_1.default, {}), ((_c = obj.recipients) === null || _c === void 0 ? void 0 : _c.length) > 0 ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: `${intl.formatMessage(messages.visibleToRecipients)}` }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "disabled", fontSize: "small" }, { children: "private" })) }))) : ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: `${intl.formatMessage(messages.visibleToAll)}` }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "disabled", fontSize: "small" }, { children: "public" })) })))] })) }))] }), action: renderHeaderAction() }), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ classes: { root: classes.content } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.titleSection }, { children: 'title' in obj && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: template === feedObject_1.SCFeedObjectTemplateType.DETAIL ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", gutterBottom: true, className: classes.title }, { children: obj.title }))) : ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url((0, contribution_1.getContributionRouteName)(obj), (0, contribution_1.getRouteData)(obj)) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", gutterBottom: true, className: classes.title }, { children: obj.title })) }))) })) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.textSection }, { children: getContributionSummary(obj, template) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.mediasSection }, { children: (0, jsx_runtime_1.jsx)(FeedObjectMediaPreview_1.default, Object.assign({ medias: obj.medias }, FeedObjectMediaPreviewProps)) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.pollsSection }, { children: obj['poll'] && ((0, jsx_runtime_1.jsx)(Poll_1.default, Object.assign({ visible: pollVisible ||
|
|
447
449
|
template === feedObject_1.SCFeedObjectTemplateType.DETAIL ||
|
|
448
|
-
Boolean(obj.type !== types_1.SCContributionType.DISCUSSION && !obj.html && !obj.medias.length), feedObject: obj, pollObject: obj['poll'], onChange: handleChangePoll, onToggleVisibility: handleTogglePollVisibility }, PollObjectProps))) })), !obj.draft && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.infoSection }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [!commentsEnabled && !allShareEnabled ? ((0, jsx_runtime_1.jsx)(Vote_1.default, { feedObjectId: feedObjectId || (feedObject === null || feedObject === void 0 ? void 0 : feedObject.id), feedObjectType: feedObjectType, feedObject: obj, inlineAction: true, onVoteAction: handleVoteSuccess, className: classes.vote })) : (!hideParticipantsPreview && ((0, jsx_runtime_1.jsx)(Contributors_1.default, Object.assign({ feedObject: obj, feedObjectType: obj.type }, ContributorsFeedObjectProps, { cacheStrategy: cacheStrategy })))), !_hideFollowAction && (0, jsx_runtime_1.jsx)(Follow_1.default, Object.assign({ feedObject: obj, feedObjectType: obj.type, handleFollow: handleFollow }, FollowButtonProps))] })) })))] })), (0, jsx_runtime_1.jsxs)(material_1.CardActions, Object.assign({ className: classes.actionsSection }, { children: [(0, jsx_runtime_1.jsx)(Actions_1.default, Object.assign({ feedObjectId: feedObjectId, feedObjectType: feedObjectType, feedObject: obj, hideVoteAction: !allShareEnabled && !commentsEnabled, hideCommentAction: !commentsEnabled || template === feedObject_1.SCFeedObjectTemplateType.DETAIL || (hasEvent && !((
|
|
449
|
-
((template === feedObject_1.SCFeedObjectTemplateType.DETAIL && (!hasEvent || ((
|
|
450
|
+
Boolean(obj.type !== types_1.SCContributionType.DISCUSSION && !obj.html && !obj.medias.length), feedObject: obj, pollObject: obj['poll'], onChange: handleChangePoll, onToggleVisibility: handleTogglePollVisibility }, PollObjectProps))) })), !obj.draft && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.infoSection }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [!commentsEnabled && !allShareEnabled ? ((0, jsx_runtime_1.jsx)(Vote_1.default, { feedObjectId: feedObjectId || (feedObject === null || feedObject === void 0 ? void 0 : feedObject.id), feedObjectType: feedObjectType, feedObject: obj, inlineAction: true, onVoteAction: handleVoteSuccess, className: classes.vote })) : (!hideParticipantsPreview && ((0, jsx_runtime_1.jsx)(Contributors_1.default, Object.assign({ feedObject: obj, feedObjectType: obj.type }, ContributorsFeedObjectProps, { cacheStrategy: cacheStrategy })))), !_hideFollowAction && (0, jsx_runtime_1.jsx)(Follow_1.default, Object.assign({ feedObject: obj, feedObjectType: obj.type, handleFollow: handleFollow }, FollowButtonProps))] })) })))] })), (0, jsx_runtime_1.jsxs)(material_1.CardActions, Object.assign({ className: classes.actionsSection }, { children: [(0, jsx_runtime_1.jsx)(Actions_1.default, Object.assign({ feedObjectId: feedObjectId, feedObjectType: feedObjectType, feedObject: obj, hideVoteAction: !allShareEnabled && !commentsEnabled, hideCommentAction: !commentsEnabled || template === feedObject_1.SCFeedObjectTemplateType.DETAIL || (hasEvent && !((_f = (_d = obj === null || obj === void 0 ? void 0 : obj.medias[0].embed) === null || _d === void 0 ? void 0 : _d.metadata) === null || _f === void 0 ? void 0 : _f.active)), hideShareAction: !allShareEnabled, handleExpandActivities: template === feedObject_1.SCFeedObjectTemplateType.PREVIEW ? handleExpandActivities : null, VoteActionProps: { onVoteAction: handleVoteSuccess } }, ActionsProps)), commentsEnabled &&
|
|
451
|
+
((template === feedObject_1.SCFeedObjectTemplateType.DETAIL && (!hasEvent || ((_k = (_j = (_h = (_g = obj === null || obj === void 0 ? void 0 : obj.medias) === null || _g === void 0 ? void 0 : _g[0]) === null || _h === void 0 ? void 0 : _h.embed) === null || _j === void 0 ? void 0 : _j.metadata) === null || _k === void 0 ? void 0 : _k.active))) ||
|
|
450
452
|
expandedActivities) && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.replyContent }, { children: (0, jsx_runtime_1.jsx)(CommentObjectReplyComponent, Object.assign({ id: `reply-feedObject-${obj.id}`, onReply: handleReply, editable: !isReplying || Boolean(obj) }, CommentObjectReplyComponentProps), Number(isReplying)) })))] })), commentsEnabled &&
|
|
451
453
|
template === feedObject_1.SCFeedObjectTemplateType.PREVIEW &&
|
|
452
454
|
(obj.comment_count > 0 || (feedObjectActivities && feedObjectActivities.length > 0)) && ((0, jsx_runtime_1.jsx)(material_1.Collapse, Object.assign({ in: expandedActivities, timeout: "auto", classes: { root: classes.activitiesSection } }, { children: (0, jsx_runtime_1.jsx)(material_1.CardContent, Object.assign({ className: classes.activitiesContent }, { children: (0, jsx_runtime_1.jsx)(Activities_1.default, Object.assign({ feedObject: obj, feedObjectActivities: feedObjectActivities, activitiesType: selectedActivities, onSetSelectedActivities: handleSelectedActivities, comments: comments, CommentsObjectProps: {
|
|
@@ -463,6 +465,6 @@ function FeedObject(inProps) {
|
|
|
463
465
|
/**
|
|
464
466
|
* Renders root object
|
|
465
467
|
*/
|
|
466
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`) }, rest, { children: [obj && markRead && (0, jsx_runtime_1.jsx)(MarkRead_1.default, { endpoint: api_services_1.Endpoints.FeedObjectMarkRead, data: { object: [obj.id] }, callback: handleMarkReadComplete }), objElement] })), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
|
|
468
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`) }, rest, { children: [scUserContext.user && obj && markRead && ((0, jsx_runtime_1.jsx)(MarkRead_1.default, { endpoint: api_services_1.Endpoints.FeedObjectMarkRead, data: { object: [obj.id] }, callback: handleMarkReadComplete })), objElement] })), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
|
|
467
469
|
}
|
|
468
470
|
exports.default = FeedObject;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { AutocompleteProps, TextFieldProps } from '@mui/material';
|
|
2
|
+
import { SCUserAutocompleteType } from '@selfcommunity/types';
|
|
3
|
+
export interface UserAutocompleteProps extends Pick<AutocompleteProps<SCUserAutocompleteType | null, true, any, any>, Exclude<keyof AutocompleteProps<SCUserAutocompleteType | null, true, any, any>, 'open' | 'onOpen' | 'onClose' | 'onChange' | 'filterSelectedOptions' | 'disableCloseOnSelect' | 'options' | 'getOptionLabel' | 'value' | 'selectOnFocus' | 'clearOnBlur' | 'blurOnSelect' | 'handleHomeEndKeys' | 'clearIcon' | 'noOptionsText' | 'isOptionEqualToValue' | 'renderTags' | 'renderOption' | 'renderInput'>> {
|
|
4
|
+
/**
|
|
5
|
+
* The props applied to text field
|
|
6
|
+
* @default {variant: 'outlined, label: groups_label}
|
|
7
|
+
*/
|
|
8
|
+
TextFieldProps?: TextFieldProps;
|
|
9
|
+
/**
|
|
10
|
+
* Callback for change event on poll object
|
|
11
|
+
* @param value
|
|
12
|
+
*/
|
|
13
|
+
onChange?: (value: SCUserAutocompleteType[]) => void;
|
|
14
|
+
/**
|
|
15
|
+
* The maximum number of users that will be visible when not focused.
|
|
16
|
+
* @default 0
|
|
17
|
+
*/
|
|
18
|
+
limitCountGroups?: number;
|
|
19
|
+
endpointQueryParams?: Record<string, string | number | boolean>;
|
|
20
|
+
}
|
|
21
|
+
declare const UserAutocomplete: (inProps: UserAutocompleteProps) => JSX.Element;
|
|
22
|
+
export default UserAutocomplete;
|