@selfcommunity/react-ui 0.10.2-courses.169 → 0.10.2-courses.171
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/BottomNavigation/BottomNavigation.js +1 -1
- package/lib/cjs/components/CourseForm/CourseForm.js +1 -2
- package/lib/cjs/components/Courses/Courses.js +1 -1
- package/lib/cjs/components/LessonCommentObjects/LessonCommentObjects.js +5 -1
- package/lib/cjs/components/NavigationToolbar/NavigationToolbar.js +1 -1
- package/lib/esm/components/BottomNavigation/BottomNavigation.js +1 -1
- package/lib/esm/components/CourseForm/CourseForm.js +1 -2
- package/lib/esm/components/Courses/Courses.js +1 -1
- package/lib/esm/components/LessonCommentObjects/LessonCommentObjects.js +5 -1
- package/lib/esm/components/NavigationToolbar/NavigationToolbar.js +1 -1
- package/lib/umd/react-ui.js +1 -1
- package/package.json +8 -8
|
@@ -103,7 +103,7 @@ function BottomNavigation(inProps) {
|
|
|
103
103
|
((groupsEnabled && !eventsEnabled) || (!groupsEnabled && eventsEnabled)) &&
|
|
104
104
|
!exploreStreamEnabled ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: (0, classnames_1.default)(classes.composer, classes.action), component: ComposerIconButton_1.default, disableRipple: true }, "composer")) : null,
|
|
105
105
|
coursesEnabled && (scUserContext.user || contentAvailable) ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "courses" }) }, "courses")) : null,
|
|
106
|
-
groupsEnabled &&
|
|
106
|
+
groupsEnabled && scUserContext.user ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }) }, "groups")) : null,
|
|
107
107
|
(!postOnlyStaffEnabled || (react_core_1.UserUtils.isStaff(scUserContext.user) && postOnlyStaffEnabled)) &&
|
|
108
108
|
groupsEnabled &&
|
|
109
109
|
eventsEnabled &&
|
|
@@ -260,8 +260,7 @@ function CourseForm(inProps) {
|
|
|
260
260
|
(!field.name ||
|
|
261
261
|
Object.keys(error).length !== 0 ||
|
|
262
262
|
field.name.length > Course_1.COURSE_TITLE_MAX_LENGTH ||
|
|
263
|
-
field.description.length > Course_1.COURSE_DESCRIPTION_MAX_LENGTH
|
|
264
|
-
(!!field.privacy && (!field.description || course.num_sections === 0 || course.num_lessons === 0))), variant: "contained", onClick: _step === Course_1.SCCourseFormStepType.GENERAL
|
|
263
|
+
field.description.length > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), variant: "contained", onClick: _step === Course_1.SCCourseFormStepType.GENERAL
|
|
265
264
|
? () => handleChangeStep(Course_1.SCCourseFormStepType.CUSTOMIZATION)
|
|
266
265
|
: field.privacy !== types_1.SCCoursePrivacyType.DRAFT && course.privacy === types_1.SCCoursePrivacyType.DRAFT
|
|
267
266
|
? () => setOpenDialog(true)
|
|
@@ -220,7 +220,7 @@ function Courses(inProps) {
|
|
|
220
220
|
}
|
|
221
221
|
}, InputProps: {
|
|
222
222
|
endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => fetchCourses(), disabled: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchCourses(), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }), disabled: loading })) })))
|
|
223
|
-
} }) })), ((onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled) && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.CoursesChipRoot, { color: showMyCourses ? 'primary' : 'default', variant: showMyCourses ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courses.filterByCreatedByMe", defaultMessage: "ui.courses.filterByCreatedByMe" }), onClick: () => setShowMyCourses(!showMyCourses),
|
|
223
|
+
} }) })), authUserId && ((onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled) && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.CoursesChipRoot, { color: showMyCourses ? 'primary' : 'default', variant: showMyCourses ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courses.filterByCreatedByMe", defaultMessage: "ui.courses.filterByCreatedByMe" }), onClick: () => setShowMyCourses(!showMyCourses),
|
|
224
224
|
// @ts-expect-error this is needed to use showForMe into SCCourses
|
|
225
225
|
showForMe: showMyCourses, deleteIcon: showMyCourses ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyCourses ? () => setShowMyCourses(false) : null, disabled: loading || showForMe }) }))), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: "auto" }, { children: (0, jsx_runtime_1.jsx)(material_1.FormControl, Object.assign({ fullWidth: true }, { children: (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { onChange: handleOnChangeCategory, className: classes.category, size: "small", multiple: true }) })) })), authUserId && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.CoursesChipRoot, { color: showForMe ? 'primary' : 'default', variant: showForMe ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courses.filterByCoursesForMe", defaultMessage: "ui.courses.filterByCoursesForMe" }), onClick: handleChipClick,
|
|
226
226
|
// @ts-expect-error this is needed to use showForMe into SCCourses
|
|
@@ -165,12 +165,16 @@ function LessonCommentObjects(inProps) {
|
|
|
165
165
|
}
|
|
166
166
|
commentsObject.updateLessonComments([...updated]);
|
|
167
167
|
};
|
|
168
|
+
console.log(commentsObject.isLoadingNext);
|
|
168
169
|
/**
|
|
169
170
|
* Renders root object(if obj)
|
|
170
171
|
*/
|
|
171
172
|
if (!commentsObject.lessonObject) {
|
|
172
173
|
return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
|
|
173
174
|
}
|
|
174
|
-
|
|
175
|
+
if (!commentsObject.comments.length && commentsObject.isLoadingNext) {
|
|
176
|
+
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, Object.assign({ count: 5 }, CommentsObjectSkeletonProps));
|
|
177
|
+
}
|
|
178
|
+
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: commentsObject.comments.length > 0 ? ((0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ height: '100%', dataLength: commentsObject.comments.length, next: handleNext, hasMoreNext: Boolean(commentsObject.next), loaderNext: (0, jsx_runtime_1.jsx)(LessonCommentObject_1.LessonCommentObjectSkeleton, Object.assign({}, CommentObjectSkeletonProps, { count: 1 })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ ref: commentsEndRef }, { children: commentsObject.comments.map((c, index) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(LessonCommentObject_1.default, Object.assign({ commentObject: c, lessonObject: commentsObject.lessonObject, onDelete: (comment) => handleCommentsUpdate(comment, true), isEditing: (editing) => setIsEditing(editing) }, CommentComponentProps, { CommentObjectSkeletonProps: CommentObjectSkeletonProps }), c.id) }, index))) })) }))) : null }), commentsObject.comments.length > 0 && !editing && ((0, jsx_runtime_1.jsx)(CommentObjectReply_1.default, { id: `reply-lessonCommentObjects`, showAvatar: false, replyIcon: !commenting, editable: !commenting, onReply: handleCommentAction, EditorProps: { placeholder: intl.formatMessage(messages.commentEditorPlaceholder), uploadFile: true, uploadImage: false } }, replyKey))] }) })));
|
|
175
179
|
}
|
|
176
180
|
exports.default = LessonCommentObjects;
|
|
@@ -149,7 +149,7 @@ function NavigationToolbar(inProps) {
|
|
|
149
149
|
}
|
|
150
150
|
const _children = children || ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.navigation }, { children: [scUserContext.user && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: (0, classnames_1.default)(classes.home, { [classes.active]: value.startsWith(scRoutingContext.url(react_core_1.SCRoutes.HOME_ROUTE_NAME, {})) }), "aria-label": "Home", to: scRoutingContext.url(react_core_1.SCRoutes.HOME_ROUTE_NAME, {}), component: react_core_1.Link }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "home" }) }))), coursesEnabled && (scUserContext.user || preferences[react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY]) && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: (0, classnames_1.default)(classes.courses, {
|
|
151
151
|
[classes.active]: value.startsWith(scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}))
|
|
152
|
-
}), "aria-label": "Courses", to: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}), component: react_core_1.Link }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "courses" }) }))), groupsEnabled &&
|
|
152
|
+
}), "aria-label": "Courses", to: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}), component: react_core_1.Link }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "courses" }) }))), groupsEnabled && scUserContext.user && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: (0, classnames_1.default)(classes.groups, {
|
|
153
153
|
[classes.active]: value.startsWith(scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {})) ||
|
|
154
154
|
value.startsWith(scRoutingContext.url(react_core_1.SCRoutes.GROUPS_ROUTE_NAME, {}))
|
|
155
155
|
}), "aria-label": "Groups", to: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), component: react_core_1.Link }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "groups" }) }))), eventsEnabled && (scUserContext.user || preferences[react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY]) && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: (0, classnames_1.default)(classes.events, {
|
|
@@ -101,7 +101,7 @@ export default function BottomNavigation(inProps) {
|
|
|
101
101
|
((groupsEnabled && !eventsEnabled) || (!groupsEnabled && eventsEnabled)) &&
|
|
102
102
|
!exploreStreamEnabled ? (_jsx(BottomNavigationAction, { className: classNames(classes.composer, classes.action), component: ComposerIconButton, disableRipple: true }, "composer")) : null,
|
|
103
103
|
coursesEnabled && (scUserContext.user || contentAvailable) ? (_jsx(BottomNavigationAction, { className: classes.action, component: Link, to: scRoutingContext.url(SCRoutes.COURSES_ROUTE_NAME, {}), value: scRoutingContext.url(SCRoutes.COURSES_ROUTE_NAME, {}), icon: _jsx(Icon, { children: "courses" }) }, "courses")) : null,
|
|
104
|
-
groupsEnabled &&
|
|
104
|
+
groupsEnabled && scUserContext.user ? (_jsx(BottomNavigationAction, { className: classes.action, component: Link, to: scRoutingContext.url(SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), value: scRoutingContext.url(SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), icon: _jsx(Icon, { children: "groups" }) }, "groups")) : null,
|
|
105
105
|
(!postOnlyStaffEnabled || (UserUtils.isStaff(scUserContext.user) && postOnlyStaffEnabled)) &&
|
|
106
106
|
groupsEnabled &&
|
|
107
107
|
eventsEnabled &&
|
|
@@ -258,8 +258,7 @@ export default function CourseForm(inProps) {
|
|
|
258
258
|
(!field.name ||
|
|
259
259
|
Object.keys(error).length !== 0 ||
|
|
260
260
|
field.name.length > COURSE_TITLE_MAX_LENGTH ||
|
|
261
|
-
field.description.length > COURSE_DESCRIPTION_MAX_LENGTH
|
|
262
|
-
(!!field.privacy && (!field.description || course.num_sections === 0 || course.num_lessons === 0))), variant: "contained", onClick: _step === SCCourseFormStepType.GENERAL
|
|
261
|
+
field.description.length > COURSE_DESCRIPTION_MAX_LENGTH), variant: "contained", onClick: _step === SCCourseFormStepType.GENERAL
|
|
263
262
|
? () => handleChangeStep(SCCourseFormStepType.CUSTOMIZATION)
|
|
264
263
|
: field.privacy !== SCCoursePrivacyType.DRAFT && course.privacy === SCCoursePrivacyType.DRAFT
|
|
265
264
|
? () => setOpenDialog(true)
|
|
@@ -217,7 +217,7 @@ export default function Courses(inProps) {
|
|
|
217
217
|
}
|
|
218
218
|
}, InputProps: {
|
|
219
219
|
endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? (_jsx(IconButton, Object.assign({ onClick: () => fetchCourses(), disabled: loading }, { children: _jsx(Icon, { children: "search" }) }))) : (_jsx(Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchCourses(), endIcon: _jsx(Icon, { children: "search" }), disabled: loading })) })))
|
|
220
|
-
} }) })), ((onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled) && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(CoursesChipRoot, { color: showMyCourses ? 'primary' : 'default', variant: showMyCourses ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.courses.filterByCreatedByMe", defaultMessage: "ui.courses.filterByCreatedByMe" }), onClick: () => setShowMyCourses(!showMyCourses),
|
|
220
|
+
} }) })), authUserId && ((onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled) && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(CoursesChipRoot, { color: showMyCourses ? 'primary' : 'default', variant: showMyCourses ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.courses.filterByCreatedByMe", defaultMessage: "ui.courses.filterByCreatedByMe" }), onClick: () => setShowMyCourses(!showMyCourses),
|
|
221
221
|
// @ts-expect-error this is needed to use showForMe into SCCourses
|
|
222
222
|
showForMe: showMyCourses, deleteIcon: showMyCourses ? _jsx(Icon, { children: "close" }) : null, onDelete: showMyCourses ? () => setShowMyCourses(false) : null, disabled: loading || showForMe }) }))), _jsx(Grid, Object.assign({ item: true, xs: 12, md: "auto" }, { children: _jsx(FormControl, Object.assign({ fullWidth: true }, { children: _jsx(CategoryAutocomplete, { onChange: handleOnChangeCategory, className: classes.category, size: "small", multiple: true }) })) })), authUserId && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(CoursesChipRoot, { color: showForMe ? 'primary' : 'default', variant: showForMe ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.courses.filterByCoursesForMe", defaultMessage: "ui.courses.filterByCoursesForMe" }), onClick: handleChipClick,
|
|
223
223
|
// @ts-expect-error this is needed to use showForMe into SCCourses
|
|
@@ -163,11 +163,15 @@ export default function LessonCommentObjects(inProps) {
|
|
|
163
163
|
}
|
|
164
164
|
commentsObject.updateLessonComments([...updated]);
|
|
165
165
|
};
|
|
166
|
+
console.log(commentsObject.isLoadingNext);
|
|
166
167
|
/**
|
|
167
168
|
* Renders root object(if obj)
|
|
168
169
|
*/
|
|
169
170
|
if (!commentsObject.lessonObject) {
|
|
170
171
|
return _jsx(HiddenPlaceholder, {});
|
|
171
172
|
}
|
|
172
|
-
|
|
173
|
+
if (!commentsObject.comments.length && commentsObject.isLoadingNext) {
|
|
174
|
+
return _jsx(LessonCommentsObjectSkeleton, Object.assign({ count: 5 }, CommentsObjectSkeletonProps));
|
|
175
|
+
}
|
|
176
|
+
return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: _jsxs(_Fragment, { children: [_jsx(_Fragment, { children: commentsObject.comments.length > 0 ? (_jsx(InfiniteScroll, Object.assign({ height: '100%', dataLength: commentsObject.comments.length, next: handleNext, hasMoreNext: Boolean(commentsObject.next), loaderNext: _jsx(LessonCommentObjectSkeleton, Object.assign({}, CommentObjectSkeletonProps, { count: 1 })) }, { children: _jsx(List, Object.assign({ ref: commentsEndRef }, { children: commentsObject.comments.map((c, index) => (_jsx(ListItem, { children: _jsx(LessonCommentObject, Object.assign({ commentObject: c, lessonObject: commentsObject.lessonObject, onDelete: (comment) => handleCommentsUpdate(comment, true), isEditing: (editing) => setIsEditing(editing) }, CommentComponentProps, { CommentObjectSkeletonProps: CommentObjectSkeletonProps }), c.id) }, index))) })) }))) : null }), commentsObject.comments.length > 0 && !editing && (_jsx(CommentObjectReply, { id: `reply-lessonCommentObjects`, showAvatar: false, replyIcon: !commenting, editable: !commenting, onReply: handleCommentAction, EditorProps: { placeholder: intl.formatMessage(messages.commentEditorPlaceholder), uploadFile: true, uploadImage: false } }, replyKey))] }) })));
|
|
173
177
|
}
|
|
@@ -147,7 +147,7 @@ export default function NavigationToolbar(inProps) {
|
|
|
147
147
|
}
|
|
148
148
|
const _children = children || (_jsxs(Box, Object.assign({ className: classes.navigation }, { children: [scUserContext.user && (_jsx(IconButton, Object.assign({ className: classNames(classes.home, { [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {})) }), "aria-label": "Home", to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "home" }) }))), coursesEnabled && (scUserContext.user || preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY]) && (_jsx(IconButton, Object.assign({ className: classNames(classes.courses, {
|
|
149
149
|
[classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.COURSES_ROUTE_NAME, {}))
|
|
150
|
-
}), "aria-label": "Courses", to: scRoutingContext.url(SCRoutes.COURSES_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "courses" }) }))), groupsEnabled &&
|
|
150
|
+
}), "aria-label": "Courses", to: scRoutingContext.url(SCRoutes.COURSES_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "courses" }) }))), groupsEnabled && scUserContext.user && (_jsx(IconButton, Object.assign({ className: classNames(classes.groups, {
|
|
151
151
|
[classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {})) ||
|
|
152
152
|
value.startsWith(scRoutingContext.url(SCRoutes.GROUPS_ROUTE_NAME, {}))
|
|
153
153
|
}), "aria-label": "Groups", to: scRoutingContext.url(SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "groups" }) }))), eventsEnabled && (scUserContext.user || preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY]) && (_jsx(IconButton, Object.assign({ className: classNames(classes.events, {
|