@selfcommunity/react-ui 0.10.2-courses.190 → 0.10.2-courses.192

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/lib/cjs/components/Course/Course.js +2 -2
  2. package/lib/cjs/components/CourseForm/CourseForm.d.ts +5 -0
  3. package/lib/cjs/components/CourseForm/CourseForm.js +10 -5
  4. package/lib/cjs/components/CourseFormDialog/CourseFormDialog.js +12 -2
  5. package/lib/cjs/components/Courses/Courses.js +3 -9
  6. package/lib/cjs/components/EditCourse/Lessons/SectionRow.js +1 -1
  7. package/lib/cjs/components/EditCourse/Lessons.js +29 -24
  8. package/lib/esm/components/Course/Course.js +2 -2
  9. package/lib/esm/components/CourseForm/CourseForm.d.ts +5 -0
  10. package/lib/esm/components/CourseForm/CourseForm.js +13 -8
  11. package/lib/esm/components/CourseFormDialog/CourseFormDialog.js +13 -3
  12. package/lib/esm/components/Courses/Courses.js +3 -9
  13. package/lib/esm/components/EditCourse/Lessons/SectionRow.js +2 -2
  14. package/lib/esm/components/EditCourse/Lessons.js +19 -14
  15. package/lib/umd/react-ui.js +1 -1
  16. package/package.json +8 -8
package/lib/cjs/components/Course/Course.js CHANGED
@@ -160,7 +160,7 @@ function Course(inProps) {
160
160
  to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
161
161
  }), { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !((_b = scCourse.created_by) === null || _b === void 0 ? void 0 : _b.community_badge), smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scCourse.name, src: (_c = scCourse.created_by) === null || _c === void 0 ? void 0 : _c.avatar, className: classes.previewAvatar }) })) }))] })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.previewContent }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ className: classes.previewCreator }, (!((_d = scCourse.created_by) === null || _d === void 0 ? void 0 : _d.deleted) && {
162
162
  to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
163
- }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (_e = scCourse.created_by) === null || _e === void 0 ? void 0 : _e.username })) })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse), className: classes.previewNameWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.previewName }, { children: scCourse.name })) })), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.previewInfo }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), "-", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.previewCategory }, { children: scCourse.categories.map((category) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", label: category.name }, category.id))) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.previewProgress }, { children: renderProgress() }))] })), actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.previewActions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "outlined", size: "small", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) })) })))] })));
163
+ }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (_e = scCourse.created_by) === null || _e === void 0 ? void 0 : _e.username })) })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse), className: classes.previewNameWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.previewName }, { children: scCourse.name })) })), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.previewInfo }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), ' - ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.previewCategory }, { children: scCourse.categories.map((category) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", label: category.name }, category.id))) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.previewProgress }, { children: renderProgress() }))] })), actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.previewActions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "outlined", size: "small", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) })) })))] })));
164
164
  }
165
165
  else {
166
166
  contentObj = ((0, jsx_runtime_1.jsx)(SnippetRoot, { ButtonBaseProps: { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, elevation: 0, className: classes.snippetRoot, image: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.snippetImage }, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { variant: "square", alt: scCourse.name, src: scCourse.image_medium, className: userProfileSnippet ? classes.snippetAvatarUserProfile : classes.snippetAvatar }), !userProfileSnippet &&
@@ -172,7 +172,7 @@ function Course(inProps) {
172
172
  ? 'warning'
173
173
  : 'secondary', label: chipLabel, className: classes.chip }))] })), primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!userProfileSnippet && ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!((_f = scCourse.created_by) === null || _f === void 0 ? void 0 : _f.deleted) && {
174
174
  to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
175
- }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span" }, { children: (_g = scCourse.created_by) === null || _g === void 0 ? void 0 : _g.username })) }))), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.name })) }))] }), secondary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: userProfileSnippet ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: !scCourse.hide_member_count && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.userProfileSnippet.students", defaultMessage: "ui.course.userProfileSnippet.students", values: { students: scCourse.member_count } })) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), "-", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })) }), actions: actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) }))) }));
175
+ }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span" }, { children: (_g = scCourse.created_by) === null || _g === void 0 ? void 0 : _g.username })) }))), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.name })) }))] }), secondary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: userProfileSnippet ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: !scCourse.hide_member_count && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.userProfileSnippet.students", defaultMessage: "ui.course.userProfileSnippet.students", values: { students: scCourse.member_count } })) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), ' - ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })) }), actions: actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) }))) }));
176
176
  }
177
177
  /**
178
178
  * Renders root object
package/lib/cjs/components/CourseForm/CourseForm.d.ts CHANGED
@@ -22,6 +22,11 @@ export interface CourseFormProps extends BoxProps {
22
22
  * @default `SCCourseFormStepType.GENERAL`
23
23
  */
24
24
  step?: SCCourseFormStepType;
25
+ /**
26
+ * On step change callback function
27
+ * @default null
28
+ */
29
+ onStepChange?: (step: SCCourseFormStepType, type: SCCourseType) => void;
25
30
  /**
26
31
  * On error callback function
27
32
  * @default null
package/lib/cjs/components/CourseForm/CourseForm.js CHANGED
@@ -54,8 +54,11 @@ const classes = {
54
54
  privacySection: `${constants_1.PREFIX}-privacy-section`,
55
55
  privacySectionInfo: `${constants_1.PREFIX}-privacy-section-info`,
56
56
  selected: `${constants_1.PREFIX}-selected`,
57
+ disabled: `${constants_1.PREFIX}-disabled`,
57
58
  stepOne: `${constants_1.PREFIX}-step-one`,
58
59
  stepTwo: `${constants_1.PREFIX}-step-two`,
60
+ stepCustomization: `${constants_1.PREFIX}-step-customization`,
61
+ cardTitle: `${constants_1.PREFIX}-card-title`,
59
62
  title: `${constants_1.PREFIX}-title`,
60
63
  contrastColor: `${constants_1.PREFIX}-contrast-color`
61
64
  };
@@ -104,7 +107,7 @@ function CourseForm(inProps) {
104
107
  props: inProps,
105
108
  name: constants_1.PREFIX
106
109
  });
107
- const { className, onSuccess, onError, course = null, step = Course_1.SCCourseFormStepType.GENERAL } = props, rest = tslib_1.__rest(props, ["className", "onSuccess", "onError", "course", "step"]);
110
+ const { className, onSuccess, onError, course = null, step = Course_1.SCCourseFormStepType.GENERAL, onStepChange } = props, rest = tslib_1.__rest(props, ["className", "onSuccess", "onError", "course", "step", "onStepChange"]);
108
111
  // INTL
109
112
  const intl = (0, react_intl_1.useIntl)();
110
113
  const initialFieldState = {
@@ -123,10 +126,11 @@ function CourseForm(inProps) {
123
126
  const [error, setError] = (0, react_1.useState)({});
124
127
  const [openDialog, setOpenDialog] = (0, react_1.useState)(false);
125
128
  // PREFERENCES
126
- const scPreferences = (0, react_core_1.useSCPreferences)();
129
+ const { preferences } = (0, react_core_1.useSCPreferences)();
130
+ const courseAdvancedEnabled = (0, react_1.useMemo)(() => preferences[react_core_1.SCPreferences.CONFIGURATIONS_COURSES_ADVANCED_ENABLED].value, [preferences]);
127
131
  const _backgroundCover = Object.assign({}, (field.imageOriginal
128
132
  ? { background: `url('${field.imageOriginal}') center / cover` }
129
- : { background: `url('${scPreferences.preferences[react_core_1.SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
133
+ : { background: `url('${preferences[react_core_1.SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
130
134
  const handleChangeCover = (0, react_1.useCallback)((cover) => {
131
135
  setField((prev) => (Object.assign(Object.assign({}, prev), { ['imageOriginalFile']: cover })));
132
136
  const reader = new FileReader();
@@ -145,6 +149,7 @@ function CourseForm(inProps) {
145
149
  */
146
150
  const handleChangeStep = (newStep) => {
147
151
  setStep(newStep);
152
+ onStepChange(newStep, field.type);
148
153
  };
149
154
  /**
150
155
  * Formats categories object to a specific format needed in the form body
@@ -249,11 +254,11 @@ function CourseForm(inProps) {
249
254
  /**
250
255
  * Renders root object
251
256
  */
252
- return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: _step === Course_1.SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === Course_1.SCCourseFormStepType.GENERAL && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Object.values(types_1.SCCourseTypologyType).map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Card, Object.assign({ className: (0, classnames_1.default)(classes.card, { [classes.selected]: option === field.type }) }, { children: (0, jsx_runtime_1.jsx)(material_1.CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [course && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), (0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadCourseCover_1.default, { isUploading: field.isSubmitting, onChange: handleChangeCover }) })), (0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
257
+ return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: _step === Course_1.SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === Course_1.SCCourseFormStepType.GENERAL && ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: Object.values(types_1.SCCourseTypologyType).map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Card, Object.assign({ className: (0, classnames_1.default)(classes.card, { [classes.selected]: option === field.type }, { [classes.disabled]: !courseAdvancedEnabled && option !== types_1.SCCourseTypologyType.SELF }) }, { children: (0, jsx_runtime_1.jsx)(material_1.CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: "subtitle2", className: classes.cardTitle }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }), !courseAdvancedEnabled && option !== types_1.SCCourseTypologyType.SELF && ((0, jsx_runtime_1.jsx)(material_1.Chip, { variant: "outlined", color: "warning", size: "small", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.comingSoon.chip", defaultMessage: "ui.courseForm.comingSoon.chip" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [course && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), (0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: (0, classnames_1.default)(classes.form, _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadCourseCover_1.default, { isUploading: field.isSubmitting, onChange: handleChangeCover }) })), (0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
253
258
  endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: Course_1.COURSE_TITLE_MAX_LENGTH - field.name.length }))
254
259
  }, error: Boolean(field.name.length > Course_1.COURSE_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > Course_1.COURSE_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.name.error.maxLength", defaultMessage: "ui.courseForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
255
260
  endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_a = field.description) === null || _a === void 0 ? void 0 : _a.length) ? Course_1.COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : Course_1.COURSE_DESCRIPTION_MAX_LENGTH })))
256
- }, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" })) : null }), (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && (0, jsx_runtime_1.jsx)(Edit_1.default, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === Course_1.SCCourseFormStepType.GENERAL
261
+ }, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" })) : null }), (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && (0, jsx_runtime_1.jsx)(Edit_1.default, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: (0, classnames_1.default)(classes.actions, _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === Course_1.SCCourseFormStepType.GENERAL
257
262
  ? !field.type || Object.keys(error).length !== 0
258
263
  : _step === Course_1.SCCourseFormStepType.CUSTOMIZATION &&
259
264
  (!field.name ||
package/lib/cjs/components/CourseFormDialog/CourseFormDialog.js CHANGED
@@ -43,7 +43,15 @@ function CourseFormDialog(inProps) {
43
43
  props: inProps,
44
44
  name: constants_1.PREFIX
45
45
  });
46
- const { className, open = true, onClose, CourseFormComponentProps = { step: Course_1.SCCourseFormStepType.GENERAL } } = props, rest = tslib_1.__rest(props, ["className", "open", "onClose", "CourseFormComponentProps"]);
46
+ const { className, open = true, onClose, CourseFormComponentProps = {} } = props, rest = tslib_1.__rest(props, ["className", "open", "onClose", "CourseFormComponentProps"]);
47
+ // STATE
48
+ const [step, setStep] = (0, react_1.useState)(Course_1.SCCourseFormStepType.GENERAL);
49
+ const [type, setType] = (0, react_1.useState)('');
50
+ //HANDLERS
51
+ const handleStepTypeChange = (step, type) => {
52
+ setStep(step);
53
+ setType(type);
54
+ };
47
55
  const handleSuccess = (0, react_1.useCallback)((course) => {
48
56
  var _a;
49
57
  (_a = CourseFormComponentProps.onSuccess) === null || _a === void 0 ? void 0 : _a.call(CourseFormComponentProps, course);
@@ -52,6 +60,8 @@ function CourseFormDialog(inProps) {
52
60
  /**
53
61
  * Renders root object
54
62
  */
55
- return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ DialogContentProps: { dividers: false }, title: (CourseFormComponentProps === null || CourseFormComponentProps === void 0 ? void 0 : CourseFormComponentProps.course) ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.title.edit", defaultMessage: "ui.courseForm.title.edit" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.title.${CourseFormComponentProps.step}`, defaultMessage: `ui.courseForm.title.${CourseFormComponentProps.step}` })), open: open, onClose: onClose, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(CourseForm_1.default, Object.assign({}, CourseFormComponentProps, { onSuccess: handleSuccess })) })));
63
+ return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ DialogContentProps: { dividers: false }, title: (CourseFormComponentProps === null || CourseFormComponentProps === void 0 ? void 0 : CourseFormComponentProps.course) ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.title.edit", defaultMessage: "ui.courseForm.title.edit" })) : step === Course_1.SCCourseFormStepType.GENERAL ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.title.general", defaultMessage: "ui.courseForm.title.general" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.title.customization", defaultMessage: "ui.courseForm.title.customization", values: {
64
+ courseType: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${type}.title`, defaultMessage: `ui.courseForm.${type}.title` })
65
+ } })), open: open, onClose: onClose, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(CourseForm_1.default, Object.assign({}, CourseFormComponentProps, { onStepChange: handleStepTypeChange, onSuccess: handleSuccess })) })));
56
66
  }
57
67
  exports.default = CourseFormDialog;
package/lib/cjs/components/Courses/Courses.js CHANGED
@@ -105,12 +105,6 @@ function Courses(inProps) {
105
105
  const contentAvailability = react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY in preferences && preferences[react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY].value;
106
106
  const onlyStaffEnabled = (0, react_1.useMemo)(() => { var _a; return (_a = preferences[react_core_1.SCPreferences.CONFIGURATIONS_COURSES_ONLY_STAFF_ENABLED]) === null || _a === void 0 ? void 0 : _a.value; }, [preferences]);
107
107
  const canCreateCourse = (0, react_1.useMemo)(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_course; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
108
- const endpoint = (0, react_1.useMemo)(() => {
109
- if (showManagedCourses) {
110
- return api_services_1.Endpoints.GetJoinedCourses;
111
- }
112
- return api_services_1.Endpoints.SearchCourses;
113
- }, [showManagedCourses]);
114
108
  // CONST
115
109
  const authUserId = scUserContext.user ? scUserContext.user.id : null;
116
110
  const theme = (0, material_1.useTheme)();
@@ -130,8 +124,8 @@ function Courses(inProps) {
130
124
  const fetchCourses = () => {
131
125
  return api_services_1.http
132
126
  .request({
133
- url: endpoint.url({}),
134
- method: endpoint.method,
127
+ url: api_services_1.Endpoints.SearchCourses.url({}),
128
+ method: api_services_1.Endpoints.SearchCourses.method,
135
129
  params: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, endpointQueryParams), (_categories.length && { categories: JSON.stringify(_categories) })), (query && { search: query })), (showManagedCourses && { statuses: JSON.stringify(['creator', 'manager']) })), (showMine && { statuses: JSON.stringify(['joined', 'manager']) }))
136
130
  })
137
131
  .then((res) => {
@@ -183,7 +177,7 @@ function Courses(inProps) {
183
177
  return api_services_1.http
184
178
  .request({
185
179
  url: next,
186
- method: showManagedCourses ? api_services_1.Endpoints.GetJoinedCourses.method : api_services_1.Endpoints.SearchCourses.method
180
+ method: api_services_1.Endpoints.SearchCourses.method
187
181
  })
188
182
  .then((res) => {
189
183
  setCourses([...courses, ...res.data.results]);
package/lib/cjs/components/EditCourse/Lessons/SectionRow.js CHANGED
@@ -143,6 +143,6 @@ function SectionRow(props, ref) {
143
143
  ? api_services_1.Endpoints.CreateCourseSection.url({ id: course.id })
144
144
  : api_services_1.Endpoints.PatchCourseSection.url({ id: course.id, section_id: section.id }),
145
145
  method: isNewRow ? api_services_1.Endpoints.CreateCourseSection.method : api_services_1.Endpoints.PatchCourseSection.method
146
- }, row: section, isNewRow: isNewRow, handleManageRow: handleManageSection, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: classes.cellAlignCenter }, { children: (0, jsx_runtime_1.jsx)(LessonReleaseMenu_1.default, { course: course, section: section }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: classes.cellAlignRight }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionsWrapper }, { children: [(0, jsx_runtime_1.jsx)(AddButton_1.default, { label: "ui.editCourse.tab.lessons.table.lesson", handleAddRow: handleAddTempLesson, color: "primary", variant: "outlined", disabled: isDisabled }), (0, jsx_runtime_1.jsxs)(MenuRow_1.default, Object.assign({ disabled: isDisabled }, { children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: handleAbleEditMode }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.rename", defaultMessage: "ui.editCourse.tab.lessons.table.menu.rename" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: () => handleOpenDialog({ row: types_2.RowType.SECTION, section }) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.delete", defaultMessage: "ui.editCourse.tab.lessons.table.menu.delete" }) })) }))] }))] })) }))] })), (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: classes.tableBodyCollapseWrapper, colSpan: 4 }, { children: (0, jsx_runtime_1.jsx)(material_1.Collapse, Object.assign({ in: expand, timeout: "auto", unmountOnExit: true }, { children: (0, jsx_runtime_1.jsx)(dnd_1.DragDropContext, Object.assign({ onDragEnd: handleDragEnd }, { children: (0, jsx_runtime_1.jsx)(material_1.Table, { children: (0, jsx_runtime_1.jsx)(dnd_1.Droppable, Object.assign({ droppableId: "droppable-2" }, { children: (outerProvider) => ((0, jsx_runtime_1.jsxs)(material_1.TableBody, Object.assign({ ref: outerProvider.innerRef }, outerProvider.droppableProps, { children: [lessons.map((lesson, i, array) => ((0, jsx_runtime_1.jsx)(dnd_1.Draggable, Object.assign({ draggableId: i.toString(), index: i, isDragDisabled: isDisabled }, { children: (innerProvider) => ((0, jsx_runtime_1.jsx)(LessonRow_1.default, { provider: innerProvider, course: course, section: section, lesson: lesson, isNewRow: isNewLocalRow && i + 1 === array.length, handleManageLesson: handleManageLesson, handleOpenDialog: () => handleOpenDialog({ row: types_2.RowType.LESSON, section, lesson }), ref: innerRef }, i)) }), i))), outerProvider.placeholder] }))) })) }) })) })) })) })] }));
146
+ }, row: section, isNewRow: isNewRow, handleManageRow: handleManageSection, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), course.type !== types_1.SCCourseTypologyType.SELF && ((0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: classes.cellAlignCenter }, { children: (0, jsx_runtime_1.jsx)(LessonReleaseMenu_1.default, { course: course, section: section }) }))), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: classes.cellAlignRight }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionsWrapper }, { children: [(0, jsx_runtime_1.jsx)(AddButton_1.default, { label: "ui.editCourse.tab.lessons.table.lesson", handleAddRow: handleAddTempLesson, color: "primary", variant: "outlined", disabled: isDisabled }), (0, jsx_runtime_1.jsxs)(MenuRow_1.default, Object.assign({ disabled: isDisabled }, { children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: handleAbleEditMode }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.rename", defaultMessage: "ui.editCourse.tab.lessons.table.menu.rename" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: () => handleOpenDialog({ row: types_2.RowType.SECTION, section }) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.delete", defaultMessage: "ui.editCourse.tab.lessons.table.menu.delete" }) })) }))] }))] })) }))] })), (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: classes.tableBodyCollapseWrapper, colSpan: 4 }, { children: (0, jsx_runtime_1.jsx)(material_1.Collapse, Object.assign({ in: expand, timeout: "auto", unmountOnExit: true }, { children: (0, jsx_runtime_1.jsx)(dnd_1.DragDropContext, Object.assign({ onDragEnd: handleDragEnd }, { children: (0, jsx_runtime_1.jsx)(material_1.Table, { children: (0, jsx_runtime_1.jsx)(dnd_1.Droppable, Object.assign({ droppableId: "droppable-2" }, { children: (outerProvider) => ((0, jsx_runtime_1.jsxs)(material_1.TableBody, Object.assign({ ref: outerProvider.innerRef }, outerProvider.droppableProps, { children: [lessons.map((lesson, i, array) => ((0, jsx_runtime_1.jsx)(dnd_1.Draggable, Object.assign({ draggableId: i.toString(), index: i, isDragDisabled: isDisabled }, { children: (innerProvider) => ((0, jsx_runtime_1.jsx)(LessonRow_1.default, { provider: innerProvider, course: course, section: section, lesson: lesson, isNewRow: isNewLocalRow && i + 1 === array.length, handleManageLesson: handleManageLesson, handleOpenDialog: () => handleOpenDialog({ row: types_2.RowType.LESSON, section, lesson }), ref: innerRef }, i)) }), i))), outerProvider.placeholder] }))) })) }) })) })) })) })] }));
147
147
  }
148
148
  exports.default = (0, react_1.memo)((0, react_1.forwardRef)(SectionRow));
package/lib/cjs/components/EditCourse/Lessons.js CHANGED
@@ -6,6 +6,7 @@ const react_intl_1 = require("react-intl");
6
6
  const constants_1 = require("./constants");
7
7
  const react_1 = require("react");
8
8
  const dnd_1 = require("@hello-pangea/dnd");
9
+ const types_1 = require("@selfcommunity/types");
9
10
  const api_services_1 = require("@selfcommunity/api-services");
10
11
  const utils_1 = require("@selfcommunity/utils");
11
12
  const Errors_1 = require("../../constants/Errors");
@@ -15,7 +16,7 @@ const Status_1 = tslib_1.__importDefault(require("./Status"));
15
16
  const EmptyStatus_1 = tslib_1.__importDefault(require("../../shared/EmptyStatus"));
16
17
  const AddButton_1 = tslib_1.__importDefault(require("./Lessons/AddButton"));
17
18
  const SectionRow_1 = tslib_1.__importDefault(require("./Lessons/SectionRow"));
18
- const types_1 = require("./types");
19
+ const types_2 = require("./types");
19
20
  const hooks_1 = require("./hooks");
20
21
  const ConfirmDialog_1 = tslib_1.__importDefault(require("../../shared/ConfirmDialog/ConfirmDialog"));
21
22
  const CourseTypePopover_1 = tslib_1.__importDefault(require("../../shared/CourseTypePopover"));
@@ -39,20 +40,6 @@ const classes = {
39
40
  emptyStatusButton: `${constants_1.PREFIX}-empty-status-button`,
40
41
  contrastColor: `${constants_1.PREFIX}-contrast-color`
41
42
  };
42
- const headerCells = [
43
- {
44
- className: undefined,
45
- id: 'ui.editCourse.tab.lessons.table.header.lessonName'
46
- },
47
- {
48
- className: classes.cellAlignCenter,
49
- id: 'ui.editCourse.tab.lessons.table.header.calendar'
50
- },
51
- {
52
- className: classes.cellAlignRight,
53
- id: 'ui.editCourse.tab.lessons.table.header.actions'
54
- }
55
- ];
56
43
  function Lessons(props) {
57
44
  // PROPS
58
45
  const { course, setCourse, handleTabChange } = props;
@@ -73,6 +60,24 @@ function Lessons(props) {
73
60
  }, [course]);
74
61
  // MEMOS
75
62
  const isNewRow = (0, react_1.useMemo)(() => { var _a; return sections.length > ((_a = course.sections) === null || _a === void 0 ? void 0 : _a.length); }, [course, sections]);
63
+ const headerCells = (0, react_1.useMemo)(() => [
64
+ {
65
+ className: undefined,
66
+ id: 'ui.editCourse.tab.lessons.table.header.lessonName'
67
+ },
68
+ ...(course.type !== types_1.SCCourseTypologyType.SELF
69
+ ? [
70
+ {
71
+ className: classes.cellAlignCenter,
72
+ id: 'ui.editCourse.tab.lessons.table.header.calendar'
73
+ }
74
+ ]
75
+ : []),
76
+ {
77
+ className: classes.cellAlignRight,
78
+ id: 'ui.editCourse.tab.lessons.table.header.actions'
79
+ }
80
+ ], [course]);
76
81
  // FUNCTIONS
77
82
  const getSection = (0, react_1.useCallback)((id) => {
78
83
  return {
@@ -112,12 +117,12 @@ function Lessons(props) {
112
117
  }, [setSections]);
113
118
  const handleManageSection = (0, react_1.useCallback)((section, type, newRow = false) => {
114
119
  switch (type) {
115
- case types_1.ActionLessonType.ADD: {
120
+ case types_2.ActionLessonType.ADD: {
116
121
  const newSection = Object.assign(Object.assign({}, section), { lessons: [] });
117
122
  setCourse(Object.assign(Object.assign({}, course), { num_sections: course.num_sections + 1, sections: [...course.sections, newSection] }));
118
123
  break;
119
124
  }
120
- case types_1.ActionLessonType.RENAME:
125
+ case types_2.ActionLessonType.RENAME:
121
126
  setCourse(Object.assign(Object.assign({}, course), { sections: course.sections.map((prevSection) => {
122
127
  if (prevSection.id === section.id) {
123
128
  return Object.assign(Object.assign({}, prevSection), { name: section.name });
@@ -125,7 +130,7 @@ function Lessons(props) {
125
130
  return prevSection;
126
131
  }) }));
127
132
  break;
128
- case types_1.ActionLessonType.DELETE: {
133
+ case types_2.ActionLessonType.DELETE: {
129
134
  if (newRow) {
130
135
  setCourse(Object.assign(Object.assign({}, course), { sections: course.sections.filter((prevSection) => prevSection.id !== section.id) }));
131
136
  }
@@ -134,7 +139,7 @@ function Lessons(props) {
134
139
  }
135
140
  break;
136
141
  }
137
- case types_1.ActionLessonType.UPDATE:
142
+ case types_2.ActionLessonType.UPDATE:
138
143
  setCourse(Object.assign(Object.assign({}, course), { sections: course.sections.map((prevSection) => {
139
144
  if (prevSection.id === section.id) {
140
145
  return Object.assign(Object.assign({}, prevSection), { lessons: section.lessons });
@@ -142,7 +147,7 @@ function Lessons(props) {
142
147
  return prevSection;
143
148
  }) }));
144
149
  break;
145
- case type.endsWith(types_1.ActionLessonType.UPDATE) && type: {
150
+ case type.endsWith(types_2.ActionLessonType.UPDATE) && type: {
146
151
  if (newRow) {
147
152
  setCourse(Object.assign(Object.assign({}, course), { sections: course.sections.map((prevSection) => {
148
153
  if (prevSection.id === section.id) {
@@ -153,10 +158,10 @@ function Lessons(props) {
153
158
  }
154
159
  else {
155
160
  let numLessons = course.num_lessons;
156
- if (type === types_1.ActionLessonType.ADD_UPDATE) {
161
+ if (type === types_2.ActionLessonType.ADD_UPDATE) {
157
162
  numLessons = course.num_lessons + 1;
158
163
  }
159
- else if (type === types_1.ActionLessonType.DELETE_UPDATE) {
164
+ else if (type === types_2.ActionLessonType.DELETE_UPDATE) {
160
165
  numLessons = course.num_lessons - 1;
161
166
  }
162
167
  setCourse(Object.assign(Object.assign({}, course), { num_lessons: numLessons, sections: course.sections.map((prevSection) => {
@@ -174,10 +179,10 @@ function Lessons(props) {
174
179
  }, [setDialog]);
175
180
  const handleDeleteRow = (0, react_1.useCallback)(() => {
176
181
  switch (dialog.row) {
177
- case types_1.RowType.SECTION:
182
+ case types_2.RowType.SECTION:
178
183
  ref.current.handleDeleteSection(dialog.section);
179
184
  break;
180
- case types_1.RowType.LESSON:
185
+ case types_2.RowType.LESSON:
181
186
  ref.current.handleDeleteLesson(dialog.section, dialog.lesson);
182
187
  }
183
188
  handleOpenDialog(null);
package/lib/esm/components/Course/Course.js CHANGED
@@ -158,7 +158,7 @@ export default function Course(inProps) {
158
158
  to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
159
159
  }), { children: _jsx(UserAvatar, Object.assign({ hide: !((_b = scCourse.created_by) === null || _b === void 0 ? void 0 : _b.community_badge), smaller: true }, { children: _jsx(Avatar, { alt: scCourse.name, src: (_c = scCourse.created_by) === null || _c === void 0 ? void 0 : _c.avatar, className: classes.previewAvatar }) })) }))] })), _jsxs(CardContent, Object.assign({ className: classes.previewContent }, { children: [_jsx(Link, Object.assign({ className: classes.previewCreator }, (!((_d = scCourse.created_by) === null || _d === void 0 ? void 0 : _d.deleted) && {
160
160
  to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
161
- }), { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: (_e = scCourse.created_by) === null || _e === void 0 ? void 0 : _e.username })) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse), className: classes.previewNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h6", className: classes.previewName }, { children: scCourse.name })) })), _jsxs(Typography, Object.assign({ className: classes.previewInfo }, { children: [_jsx(FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), "-", _jsx(FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })), _jsx(Box, Object.assign({ className: classes.previewCategory }, { children: scCourse.categories.map((category) => (_jsx(Chip, { size: "small", label: category.name }, category.id))) })), _jsx(Box, Object.assign({ className: classes.previewProgress }, { children: renderProgress() }))] })), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, Object.assign({ className: classes.previewActions }, { children: _jsx(Button, Object.assign({ variant: "outlined", size: "small", component: Link, to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) })) })))] })));
161
+ }), { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: (_e = scCourse.created_by) === null || _e === void 0 ? void 0 : _e.username })) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse), className: classes.previewNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h6", className: classes.previewName }, { children: scCourse.name })) })), _jsxs(Typography, Object.assign({ className: classes.previewInfo }, { children: [_jsx(FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), ' - ', _jsx(FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })), _jsx(Box, Object.assign({ className: classes.previewCategory }, { children: scCourse.categories.map((category) => (_jsx(Chip, { size: "small", label: category.name }, category.id))) })), _jsx(Box, Object.assign({ className: classes.previewProgress }, { children: renderProgress() }))] })), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, Object.assign({ className: classes.previewActions }, { children: _jsx(Button, Object.assign({ variant: "outlined", size: "small", component: Link, to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) })) })))] })));
162
162
  }
163
163
  else {
164
164
  contentObj = (_jsx(SnippetRoot, { ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse) }, elevation: 0, className: classes.snippetRoot, image: _jsxs(Box, Object.assign({ className: classes.snippetImage }, { children: [_jsx(Avatar, { variant: "square", alt: scCourse.name, src: scCourse.image_medium, className: userProfileSnippet ? classes.snippetAvatarUserProfile : classes.snippetAvatar }), !userProfileSnippet &&
@@ -170,7 +170,7 @@ export default function Course(inProps) {
170
170
  ? 'warning'
171
171
  : 'secondary', label: chipLabel, className: classes.chip }))] })), primary: _jsxs(_Fragment, { children: [!userProfileSnippet && (_jsx(Link, Object.assign({}, (!((_f = scCourse.created_by) === null || _f === void 0 ? void 0 : _f.deleted) && {
172
172
  to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
173
- }), { children: _jsx(Typography, Object.assign({ component: "span" }, { children: (_g = scCourse.created_by) === null || _g === void 0 ? void 0 : _g.username })) }))), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: scCourse.name })) }))] }), secondary: _jsx(_Fragment, { children: userProfileSnippet ? (_jsx(_Fragment, { children: !scCourse.hide_member_count && (_jsx(FormattedMessage, { id: "ui.course.userProfileSnippet.students", defaultMessage: "ui.course.userProfileSnippet.students", values: { students: scCourse.member_count } })) })) : (_jsxs(_Fragment, { children: [_jsx(FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), "-", _jsx(FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })) }), actions: actions !== null && actions !== void 0 ? actions : (_jsx(Button, Object.assign({ size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) }))) }));
173
+ }), { children: _jsx(Typography, Object.assign({ component: "span" }, { children: (_g = scCourse.created_by) === null || _g === void 0 ? void 0 : _g.username })) }))), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: scCourse.name })) }))] }), secondary: _jsx(_Fragment, { children: userProfileSnippet ? (_jsx(_Fragment, { children: !scCourse.hide_member_count && (_jsx(FormattedMessage, { id: "ui.course.userProfileSnippet.students", defaultMessage: "ui.course.userProfileSnippet.students", values: { students: scCourse.member_count } })) })) : (_jsxs(_Fragment, { children: [_jsx(FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), ' - ', _jsx(FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })) }), actions: actions !== null && actions !== void 0 ? actions : (_jsx(Button, Object.assign({ size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) }))) }));
174
174
  }
175
175
  /**
176
176
  * Renders root object
package/lib/esm/components/CourseForm/CourseForm.d.ts CHANGED
@@ -22,6 +22,11 @@ export interface CourseFormProps extends BoxProps {
22
22
  * @default `SCCourseFormStepType.GENERAL`
23
23
  */
24
24
  step?: SCCourseFormStepType;
25
+ /**
26
+ * On step change callback function
27
+ * @default null
28
+ */
29
+ onStepChange?: (step: SCCourseFormStepType, type: SCCourseType) => void;
25
30
  /**
26
31
  * On error callback function
27
32
  * @default null
package/lib/esm/components/CourseForm/CourseForm.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { __rest } from "tslib";
2
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { LoadingButton } from '@mui/lab';
4
- import { Box, CardActionArea, Card, CardContent, FormGroup, Paper, TextField, Typography } from '@mui/material';
4
+ import { Box, CardActionArea, Card, CardContent, FormGroup, Paper, TextField, Typography, Chip } from '@mui/material';
5
5
  import { styled } from '@mui/material/styles';
6
6
  import { useThemeProps } from '@mui/system';
7
7
  import { CourseService, formatHttpErrorCode } from '@selfcommunity/api-services';
@@ -10,7 +10,7 @@ import { SCCoursePrivacyType, SCCourseTypologyType } from '@selfcommunity/types'
10
10
  import { Logger } from '@selfcommunity/utils';
11
11
  import classNames from 'classnames';
12
12
  import PubSub from 'pubsub-js';
13
- import { Fragment, useCallback, useState } from 'react';
13
+ import { Fragment, useCallback, useMemo, useState } from 'react';
14
14
  import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
15
15
  import { SCOPE_SC_UI } from '../../constants/Errors';
16
16
  import { SCCourseEventType, SCTopicType } from '../../constants/PubSub';
@@ -52,8 +52,11 @@ const classes = {
52
52
  privacySection: `${PREFIX}-privacy-section`,
53
53
  privacySectionInfo: `${PREFIX}-privacy-section-info`,
54
54
  selected: `${PREFIX}-selected`,
55
+ disabled: `${PREFIX}-disabled`,
55
56
  stepOne: `${PREFIX}-step-one`,
56
57
  stepTwo: `${PREFIX}-step-two`,
58
+ stepCustomization: `${PREFIX}-step-customization`,
59
+ cardTitle: `${PREFIX}-card-title`,
57
60
  title: `${PREFIX}-title`,
58
61
  contrastColor: `${PREFIX}-contrast-color`
59
62
  };
@@ -102,7 +105,7 @@ export default function CourseForm(inProps) {
102
105
  props: inProps,
103
106
  name: PREFIX
104
107
  });
105
- const { className, onSuccess, onError, course = null, step = SCCourseFormStepType.GENERAL } = props, rest = __rest(props, ["className", "onSuccess", "onError", "course", "step"]);
108
+ const { className, onSuccess, onError, course = null, step = SCCourseFormStepType.GENERAL, onStepChange } = props, rest = __rest(props, ["className", "onSuccess", "onError", "course", "step", "onStepChange"]);
106
109
  // INTL
107
110
  const intl = useIntl();
108
111
  const initialFieldState = {
@@ -121,10 +124,11 @@ export default function CourseForm(inProps) {
121
124
  const [error, setError] = useState({});
122
125
  const [openDialog, setOpenDialog] = useState(false);
123
126
  // PREFERENCES
124
- const scPreferences = useSCPreferences();
127
+ const { preferences } = useSCPreferences();
128
+ const courseAdvancedEnabled = useMemo(() => preferences[SCPreferences.CONFIGURATIONS_COURSES_ADVANCED_ENABLED].value, [preferences]);
125
129
  const _backgroundCover = Object.assign({}, (field.imageOriginal
126
130
  ? { background: `url('${field.imageOriginal}') center / cover` }
127
- : { background: `url('${scPreferences.preferences[SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
131
+ : { background: `url('${preferences[SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
128
132
  const handleChangeCover = useCallback((cover) => {
129
133
  setField((prev) => (Object.assign(Object.assign({}, prev), { ['imageOriginalFile']: cover })));
130
134
  const reader = new FileReader();
@@ -143,6 +147,7 @@ export default function CourseForm(inProps) {
143
147
  */
144
148
  const handleChangeStep = (newStep) => {
145
149
  setStep(newStep);
150
+ onStepChange(newStep, field.type);
146
151
  };
147
152
  /**
148
153
  * Formats categories object to a specific format needed in the form body
@@ -247,11 +252,11 @@ export default function CourseForm(inProps) {
247
252
  /**
248
253
  * Renders root object
249
254
  */
250
- return (_jsxs(Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(Box, Object.assign({ className: _step === SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === SCCourseFormStepType.GENERAL && (_jsx(_Fragment, { children: Object.values(SCCourseTypologyType).map((option, index) => (_jsx(Card, Object.assign({ className: classNames(classes.card, { [classes.selected]: option === field.type }) }, { children: _jsx(CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: _jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }) })), _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === SCCourseFormStepType.CUSTOMIZATION && (_jsxs(Fragment, { children: [course && (_jsx(Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: _jsx(FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), _jsxs(FormGroup, Object.assign({ className: classes.form }, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(UploadCourseCover, { isUploading: field.isSubmitting, onChange: handleChangeCover }) })), _jsx(TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
255
+ return (_jsxs(Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(Box, Object.assign({ className: _step === SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === SCCourseFormStepType.GENERAL && (_jsx(Fragment, { children: Object.values(SCCourseTypologyType).map((option, index) => (_jsx(Card, Object.assign({ className: classNames(classes.card, { [classes.selected]: option === field.type }, { [classes.disabled]: !courseAdvancedEnabled && option !== SCCourseTypologyType.SELF }) }, { children: _jsx(CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: _jsxs(CardContent, { children: [_jsxs(Typography, Object.assign({ variant: "subtitle2", className: classes.cardTitle }, { children: [_jsx(FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }), !courseAdvancedEnabled && option !== SCCourseTypologyType.SELF && (_jsx(Chip, { variant: "outlined", color: "warning", size: "small", label: _jsx(FormattedMessage, { id: "ui.courseForm.comingSoon.chip", defaultMessage: "ui.courseForm.comingSoon.chip" }) }))] })), _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === SCCourseFormStepType.CUSTOMIZATION && (_jsxs(Fragment, { children: [course && (_jsx(Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: _jsx(FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), _jsxs(FormGroup, Object.assign({ className: classNames(classes.form, _step === SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(UploadCourseCover, { isUploading: field.isSubmitting, onChange: handleChangeCover }) })), _jsx(TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
251
256
  endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: COURSE_TITLE_MAX_LENGTH - field.name.length }))
252
257
  }, error: Boolean(field.name.length > COURSE_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > COURSE_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.courseForm.name.error.maxLength", defaultMessage: "ui.courseForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), _jsx(TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
253
258
  endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_a = field.description) === null || _a === void 0 ? void 0 : _a.length) ? COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : COURSE_DESCRIPTION_MAX_LENGTH })))
254
- }, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > COURSE_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > COURSE_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" })) : null }), _jsx(CategoryAutocomplete, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && _jsx(CourseEdit, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) })] }))] })), _jsx(Box, Object.assign({ className: classes.actions }, { children: _jsx(LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === SCCourseFormStepType.GENERAL
259
+ }, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > COURSE_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > COURSE_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" })) : null }), _jsx(CategoryAutocomplete, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && _jsx(CourseEdit, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) })] }))] })), _jsx(Box, Object.assign({ className: classNames(classes.actions, _step === SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: _jsx(LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === SCCourseFormStepType.GENERAL
255
260
  ? !field.type || Object.keys(error).length !== 0
256
261
  : _step === SCCourseFormStepType.CUSTOMIZATION &&
257
262
  (!field.name ||
package/lib/esm/components/CourseFormDialog/CourseFormDialog.js CHANGED
@@ -7,7 +7,7 @@ import { FormattedMessage } from 'react-intl';
7
7
  import BaseDialog from '../../shared/BaseDialog';
8
8
  import { PREFIX } from './constants';
9
9
  import CourseForm from '../CourseForm';
10
- import { useCallback } from 'react';
10
+ import { useCallback, useState } from 'react';
11
11
  import { SCCourseFormStepType } from '../../constants/Course';
12
12
  const classes = {
13
13
  root: `${PREFIX}-root`
@@ -41,7 +41,15 @@ export default function CourseFormDialog(inProps) {
41
41
  props: inProps,
42
42
  name: PREFIX
43
43
  });
44
- const { className, open = true, onClose, CourseFormComponentProps = { step: SCCourseFormStepType.GENERAL } } = props, rest = __rest(props, ["className", "open", "onClose", "CourseFormComponentProps"]);
44
+ const { className, open = true, onClose, CourseFormComponentProps = {} } = props, rest = __rest(props, ["className", "open", "onClose", "CourseFormComponentProps"]);
45
+ // STATE
46
+ const [step, setStep] = useState(SCCourseFormStepType.GENERAL);
47
+ const [type, setType] = useState('');
48
+ //HANDLERS
49
+ const handleStepTypeChange = (step, type) => {
50
+ setStep(step);
51
+ setType(type);
52
+ };
45
53
  const handleSuccess = useCallback((course) => {
46
54
  var _a;
47
55
  (_a = CourseFormComponentProps.onSuccess) === null || _a === void 0 ? void 0 : _a.call(CourseFormComponentProps, course);
@@ -50,5 +58,7 @@ export default function CourseFormDialog(inProps) {
50
58
  /**
51
59
  * Renders root object
52
60
  */
53
- return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, title: (CourseFormComponentProps === null || CourseFormComponentProps === void 0 ? void 0 : CourseFormComponentProps.course) ? (_jsx(FormattedMessage, { id: "ui.courseForm.title.edit", defaultMessage: "ui.courseForm.title.edit" })) : (_jsx(FormattedMessage, { id: `ui.courseForm.title.${CourseFormComponentProps.step}`, defaultMessage: `ui.courseForm.title.${CourseFormComponentProps.step}` })), open: open, onClose: onClose, className: classNames(classes.root, className) }, rest, { children: _jsx(CourseForm, Object.assign({}, CourseFormComponentProps, { onSuccess: handleSuccess })) })));
61
+ return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, title: (CourseFormComponentProps === null || CourseFormComponentProps === void 0 ? void 0 : CourseFormComponentProps.course) ? (_jsx(FormattedMessage, { id: "ui.courseForm.title.edit", defaultMessage: "ui.courseForm.title.edit" })) : step === SCCourseFormStepType.GENERAL ? (_jsx(FormattedMessage, { id: "ui.courseForm.title.general", defaultMessage: "ui.courseForm.title.general" })) : (_jsx(FormattedMessage, { id: "ui.courseForm.title.customization", defaultMessage: "ui.courseForm.title.customization", values: {
62
+ courseType: _jsx(FormattedMessage, { id: `ui.courseForm.${type}.title`, defaultMessage: `ui.courseForm.${type}.title` })
63
+ } })), open: open, onClose: onClose, className: classNames(classes.root, className) }, rest, { children: _jsx(CourseForm, Object.assign({}, CourseFormComponentProps, { onStepChange: handleStepTypeChange, onSuccess: handleSuccess })) })));
54
64
  }
package/lib/esm/components/Courses/Courses.js CHANGED
@@ -102,12 +102,6 @@ export default function Courses(inProps) {
102
102
  const contentAvailability = SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY in preferences && preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY].value;
103
103
  const onlyStaffEnabled = useMemo(() => { var _a; return (_a = preferences[SCPreferences.CONFIGURATIONS_COURSES_ONLY_STAFF_ENABLED]) === null || _a === void 0 ? void 0 : _a.value; }, [preferences]);
104
104
  const canCreateCourse = useMemo(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_course; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
105
- const endpoint = useMemo(() => {
106
- if (showManagedCourses) {
107
- return Endpoints.GetJoinedCourses;
108
- }
109
- return Endpoints.SearchCourses;
110
- }, [showManagedCourses]);
111
105
  // CONST
112
106
  const authUserId = scUserContext.user ? scUserContext.user.id : null;
113
107
  const theme = useTheme();
@@ -127,8 +121,8 @@ export default function Courses(inProps) {
127
121
  const fetchCourses = () => {
128
122
  return http
129
123
  .request({
130
- url: endpoint.url({}),
131
- method: endpoint.method,
124
+ url: Endpoints.SearchCourses.url({}),
125
+ method: Endpoints.SearchCourses.method,
132
126
  params: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, endpointQueryParams), (_categories.length && { categories: JSON.stringify(_categories) })), (query && { search: query })), (showManagedCourses && { statuses: JSON.stringify(['creator', 'manager']) })), (showMine && { statuses: JSON.stringify(['joined', 'manager']) }))
133
127
  })
134
128
  .then((res) => {
@@ -180,7 +174,7 @@ export default function Courses(inProps) {
180
174
  return http
181
175
  .request({
182
176
  url: next,
183
- method: showManagedCourses ? Endpoints.GetJoinedCourses.method : Endpoints.SearchCourses.method
177
+ method: Endpoints.SearchCourses.method
184
178
  })
185
179
  .then((res) => {
186
180
  setCourses([...courses, ...res.data.results]);
package/lib/esm/components/EditCourse/Lessons/SectionRow.js CHANGED
@@ -13,7 +13,7 @@ import { Logger } from '@selfcommunity/utils';
13
13
  import { SCOPE_SC_UI } from '../../../constants/Errors';
14
14
  import { useSnackbar } from 'notistack';
15
15
  import LessonReleaseMenu from '../../LessonReleaseMenu';
16
- import { SCCourseLessonTypologyType } from '@selfcommunity/types';
16
+ import { SCCourseLessonTypologyType, SCCourseTypologyType } from '@selfcommunity/types';
17
17
  import { CourseService, Endpoints } from '@selfcommunity/api-services';
18
18
  import { ActionLessonType, RowType } from '../types';
19
19
  import { useIsDisabled } from '../hooks';
@@ -140,6 +140,6 @@ function SectionRow(props, ref) {
140
140
  ? Endpoints.CreateCourseSection.url({ id: course.id })
141
141
  : Endpoints.PatchCourseSection.url({ id: course.id, section_id: section.id }),
142
142
  method: isNewRow ? Endpoints.CreateCourseSection.method : Endpoints.PatchCourseSection.method
143
- }, row: section, isNewRow: isNewRow, handleManageRow: handleManageSection, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), _jsx(TableCell, Object.assign({ className: classes.cellAlignCenter }, { children: _jsx(LessonReleaseMenu, { course: course, section: section }) })), _jsx(TableCell, Object.assign({ className: classes.cellAlignRight }, { children: _jsxs(Stack, Object.assign({ className: classes.actionsWrapper }, { children: [_jsx(AddButton, { label: "ui.editCourse.tab.lessons.table.lesson", handleAddRow: handleAddTempLesson, color: "primary", variant: "outlined", disabled: isDisabled }), _jsxs(MenuRow, Object.assign({ disabled: isDisabled }, { children: [_jsx(MenuItem, Object.assign({ onClick: handleAbleEditMode }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.rename", defaultMessage: "ui.editCourse.tab.lessons.table.menu.rename" }) })) })), _jsx(MenuItem, Object.assign({ onClick: () => handleOpenDialog({ row: RowType.SECTION, section }) }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.delete", defaultMessage: "ui.editCourse.tab.lessons.table.menu.delete" }) })) }))] }))] })) }))] })), _jsx(TableRow, { children: _jsx(TableCell, Object.assign({ className: classes.tableBodyCollapseWrapper, colSpan: 4 }, { children: _jsx(Collapse, Object.assign({ in: expand, timeout: "auto", unmountOnExit: true }, { children: _jsx(DragDropContext, Object.assign({ onDragEnd: handleDragEnd }, { children: _jsx(Table, { children: _jsx(Droppable, Object.assign({ droppableId: "droppable-2" }, { children: (outerProvider) => (_jsxs(TableBody, Object.assign({ ref: outerProvider.innerRef }, outerProvider.droppableProps, { children: [lessons.map((lesson, i, array) => (_jsx(Draggable, Object.assign({ draggableId: i.toString(), index: i, isDragDisabled: isDisabled }, { children: (innerProvider) => (_jsx(LessonRow, { provider: innerProvider, course: course, section: section, lesson: lesson, isNewRow: isNewLocalRow && i + 1 === array.length, handleManageLesson: handleManageLesson, handleOpenDialog: () => handleOpenDialog({ row: RowType.LESSON, section, lesson }), ref: innerRef }, i)) }), i))), outerProvider.placeholder] }))) })) }) })) })) })) })] }));
143
+ }, row: section, isNewRow: isNewRow, handleManageRow: handleManageSection, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), course.type !== SCCourseTypologyType.SELF && (_jsx(TableCell, Object.assign({ className: classes.cellAlignCenter }, { children: _jsx(LessonReleaseMenu, { course: course, section: section }) }))), _jsx(TableCell, Object.assign({ className: classes.cellAlignRight }, { children: _jsxs(Stack, Object.assign({ className: classes.actionsWrapper }, { children: [_jsx(AddButton, { label: "ui.editCourse.tab.lessons.table.lesson", handleAddRow: handleAddTempLesson, color: "primary", variant: "outlined", disabled: isDisabled }), _jsxs(MenuRow, Object.assign({ disabled: isDisabled }, { children: [_jsx(MenuItem, Object.assign({ onClick: handleAbleEditMode }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.rename", defaultMessage: "ui.editCourse.tab.lessons.table.menu.rename" }) })) })), _jsx(MenuItem, Object.assign({ onClick: () => handleOpenDialog({ row: RowType.SECTION, section }) }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.delete", defaultMessage: "ui.editCourse.tab.lessons.table.menu.delete" }) })) }))] }))] })) }))] })), _jsx(TableRow, { children: _jsx(TableCell, Object.assign({ className: classes.tableBodyCollapseWrapper, colSpan: 4 }, { children: _jsx(Collapse, Object.assign({ in: expand, timeout: "auto", unmountOnExit: true }, { children: _jsx(DragDropContext, Object.assign({ onDragEnd: handleDragEnd }, { children: _jsx(Table, { children: _jsx(Droppable, Object.assign({ droppableId: "droppable-2" }, { children: (outerProvider) => (_jsxs(TableBody, Object.assign({ ref: outerProvider.innerRef }, outerProvider.droppableProps, { children: [lessons.map((lesson, i, array) => (_jsx(Draggable, Object.assign({ draggableId: i.toString(), index: i, isDragDisabled: isDisabled }, { children: (innerProvider) => (_jsx(LessonRow, { provider: innerProvider, course: course, section: section, lesson: lesson, isNewRow: isNewLocalRow && i + 1 === array.length, handleManageLesson: handleManageLesson, handleOpenDialog: () => handleOpenDialog({ row: RowType.LESSON, section, lesson }), ref: innerRef }, i)) }), i))), outerProvider.placeholder] }))) })) }) })) })) })) })] }));
144
144
  }
145
145
  export default memo(forwardRef(SectionRow));