@selfcommunity/react-ui 1.2.0-alpha.3 → 1.2.0-alpha.5
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/CategoryAutocomplete/CategoryAutocomplete.js +6 -5
- package/lib/cjs/components/CourseDashboard/Header.d.ts +2 -2
- package/lib/cjs/components/CourseDashboard/Header.js +4 -10
- package/lib/cjs/components/CourseDashboard/Student/ActionButton.js +6 -2
- package/lib/cjs/components/CourseDashboard/Student.js +6 -5
- package/lib/cjs/components/CourseDashboard/Teacher/Comments.js +3 -3
- package/lib/cjs/components/CourseDashboard/Teacher/Info.js +2 -2
- package/lib/cjs/components/CourseDashboard/Teacher.js +2 -2
- package/lib/cjs/components/CourseForm/CourseForm.js +11 -6
- package/lib/cjs/components/CourseForm/Edit.js +4 -4
- package/lib/cjs/components/CourseParticipantsButton/CourseParticipantsButton.js +3 -2
- package/lib/cjs/components/EditCourse/EditCourse.js +2 -2
- package/lib/cjs/components/EditCourse/Lessons/ChangeLessonStatus.js +10 -5
- package/lib/cjs/components/EditCourse/Lessons/FieldName.js +2 -2
- package/lib/cjs/components/EditCourse/Lessons/LessonRow.js +3 -3
- package/lib/cjs/components/EditCourse/Lessons/SectionRow.js +3 -3
- package/lib/cjs/components/EditCourse/Lessons.js +5 -4
- package/lib/cjs/components/EditCourse/Options/Skeleton.js +2 -2
- package/lib/cjs/components/EditCourse/Options/SwitchForm.js +2 -2
- package/lib/cjs/components/EditCourse/Options.js +2 -2
- package/lib/cjs/components/EditCourse/Status.js +3 -5
- package/lib/cjs/components/EditCourse/Users.js +2 -2
- package/lib/cjs/components/FeedObject/Contributors/Contributors.js +1 -1
- package/lib/cjs/components/PaywallsConfigurator/PaywallsConfigurator.js +1 -1
- package/lib/cjs/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js +2 -1
- package/lib/cjs/components/User/User.js +2 -2
- package/lib/cjs/shared/AccordionLessons/AccordionLessons.js +4 -4
- package/lib/cjs/shared/AddUsersButton/AddUsersButton.js +14 -6
- package/lib/cjs/shared/ConfirmDialog/ConfirmDialog.js +11 -7
- package/lib/cjs/shared/CourseUsersTable/ChangeUsersStatus.js +3 -5
- package/lib/cjs/shared/CourseUsersTable/CourseUsersTable.js +6 -4
- package/lib/cjs/shared/CourseUsersTable/SeeProgressButton.js +4 -3
- package/lib/cjs/types/course.d.ts +5 -0
- package/lib/cjs/utils/course.d.ts +2 -1
- package/lib/cjs/utils/course.js +9 -1
- package/lib/esm/components/CategoryAutocomplete/CategoryAutocomplete.js +7 -6
- package/lib/esm/components/CourseDashboard/Header.d.ts +2 -2
- package/lib/esm/components/CourseDashboard/Header.js +4 -10
- package/lib/esm/components/CourseDashboard/Student/ActionButton.js +6 -2
- package/lib/esm/components/CourseDashboard/Student.js +6 -5
- package/lib/esm/components/CourseDashboard/Teacher/Comments.js +3 -3
- package/lib/esm/components/CourseDashboard/Teacher/Info.js +2 -2
- package/lib/esm/components/CourseDashboard/Teacher.js +2 -2
- package/lib/esm/components/CourseForm/CourseForm.js +12 -7
- package/lib/esm/components/CourseForm/Edit.js +4 -4
- package/lib/esm/components/CourseParticipantsButton/CourseParticipantsButton.js +3 -2
- package/lib/esm/components/EditCourse/EditCourse.js +2 -2
- package/lib/esm/components/EditCourse/Lessons/ChangeLessonStatus.js +10 -5
- package/lib/esm/components/EditCourse/Lessons/FieldName.js +2 -2
- package/lib/esm/components/EditCourse/Lessons/LessonRow.js +4 -4
- package/lib/esm/components/EditCourse/Lessons/SectionRow.js +4 -4
- package/lib/esm/components/EditCourse/Lessons.js +5 -4
- package/lib/esm/components/EditCourse/Options/Skeleton.js +3 -3
- package/lib/esm/components/EditCourse/Options/SwitchForm.js +2 -2
- package/lib/esm/components/EditCourse/Options.js +2 -2
- package/lib/esm/components/EditCourse/Status.js +3 -4
- package/lib/esm/components/EditCourse/Users.js +2 -2
- package/lib/esm/components/FeedObject/Contributors/Contributors.js +1 -1
- package/lib/esm/components/PaywallsConfigurator/PaywallsConfigurator.js +1 -1
- package/lib/esm/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js +2 -1
- package/lib/esm/components/User/User.js +3 -3
- package/lib/esm/shared/AccordionLessons/AccordionLessons.js +4 -4
- package/lib/esm/shared/AddUsersButton/AddUsersButton.js +15 -7
- package/lib/esm/shared/ConfirmDialog/ConfirmDialog.js +12 -8
- package/lib/esm/shared/CourseUsersTable/ChangeUsersStatus.js +4 -6
- package/lib/esm/shared/CourseUsersTable/CourseUsersTable.js +7 -5
- package/lib/esm/shared/CourseUsersTable/SeeProgressButton.js +4 -3
- package/lib/esm/types/course.d.ts +5 -0
- package/lib/esm/utils/course.d.ts +2 -1
- package/lib/esm/utils/course.js +7 -0
- package/lib/umd/react-ui.js +1 -1
- package/package.json +5 -5
|
@@ -12,7 +12,7 @@ const system_1 = require("@mui/system");
|
|
|
12
12
|
const constants_1 = require("./constants");
|
|
13
13
|
const classes = {
|
|
14
14
|
root: `${constants_1.PREFIX}-root`,
|
|
15
|
-
|
|
15
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
|
|
16
16
|
};
|
|
17
17
|
const Root = (0, material_1.styled)(material_1.Autocomplete, {
|
|
18
18
|
name: constants_1.PREFIX,
|
|
@@ -56,6 +56,7 @@ const CategoryAutocomplete = (inProps) => {
|
|
|
56
56
|
const [value, setValue] = (0, react_1.useState)(typeof defaultValue === 'string' ? null : defaultValue);
|
|
57
57
|
// HOOKS
|
|
58
58
|
const { categories, isLoading } = (0, react_core_1.useSCFetchCategories)({ endpointQueryParams });
|
|
59
|
+
const theme = (0, material_1.useTheme)();
|
|
59
60
|
(0, react_1.useEffect)(() => {
|
|
60
61
|
onChange === null || onChange === void 0 ? void 0 : onChange(value);
|
|
61
62
|
}, [value]);
|
|
@@ -84,19 +85,19 @@ const CategoryAutocomplete = (inProps) => {
|
|
|
84
85
|
onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
|
|
85
86
|
};
|
|
86
87
|
// Render
|
|
87
|
-
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root, multiple: multiple, open: open, onOpen: handleOpen, onClose: handleClose, filterSelectedOptions: !checkboxSelect, disableCloseOnSelect: checkboxSelect, options: categories || [], getOptionLabel: (option) => option.name || '', value: value, selectOnFocus: true, clearOnBlur: true, blurOnSelect: true, handleHomeEndKeys: true, clearIcon: null, disabled: disabled || isLoading, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryAutocomplete.empty", defaultMessage: "ui.categoryAutocomplete.empty" }), onChange: handleChange, isOptionEqualToValue: (option, value) => value.id === option.id, renderValue: (value, getItemProps) => {
|
|
88
|
+
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root, multiple: multiple, open: open, onOpen: handleOpen, onClose: handleClose, filterSelectedOptions: !checkboxSelect, disableCloseOnSelect: checkboxSelect, options: categories || [], getOptionLabel: (option) => option.name || '', value: value, selectOnFocus: true, clearOnBlur: true, blurOnSelect: true, handleHomeEndKeys: true, clearIcon: null, disabled: disabled || isLoading, noOptionsText: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryAutocomplete.empty", defaultMessage: "ui.categoryAutocomplete.empty" }) })), onChange: handleChange, isOptionEqualToValue: (option, value) => value.id === option.id, renderValue: (value, getItemProps) => {
|
|
88
89
|
if (multiple) {
|
|
89
90
|
return value.map((option, index) => {
|
|
90
91
|
const _a = getItemProps({ index }), { key } = _a, rest = tslib_1.__rest(_a, ["key"]);
|
|
91
|
-
return ((0, jsx_runtime_1.jsx)(material_1.Chip, Object.assign({ id: option.id, label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.
|
|
92
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Chip, Object.assign({ id: option.id, label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.paperContrastColor }, { children: option.name })), color: option.color }, rest), key));
|
|
92
93
|
});
|
|
93
94
|
}
|
|
94
|
-
return ((0, jsx_runtime_1.jsx)(material_1.Chip, Object.assign({ id: value.id, label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.
|
|
95
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Chip, Object.assign({ id: value.id, label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.paperContrastColor }, { children: value.name })), color: value.color }, getItemProps)));
|
|
95
96
|
}, renderOption: (props, option, { selected, inputValue }) => {
|
|
96
97
|
const { key } = props, rest = tslib_1.__rest(props, ["key"]);
|
|
97
98
|
const matches = (0, match_1.default)(option.name, inputValue);
|
|
98
99
|
const parts = (0, parse_1.default)(option.name, matches);
|
|
99
|
-
return ((0, jsx_runtime_1.jsxs)("li", Object.assign({}, rest, { children: [checkboxSelect && (0, jsx_runtime_1.jsx)(material_1.Checkbox, { style: { marginRight: 8 }, checked: selected }), (0, jsx_runtime_1.jsx)(material_1.Chip, { label: parts.map((part, index) => ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span",
|
|
100
|
+
return ((0, jsx_runtime_1.jsxs)("li", Object.assign({}, rest, { children: [checkboxSelect && (0, jsx_runtime_1.jsx)(material_1.Checkbox, { style: { marginRight: 8 }, checked: selected }), (0, jsx_runtime_1.jsx)(material_1.Chip, { label: parts.map((part, index) => ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", sx: { fontWeight: part.highlight ? 700 : 400, color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: part.text }), index))) })] }), key));
|
|
100
101
|
}, renderInput: (params) => {
|
|
101
102
|
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, TextFieldProps, { margin: "dense", slotProps: {
|
|
102
103
|
input: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'categories', endAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isLoading ? (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "inherit", size: 20 }) : null, params.InputProps.endAdornment] })) })
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { SCCourseType } from '@selfcommunity/types';
|
|
2
|
-
import React from 'react';
|
|
3
3
|
interface HeaderCourseDashboardProps {
|
|
4
4
|
course: SCCourseType;
|
|
5
5
|
hasAction?: boolean;
|
|
6
6
|
}
|
|
7
7
|
declare function HeaderCourseDashboard(props: HeaderCourseDashboardProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
-
declare const _default:
|
|
8
|
+
declare const _default: import("react").MemoExoticComponent<typeof HeaderCourseDashboard>;
|
|
9
9
|
export default _default;
|
|
@@ -12,6 +12,7 @@ const types_2 = require("../../types");
|
|
|
12
12
|
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
13
13
|
const CourseTypePopover_1 = tslib_1.__importDefault(require("../../shared/CourseTypePopover"));
|
|
14
14
|
const BuyButton_1 = tslib_1.__importDefault(require("../BuyButton"));
|
|
15
|
+
const course_1 = require("../../utils/course");
|
|
15
16
|
const classes = {
|
|
16
17
|
header: `${constants_1.PREFIX}-header`,
|
|
17
18
|
img: `${constants_1.PREFIX}-header-img`,
|
|
@@ -19,15 +20,8 @@ const classes = {
|
|
|
19
20
|
innerWrapper: `${constants_1.PREFIX}-header-inner-wrapper`,
|
|
20
21
|
iconWrapper: `${constants_1.PREFIX}-header-icon-wrapper`,
|
|
21
22
|
buttonPopover: `${constants_1.PREFIX}-header-button-popover`,
|
|
22
|
-
|
|
23
|
+
defaultContrastColor: `${constants_1.PREFIX}-default-contrast-color`
|
|
23
24
|
};
|
|
24
|
-
function getUrlEditDashboard(course) {
|
|
25
|
-
return {
|
|
26
|
-
id: course.id,
|
|
27
|
-
slug: course.slug,
|
|
28
|
-
tab: types_2.SCCourseEditTabType.LESSONS
|
|
29
|
-
};
|
|
30
|
-
}
|
|
31
25
|
function HeaderCourseDashboard(props) {
|
|
32
26
|
var _a;
|
|
33
27
|
// PROPS
|
|
@@ -38,7 +32,7 @@ function HeaderCourseDashboard(props) {
|
|
|
38
32
|
const intl = (0, react_intl_1.useIntl)();
|
|
39
33
|
// PAYMENTS
|
|
40
34
|
const { isPaymentsEnabled } = (0, react_core_1.useSCPaymentsEnabled)();
|
|
41
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.header }, { children: [(0, jsx_runtime_1.jsx)("img", { src: course.image_bigger, alt: course.image_bigger, className: classes.img }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3", className: classes.
|
|
35
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.header }, { children: [(0, jsx_runtime_1.jsx)("img", { src: course.image_bigger, alt: course.image_bigger, className: classes.img }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3", className: classes.defaultContrastColor }, { children: course.name })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.outerWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.innerWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: (0, classnames_1.default)(classes.iconWrapper, classes.defaultContrastColor) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "public" })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.label", defaultMessage: "ui.course.label", values: {
|
|
42
36
|
privacy: intl.formatMessage({
|
|
43
37
|
id: `ui.course.privacy.${course.privacy === types_1.SCCoursePrivacyType.DRAFT ? 'draft' : course.privacy}`,
|
|
44
38
|
defaultMessage: `ui.course.privacy.${course.privacy === types_1.SCCoursePrivacyType.DRAFT ? 'draft' : course.privacy}`
|
|
@@ -46,6 +40,6 @@ function HeaderCourseDashboard(props) {
|
|
|
46
40
|
} }) }))] })), (0, jsx_runtime_1.jsx)(CourseTypePopover_1.default, { course: course }), isPaymentsEnabled &&
|
|
47
41
|
((_a = course.paywalls) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
|
|
48
42
|
(course.privacy === types_1.SCCoursePrivacyType.OPEN ||
|
|
49
|
-
(course.privacy === types_1.SCCoursePrivacyType.PRIVATE && course.join_status && course.join_status !== types_1.SCCourseJoinStatusType.REQUESTED)) && ((0, jsx_runtime_1.jsx)(BuyButton_1.default, { size: "md", variant: "text", startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "dredit-card" }), contentType: types_1.SCContentType.COURSE, content: course, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.paid", defaultMessage: "ui.course.paid" }) }))] })), hasAction && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_EDIT_ROUTE_NAME, getUrlEditDashboard(course)), size: "small", color: "primary", variant: "contained" }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.teacher.btn.label", defaultMessage: "ui.course.dashboard.teacher.btn.label" }) })) })))] }))] })));
|
|
43
|
+
(course.privacy === types_1.SCCoursePrivacyType.PRIVATE && course.join_status && course.join_status !== types_1.SCCourseJoinStatusType.REQUESTED)) && ((0, jsx_runtime_1.jsx)(BuyButton_1.default, { size: "md", variant: "text", startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "dredit-card" }), contentType: types_1.SCContentType.COURSE, content: course, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.paid", defaultMessage: "ui.course.paid" }) }))] })), hasAction && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_EDIT_ROUTE_NAME, (0, course_1.getUrlEditDashboard)(course, types_2.SCCourseEditTabType.LESSONS)), size: "small", color: "primary", variant: "contained" }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.teacher.btn.label", defaultMessage: "ui.course.dashboard.teacher.btn.label" }) })) })))] }))] })));
|
|
50
44
|
}
|
|
51
45
|
exports.default = (0, react_1.memo)(HeaderCourseDashboard);
|
|
@@ -5,11 +5,15 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
5
5
|
const material_1 = require("@mui/material");
|
|
6
6
|
const react_intl_1 = require("react-intl");
|
|
7
7
|
const react_core_1 = require("@selfcommunity/react-core");
|
|
8
|
+
const constants_1 = require("./../constants");
|
|
9
|
+
const classes = {
|
|
10
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
|
|
11
|
+
};
|
|
8
12
|
function ActionButton(props) {
|
|
9
13
|
const { labelId, to, size = 'small', color = 'primary', variant = 'contained' } = props, rest = tslib_1.__rest(props, ["labelId", "to", "size", "color", "variant"]);
|
|
10
14
|
if (to) {
|
|
11
|
-
return ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: to, size: size, color: color, variant: variant }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: labelId, defaultMessage: labelId }) })) })));
|
|
15
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: to, size: size, color: color, variant: variant }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: labelId, defaultMessage: labelId }) })) })));
|
|
12
16
|
}
|
|
13
|
-
return ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: size, color: color, variant: variant }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: labelId, defaultMessage: labelId }) })) })));
|
|
17
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: size, color: color, variant: variant }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: labelId, defaultMessage: labelId }) })) })));
|
|
14
18
|
}
|
|
15
19
|
exports.default = ActionButton;
|
|
@@ -50,7 +50,8 @@ const classes = {
|
|
|
50
50
|
box: `${constants_1.PREFIX}-box`,
|
|
51
51
|
percentageWrapper: `${constants_1.PREFIX}-percentage-wrapper`,
|
|
52
52
|
completedWrapper: `${constants_1.PREFIX}-completed-wrapper`,
|
|
53
|
-
|
|
53
|
+
defaultContrastColor: `${constants_1.PREFIX}-default-contrast-color`,
|
|
54
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
|
|
54
55
|
};
|
|
55
56
|
function getUrlNextLesson(course) {
|
|
56
57
|
var _a, _b, _c;
|
|
@@ -197,17 +198,17 @@ function Student(inProps) {
|
|
|
197
198
|
to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
|
|
198
199
|
}), { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !scCourse.created_by.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { className: classes.avatar, src: scCourse.created_by.avatar, alt: scCourse.created_by.username }) })) })), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!scCourse.created_by.deleted && {
|
|
199
200
|
to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
|
|
200
|
-
}), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.created_by.username })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.header.user.creator", defaultMessage: "ui.course.dashboard.header.user.creator" }) }))] })] })), actionButton] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE || scCourse.privacy === types_1.SCCoursePrivacyType.SECRET) &&
|
|
201
|
+
}), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: scCourse.created_by.username })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.header.user.creator", defaultMessage: "ui.course.dashboard.header.user.creator" }) }))] })] })), actionButton] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE || scCourse.privacy === types_1.SCCoursePrivacyType.SECRET) &&
|
|
201
202
|
(scCourse.join_status === types_1.SCCourseJoinStatusType.CREATOR ||
|
|
202
203
|
scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER ||
|
|
203
204
|
scCourse.join_status === types_1.SCCourseJoinStatusType.JOINED)) ||
|
|
204
205
|
scCourse.privacy === types_1.SCCoursePrivacyType.OPEN ||
|
|
205
206
|
scCourse.privacy === types_1.SCCoursePrivacyType.DRAFT) &&
|
|
206
|
-
scCourse.description && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: (0, classnames_1.default)(classes.margin, classes.
|
|
207
|
+
scCourse.description && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: (0, classnames_1.default)(classes.margin, classes.defaultContrastColor) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.description", defaultMessage: "ui.course.dashboard.student.description" }) })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.box }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: (0, classnames_1.default)(classes.description, classes.paperContrastColor) }, { children: scCourse.description })) }))] })), (((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE || scCourse.privacy === types_1.SCCoursePrivacyType.SECRET) &&
|
|
207
208
|
(scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER || scCourse.join_status === types_1.SCCourseJoinStatusType.JOINED)) ||
|
|
208
|
-
(scCourse.privacy === types_1.SCCoursePrivacyType.OPEN && scCourse.join_status !== types_1.SCCourseJoinStatusType.CREATOR)) && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [scCourse.join_status !== null && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: (0, classnames_1.default)(classes.margin, classes.
|
|
209
|
+
(scCourse.privacy === types_1.SCCoursePrivacyType.OPEN && scCourse.join_status !== types_1.SCCourseJoinStatusType.CREATOR)) && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [scCourse.join_status !== null && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: (0, classnames_1.default)(classes.margin, classes.defaultContrastColor) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.progress", defaultMessage: "ui.course.dashboard.student.progress" }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.box }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.percentageWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.progress.described", defaultMessage: "ui.course.dashboard.student.progress.described", values: { progress: scCourse.num_lessons_completed, end: scCourse.num_lessons } }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.progress.percentage", defaultMessage: "ui.course.dashboard.student.progress.percentage", values: { percentage: scCourse.user_completion_rate } }) }))] })), (0, jsx_runtime_1.jsx)(material_1.LinearProgress, { className: classes.progress, variant: "determinate", value: scCourse.user_completion_rate })] }))] })), scCourse.user_completion_rate === 100 && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: (0, classnames_1.default)(classes.completedWrapper, classes.margin) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3", className: classes.defaultContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.completed", defaultMessage: "ui.course.dashboard.student.completed" }) })), (0, jsx_runtime_1.jsx)("img", { src: clapping_1.default, alt: intl.formatMessage({ id: 'ui.course.dashboard.student.completed', defaultMessage: 'ui.course.dashboard.student.completed' }), width: 32, height: 32 })] }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: (0, classnames_1.default)(classes.margin, classes.defaultContrastColor) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.contents", defaultMessage: "ui.course.dashboard.student.contents" }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.lessonsSections }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.sections.title", defaultMessage: "ui.course.table.sections.title", values: {
|
|
209
210
|
sectionsNumber: scCourse.num_sections
|
|
210
|
-
} }) })), (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.circle }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.
|
|
211
|
+
} }) })), (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.circle }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.lessons.title", defaultMessage: "ui.course.table.lessons.title", values: {
|
|
211
212
|
lessonsNumber: scCourse.num_lessons
|
|
212
213
|
} }) }))] })), (0, jsx_runtime_1.jsx)(AccordionLessons_1.default, { course: scCourse, className: classes.accordion })] }))] })));
|
|
213
214
|
}
|
|
@@ -21,7 +21,7 @@ const classes = {
|
|
|
21
21
|
userInfo: `${constants_1.PREFIX}-user-info`,
|
|
22
22
|
circle: `${constants_1.PREFIX}-circle`,
|
|
23
23
|
button: `${constants_1.PREFIX}-button`,
|
|
24
|
-
|
|
24
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
|
|
25
25
|
};
|
|
26
26
|
function CommentSkeleton({ id }) {
|
|
27
27
|
return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.outerWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "text", width: "90px", height: "21px" }), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.innerWrapper }, { children: [Array.from(new Array(id)).map((_, i) => ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.userWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "circular", className: classes.avatar }), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.userInfo }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "text", width: "90px", height: "21px" }), (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.circle }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "text", width: "90px", height: "21px" })] })), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "text", width: "180px", height: "21px" })] })] }), i))), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "rounded", width: "112px", height: "36px", className: classes.button })] }))] })));
|
|
@@ -97,11 +97,11 @@ function Comments(props) {
|
|
|
97
97
|
map.set(name, [...map.get(name), comment]);
|
|
98
98
|
}
|
|
99
99
|
});
|
|
100
|
-
return Array.from(map.entries()).map(([name, comments]) => ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.outerWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.
|
|
100
|
+
return Array.from(map.entries()).map(([name, comments]) => ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.outerWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: name })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.innerWrapper }, { children: [comments.map((comment) => ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.userWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { src: comment.created_by.avatar, alt: comment.created_by.username, className: classes.avatar }), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.userInfo }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: comment.created_by.username })), (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.circle }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedDate, { value: comment.created_at }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", component: "div", dangerouslySetInnerHTML: { __html: comment.html }, className: classes.paperContrastColor })] })] }), comment.id))), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_COMMENTS_ROUTE_NAME, (0, course_1.getUrlLesson)(comments[0].extras.course, comments[0].extras.lesson, comments[0].extras.section)), size: "small", variant: "contained", color: "inherit", className: classes.button }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.teacher.tab.comments.lessons.btn.label", defaultMessage: "ui.course.dashboard.teacher.tab.comments.lessons.btn.label" }) })) }))] }))] }), name)));
|
|
101
101
|
}, [state.results]);
|
|
102
102
|
if (!state.initialized) {
|
|
103
103
|
return (0, jsx_runtime_1.jsx)(CommentsSkeleton, {});
|
|
104
104
|
}
|
|
105
|
-
return ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.container }, { children: state.count > 0 ? ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.
|
|
105
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.container }, { children: state.count > 0 ? ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.teacher.tab.comments.number", defaultMessage: "ui.course.dashboard.teacher.tab.comments.number", values: { commentsNumber: state.count } }) })), renderComments, isLoading && (0, jsx_runtime_1.jsx)(CommentSkeleton, { id: 1 }), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "contained", color: "inherit", loading: isLoading, disabled: !state.next, onClick: handleNext }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.teacher.tab.comments.btn.label", defaultMessage: "ui.course.dashboard.teacher.tab.comments.btn.label" }) })) }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.teacher.tab.comments.empty", defaultMessage: "ui.course.dashboard.teacher.tab.comments.empty" }) }))) })));
|
|
106
106
|
}
|
|
107
107
|
exports.default = (0, react_1.memo)(Comments);
|
|
@@ -10,11 +10,11 @@ const react_1 = require("react");
|
|
|
10
10
|
const types_1 = require("../types");
|
|
11
11
|
const classes = {
|
|
12
12
|
info: `${constants_1.PREFIX}-info`,
|
|
13
|
-
|
|
13
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
|
|
14
14
|
};
|
|
15
15
|
function InfoCourseDashboard(props) {
|
|
16
16
|
// PROPS
|
|
17
17
|
const { title, course, position } = props;
|
|
18
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.info }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", className: classes.
|
|
18
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.info }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: title, defaultMessage: title }) })), position === types_1.InfoPositionType.FIRST && (0, jsx_runtime_1.jsx)(CourseParticipantsButton_1.default, { course: course }), position === types_1.InfoPositionType.SECOND && ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: [course.avg_completion_rate, "%"] })))] })));
|
|
19
19
|
}
|
|
20
20
|
exports.default = (0, react_1.memo)(InfoCourseDashboard);
|
|
@@ -22,7 +22,7 @@ const classes = {
|
|
|
22
22
|
tabList: `${constants_1.PREFIX}-tab-list`,
|
|
23
23
|
tab: `${constants_1.PREFIX}-tab`,
|
|
24
24
|
tabPanel: `${constants_1.PREFIX}-tab-panel`,
|
|
25
|
-
|
|
25
|
+
defaultContrastColor: `${constants_1.PREFIX}-default-contrast-color`
|
|
26
26
|
};
|
|
27
27
|
const TAB_DATA = [
|
|
28
28
|
{
|
|
@@ -57,6 +57,6 @@ function Teacher(inProps) {
|
|
|
57
57
|
if (!scCourse) {
|
|
58
58
|
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
|
|
59
59
|
}
|
|
60
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(Header_1.default, { course: scCourse, hasAction: true }), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.infoWrapper }, { children: [(0, jsx_runtime_1.jsx)(Info_1.default, { title: "ui.course.dashboard.teacher.info.students", course: scCourse, position: types_1.InfoPositionType.FIRST }), (0, jsx_runtime_1.jsx)(Info_1.default, { title: "ui.course.dashboard.teacher.info.completion", course: scCourse, position: types_1.InfoPositionType.SECOND })] })), (0, jsx_runtime_1.jsxs)(lab_1.TabContext, Object.assign({ value: tabValue }, { children: [(0, jsx_runtime_1.jsx)(lab_1.TabList, Object.assign({ className: classes.tabList, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "standard", centered: true }, { children: TAB_DATA.map((data, i) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: data.label, defaultMessage: data.label }) })), value: data.value, className: (0, classnames_1.default)(classes.tab, classes.
|
|
60
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(Header_1.default, { course: scCourse, hasAction: true }), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.infoWrapper }, { children: [(0, jsx_runtime_1.jsx)(Info_1.default, { title: "ui.course.dashboard.teacher.info.students", course: scCourse, position: types_1.InfoPositionType.FIRST }), (0, jsx_runtime_1.jsx)(Info_1.default, { title: "ui.course.dashboard.teacher.info.completion", course: scCourse, position: types_1.InfoPositionType.SECOND })] })), (0, jsx_runtime_1.jsxs)(lab_1.TabContext, Object.assign({ value: tabValue }, { children: [(0, jsx_runtime_1.jsx)(lab_1.TabList, Object.assign({ className: classes.tabList, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "standard", centered: true }, { children: TAB_DATA.map((data, i) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: data.label, defaultMessage: data.label }) })), value: data.value, className: (0, classnames_1.default)(classes.tab, classes.defaultContrastColor) }, i))) })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ className: classes.tabPanel, value: types_1.TabContentType.STUDENTS }, { children: (0, jsx_runtime_1.jsx)(Students_1.default, { course: scCourse }) })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ className: classes.tabPanel, value: types_1.TabContentType.COMMENTS }, { children: (0, jsx_runtime_1.jsx)(Comments_1.default, { course: scCourse }) }))] }))] })));
|
|
61
61
|
}
|
|
62
62
|
exports.default = (0, react_1.memo)(Teacher);
|
|
@@ -60,7 +60,8 @@ const classes = {
|
|
|
60
60
|
stepCustomization: `${constants_1.PREFIX}-step-customization`,
|
|
61
61
|
cardTitle: `${constants_1.PREFIX}-card-title`,
|
|
62
62
|
title: `${constants_1.PREFIX}-title`,
|
|
63
|
-
|
|
63
|
+
defaultContrastColor: `${constants_1.PREFIX}-default-contrast-color`,
|
|
64
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`,
|
|
64
65
|
paywallsConfiguratorWrap: `${constants_1.PREFIX}-paywalls-configurator-wrap`
|
|
65
66
|
};
|
|
66
67
|
const Root = (0, material_1.styled)(material_1.Box, {
|
|
@@ -134,6 +135,8 @@ function CourseForm(inProps) {
|
|
|
134
135
|
const { preferences } = (0, react_core_1.useSCPreferences)();
|
|
135
136
|
// PAYMENTS
|
|
136
137
|
const { isPaymentsEnabled } = (0, react_core_1.useSCPaymentsEnabled)();
|
|
138
|
+
// HOOKS
|
|
139
|
+
const theme = (0, material_1.useTheme)();
|
|
137
140
|
const isStaff = (0, react_1.useMemo)(() => scUserContext.user && react_core_1.UserUtils.isStaff(scUserContext.user), [scUserContext.user]);
|
|
138
141
|
const courseAdvancedEnabled = (0, react_1.useMemo)(() => preferences[react_core_1.SCPreferences.CONFIGURATIONS_COURSES_ADVANCED_ENABLED].value, [preferences]);
|
|
139
142
|
const _backgroundCover = Object.assign({}, (field.imageOriginal
|
|
@@ -283,15 +286,17 @@ function CourseForm(inProps) {
|
|
|
283
286
|
* Renders root object
|
|
284
287
|
*/
|
|
285
288
|
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 &&
|
|
286
|
-
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: (0, classnames_1.default)(classes.cardTitle, classes.
|
|
289
|
+
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: (0, classnames_1.default)(classes.cardTitle, classes.paperContrastColor) }, { 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", className: classes.paperContrastColor }, { 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.defaultContrastColor }, { 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, slotProps: {
|
|
287
290
|
input: {
|
|
288
|
-
endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.
|
|
291
|
+
endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: Course_1.COURSE_TITLE_MAX_LENGTH - field.name.length })))
|
|
289
292
|
}
|
|
290
293
|
}, error: Boolean((!!course && !field.name) || field.name.length > Course_1.COURSE_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: !!course && !field.name ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : 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, slotProps: {
|
|
291
294
|
input: {
|
|
292
|
-
endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.
|
|
295
|
+
endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) ? Course_1.COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : Course_1.COURSE_DESCRIPTION_MAX_LENGTH })))
|
|
293
296
|
}
|
|
294
|
-
}, error: Boolean((!!field.privacy && !field.description) || ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), helperText: !!field.privacy && !field.description ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : (((_e = field.description) === null || _e === void 0 ? void 0 : _e.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" }))) }), (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { defaultValue: field.categories, TextFieldProps: {
|
|
297
|
+
}, error: Boolean((!!field.privacy && !field.description) || ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), helperText: !!field.privacy && !field.description ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : (((_e = field.description) === null || _e === void 0 ? void 0 : _e.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" }))) }), (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { defaultValue: field.categories, TextFieldProps: {
|
|
298
|
+
label: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) })))
|
|
299
|
+
}, 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 }))) }), isPaymentsEnabled && isStaff && !hidePaywalls && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: (0, jsx_runtime_1.jsx)(PaywallsConfigurator_1.default, Object.assign({}, (course && { contentId: course.id }), { contentType: types_1.SCContentType.COURSE, onChangeContentAccessType: handleChangeContentAccessType, onChangePaymentProducts: handleChangePaymentsProducts })) })))] }))] })), (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)(material_1.Button, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === Course_1.SCCourseFormStepType.GENERAL
|
|
295
300
|
? !field.type || Object.keys(error).length !== 0
|
|
296
301
|
: _step === Course_1.SCCourseFormStepType.CUSTOMIZATION &&
|
|
297
302
|
(!field.name ||
|
|
@@ -302,6 +307,6 @@ function CourseForm(inProps) {
|
|
|
302
307
|
? () => handleChangeStep(Course_1.SCCourseFormStepType.CUSTOMIZATION)
|
|
303
308
|
: field.privacy !== types_1.SCCoursePrivacyType.DRAFT && course.privacy === types_1.SCCoursePrivacyType.DRAFT
|
|
304
309
|
? () => setOpenDialog(true)
|
|
305
|
-
: handleSubmit, color: "primary" }, { children: course ? ((0, jsx_runtime_1.jsx)(
|
|
310
|
+
: handleSubmit, color: "primary" }, { children: course ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.action.save", defaultMessage: "ui.courseForm.edit.action.save" })) : _step === Course_1.SCCourseFormStepType.GENERAL ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.button.next", defaultMessage: "ui.courseForm.button.next" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.button.create", defaultMessage: "ui.courseForm.button.create" })) })) }))] })) })), openDialog && (0, jsx_runtime_1.jsx)(Dialog_1.default, { onSubmit: handleSubmit, onClose: handleClose })] }));
|
|
306
311
|
}
|
|
307
312
|
exports.default = CourseForm;
|
|
@@ -20,7 +20,7 @@ const classes = {
|
|
|
20
20
|
privacyItem: `${constants_1.PREFIX}-edit-privacy-item`,
|
|
21
21
|
privacyItemInfo: `${constants_1.PREFIX}-edit-privacy-item-info`,
|
|
22
22
|
disabled: `${constants_1.PREFIX}-disabled`,
|
|
23
|
-
|
|
23
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
|
|
24
24
|
};
|
|
25
25
|
const Root = (0, material_1.styled)(material_1.Box, {
|
|
26
26
|
name: constants_1.PREFIX,
|
|
@@ -46,11 +46,11 @@ function CourseEdit(inProps) {
|
|
|
46
46
|
/**
|
|
47
47
|
* Renders root object
|
|
48
48
|
*/
|
|
49
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [course.privacy === types_1.SCCoursePrivacyType.DRAFT && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.access }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.
|
|
49
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [course.privacy === types_1.SCCoursePrivacyType.DRAFT && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.access }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.access.section.title", defaultMessage: "ui.courseForm.edit.access.section.title" }) })), (0, jsx_runtime_1.jsxs)(Widget_1.default, Object.assign({ className: classes.card }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "medium", color: "warning" }, { children: "error" })), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.access.info.title", defaultMessage: "ui.courseForm.edit.access.info.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.access.info.subtitle", defaultMessage: "ui.courseForm.edit.access.info.subtitle" }) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.accessInfo }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.access.info.access", defaultMessage: "ui.courseForm.edit.access.info.access", values: { icon: (chunks) => (0, jsx_runtime_1.jsx)(material_1.Icon, { children: chunks }, "ui.courseForm.edit.access.info.access.icon") } }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.access.info.visibility", defaultMessage: "ui.courseForm.edit.access.info.visibility", values: { icon: (chunks) => (0, jsx_runtime_1.jsx)(material_1.Icon, { children: chunks }, "ui.courseForm.edit.access.info.visibility.icon") } }) }))] }))] })] }))] }))), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.publish }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.publication.title", defaultMessage: "ui.courseForm.edit.publication.title" }) })), notPublishable ? ((0, jsx_runtime_1.jsxs)(Widget_1.default, Object.assign({ className: classes.card }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "medium", color: "warning" }, { children: "error" })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.publication.subtitle.info", defaultMessage: "ui.courseForm.edit.publication.subtitle.info" }) }))] }))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: (0, classnames_1.default)(classes.publishInfo, classes.paperContrastColor) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.publication.subtitle", defaultMessage: "ui.courseForm.edit.publication.subtitle" }) }))), (0, jsx_runtime_1.jsx)(material_1.RadioGroup, { children: Object.values(types_1.SCCoursePrivacyType)
|
|
50
50
|
.filter((option) => option !== types_1.SCCoursePrivacyType.DRAFT)
|
|
51
|
-
.map((option, index) => ((0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ className: classes.privacyItem, disabled: notPublishable }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small", value: option, checked: option === privacy, onChange: handleChange, disabled: notPublishable }), label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.
|
|
51
|
+
.map((option, index) => ((0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ className: classes.privacyItem, disabled: notPublishable }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small", value: option, checked: option === privacy, onChange: handleChange, disabled: notPublishable }), label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.edit.publication.option.${option}.title`, defaultMessage: `ui.courseForm.edit.publication.option.${option}.title` }) })) }), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: (0, classnames_1.default)(classes.paperContrastColor, classes.privacyItemInfo, { [classes.disabled]: notPublishable }) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.edit.publication.option.${option}.access`, defaultMessage: `ui.courseForm.edit.publication.option.${option}.access`, values: {
|
|
52
52
|
icon: (chunks) => ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: chunks }, `ui.courseForm.edit.publication.option.${option}.access.icon`))
|
|
53
|
-
} }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: (classes.
|
|
53
|
+
} }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: (classes.paperContrastColor, (0, classnames_1.default)(classes.privacyItemInfo, { [classes.disabled]: notPublishable })) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.edit.publication.option.${option}.visibility`, defaultMessage: `ui.courseForm.edit.publication.option.${option}.visibility`, values: {
|
|
54
54
|
icon: (chunks) => ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: chunks }, `ui.courseForm.edit.publication.option.${option}.visibility.icon`))
|
|
55
55
|
} }) }))] })] }), index))) })] }))] })));
|
|
56
56
|
}
|
|
@@ -25,7 +25,8 @@ const classes = {
|
|
|
25
25
|
endMessage: `${PREFIX}-end-message`,
|
|
26
26
|
infiniteScroll: `${PREFIX}-infinite-scroll`,
|
|
27
27
|
participants: `${PREFIX}-participants`,
|
|
28
|
-
|
|
28
|
+
paperContrastColor: `${PREFIX}-paper-contrast-color`,
|
|
29
|
+
dialogPaperContrastColor: `${PREFIX}-dialog-paper-contrast-color`
|
|
29
30
|
};
|
|
30
31
|
const Root = (0, material_1.styled)(material_1.Button, {
|
|
31
32
|
name: PREFIX,
|
|
@@ -144,6 +145,6 @@ function CourseParticipantsButton(inProps) {
|
|
|
144
145
|
}
|
|
145
146
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scCourse || count === 0,
|
|
146
147
|
// @ts-expect-error this is needed to use enrolled into SCCourseParticipantsButton
|
|
147
|
-
enrolled: enrolled }, rest, { children: [!hideCaption && ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.participants, classes.
|
|
148
|
+
enrolled: enrolled }, rest, { children: [!hideCaption && ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.participants, classes.paperContrastColor) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "people_alt" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.courseParticipantsButton.participants", id: "ui.courseParticipantsButton.participants", values: { total: count } })] }))), !count && (loading || !scCourse) ? ((0, jsx_runtime_1.jsx)(AvatarGroupSkeleton_1.default, Object.assign({}, rest, (!participantsAvailable && { skeletonsAnimation: false }), { count: 4 }))) : ((0, jsx_runtime_1.jsx)(material_1.AvatarGroup, Object.assign({ total: count, renderSurplus: renderSurplus, className: classes.paperContrastColor }, { children: enrolled.map((c) => ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: c.username, src: c.avatar }, c.id))) })))] })), open && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.dialogPaperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.courseParticipantsButton.dialogTitle", id: "ui.courseParticipantsButton.dialogTitle", values: { total: count } }) })), onClose: handleToggleDialogOpen, open: true }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: count, next: fetchEnrolledUsers, hasMoreNext: next !== null || loading, loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, { elevation: 0 }), className: classes.infiniteScroll, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.endMessage, classes.dialogPaperContrastColor) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseParticipantsButton.noOtherParticipants", defaultMessage: "ui.courseParticipantsButton.noOtherParticipants" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: enrolled.map((e) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, { elevation: 0, user: e }) }, e.id))) }) })) })))] }));
|
|
148
149
|
}
|
|
149
150
|
exports.default = CourseParticipantsButton;
|
|
@@ -23,7 +23,7 @@ const classes = {
|
|
|
23
23
|
tabList: `${constants_1.PREFIX}-tab-list`,
|
|
24
24
|
tab: `${constants_1.PREFIX}-tab`,
|
|
25
25
|
tabPanel: `${constants_1.PREFIX}-tab-panel`,
|
|
26
|
-
|
|
26
|
+
defaultContrastColor: `${constants_1.PREFIX}-default-contrast-color`
|
|
27
27
|
};
|
|
28
28
|
const TAB_DATA = [
|
|
29
29
|
{
|
|
@@ -105,6 +105,6 @@ function EditCourse(inProps) {
|
|
|
105
105
|
if (!scCourse) {
|
|
106
106
|
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, { tab: tab });
|
|
107
107
|
}
|
|
108
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.header }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ href: scRoutingContext.url(react_core_1.SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse), size: "small" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.
|
|
108
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.header }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ href: scRoutingContext.url(react_core_1.SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse), size: "small" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.defaultContrastColor }, { children: "arrow_back" })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.defaultContrastColor }, { children: scCourse.name }))] })), (0, jsx_runtime_1.jsxs)(lab_1.TabContext, Object.assign({ value: tabValue }, { children: [(0, jsx_runtime_1.jsx)(lab_1.TabList, Object.assign({ className: classes.tabList, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: isMobile ? 'scrollable' : 'standard', scrollButtons: isMobile, centered: !isMobile }, { children: TAB_DATA.map((data, i) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: data.label, defaultMessage: data.label }) })), value: data.value, className: (0, classnames_1.default)(classes.tab, classes.defaultContrastColor) }, i))) })), panelData.map((data, i) => ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ className: classes.tabPanel, value: data.value }, { children: data.children }), i)))] }))] })));
|
|
109
109
|
}
|
|
110
110
|
exports.default = EditCourse;
|
|
@@ -27,15 +27,16 @@ const OPTIONS = [
|
|
|
27
27
|
const classes = {
|
|
28
28
|
changeLessonStatusPublishedWrapper: `${constants_1.PREFIX}-change-lesson-status-published-wrapper`,
|
|
29
29
|
changeLessonStatusIconDraft: `${constants_1.PREFIX}-change-lesson-status-icon-draft`,
|
|
30
|
-
|
|
30
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-constrast-color`
|
|
31
31
|
};
|
|
32
32
|
function ChangeLessonStatus(props) {
|
|
33
33
|
// PROPS
|
|
34
34
|
const { course, section, lesson, onChange, disabled } = props;
|
|
35
|
+
// CONTEXTS
|
|
36
|
+
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
35
37
|
// HOOKS
|
|
36
38
|
const theme = (0, material_1.useTheme)();
|
|
37
39
|
const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
|
|
38
|
-
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
39
40
|
// STATES
|
|
40
41
|
const [value, setValue] = (0, react_1.useState)('');
|
|
41
42
|
const [loading, setLoading] = (0, react_1.useState)(false);
|
|
@@ -78,16 +79,20 @@ function ChangeLessonStatus(props) {
|
|
|
78
79
|
handleAction(newValue);
|
|
79
80
|
}
|
|
80
81
|
}, [handleAction, value]);
|
|
81
|
-
return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(MenuRow_1.default, Object.assign({ buttonClassName: (0, classnames_1.default)(
|
|
82
|
+
return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(MenuRow_1.default, Object.assign({ buttonClassName: (0, classnames_1.default)(hasPublished ? classes.changeLessonStatusPublishedWrapper : undefined), icon: icon }, { children: OPTIONS.map((option, i) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", color: "inherit", onClick: handleClick, loading: loading, disabled: loading, "data-value": option.value, sx: {
|
|
82
83
|
padding: 0,
|
|
83
84
|
':hover': {
|
|
84
85
|
backgroundColor: 'unset'
|
|
85
86
|
}
|
|
86
|
-
} }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1",
|
|
87
|
+
} }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", sx: {
|
|
88
|
+
color: theme.palette.getContrastText(theme.palette.background.paper)
|
|
89
|
+
} }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: option.id, defaultMessage: option.id }) })) })) }, i))) }))) : ((0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ className: (0, classnames_1.default)(hasPublished ? classes.changeLessonStatusPublishedWrapper : undefined), size: "small", value: value, onChange: handleChange, disabled: disabled }, { children: OPTIONS.map((option, i) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: option.value }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", color: "inherit", loading: loading, disabled: loading, sx: {
|
|
87
90
|
padding: 0,
|
|
88
91
|
':hover': {
|
|
89
92
|
backgroundColor: 'unset'
|
|
90
93
|
}
|
|
91
|
-
} }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1",
|
|
94
|
+
} }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", sx: {
|
|
95
|
+
color: theme.palette.getContrastText(theme.palette.background.paper)
|
|
96
|
+
} }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: option.id, defaultMessage: option.id }) })) })) }), i))) }))) }));
|
|
92
97
|
}
|
|
93
98
|
exports.default = (0, react_1.memo)(ChangeLessonStatus);
|
|
@@ -18,7 +18,7 @@ const classes = {
|
|
|
18
18
|
editModeWrapper: `${constants_1.PREFIX}-edit-mode-wrapper`,
|
|
19
19
|
editModeSaveButton: `${constants_1.PREFIX}-edit-mode-save-button`,
|
|
20
20
|
editModeCloseButton: `${constants_1.PREFIX}-edit-mode-close-button`,
|
|
21
|
-
|
|
21
|
+
paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
|
|
22
22
|
};
|
|
23
23
|
function FieldName(props) {
|
|
24
24
|
// PROPS
|
|
@@ -78,6 +78,6 @@ function FieldName(props) {
|
|
|
78
78
|
handleDisableEditMode();
|
|
79
79
|
}
|
|
80
80
|
}, [row, isNewRow, handleManageRow, setName, handleDisableEditMode]);
|
|
81
|
-
return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: isNewRow || editMode ? ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.editModeWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { type: "text", variant: "outlined", size: "small", focused: true, autoFocus: true, defaultValue: row.name, onChange: handleChange }), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", color: "primary", variant: "contained", onClick: handleSubmit, loading: loading, disabled: loading, className: classes.editModeSaveButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "check" }) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ color: "default", size: "small", onClick: handleClose, className: classes.editModeCloseButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] }))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.
|
|
81
|
+
return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: isNewRow || editMode ? ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.editModeWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { type: "text", variant: "outlined", size: "small", focused: true, autoFocus: true, defaultValue: row.name, onChange: handleChange }), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", color: "primary", variant: "contained", onClick: handleSubmit, loading: loading, disabled: loading, className: classes.editModeSaveButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "check" }) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ color: "default", size: "small", onClick: handleClose, className: classes.editModeCloseButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] }))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: row.name }))) }));
|
|
82
82
|
}
|
|
83
83
|
exports.default = (0, react_1.memo)(FieldName);
|
|
@@ -23,8 +23,7 @@ const classes = {
|
|
|
23
23
|
cellAlignRight: `${constants_1.PREFIX}-cell-align-right`,
|
|
24
24
|
cellPadding: `${constants_1.PREFIX}-cell-padding`,
|
|
25
25
|
tableBodyIconWrapper: `${constants_1.PREFIX}-table-body-icon-wrapper`,
|
|
26
|
-
actionsWrapper: `${constants_1.PREFIX}-actions-wrapper
|
|
27
|
-
contrastColor: `${constants_1.PREFIX}-contrast-color`
|
|
26
|
+
actionsWrapper: `${constants_1.PREFIX}-actions-wrapper`
|
|
28
27
|
};
|
|
29
28
|
function LessonRow(props, ref) {
|
|
30
29
|
// PROPS
|
|
@@ -36,6 +35,7 @@ function LessonRow(props, ref) {
|
|
|
36
35
|
// HOOKS
|
|
37
36
|
const { isDisabled } = (0, hooks_1.useIsDisabled)();
|
|
38
37
|
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
38
|
+
const theme = (0, material_1.useTheme)();
|
|
39
39
|
// HANDLERS
|
|
40
40
|
const handleAbleEditMode = (0, react_1.useCallback)(() => setTimeout(() => setEditMode(true)), [setEditMode]);
|
|
41
41
|
const handleDisableEditMode = (0, react_1.useCallback)(() => setEditMode(false), [setEditMode]);
|
|
@@ -64,6 +64,6 @@ function LessonRow(props, ref) {
|
|
|
64
64
|
? api_services_1.Endpoints.CreateCourseLesson.url({ id: course.id, section_id: section.id })
|
|
65
65
|
: api_services_1.Endpoints.PatchCourseLesson.url({ id: course.id, section_id: section.id, lesson_id: lesson.id }),
|
|
66
66
|
method: isNewRow ? api_services_1.Endpoints.CreateCourseLesson.method : api_services_1.Endpoints.PatchCourseLesson.method
|
|
67
|
-
}, row: lesson, isNewRow: isNewRow, handleManageRow: handleManageLesson, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, {}), (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)(ChangeLessonStatus_1.default, { course: course, section: section, lesson: lesson, onChange: handleManageLesson, 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({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_EDIT_ROUTE_NAME, (0, course_1.getUrlLesson)(course, lesson, section)) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1",
|
|
67
|
+
}, row: lesson, isNewRow: isNewRow, handleManageRow: handleManageLesson, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, {}), (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)(ChangeLessonStatus_1.default, { course: course, section: section, lesson: lesson, onChange: handleManageLesson, 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({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_EDIT_ROUTE_NAME, (0, course_1.getUrlLesson)(course, lesson, section)) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.edit", defaultMessage: "ui.editCourse.tab.lessons.table.menu.edit" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_PREVIEW_ROUTE_NAME, (0, course_1.getUrlLesson)(course, lesson, section)) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.preview", defaultMessage: "ui.editCourse.tab.lessons.table.menu.preview" }) })) })), (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", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { 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 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { 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" }) })) }))] }))] })) }))] })));
|
|
68
68
|
}
|
|
69
69
|
exports.default = (0, react_1.memo)((0, react_1.forwardRef)(LessonRow));
|
|
@@ -28,8 +28,7 @@ const classes = {
|
|
|
28
28
|
cellWidth: `${constants_1.PREFIX}-cell-width`,
|
|
29
29
|
cellAlignRight: `${constants_1.PREFIX}-cell-align-right`,
|
|
30
30
|
cellAlignCenter: `${constants_1.PREFIX}-cell-align-center`,
|
|
31
|
-
cellPadding: `${constants_1.PREFIX}-cell-padding
|
|
32
|
-
contrastColor: `${constants_1.PREFIX}-contrast-color`
|
|
31
|
+
cellPadding: `${constants_1.PREFIX}-cell-padding`
|
|
33
32
|
};
|
|
34
33
|
function SectionRow(props, ref) {
|
|
35
34
|
// PROPS
|
|
@@ -44,6 +43,7 @@ function SectionRow(props, ref) {
|
|
|
44
43
|
const { isDisabled } = (0, hooks_1.useIsDisabled)();
|
|
45
44
|
const intl = (0, react_intl_1.useIntl)();
|
|
46
45
|
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
|
|
46
|
+
const theme = (0, material_1.useTheme)();
|
|
47
47
|
// EFFECTS
|
|
48
48
|
(0, react_1.useEffect)(() => {
|
|
49
49
|
if (section.lessons) {
|
|
@@ -154,6 +154,6 @@ function SectionRow(props, ref) {
|
|
|
154
154
|
? api_services_1.Endpoints.CreateCourseSection.url({ id: course.id })
|
|
155
155
|
: api_services_1.Endpoints.PatchCourseSection.url({ id: course.id, section_id: section.id }),
|
|
156
156
|
method: isNewRow ? api_services_1.Endpoints.CreateCourseSection.method : api_services_1.Endpoints.PatchCourseSection.method
|
|
157
|
-
}, 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: "contained", 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",
|
|
157
|
+
}, 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: "contained", 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", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { 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", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { 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] }))) })) }) })) })) })) })] }));
|
|
158
158
|
}
|
|
159
159
|
exports.default = (0, react_1.memo)((0, react_1.forwardRef)(SectionRow));
|