@selfcommunity/react-templates 0.5.0 → 1.0.0
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/CategoryFeed/CategoryFeed.js +1 -1
- package/lib/cjs/components/Course/Course.d.ts +1 -1
- package/lib/cjs/components/EventFeed/EventFeed.js +1 -1
- package/lib/cjs/components/ExploreFeed/ExploreFeed.js +1 -1
- package/lib/cjs/components/FeedObjectDetail/FeedObjectDetail.js +1 -1
- package/lib/cjs/components/FeedObjectDetail/Skeleton.js +1 -1
- package/lib/cjs/components/GroupFeed/GroupFeed.js +1 -1
- package/lib/cjs/components/Lesson/Lesson.js +3 -4
- package/lib/cjs/components/LoyaltyProgramDetail/LoyaltyProgramDetail.js +2 -2
- package/lib/cjs/components/LoyaltyProgramDetail/PointsList.js +2 -2
- package/lib/cjs/components/LoyaltyProgramDetail/PrizeItemSkeleton.js +1 -1
- package/lib/cjs/components/LoyaltyProgramDetail/Skeleton.js +1 -1
- package/lib/cjs/components/MainFeed/MainFeed.js +1 -1
- package/lib/cjs/components/UserFeed/UserFeed.js +1 -1
- package/lib/cjs/components/UserProfile/UserProfile.js +1 -1
- package/lib/esm/components/CategoryFeed/CategoryFeed.js +1 -1
- package/lib/esm/components/Course/Course.d.ts +1 -1
- package/lib/esm/components/EventFeed/EventFeed.js +1 -1
- package/lib/esm/components/ExploreFeed/ExploreFeed.js +1 -1
- package/lib/esm/components/FeedObjectDetail/FeedObjectDetail.js +2 -2
- package/lib/esm/components/FeedObjectDetail/Skeleton.js +1 -1
- package/lib/esm/components/GroupFeed/GroupFeed.js +1 -1
- package/lib/esm/components/Lesson/Lesson.js +4 -5
- package/lib/esm/components/LoyaltyProgramDetail/LoyaltyProgramDetail.js +2 -2
- package/lib/esm/components/LoyaltyProgramDetail/PointsList.js +2 -2
- package/lib/esm/components/LoyaltyProgramDetail/PrizeItemSkeleton.js +1 -1
- package/lib/esm/components/LoyaltyProgramDetail/Skeleton.js +1 -1
- package/lib/esm/components/MainFeed/MainFeed.js +1 -1
- package/lib/esm/components/UserFeed/UserFeed.js +1 -1
- package/lib/esm/components/UserProfile/UserProfile.js +1 -1
- package/lib/umd/234.js +2 -0
- package/lib/umd/{519.js.LICENSE.txt → 234.js.LICENSE.txt} +1 -14
- package/lib/umd/3ffb7beb33b58142e791.js +2 -0
- package/lib/umd/739.js +2 -0
- package/lib/umd/react-templates.js +1 -1
- package/lib/umd/react-templates.js.LICENSE.txt +1 -1
- package/package.json +131 -131
- package/lib/umd/519.js +0 -2
- package/lib/umd/738.js +0 -2
- package/lib/umd/73cbb3dbfaa3ddd4df47.js +0 -2
- /package/lib/umd/{738.js.LICENSE.txt → 3ffb7beb33b58142e791.js.LICENSE.txt} +0 -0
- /package/lib/umd/{73cbb3dbfaa3ddd4df47.js.LICENSE.txt → 739.js.LICENSE.txt} +0 -0
|
@@ -76,7 +76,7 @@ function CategoryFeed(inProps) {
|
|
|
76
76
|
const scUserContext = (0, react_core_1.useSCUser)();
|
|
77
77
|
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
78
78
|
// REF
|
|
79
|
-
const feedRef = (0, react_1.useRef)();
|
|
79
|
+
const feedRef = (0, react_1.useRef)(null);
|
|
80
80
|
// Hooks
|
|
81
81
|
const { scCategory } = (0, react_core_1.useSCFetchCategory)({ id: categoryId, category });
|
|
82
82
|
const isAdvertisingCustomAdvEnabled = (0, react_core_1.useSCPreferenceEnabled)(react_core_1.SCPreferences.ADVERTISING_CUSTOM_ADV_ENABLED);
|
|
@@ -92,7 +92,7 @@ function EventFeed(inProps) {
|
|
|
92
92
|
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
93
93
|
const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
|
|
94
94
|
// REF
|
|
95
|
-
const feedRef = (0, react_1.useRef)();
|
|
95
|
+
const feedRef = (0, react_1.useRef)(null);
|
|
96
96
|
// CONST
|
|
97
97
|
const authUserId = scUserContext.user ? scUserContext.user.id : null;
|
|
98
98
|
(0, react_1.useEffect)(() => {
|
|
@@ -89,7 +89,7 @@ function ExploreFeed(inProps) {
|
|
|
89
89
|
const isAdvertisingCustomAdvOnlyForAnonUsersEnabled = (0, react_core_1.useSCPreferenceEnabled)(react_core_1.SCPreferences.ADVERTISING_CUSTOM_ADV_ONLY_FOR_ANONYMOUS_USERS_ENABLED);
|
|
90
90
|
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
91
91
|
// REF
|
|
92
|
-
const feedRef = (0, react_1.useRef)();
|
|
92
|
+
const feedRef = (0, react_1.useRef)(null);
|
|
93
93
|
/**
|
|
94
94
|
* Render advertising above the feed
|
|
95
95
|
*/
|
|
@@ -98,6 +98,6 @@ function FeedObjectDetail(inProps) {
|
|
|
98
98
|
if (!obj) {
|
|
99
99
|
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
|
|
100
100
|
}
|
|
101
|
-
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, spacing: 2 }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({
|
|
101
|
+
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ size: { xs: 12, md: 7 } }, { children: [(0, jsx_runtime_1.jsx)(react_ui_1.FeedObject, Object.assign({}, FeedObjectProps, { feedObject: obj, template: react_ui_1.SCFeedObjectTemplateType.DETAIL, onReply: handleReply })), renderAdvertising(), commentsEnabled && ((0, jsx_runtime_1.jsx)(react_ui_1.CommentsFeedObject, Object.assign({ showTitle: true, feedObject: obj, comments: comments }, CommentsFeedObjectProps), `comments_${obj.id}`))] })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, md: 5 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ sx: { display: { xs: 'none', md: 'block' } } }, { children: (0, jsx_runtime_1.jsx)(react_ui_1.StickyBox, Object.assign({}, FeedSidebarProps, { children: (0, jsx_runtime_1.jsx)(react_ui_1.RelatedFeedObjectsWidget, Object.assign({ feedObject: obj, feedObjectId: obj.id }, RelatedFeedObjectProps), `related_${obj.id}`) })) })) }))] })) })));
|
|
102
102
|
}
|
|
103
103
|
exports.default = FeedObjectDetail;
|
|
@@ -33,6 +33,6 @@ const Root = (0, material_1.styled)(material_1.Box, {
|
|
|
33
33
|
*/
|
|
34
34
|
function FeedObjectDetailSkeleton(props) {
|
|
35
35
|
const { FeedObjectSkeletonProps = {}, CommentsFeedObjectSkeletonProps = {}, RelatedFeedObjectsSkeletonProps = {} } = props;
|
|
36
|
-
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, spacing: 2 }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({
|
|
36
|
+
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ size: { xs: 12, md: 7 } }, { children: [(0, jsx_runtime_1.jsx)(react_ui_1.FeedObjectSkeleton, Object.assign({ template: react_ui_1.SCFeedObjectTemplateType.DETAIL }, FeedObjectSkeletonProps)), (0, jsx_runtime_1.jsx)(react_ui_1.CommentsFeedObjectSkeleton, Object.assign({ count: 4 }, CommentsFeedObjectSkeletonProps))] })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, md: 5 } }, { children: (0, jsx_runtime_1.jsx)(react_ui_1.RelatedFeedObjectsWidgetSkeleton, Object.assign({}, RelatedFeedObjectsSkeletonProps)) }))] })) })));
|
|
37
37
|
}
|
|
38
38
|
exports.default = FeedObjectDetailSkeleton;
|
|
@@ -78,7 +78,7 @@ function GroupFeed(inProps) {
|
|
|
78
78
|
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
79
79
|
const { scGroup } = (0, react_core_1.useSCFetchGroup)({ id: groupId, group });
|
|
80
80
|
// REF
|
|
81
|
-
const feedRef = (0, react_1.useRef)();
|
|
81
|
+
const feedRef = (0, react_1.useRef)(null);
|
|
82
82
|
// CONST
|
|
83
83
|
const authUserId = scUserContext.user ? scUserContext.user.id : null;
|
|
84
84
|
(0, react_1.useEffect)(() => {
|
|
@@ -12,7 +12,6 @@ const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
|
12
12
|
const react_ui_1 = require("@selfcommunity/react-ui");
|
|
13
13
|
const api_services_1 = require("@selfcommunity/api-services");
|
|
14
14
|
const react_intl_1 = require("react-intl");
|
|
15
|
-
const lab_1 = require("@mui/lab");
|
|
16
15
|
const notistack_1 = require("notistack");
|
|
17
16
|
const react_ui_2 = require("@selfcommunity/react-ui");
|
|
18
17
|
const classes = {
|
|
@@ -193,8 +192,8 @@ function Lesson(inProps) {
|
|
|
193
192
|
return (0, jsx_runtime_1.jsx)(react_ui_1.HiddenPlaceholder, {});
|
|
194
193
|
}
|
|
195
194
|
return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(react_ui_1.LessonAppbar, Object.assign({ showComments: scLesson.comments_enabled, editMode: editMode, activePanel: activePanel, title: scCourse.name, handleOpen: handleOpenDrawer, onSave: handleLessonUpdate, updating: updating }, LessonAppbarProps)), (0, jsx_runtime_1.jsxs)(Container, Object.assign({ open: Boolean(activePanel) || editMode, className: classes.containerRoot }, { children: [previewMode && ((0, jsx_runtime_1.jsx)(material_1.Alert, Object.assign({ severity: "info", className: classes.previewInfo }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.lesson.previewMode", defaultMessage: "templates.lesson.previewMode", values: {
|
|
196
|
-
link: (
|
|
197
|
-
linkBack: (
|
|
198
|
-
} }) })) }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.navigation }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", color: "text.secondary" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.lesson.number", defaultMessage: "templates.lesson.number", values: { from: currentLessonIndex + 1, to: availableLessons.length } }) })) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.navigationTitle }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: scLesson.name })), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handlePrev, disabled: isPrevDisabled }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_back" }) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleNext, disabled: isNextDisabled }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_next" }) }))] })] })), (0, jsx_runtime_1.jsx)(react_ui_1.LessonObject, { course: scCourse, lesson: scLesson, editMode: editMode, onContentChange: handleLessonContentEdit, onMediaChange: handleLessonMediaEdit }), !isCourseAdmin && !editMode && !previewMode && ((0, jsx_runtime_1.jsx)(
|
|
195
|
+
link: (chunks) => ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_EDIT_ROUTE_NAME, (0, react_ui_2.getUrlLesson)(scCourse, scLesson)) }, { children: chunks }), "templates.lesson.previewMode.link")),
|
|
196
|
+
linkBack: (chunks) => ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse) }, { children: chunks }), "templates.lesson.previewMode.linkBack"))
|
|
197
|
+
} }) })) }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.navigation }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", color: "text.secondary" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.lesson.number", defaultMessage: "templates.lesson.number", values: { from: currentLessonIndex + 1, to: availableLessons.length } }) })) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.navigationTitle }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: scLesson.name })), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handlePrev, disabled: isPrevDisabled }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_back" }) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleNext, disabled: isNextDisabled }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_next" }) }))] })] })), (0, jsx_runtime_1.jsx)(react_ui_1.LessonObject, { course: scCourse, lesson: scLesson, editMode: editMode, onContentChange: handleLessonContentEdit, onMediaChange: handleLessonMediaEdit }), !isCourseAdmin && !editMode && !previewMode && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.button, loading: loading, size: "small", variant: completed ? 'outlined' : 'contained', startIcon: !completed && (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_next" }), endIcon: completed && (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "circle_checked" }), onClick: toggleLessonCompletion }, { children: completed ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.lesson.button.completed", defaultMessage: "templates.lesson.button.completed" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.lesson.button.complete", defaultMessage: "templates.lesson.button.complete" })) })))] })), (0, jsx_runtime_1.jsx)(react_ui_1.LessonDrawer, Object.assign({ course: scCourse, lesson: scLesson, editMode: isMobile ? activePanel === react_ui_1.SCLessonActionsType.SETTINGS : editMode, previewMode: previewMode, activePanel: activePanel, handleClose: handleCloseDrawer, handleChangeLesson: handleChangeLesson, LessonEditFormProps: { lesson: scLesson, onSave: handleLessonUpdate, updating: updating, onSettingsChange: handleSettingsChange } }, LessonDrawerProps))] })), openDialog && (0, jsx_runtime_1.jsx)(react_ui_1.CourseCompletedDialog, { course: scCourse, onClose: handleCloseDialog })] }));
|
|
199
198
|
}
|
|
200
199
|
exports.default = Lesson;
|
|
@@ -117,7 +117,7 @@ function LoyaltyProgramDetail(inProps) {
|
|
|
117
117
|
}
|
|
118
118
|
});
|
|
119
119
|
})
|
|
120
|
-
.catch((
|
|
120
|
+
.catch(() => {
|
|
121
121
|
setOpen(false);
|
|
122
122
|
let _snackBar = enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.prize.request.error", defaultMessage: "templates.loyaltyProgramDetail.prize.request.error" }), {
|
|
123
123
|
variant: 'error',
|
|
@@ -184,6 +184,6 @@ function LoyaltyProgramDetail(inProps) {
|
|
|
184
184
|
if (loading) {
|
|
185
185
|
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
|
|
186
186
|
}
|
|
187
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [points !== 0 && ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: [!isMobile && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.loyaltyProgramWidget.title", defaultMessage: "ui.loyaltyProgramWidget.title" }), (0, jsx_runtime_1.jsx)(material_1.Chip, { className: classes.userPoints, component: "span", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.userPoints", defaultMessage: "templates.loyaltyProgramDetail.userPoints", values: { total: points } }) })] }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.community", defaultMessage: "templates.loyaltyProgramDetail.community" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionInfo }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.description", defaultMessage: "templates.loyaltyProgramDetail.description" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.listTitle", defaultMessage: "templates.loyaltyProgramDetail.listTitle" }) })), (0, jsx_runtime_1.jsx)(PointsList_1.default, { className: classes.pointsSection }), prizes.length !== 0 && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.prizes", defaultMessage: "templates.loyaltyProgramDetail.prizes" }) }))), (0, jsx_runtime_1.jsx)(react_ui_1.InfiniteScroll, Object.assign({ dataLength: prizes.length, next: handleNext, hasMoreNext: Boolean(next), loaderNext: (0, jsx_runtime_1.jsx)(PrizeItemSkeleton_1.default, {}), endMessage: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: prizes.length !== 0 ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.content.end.message", defaultMessage: "templates.loyaltyProgramDetail.content.end.message" }), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ color:
|
|
187
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [points !== 0 && ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: [!isMobile && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.loyaltyProgramWidget.title", defaultMessage: "ui.loyaltyProgramWidget.title" }), (0, jsx_runtime_1.jsx)(material_1.Chip, { className: classes.userPoints, component: "span", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.userPoints", defaultMessage: "templates.loyaltyProgramDetail.userPoints", values: { total: points } }) })] }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.community", defaultMessage: "templates.loyaltyProgramDetail.community" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionInfo }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.description", defaultMessage: "templates.loyaltyProgramDetail.description" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.listTitle", defaultMessage: "templates.loyaltyProgramDetail.listTitle" }) })), (0, jsx_runtime_1.jsx)(PointsList_1.default, { className: classes.pointsSection }), prizes.length !== 0 && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.prizes", defaultMessage: "templates.loyaltyProgramDetail.prizes" }) }))), (0, jsx_runtime_1.jsx)(react_ui_1.InfiniteScroll, Object.assign({ dataLength: prizes.length, next: handleNext, hasMoreNext: Boolean(next), loaderNext: (0, jsx_runtime_1.jsx)(PrizeItemSkeleton_1.default, {}), endMessage: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: prizes.length !== 0 ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.content.end.message", defaultMessage: "templates.loyaltyProgramDetail.content.end.message" }), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ color: "secondary", onClick: handleScrollUp }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.content.end.button", defaultMessage: "templates.loyaltyProgramDetail.content.end.button" }) }))] }))) : null }) }, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: !isMobile ? 3 : 0, direction: isMobile ? 'column' : 'row', className: classes.prizeSection }, { children: prizes.map((prize) => ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, md: 6, lg: 4, xl: 3 } }, { children: (0, jsx_runtime_1.jsxs)(material_1.Card, Object.assign({ className: classes.card }, { children: [(0, jsx_runtime_1.jsx)(material_1.CardMedia, { component: "img", image: prize.image }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.prizePoints }, { children: (0, jsx_runtime_1.jsx)(material_1.Chip, { className: points <= prize.points ? classes.notRequestable : null, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.prize.points", defaultMessage: "templates.loyaltyProgramDetail.prize.points", values: { total: prize.points } }) }) })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.cardTitle }, { children: prize.title })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.cardContent }, { children: prize.description }))] }), (0, jsx_runtime_1.jsxs)(material_1.CardActions, { children: [prize.link && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "medium", color: "secondary", href: prize.link, target: "_blank", className: classes.actionButton }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.button.more", defaultMessage: "templates.loyaltyProgramDetail.button.more" }) }))), ((!prize.link && prize.active && points >= prize.points) || (prize.active && points >= prize.points)) && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", className: classes.actionButton, disabled: points < prize.points, onClick: () => handleOpenAlert(prize.id) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.button.request", defaultMessage: "templates.loyaltyProgramDetail.button.request" }) })))] })] })) }), prize.id))) })) })), open && ((0, jsx_runtime_1.jsx)(react_ui_1.ConfirmDialog, { open: open, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.dialog.msg", defaultMessage: "templates.loyaltyProgramDetail.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.dialog.confirm", defaultMessage: "templates.loyaltyProgramDetail.dialog.confirm" }), onConfirm: () => requestPrize(prizeRequested), onClose: () => setOpen(false) }))] })));
|
|
188
188
|
}
|
|
189
189
|
exports.default = LoyaltyProgramDetail;
|
|
@@ -25,7 +25,7 @@ const classes = {
|
|
|
25
25
|
};
|
|
26
26
|
function PointElement({ message, points }) {
|
|
27
27
|
if (points > 0) {
|
|
28
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({
|
|
28
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ size: { xs: 12, md: 6 } }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ component: "div", className: classes.element }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: message }), (0, jsx_runtime_1.jsxs)(material_1.Typography, { children: ["+", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points", defaultMessage: "templates.loyaltyProgramDetail.points", values: { total: points } })] })] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })));
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
exports.PointElement = PointElement;
|
|
@@ -51,6 +51,6 @@ function PointsList(props) {
|
|
|
51
51
|
/**
|
|
52
52
|
* Renders the component (if not hidden by autoHide prop)
|
|
53
53
|
*/
|
|
54
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), container: true, spacing: 2 }, rest, { children: [preferences[react_core_1.SCPreferences.CONFIGURATIONS_POST_TYPE_ENABLED].value && ((0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.post", defaultMessage: "templates.loyaltyProgramDetail.points.post" }), points: _preferences[react_core_1.SCPreferences.POINTS_MAKE_POST] })), preferences[react_core_1.SCPreferences.CONFIGURATIONS_DISCUSSION_TYPE_ENABLED].value && ((0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.discussion", defaultMessage: "templates.loyaltyProgramDetail.points.discussion" }), points: _preferences[react_core_1.SCPreferences.POINTS_MAKE_DISCUSSION] })), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.comment", defaultMessage: "templates.loyaltyProgramDetail.points.comment" }), points: _preferences[react_core_1.SCPreferences.POINTS_MAKE_COMMENT] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.appreciation", defaultMessage: "templates.loyaltyProgramDetail.points.appreciation" }), points: _preferences[react_core_1.SCPreferences.POINTS_RECEIVE_VOTE] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.follower", defaultMessage: "templates.loyaltyProgramDetail.points.follower" }), points: _preferences[react_core_1.SCPreferences.POINTS_CONNECTION_OR_FOLLOWER] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.share", defaultMessage: "templates.loyaltyProgramDetail.points.share" }), points: _preferences[react_core_1.SCPreferences.POINTS_SOCIAL_SHARE] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.app", defaultMessage: "templates.loyaltyProgramDetail.points.app" }), points: _preferences[react_core_1.SCPreferences.POINTS_APP_USED] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.visit", defaultMessage: "templates.loyaltyProgramDetail.points.visit" }), points: _preferences[react_core_1.SCPreferences.POINTS_DAILY_VISIT] })] })));
|
|
54
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), container: true, width: "100%", spacing: 2 }, rest, { children: [preferences[react_core_1.SCPreferences.CONFIGURATIONS_POST_TYPE_ENABLED].value && ((0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.post", defaultMessage: "templates.loyaltyProgramDetail.points.post" }), points: _preferences[react_core_1.SCPreferences.POINTS_MAKE_POST] })), preferences[react_core_1.SCPreferences.CONFIGURATIONS_DISCUSSION_TYPE_ENABLED].value && ((0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.discussion", defaultMessage: "templates.loyaltyProgramDetail.points.discussion" }), points: _preferences[react_core_1.SCPreferences.POINTS_MAKE_DISCUSSION] })), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.comment", defaultMessage: "templates.loyaltyProgramDetail.points.comment" }), points: _preferences[react_core_1.SCPreferences.POINTS_MAKE_COMMENT] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.appreciation", defaultMessage: "templates.loyaltyProgramDetail.points.appreciation" }), points: _preferences[react_core_1.SCPreferences.POINTS_RECEIVE_VOTE] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.follower", defaultMessage: "templates.loyaltyProgramDetail.points.follower" }), points: _preferences[react_core_1.SCPreferences.POINTS_CONNECTION_OR_FOLLOWER] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.share", defaultMessage: "templates.loyaltyProgramDetail.points.share" }), points: _preferences[react_core_1.SCPreferences.POINTS_SOCIAL_SHARE] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.app", defaultMessage: "templates.loyaltyProgramDetail.points.app" }), points: _preferences[react_core_1.SCPreferences.POINTS_APP_USED] }), (0, jsx_runtime_1.jsx)(PointElement, { message: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "templates.loyaltyProgramDetail.points.visit", defaultMessage: "templates.loyaltyProgramDetail.points.visit" }), points: _preferences[react_core_1.SCPreferences.POINTS_DAILY_VISIT] })] })));
|
|
55
55
|
}
|
|
56
56
|
exports.default = PointsList;
|
|
@@ -30,6 +30,6 @@ const Root = (0, material_1.styled)(react_ui_1.Widget, {
|
|
|
30
30
|
*
|
|
31
31
|
*/
|
|
32
32
|
function PrizeItemSkeleton() {
|
|
33
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsx)(material_1.CardMedia, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "rectangular", width: "100%", height: 137 }) }), (0, jsx_runtime_1.jsx)(material_1.CardContent, { children: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 20, width: "80%", variant: "text" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 10, width: "70%", variant: "text", style: { marginTop: 8 } })] })) }), (0, jsx_runtime_1.jsxs)(material_1.CardActions, Object.assign({ className: classes.actions }, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ disabled: true, variant:
|
|
33
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsx)(material_1.CardMedia, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "rectangular", width: "100%", height: 137 }) }), (0, jsx_runtime_1.jsx)(material_1.CardContent, { children: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 20, width: "80%", variant: "text" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 10, width: "70%", variant: "text", style: { marginTop: 8 } })] })) }), (0, jsx_runtime_1.jsxs)(material_1.CardActions, Object.assign({ className: classes.actions }, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ disabled: true, variant: "outlined", size: "small" }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 10, width: 50, variant: "text" }) })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ disabled: true, variant: "text", size: "small" }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 20, width: 70, variant: "text" }) }))] }))] })));
|
|
34
34
|
}
|
|
35
35
|
exports.default = PrizeItemSkeleton;
|
|
@@ -45,6 +45,6 @@ const Root = (0, material_1.styled)(material_1.Box, {
|
|
|
45
45
|
function LoyaltyProgramDetailSkeleton() {
|
|
46
46
|
const theme = (0, material_1.useTheme)();
|
|
47
47
|
const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
|
|
48
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.title, component:
|
|
48
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.title, component: "div" }, { children: [!isMobile && (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 30, width: 140, variant: "text" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "circular", width: 172, height: 30, className: classes.chip })] })), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 20, width: "50%", variant: "text" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 17, width: "80%", variant: "text", className: classes.subTitle })] })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 20, width: 146 }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 2, className: classes.pointsList }, { children: [...Array(8)].map((_prize, index) => ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, md: 6 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 15, width: "100%" }) }), index))) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 20, width: 140, variant: "text" }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: isMobile ? 3 : 6 }, { children: [...Array(6)].map((_prize, index) => ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, md: 6, lg: 4 } }, { children: (0, jsx_runtime_1.jsx)(PrizeItemSkeleton_1.default, {}) }), index))) }))] })));
|
|
49
49
|
}
|
|
50
50
|
exports.default = LoyaltyProgramDetailSkeleton;
|
|
@@ -89,7 +89,7 @@ function MainFeed(inProps) {
|
|
|
89
89
|
const isAdvertisingCustomAdvOnlyForAnonUsersEnabled = (0, react_core_1.useSCPreferenceEnabled)(react_core_1.SCPreferences.ADVERTISING_CUSTOM_ADV_ONLY_FOR_ANONYMOUS_USERS_ENABLED);
|
|
90
90
|
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
91
91
|
// REF
|
|
92
|
-
const feedRef = (0, react_1.useRef)();
|
|
92
|
+
const feedRef = (0, react_1.useRef)(null);
|
|
93
93
|
/**
|
|
94
94
|
* Render advertising above the feed
|
|
95
95
|
*/
|
|
@@ -89,7 +89,7 @@ function UserFeed(inProps) {
|
|
|
89
89
|
// Hooks
|
|
90
90
|
const { scUser } = (0, react_core_1.useSCFetchUser)({ id: userId, user });
|
|
91
91
|
// REF
|
|
92
|
-
const feedRef = (0, react_1.useRef)();
|
|
92
|
+
const feedRef = (0, react_1.useRef)(null);
|
|
93
93
|
// HANDLERS
|
|
94
94
|
const handleComposerSuccess = (feedObject) => {
|
|
95
95
|
const messageId = feedObject.scheduled_at ? 'ui.composer.scheduled.success' : 'ui.inlineComposerWidget.success';
|
|
@@ -254,7 +254,7 @@ function UserProfile(inProps) {
|
|
|
254
254
|
year: 'numeric',
|
|
255
255
|
month: 'long'
|
|
256
256
|
})
|
|
257
|
-
} }) }))), scUser.location && ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.info }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }), " ", scUser.location] }))), taggingEnabled && ((0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ direction: "row",
|
|
257
|
+
} }) }))), scUser.location && ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.info }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "add_location_alt" }), " ", scUser.location] }))), taggingEnabled && ((0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ direction: "row", className: classes.tags }, { children: scUser.tags
|
|
258
258
|
.filter((t) => t.visible)
|
|
259
259
|
.map((tag) => ((0, jsx_runtime_1.jsx)(react_ui_1.TagChip, { tag: tag, clickable: false, disposable: false, showDescription: true }, tag.id))) }), `tags_${scUser.id}`)), (0, jsx_runtime_1.jsx)(UserFeed_1.default, Object.assign({ className: classes.feed, user: scUser, widgets: _widgets, FeedObjectProps: FeedObjectProps, FeedSidebarProps: FeedSidebarProps }, UserFeedProps), `feed_${scUser.id}`)] })) })) }))] })));
|
|
260
260
|
}
|
|
@@ -73,7 +73,7 @@ export default function CategoryFeed(inProps) {
|
|
|
73
73
|
const scUserContext = useSCUser();
|
|
74
74
|
const { enqueueSnackbar } = useSnackbar();
|
|
75
75
|
// REF
|
|
76
|
-
const feedRef = useRef();
|
|
76
|
+
const feedRef = useRef(null);
|
|
77
77
|
// Hooks
|
|
78
78
|
const { scCategory } = useSCFetchCategory({ id: categoryId, category });
|
|
79
79
|
const isAdvertisingCustomAdvEnabled = useSCPreferenceEnabled(SCPreferences.ADVERTISING_CUSTOM_ADV_ENABLED);
|
|
@@ -89,7 +89,7 @@ export default function EventFeed(inProps) {
|
|
|
89
89
|
const { enqueueSnackbar } = useSnackbar();
|
|
90
90
|
const { scEvent } = useSCFetchEvent({ id: eventId, event });
|
|
91
91
|
// REF
|
|
92
|
-
const feedRef = useRef();
|
|
92
|
+
const feedRef = useRef(null);
|
|
93
93
|
// CONST
|
|
94
94
|
const authUserId = scUserContext.user ? scUserContext.user.id : null;
|
|
95
95
|
useEffect(() => {
|
|
@@ -86,7 +86,7 @@ export default function ExploreFeed(inProps) {
|
|
|
86
86
|
const isAdvertisingCustomAdvOnlyForAnonUsersEnabled = useSCPreferenceEnabled(SCPreferences.ADVERTISING_CUSTOM_ADV_ONLY_FOR_ANONYMOUS_USERS_ENABLED);
|
|
87
87
|
const { enqueueSnackbar } = useSnackbar();
|
|
88
88
|
// REF
|
|
89
|
-
const feedRef = useRef();
|
|
89
|
+
const feedRef = useRef(null);
|
|
90
90
|
/**
|
|
91
91
|
* Render advertising above the feed
|
|
92
92
|
*/
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo, useState } from 'react';
|
|
3
|
-
import { Box, Grid,
|
|
3
|
+
import { Box, Grid, styled } from '@mui/material';
|
|
4
4
|
import { CommentsFeedObject, CustomAdv, FeedObject, RelatedFeedObjectsWidget, SCFeedObjectTemplateType, StickyBox } from '@selfcommunity/react-ui';
|
|
5
5
|
import FeedObjectDetailSkeleton from './Skeleton';
|
|
6
6
|
import { useThemeProps } from '@mui/system';
|
|
@@ -95,5 +95,5 @@ export default function FeedObjectDetail(inProps) {
|
|
|
95
95
|
if (!obj) {
|
|
96
96
|
return _jsx(FeedObjectDetailSkeleton, {});
|
|
97
97
|
}
|
|
98
|
-
return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, { children: _jsxs(Grid, Object.assign({ container: true, spacing: 2 }, { children: [_jsxs(Grid, Object.assign({
|
|
98
|
+
return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, { children: _jsxs(Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [_jsxs(Grid, Object.assign({ size: { xs: 12, md: 7 } }, { children: [_jsx(FeedObject, Object.assign({}, FeedObjectProps, { feedObject: obj, template: SCFeedObjectTemplateType.DETAIL, onReply: handleReply })), renderAdvertising(), commentsEnabled && (_jsx(CommentsFeedObject, Object.assign({ showTitle: true, feedObject: obj, comments: comments }, CommentsFeedObjectProps), `comments_${obj.id}`))] })), _jsx(Grid, Object.assign({ size: { xs: 12, md: 5 } }, { children: _jsx(Box, Object.assign({ sx: { display: { xs: 'none', md: 'block' } } }, { children: _jsx(StickyBox, Object.assign({}, FeedSidebarProps, { children: _jsx(RelatedFeedObjectsWidget, Object.assign({ feedObject: obj, feedObjectId: obj.id }, RelatedFeedObjectProps), `related_${obj.id}`) })) })) }))] })) })));
|
|
99
99
|
}
|
|
@@ -31,5 +31,5 @@ const Root = styled(Box, {
|
|
|
31
31
|
*/
|
|
32
32
|
export default function FeedObjectDetailSkeleton(props) {
|
|
33
33
|
const { FeedObjectSkeletonProps = {}, CommentsFeedObjectSkeletonProps = {}, RelatedFeedObjectsSkeletonProps = {} } = props;
|
|
34
|
-
return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsxs(Grid, Object.assign({ container: true, spacing: 2 }, { children: [_jsxs(Grid, Object.assign({
|
|
34
|
+
return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsxs(Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [_jsxs(Grid, Object.assign({ size: { xs: 12, md: 7 } }, { children: [_jsx(FeedObjectSkeleton, Object.assign({ template: SCFeedObjectTemplateType.DETAIL }, FeedObjectSkeletonProps)), _jsx(CommentsFeedObjectSkeleton, Object.assign({ count: 4 }, CommentsFeedObjectSkeletonProps))] })), _jsx(Grid, Object.assign({ size: { xs: 12, md: 5 } }, { children: _jsx(RelatedFeedObjectsWidgetSkeleton, Object.assign({}, RelatedFeedObjectsSkeletonProps)) }))] })) })));
|
|
35
35
|
}
|
|
@@ -75,7 +75,7 @@ export default function GroupFeed(inProps) {
|
|
|
75
75
|
const { enqueueSnackbar } = useSnackbar();
|
|
76
76
|
const { scGroup } = useSCFetchGroup({ id: groupId, group });
|
|
77
77
|
// REF
|
|
78
|
-
const feedRef = useRef();
|
|
78
|
+
const feedRef = useRef(null);
|
|
79
79
|
// CONST
|
|
80
80
|
const authUserId = scUserContext.user ? scUserContext.user.id : null;
|
|
81
81
|
useEffect(() => {
|
|
@@ -2,7 +2,7 @@ import { __rest } from "tslib";
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Fragment, useCallback, useEffect, useMemo, useState } from 'react';
|
|
4
4
|
import { useThemeProps } from '@mui/system';
|
|
5
|
-
import { Box, Icon, IconButton, Typography, useMediaQuery, useTheme, Alert, styled } from '@mui/material';
|
|
5
|
+
import { Box, Icon, IconButton, Typography, useMediaQuery, useTheme, Alert, styled, Button } from '@mui/material';
|
|
6
6
|
import { PREFIX } from './constants';
|
|
7
7
|
import { SCCourseJoinStatusType, SCCourseLessonCompletionStatusType } from '@selfcommunity/types';
|
|
8
8
|
import { SCRoutes, useSCFetchCourse, useSCFetchLesson, useSCRouting, Link } from '@selfcommunity/react-core';
|
|
@@ -10,7 +10,6 @@ import classNames from 'classnames';
|
|
|
10
10
|
import { CourseCompletedDialog, HiddenPlaceholder, LessonAppbar, LessonDrawer, LessonObject, SCLessonActionsType } from '@selfcommunity/react-ui';
|
|
11
11
|
import { CourseInfoViewType, CourseService } from '@selfcommunity/api-services';
|
|
12
12
|
import { FormattedMessage } from 'react-intl';
|
|
13
|
-
import { LoadingButton } from '@mui/lab';
|
|
14
13
|
import { useSnackbar } from 'notistack';
|
|
15
14
|
import { getUrlLesson } from '@selfcommunity/react-ui';
|
|
16
15
|
const classes = {
|
|
@@ -191,7 +190,7 @@ export default function Lesson(inProps) {
|
|
|
191
190
|
return _jsx(HiddenPlaceholder, {});
|
|
192
191
|
}
|
|
193
192
|
return (_jsxs(Fragment, { children: [_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(LessonAppbar, Object.assign({ showComments: scLesson.comments_enabled, editMode: editMode, activePanel: activePanel, title: scCourse.name, handleOpen: handleOpenDrawer, onSave: handleLessonUpdate, updating: updating }, LessonAppbarProps)), _jsxs(Container, Object.assign({ open: Boolean(activePanel) || editMode, className: classes.containerRoot }, { children: [previewMode && (_jsx(Alert, Object.assign({ severity: "info", className: classes.previewInfo }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "templates.lesson.previewMode", defaultMessage: "templates.lesson.previewMode", values: {
|
|
194
|
-
link: (
|
|
195
|
-
linkBack: (
|
|
196
|
-
} }) })) }))), _jsx(Box, Object.assign({ className: classes.navigation }, { children: _jsx(Typography, Object.assign({ variant: "body2", color: "text.secondary" }, { children: _jsx(FormattedMessage, { id: "templates.lesson.number", defaultMessage: "templates.lesson.number", values: { from: currentLessonIndex + 1, to: availableLessons.length } }) })) })), _jsxs(Box, Object.assign({ className: classes.navigationTitle }, { children: [_jsx(Typography, Object.assign({ variant: "h5" }, { children: scLesson.name })), _jsxs(Box, { children: [_jsx(IconButton, Object.assign({ onClick: handlePrev, disabled: isPrevDisabled }, { children: _jsx(Icon, { children: "arrow_back" }) })), _jsx(IconButton, Object.assign({ onClick: handleNext, disabled: isNextDisabled }, { children: _jsx(Icon, { children: "arrow_next" }) }))] })] })), _jsx(LessonObject, { course: scCourse, lesson: scLesson, editMode: editMode, onContentChange: handleLessonContentEdit, onMediaChange: handleLessonMediaEdit }), !isCourseAdmin && !editMode && !previewMode && (_jsx(
|
|
193
|
+
link: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COURSE_LESSON_EDIT_ROUTE_NAME, getUrlLesson(scCourse, scLesson)) }, { children: chunks }), "templates.lesson.previewMode.link")),
|
|
194
|
+
linkBack: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse) }, { children: chunks }), "templates.lesson.previewMode.linkBack"))
|
|
195
|
+
} }) })) }))), _jsx(Box, Object.assign({ className: classes.navigation }, { children: _jsx(Typography, Object.assign({ variant: "body2", color: "text.secondary" }, { children: _jsx(FormattedMessage, { id: "templates.lesson.number", defaultMessage: "templates.lesson.number", values: { from: currentLessonIndex + 1, to: availableLessons.length } }) })) })), _jsxs(Box, Object.assign({ className: classes.navigationTitle }, { children: [_jsx(Typography, Object.assign({ variant: "h5" }, { children: scLesson.name })), _jsxs(Box, { children: [_jsx(IconButton, Object.assign({ onClick: handlePrev, disabled: isPrevDisabled }, { children: _jsx(Icon, { children: "arrow_back" }) })), _jsx(IconButton, Object.assign({ onClick: handleNext, disabled: isNextDisabled }, { children: _jsx(Icon, { children: "arrow_next" }) }))] })] })), _jsx(LessonObject, { course: scCourse, lesson: scLesson, editMode: editMode, onContentChange: handleLessonContentEdit, onMediaChange: handleLessonMediaEdit }), !isCourseAdmin && !editMode && !previewMode && (_jsx(Button, Object.assign({ className: classes.button, loading: loading, size: "small", variant: completed ? 'outlined' : 'contained', startIcon: !completed && _jsx(Icon, { children: "arrow_next" }), endIcon: completed && _jsx(Icon, { children: "circle_checked" }), onClick: toggleLessonCompletion }, { children: completed ? (_jsx(FormattedMessage, { id: "templates.lesson.button.completed", defaultMessage: "templates.lesson.button.completed" })) : (_jsx(FormattedMessage, { id: "templates.lesson.button.complete", defaultMessage: "templates.lesson.button.complete" })) })))] })), _jsx(LessonDrawer, Object.assign({ course: scCourse, lesson: scLesson, editMode: isMobile ? activePanel === SCLessonActionsType.SETTINGS : editMode, previewMode: previewMode, activePanel: activePanel, handleClose: handleCloseDrawer, handleChangeLesson: handleChangeLesson, LessonEditFormProps: { lesson: scLesson, onSave: handleLessonUpdate, updating: updating, onSettingsChange: handleSettingsChange } }, LessonDrawerProps))] })), openDialog && _jsx(CourseCompletedDialog, { course: scCourse, onClose: handleCloseDialog })] }));
|
|
197
196
|
}
|
|
@@ -115,7 +115,7 @@ export default function LoyaltyProgramDetail(inProps) {
|
|
|
115
115
|
}
|
|
116
116
|
});
|
|
117
117
|
})
|
|
118
|
-
.catch((
|
|
118
|
+
.catch(() => {
|
|
119
119
|
setOpen(false);
|
|
120
120
|
let _snackBar = enqueueSnackbar(_jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.prize.request.error", defaultMessage: "templates.loyaltyProgramDetail.prize.request.error" }), {
|
|
121
121
|
variant: 'error',
|
|
@@ -182,5 +182,5 @@ export default function LoyaltyProgramDetail(inProps) {
|
|
|
182
182
|
if (loading) {
|
|
183
183
|
return _jsx(Skeleton, {});
|
|
184
184
|
}
|
|
185
|
-
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [points !== 0 && (_jsxs(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: [!isMobile && _jsx(FormattedMessage, { id: "ui.loyaltyProgramWidget.title", defaultMessage: "ui.loyaltyProgramWidget.title" }), _jsx(Chip, { className: classes.userPoints, component: "span", label: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.userPoints", defaultMessage: "templates.loyaltyProgramDetail.userPoints", values: { total: points } }) })] }))), _jsx(Typography, Object.assign({ className: classes.sectionTitle }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.community", defaultMessage: "templates.loyaltyProgramDetail.community" }) })), _jsx(Typography, Object.assign({ className: classes.sectionInfo }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.description", defaultMessage: "templates.loyaltyProgramDetail.description" }) })), _jsx(Typography, Object.assign({ className: classes.sectionTitle }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.listTitle", defaultMessage: "templates.loyaltyProgramDetail.listTitle" }) })), _jsx(PointsList, { className: classes.pointsSection }), prizes.length !== 0 && (_jsx(Typography, Object.assign({ className: classes.sectionTitle }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.prizes", defaultMessage: "templates.loyaltyProgramDetail.prizes" }) }))), _jsx(InfiniteScroll, Object.assign({ dataLength: prizes.length, next: handleNext, hasMoreNext: Boolean(next), loaderNext: _jsx(PrizeItemSkeleton, {}), endMessage: _jsx(_Fragment, { children: prizes.length !== 0 ? (_jsxs(Typography, Object.assign({ className: classes.endMessage }, { children: [_jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.content.end.message", defaultMessage: "templates.loyaltyProgramDetail.content.end.message" }), _jsx(Button, Object.assign({ color:
|
|
185
|
+
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [points !== 0 && (_jsxs(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: [!isMobile && _jsx(FormattedMessage, { id: "ui.loyaltyProgramWidget.title", defaultMessage: "ui.loyaltyProgramWidget.title" }), _jsx(Chip, { className: classes.userPoints, component: "span", label: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.userPoints", defaultMessage: "templates.loyaltyProgramDetail.userPoints", values: { total: points } }) })] }))), _jsx(Typography, Object.assign({ className: classes.sectionTitle }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.community", defaultMessage: "templates.loyaltyProgramDetail.community" }) })), _jsx(Typography, Object.assign({ className: classes.sectionInfo }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.description", defaultMessage: "templates.loyaltyProgramDetail.description" }) })), _jsx(Typography, Object.assign({ className: classes.sectionTitle }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.listTitle", defaultMessage: "templates.loyaltyProgramDetail.listTitle" }) })), _jsx(PointsList, { className: classes.pointsSection }), prizes.length !== 0 && (_jsx(Typography, Object.assign({ className: classes.sectionTitle }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.prizes", defaultMessage: "templates.loyaltyProgramDetail.prizes" }) }))), _jsx(InfiniteScroll, Object.assign({ dataLength: prizes.length, next: handleNext, hasMoreNext: Boolean(next), loaderNext: _jsx(PrizeItemSkeleton, {}), endMessage: _jsx(_Fragment, { children: prizes.length !== 0 ? (_jsxs(Typography, Object.assign({ className: classes.endMessage }, { children: [_jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.content.end.message", defaultMessage: "templates.loyaltyProgramDetail.content.end.message" }), _jsx(Button, Object.assign({ color: "secondary", onClick: handleScrollUp }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.content.end.button", defaultMessage: "templates.loyaltyProgramDetail.content.end.button" }) }))] }))) : null }) }, { children: _jsx(Grid, Object.assign({ container: true, width: "100%", spacing: !isMobile ? 3 : 0, direction: isMobile ? 'column' : 'row', className: classes.prizeSection }, { children: prizes.map((prize) => (_jsx(Grid, Object.assign({ size: { xs: 12, md: 6, lg: 4, xl: 3 } }, { children: _jsxs(Card, Object.assign({ className: classes.card }, { children: [_jsx(CardMedia, { component: "img", image: prize.image }), _jsx(Box, Object.assign({ className: classes.prizePoints }, { children: _jsx(Chip, { className: points <= prize.points ? classes.notRequestable : null, label: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.prize.points", defaultMessage: "templates.loyaltyProgramDetail.prize.points", values: { total: prize.points } }) }) })), _jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ variant: "body1", className: classes.cardTitle }, { children: prize.title })), _jsx(Typography, Object.assign({ variant: "body2", className: classes.cardContent }, { children: prize.description }))] }), _jsxs(CardActions, { children: [prize.link && (_jsx(Button, Object.assign({ size: "medium", color: "secondary", href: prize.link, target: "_blank", className: classes.actionButton }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.button.more", defaultMessage: "templates.loyaltyProgramDetail.button.more" }) }))), ((!prize.link && prize.active && points >= prize.points) || (prize.active && points >= prize.points)) && (_jsx(Button, Object.assign({ size: "small", variant: "outlined", className: classes.actionButton, disabled: points < prize.points, onClick: () => handleOpenAlert(prize.id) }, { children: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.button.request", defaultMessage: "templates.loyaltyProgramDetail.button.request" }) })))] })] })) }), prize.id))) })) })), open && (_jsx(ConfirmDialog, { open: open, title: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.dialog.msg", defaultMessage: "templates.loyaltyProgramDetail.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.dialog.confirm", defaultMessage: "templates.loyaltyProgramDetail.dialog.confirm" }), onConfirm: () => requestPrize(prizeRequested), onClose: () => setOpen(false) }))] })));
|
|
186
186
|
}
|
|
@@ -22,7 +22,7 @@ const classes = {
|
|
|
22
22
|
};
|
|
23
23
|
export function PointElement({ message, points }) {
|
|
24
24
|
if (points > 0) {
|
|
25
|
-
return (_jsxs(Grid, Object.assign({
|
|
25
|
+
return (_jsxs(Grid, Object.assign({ size: { xs: 12, md: 6 } }, { children: [_jsxs(Typography, Object.assign({ component: "div", className: classes.element }, { children: [_jsx(Typography, { children: message }), _jsxs(Typography, { children: ["+", _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points", defaultMessage: "templates.loyaltyProgramDetail.points", values: { total: points } })] })] })), _jsx(Divider, {})] })));
|
|
26
26
|
}
|
|
27
27
|
}
|
|
28
28
|
const Root = styled(Grid, {
|
|
@@ -47,5 +47,5 @@ export default function PointsList(props) {
|
|
|
47
47
|
/**
|
|
48
48
|
* Renders the component (if not hidden by autoHide prop)
|
|
49
49
|
*/
|
|
50
|
-
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className), container: true, spacing: 2 }, rest, { children: [preferences[SCPreferences.CONFIGURATIONS_POST_TYPE_ENABLED].value && (_jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.post", defaultMessage: "templates.loyaltyProgramDetail.points.post" }), points: _preferences[SCPreferences.POINTS_MAKE_POST] })), preferences[SCPreferences.CONFIGURATIONS_DISCUSSION_TYPE_ENABLED].value && (_jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.discussion", defaultMessage: "templates.loyaltyProgramDetail.points.discussion" }), points: _preferences[SCPreferences.POINTS_MAKE_DISCUSSION] })), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.comment", defaultMessage: "templates.loyaltyProgramDetail.points.comment" }), points: _preferences[SCPreferences.POINTS_MAKE_COMMENT] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.appreciation", defaultMessage: "templates.loyaltyProgramDetail.points.appreciation" }), points: _preferences[SCPreferences.POINTS_RECEIVE_VOTE] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.follower", defaultMessage: "templates.loyaltyProgramDetail.points.follower" }), points: _preferences[SCPreferences.POINTS_CONNECTION_OR_FOLLOWER] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.share", defaultMessage: "templates.loyaltyProgramDetail.points.share" }), points: _preferences[SCPreferences.POINTS_SOCIAL_SHARE] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.app", defaultMessage: "templates.loyaltyProgramDetail.points.app" }), points: _preferences[SCPreferences.POINTS_APP_USED] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.visit", defaultMessage: "templates.loyaltyProgramDetail.points.visit" }), points: _preferences[SCPreferences.POINTS_DAILY_VISIT] })] })));
|
|
50
|
+
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className), container: true, width: "100%", spacing: 2 }, rest, { children: [preferences[SCPreferences.CONFIGURATIONS_POST_TYPE_ENABLED].value && (_jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.post", defaultMessage: "templates.loyaltyProgramDetail.points.post" }), points: _preferences[SCPreferences.POINTS_MAKE_POST] })), preferences[SCPreferences.CONFIGURATIONS_DISCUSSION_TYPE_ENABLED].value && (_jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.discussion", defaultMessage: "templates.loyaltyProgramDetail.points.discussion" }), points: _preferences[SCPreferences.POINTS_MAKE_DISCUSSION] })), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.comment", defaultMessage: "templates.loyaltyProgramDetail.points.comment" }), points: _preferences[SCPreferences.POINTS_MAKE_COMMENT] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.appreciation", defaultMessage: "templates.loyaltyProgramDetail.points.appreciation" }), points: _preferences[SCPreferences.POINTS_RECEIVE_VOTE] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.follower", defaultMessage: "templates.loyaltyProgramDetail.points.follower" }), points: _preferences[SCPreferences.POINTS_CONNECTION_OR_FOLLOWER] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.share", defaultMessage: "templates.loyaltyProgramDetail.points.share" }), points: _preferences[SCPreferences.POINTS_SOCIAL_SHARE] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.app", defaultMessage: "templates.loyaltyProgramDetail.points.app" }), points: _preferences[SCPreferences.POINTS_APP_USED] }), _jsx(PointElement, { message: _jsx(FormattedMessage, { id: "templates.loyaltyProgramDetail.points.visit", defaultMessage: "templates.loyaltyProgramDetail.points.visit" }), points: _preferences[SCPreferences.POINTS_DAILY_VISIT] })] })));
|
|
51
51
|
}
|
|
@@ -28,5 +28,5 @@ const Root = styled(Widget, {
|
|
|
28
28
|
*
|
|
29
29
|
*/
|
|
30
30
|
export default function PrizeItemSkeleton() {
|
|
31
|
-
return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(CardMedia, { children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", width: "100%", height: 137 }) }), _jsx(CardContent, { children: _jsxs(Typography, Object.assign({ className: classes.content }, { children: [_jsx(Skeleton, { animation: "wave", height: 20, width: "80%", variant: "text" }), _jsx(Skeleton, { animation: "wave", height: 10, width: "70%", variant: "text", style: { marginTop: 8 } })] })) }), _jsxs(CardActions, Object.assign({ className: classes.actions }, { children: [_jsx(Button, Object.assign({ disabled: true, variant:
|
|
31
|
+
return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(CardMedia, { children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", width: "100%", height: 137 }) }), _jsx(CardContent, { children: _jsxs(Typography, Object.assign({ className: classes.content }, { children: [_jsx(Skeleton, { animation: "wave", height: 20, width: "80%", variant: "text" }), _jsx(Skeleton, { animation: "wave", height: 10, width: "70%", variant: "text", style: { marginTop: 8 } })] })) }), _jsxs(CardActions, Object.assign({ className: classes.actions }, { children: [_jsx(Button, Object.assign({ disabled: true, variant: "outlined", size: "small" }, { children: _jsx(Skeleton, { animation: "wave", height: 10, width: 50, variant: "text" }) })), _jsx(Button, Object.assign({ disabled: true, variant: "text", size: "small" }, { children: _jsx(Skeleton, { animation: "wave", height: 20, width: 70, variant: "text" }) }))] }))] })));
|
|
32
32
|
}
|
|
@@ -42,5 +42,5 @@ const Root = styled(Box, {
|
|
|
42
42
|
export default function LoyaltyProgramDetailSkeleton() {
|
|
43
43
|
const theme = useTheme();
|
|
44
44
|
const isMobile = useMediaQuery(theme.breakpoints.down('md'));
|
|
45
|
-
return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsxs(Typography, Object.assign({ className: classes.title, component:
|
|
45
|
+
return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsxs(Typography, Object.assign({ className: classes.title, component: "div" }, { children: [!isMobile && _jsx(Skeleton, { animation: "wave", height: 30, width: 140, variant: "text" }), _jsx(Skeleton, { animation: "wave", variant: "circular", width: 172, height: 30, className: classes.chip })] })), _jsxs(Typography, Object.assign({ className: classes.sectionTitle }, { children: [_jsx(Skeleton, { animation: "wave", height: 20, width: "50%", variant: "text" }), _jsx(Skeleton, { animation: "wave", height: 17, width: "80%", variant: "text", className: classes.subTitle })] })), _jsx(Typography, Object.assign({ className: classes.sectionTitle }, { children: _jsx(Skeleton, { animation: "wave", height: 20, width: 146 }) })), _jsx(Grid, Object.assign({ container: true, width: "100%", spacing: 2, className: classes.pointsList }, { children: [...Array(8)].map((_prize, index) => (_jsx(Grid, Object.assign({ size: { xs: 12, md: 6 } }, { children: _jsx(Skeleton, { animation: "wave", height: 15, width: "100%" }) }), index))) })), _jsx(Typography, Object.assign({ className: classes.sectionTitle }, { children: _jsx(Skeleton, { animation: "wave", height: 20, width: 140, variant: "text" }) })), _jsx(Grid, Object.assign({ container: true, width: "100%", spacing: isMobile ? 3 : 6 }, { children: [...Array(6)].map((_prize, index) => (_jsx(Grid, Object.assign({ size: { xs: 12, md: 6, lg: 4 } }, { children: _jsx(PrizeItemSkeleton, {}) }), index))) }))] })));
|
|
46
46
|
}
|
|
@@ -86,7 +86,7 @@ export default function MainFeed(inProps) {
|
|
|
86
86
|
const isAdvertisingCustomAdvOnlyForAnonUsersEnabled = useSCPreferenceEnabled(SCPreferences.ADVERTISING_CUSTOM_ADV_ONLY_FOR_ANONYMOUS_USERS_ENABLED);
|
|
87
87
|
const { enqueueSnackbar } = useSnackbar();
|
|
88
88
|
// REF
|
|
89
|
-
const feedRef = useRef();
|
|
89
|
+
const feedRef = useRef(null);
|
|
90
90
|
/**
|
|
91
91
|
* Render advertising above the feed
|
|
92
92
|
*/
|
|
@@ -86,7 +86,7 @@ export default function UserFeed(inProps) {
|
|
|
86
86
|
// Hooks
|
|
87
87
|
const { scUser } = useSCFetchUser({ id: userId, user });
|
|
88
88
|
// REF
|
|
89
|
-
const feedRef = useRef();
|
|
89
|
+
const feedRef = useRef(null);
|
|
90
90
|
// HANDLERS
|
|
91
91
|
const handleComposerSuccess = (feedObject) => {
|
|
92
92
|
const messageId = feedObject.scheduled_at ? 'ui.composer.scheduled.success' : 'ui.inlineComposerWidget.success';
|
|
@@ -251,7 +251,7 @@ export default function UserProfile(inProps) {
|
|
|
251
251
|
year: 'numeric',
|
|
252
252
|
month: 'long'
|
|
253
253
|
})
|
|
254
|
-
} }) }))), scUser.location && (_jsxs(Typography, Object.assign({ className: classes.info }, { children: [_jsx(Icon, { children: "add_location_alt" }), " ", scUser.location] }))), taggingEnabled && (_jsx(Stack, Object.assign({ direction: "row",
|
|
254
|
+
} }) }))), scUser.location && (_jsxs(Typography, Object.assign({ className: classes.info }, { children: [_jsx(Icon, { children: "add_location_alt" }), " ", scUser.location] }))), taggingEnabled && (_jsx(Stack, Object.assign({ direction: "row", className: classes.tags }, { children: scUser.tags
|
|
255
255
|
.filter((t) => t.visible)
|
|
256
256
|
.map((tag) => (_jsx(TagChip, { tag: tag, clickable: false, disposable: false, showDescription: true }, tag.id))) }), `tags_${scUser.id}`)), _jsx(UserFeed, Object.assign({ className: classes.feed, user: scUser, widgets: _widgets, FeedObjectProps: FeedObjectProps, FeedSidebarProps: FeedSidebarProps }, UserFeedProps), `feed_${scUser.id}`)] })) })) }))] })));
|
|
257
257
|
}
|