@selfcommunity/react-ui 0.10.2-courses.180 → 0.10.2-courses.181

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.
@@ -50,7 +50,6 @@ exports.default = (props) => {
50
50
  (0, react_1.useEffect)(() => {
51
51
  if (openLink && linkInputRef.current) {
52
52
  linkInputRef.current.scrollIntoView({ behavior: 'smooth' });
53
- console.log('scroll debug');
54
53
  }
55
54
  }, [openLink]);
56
55
  // RENDER
@@ -12,6 +12,11 @@ export interface CourseContentMenuProps {
12
12
  * Callback fired on lesson item click
13
13
  */
14
14
  onLessonClick: (lesson: SCCourseLessonType, section: SCCourseSectionType) => void;
15
+ /**
16
+ * The preview mode
17
+ * @default false
18
+ */
19
+ previewMode: boolean;
15
20
  /**
16
21
  * Any other properties
17
22
  */
@@ -29,7 +29,7 @@ function CourseContentMenu(inProps) {
29
29
  props: inProps,
30
30
  name: constants_1.PREFIX
31
31
  });
32
- const { className = null, lesson, course, onLessonClick } = props, rest = tslib_1.__rest(props, ["className", "lesson", "course", "onLessonClick"]);
32
+ const { className = null, lesson, course, onLessonClick, previewMode } = props, rest = tslib_1.__rest(props, ["className", "lesson", "course", "onLessonClick", "previewMode"]);
33
33
  //STATE
34
34
  const [expandedSections, setExpandedSections] = (0, react_1.useState)((lesson === null || lesson === void 0 ? void 0 : lesson.section_id) ? [lesson.section_id] : []);
35
35
  //HANDLERS
@@ -42,6 +42,6 @@ function CourseContentMenu(inProps) {
42
42
  if (!course) {
43
43
  return null;
44
44
  }
45
- return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: course.sections.map((section) => ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ onClick: () => handleToggle(section.id), className: classes.listItem, disableRipple: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, Object.assign({ className: classes.listItemIcon }, { children: expandedSections.includes(section.id) ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) })), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: section.name })] })), (0, jsx_runtime_1.jsx)(material_1.Collapse, Object.assign({ in: expandedSections.includes(section.id), timeout: "auto", unmountOnExit: true }, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ component: "div", disablePadding: true }, { children: section.lessons.map((_lesson) => ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ className: classes.item, onClick: () => onLessonClick(_lesson, section), selected: _lesson.id === lesson.id, disabled: _lesson.locked }, { children: [course.join_status !== types_1.SCCourseJoinStatusType.CREATOR && ((0, jsx_runtime_1.jsx)(material_1.ListItemIcon, Object.assign({ className: classes.itemIcon }, { children: _lesson.completion_status === types_1.SCCourseLessonCompletionStatusType.COMPLETED ? ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.iconComplete }, { children: "circle_checked" }))) : _lesson.locked ? ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" })) : ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.iconIncomplete }, { children: "fiber_manual_record" }))) }))), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: _lesson.name })] }), _lesson.id))) })) }))] }, section.id))) })));
45
+ return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: course.sections.map((section) => ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ onClick: () => handleToggle(section.id), className: classes.listItem, disableRipple: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, Object.assign({ className: classes.listItemIcon }, { children: expandedSections.includes(section.id) ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) })), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: section.name })] })), (0, jsx_runtime_1.jsx)(material_1.Collapse, Object.assign({ in: expandedSections.includes(section.id), timeout: "auto", unmountOnExit: true }, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ component: "div", disablePadding: true }, { children: section.lessons.map((_lesson) => ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ className: classes.item, onClick: () => onLessonClick(_lesson, section), selected: _lesson.id === lesson.id, disabled: _lesson.locked }, { children: [course.join_status !== types_1.SCCourseJoinStatusType.CREATOR && !previewMode && ((0, jsx_runtime_1.jsx)(material_1.ListItemIcon, Object.assign({ className: classes.itemIcon }, { children: _lesson.completion_status === types_1.SCCourseLessonCompletionStatusType.COMPLETED ? ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.iconComplete }, { children: "circle_checked" }))) : _lesson.locked ? ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" })) : ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.iconIncomplete }, { children: "fiber_manual_record" }))) }))), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: _lesson.name })] }), _lesson.id))) })) }))] }, section.id))) })));
46
46
  }
47
47
  exports.default = CourseContentMenu;
@@ -72,6 +72,6 @@ function LessonRow(props) {
72
72
  ? api_services_1.Endpoints.CreateCourseLesson.url({ id: course.id, section_id: section.id })
73
73
  : api_services_1.Endpoints.PatchCourseLesson.url({ id: course.id, section_id: section.id, lesson_id: lesson.id }),
74
74
  method: isNewRow ? api_services_1.Endpoints.CreateCourseLesson.method : api_services_1.Endpoints.PatchCourseLesson.method
75
- }, row: lesson, isNewRow: isNewRow, handleManageRow: handleManageLesson, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, {}), (0, jsx_runtime_1.jsxs)(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, 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, getUrlLesson(course, section, lesson)) }, { 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.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_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { 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.view", defaultMessage: "ui.editCourse.tab.lessons.table.menu.view" }) })) })), (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 }, { 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" }) })) }))] }))] })), open && (0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: true, onClose: handleOpenDialog, onConfirm: handleDeleteLesson })] }))] })));
75
+ }, row: lesson, isNewRow: isNewRow, handleManageRow: handleManageLesson, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, {}), (0, jsx_runtime_1.jsxs)(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, 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, getUrlLesson(course, section, lesson)) }, { 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.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, getUrlLesson(course, section, lesson)) }, { 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.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" }, { 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" }, { 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" }) })) }))] }))] })), open && (0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: true, onClose: handleOpenDialog, onConfirm: handleDeleteLesson })] }))] })));
76
76
  }
77
77
  exports.default = (0, react_1.memo)(LessonRow);
@@ -16,6 +16,11 @@ export interface LessonDrawerProps {
16
16
  * @default false
17
17
  */
18
18
  editMode: boolean;
19
+ /**
20
+ * The preview mode
21
+ * @default false
22
+ */
23
+ previewMode: boolean;
19
24
  /**
20
25
  * The active panel
21
26
  */
@@ -31,7 +31,7 @@ function LessonDrawer(inProps) {
31
31
  props: inProps,
32
32
  name: constants_1.PREFIX
33
33
  });
34
- const { className = null, lesson, course, editMode = false, activePanel = null, LessonCommentObjectsProps = {}, LessonEditFormProps, handleClose, handleChangeLesson } = props, rest = tslib_1.__rest(props, ["className", "lesson", "course", "editMode", "activePanel", "LessonCommentObjectsProps", "LessonEditFormProps", "handleClose", "handleChangeLesson"]);
35
- return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), anchor: "right", open: Boolean(activePanel) || editMode, variant: "persistent" }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: (0, classnames_1.default)(classes.header, { [classes.headerEdit]: editMode }) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.headerContent }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", textAlign: "center" }, { children: editMode ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.lessonDrawer.settings", defaultMessage: "ui.lessonDrawer.settings" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.lessonDrawer.${activePanel}`, defaultMessage: `ui.lessonDrawer.${activePanel}` })) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.headerAction, onClick: handleClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })) })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), editMode ? ((0, jsx_runtime_1.jsx)(LessonEditForm_1.default, Object.assign({}, LessonEditFormProps))) : activePanel === types_1.SCLessonActionsType.COMMENTS ? ((0, jsx_runtime_1.jsx)(LessonCommentObjects_1.default, Object.assign({ lessonObject: lesson }, LessonCommentObjectsProps))) : ((0, jsx_runtime_1.jsx)(ScrollContainer_1.default, { children: (0, jsx_runtime_1.jsx)(CourseContentMenu_1.default, { course: course, lesson: lesson, onLessonClick: handleChangeLesson }) }))] })));
34
+ const { className = null, lesson, course, editMode = false, previewMode = false, activePanel = null, LessonCommentObjectsProps = {}, LessonEditFormProps, handleClose, handleChangeLesson } = props, rest = tslib_1.__rest(props, ["className", "lesson", "course", "editMode", "previewMode", "activePanel", "LessonCommentObjectsProps", "LessonEditFormProps", "handleClose", "handleChangeLesson"]);
35
+ return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), anchor: "right", open: Boolean(activePanel) || editMode, variant: "persistent" }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: (0, classnames_1.default)(classes.header, { [classes.headerEdit]: editMode }) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.headerContent }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", textAlign: "center" }, { children: editMode ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.lessonDrawer.settings", defaultMessage: "ui.lessonDrawer.settings" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.lessonDrawer.${activePanel}`, defaultMessage: `ui.lessonDrawer.${activePanel}` })) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.headerAction, onClick: handleClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })) })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), editMode ? ((0, jsx_runtime_1.jsx)(LessonEditForm_1.default, Object.assign({}, LessonEditFormProps))) : activePanel === types_1.SCLessonActionsType.COMMENTS ? ((0, jsx_runtime_1.jsx)(LessonCommentObjects_1.default, Object.assign({ lessonObject: lesson }, LessonCommentObjectsProps))) : ((0, jsx_runtime_1.jsx)(ScrollContainer_1.default, { children: (0, jsx_runtime_1.jsx)(CourseContentMenu_1.default, { course: course, lesson: lesson, onLessonClick: handleChangeLesson, previewMode: previewMode }) }))] })));
36
36
  }
37
37
  exports.default = LessonDrawer;
@@ -47,7 +47,6 @@ export default (props) => {
47
47
  useEffect(() => {
48
48
  if (openLink && linkInputRef.current) {
49
49
  linkInputRef.current.scrollIntoView({ behavior: 'smooth' });
50
- console.log('scroll debug');
51
50
  }
52
51
  }, [openLink]);
53
52
  // RENDER
@@ -12,6 +12,11 @@ export interface CourseContentMenuProps {
12
12
  * Callback fired on lesson item click
13
13
  */
14
14
  onLessonClick: (lesson: SCCourseLessonType, section: SCCourseSectionType) => void;
15
+ /**
16
+ * The preview mode
17
+ * @default false
18
+ */
19
+ previewMode: boolean;
15
20
  /**
16
21
  * Any other properties
17
22
  */
@@ -27,7 +27,7 @@ export default function CourseContentMenu(inProps) {
27
27
  props: inProps,
28
28
  name: PREFIX
29
29
  });
30
- const { className = null, lesson, course, onLessonClick } = props, rest = __rest(props, ["className", "lesson", "course", "onLessonClick"]);
30
+ const { className = null, lesson, course, onLessonClick, previewMode } = props, rest = __rest(props, ["className", "lesson", "course", "onLessonClick", "previewMode"]);
31
31
  //STATE
32
32
  const [expandedSections, setExpandedSections] = useState((lesson === null || lesson === void 0 ? void 0 : lesson.section_id) ? [lesson.section_id] : []);
33
33
  //HANDLERS
@@ -40,5 +40,5 @@ export default function CourseContentMenu(inProps) {
40
40
  if (!course) {
41
41
  return null;
42
42
  }
43
- return (_jsx(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: course.sections.map((section) => (_jsxs(React.Fragment, { children: [_jsxs(ListItemButton, Object.assign({ onClick: () => handleToggle(section.id), className: classes.listItem, disableRipple: true }, { children: [_jsx(ListItemIcon, Object.assign({ className: classes.listItemIcon }, { children: expandedSections.includes(section.id) ? _jsx(Icon, { children: "expand_less" }) : _jsx(Icon, { children: "expand_more" }) })), _jsx(ListItemText, { primary: section.name })] })), _jsx(Collapse, Object.assign({ in: expandedSections.includes(section.id), timeout: "auto", unmountOnExit: true }, { children: _jsx(List, Object.assign({ component: "div", disablePadding: true }, { children: section.lessons.map((_lesson) => (_jsxs(ListItemButton, Object.assign({ className: classes.item, onClick: () => onLessonClick(_lesson, section), selected: _lesson.id === lesson.id, disabled: _lesson.locked }, { children: [course.join_status !== SCCourseJoinStatusType.CREATOR && (_jsx(ListItemIcon, Object.assign({ className: classes.itemIcon }, { children: _lesson.completion_status === SCCourseLessonCompletionStatusType.COMPLETED ? (_jsx(Icon, Object.assign({ className: classes.iconComplete }, { children: "circle_checked" }))) : _lesson.locked ? (_jsx(Icon, { children: "private" })) : (_jsx(Icon, Object.assign({ className: classes.iconIncomplete }, { children: "fiber_manual_record" }))) }))), _jsx(ListItemText, { primary: _lesson.name })] }), _lesson.id))) })) }))] }, section.id))) })));
43
+ return (_jsx(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: course.sections.map((section) => (_jsxs(React.Fragment, { children: [_jsxs(ListItemButton, Object.assign({ onClick: () => handleToggle(section.id), className: classes.listItem, disableRipple: true }, { children: [_jsx(ListItemIcon, Object.assign({ className: classes.listItemIcon }, { children: expandedSections.includes(section.id) ? _jsx(Icon, { children: "expand_less" }) : _jsx(Icon, { children: "expand_more" }) })), _jsx(ListItemText, { primary: section.name })] })), _jsx(Collapse, Object.assign({ in: expandedSections.includes(section.id), timeout: "auto", unmountOnExit: true }, { children: _jsx(List, Object.assign({ component: "div", disablePadding: true }, { children: section.lessons.map((_lesson) => (_jsxs(ListItemButton, Object.assign({ className: classes.item, onClick: () => onLessonClick(_lesson, section), selected: _lesson.id === lesson.id, disabled: _lesson.locked }, { children: [course.join_status !== SCCourseJoinStatusType.CREATOR && !previewMode && (_jsx(ListItemIcon, Object.assign({ className: classes.itemIcon }, { children: _lesson.completion_status === SCCourseLessonCompletionStatusType.COMPLETED ? (_jsx(Icon, Object.assign({ className: classes.iconComplete }, { children: "circle_checked" }))) : _lesson.locked ? (_jsx(Icon, { children: "private" })) : (_jsx(Icon, Object.assign({ className: classes.iconIncomplete }, { children: "fiber_manual_record" }))) }))), _jsx(ListItemText, { primary: _lesson.name })] }), _lesson.id))) })) }))] }, section.id))) })));
44
44
  }
@@ -69,6 +69,6 @@ function LessonRow(props) {
69
69
  ? Endpoints.CreateCourseLesson.url({ id: course.id, section_id: section.id })
70
70
  : Endpoints.PatchCourseLesson.url({ id: course.id, section_id: section.id, lesson_id: lesson.id }),
71
71
  method: isNewRow ? Endpoints.CreateCourseLesson.method : Endpoints.PatchCourseLesson.method
72
- }, row: lesson, isNewRow: isNewRow, handleManageRow: handleManageLesson, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), _jsx(TableCell, {}), _jsxs(TableCell, Object.assign({ className: classes.cellAlignRight }, { children: [_jsxs(Stack, Object.assign({ className: classes.actionsWrapper }, { children: [_jsx(ChangeLessonStatus, { course: course, section: section, lesson: lesson, disabled: isDisabled }), _jsxs(MenuRow, Object.assign({ disabled: isDisabled }, { children: [_jsx(MenuItem, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.COURSE_LESSON_EDIT_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.edit", defaultMessage: "ui.editCourse.tab.lessons.table.menu.edit" }) })) })), _jsx(MenuItem, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.COURSE_LESSON_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.view", defaultMessage: "ui.editCourse.tab.lessons.table.menu.view" }) })) })), _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 }, { 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" }) })) }))] }))] })), open && _jsx(ConfirmDialog, { open: true, onClose: handleOpenDialog, onConfirm: handleDeleteLesson })] }))] })));
72
+ }, row: lesson, isNewRow: isNewRow, handleManageRow: handleManageLesson, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), _jsx(TableCell, {}), _jsxs(TableCell, Object.assign({ className: classes.cellAlignRight }, { children: [_jsxs(Stack, Object.assign({ className: classes.actionsWrapper }, { children: [_jsx(ChangeLessonStatus, { course: course, section: section, lesson: lesson, disabled: isDisabled }), _jsxs(MenuRow, Object.assign({ disabled: isDisabled }, { children: [_jsx(MenuItem, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.COURSE_LESSON_EDIT_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.edit", defaultMessage: "ui.editCourse.tab.lessons.table.menu.edit" }) })) })), _jsx(MenuItem, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.COURSE_LESSON_PREVIEW_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.preview", defaultMessage: "ui.editCourse.tab.lessons.table.menu.preview" }) })) })), _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 }, { 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" }) })) }))] }))] })), open && _jsx(ConfirmDialog, { open: true, onClose: handleOpenDialog, onConfirm: handleDeleteLesson })] }))] })));
73
73
  }
74
74
  export default memo(LessonRow);
@@ -16,6 +16,11 @@ export interface LessonDrawerProps {
16
16
  * @default false
17
17
  */
18
18
  editMode: boolean;
19
+ /**
20
+ * The preview mode
21
+ * @default false
22
+ */
23
+ previewMode: boolean;
19
24
  /**
20
25
  * The active panel
21
26
  */
@@ -29,6 +29,6 @@ export default function LessonDrawer(inProps) {
29
29
  props: inProps,
30
30
  name: PREFIX
31
31
  });
32
- const { className = null, lesson, course, editMode = false, activePanel = null, LessonCommentObjectsProps = {}, LessonEditFormProps, handleClose, handleChangeLesson } = props, rest = __rest(props, ["className", "lesson", "course", "editMode", "activePanel", "LessonCommentObjectsProps", "LessonEditFormProps", "handleClose", "handleChangeLesson"]);
33
- return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className), anchor: "right", open: Boolean(activePanel) || editMode, variant: "persistent" }, rest, { children: [_jsx(Box, Object.assign({ className: classNames(classes.header, { [classes.headerEdit]: editMode }) }, { children: _jsxs(Box, Object.assign({ className: classes.headerContent }, { children: [_jsx(Typography, Object.assign({ variant: "h4", textAlign: "center" }, { children: editMode ? (_jsx(FormattedMessage, { id: "ui.lessonDrawer.settings", defaultMessage: "ui.lessonDrawer.settings" })) : (_jsx(FormattedMessage, { id: `ui.lessonDrawer.${activePanel}`, defaultMessage: `ui.lessonDrawer.${activePanel}` })) })), _jsx(IconButton, Object.assign({ className: classes.headerAction, onClick: handleClose }, { children: _jsx(Icon, { children: "close" }) }))] })) })), _jsx(Divider, {}), editMode ? (_jsx(LessonEditForm, Object.assign({}, LessonEditFormProps))) : activePanel === SCLessonActionsType.COMMENTS ? (_jsx(LessonCommentObjects, Object.assign({ lessonObject: lesson }, LessonCommentObjectsProps))) : (_jsx(ScrollContainer, { children: _jsx(CourseContentMenu, { course: course, lesson: lesson, onLessonClick: handleChangeLesson }) }))] })));
32
+ const { className = null, lesson, course, editMode = false, previewMode = false, activePanel = null, LessonCommentObjectsProps = {}, LessonEditFormProps, handleClose, handleChangeLesson } = props, rest = __rest(props, ["className", "lesson", "course", "editMode", "previewMode", "activePanel", "LessonCommentObjectsProps", "LessonEditFormProps", "handleClose", "handleChangeLesson"]);
33
+ return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className), anchor: "right", open: Boolean(activePanel) || editMode, variant: "persistent" }, rest, { children: [_jsx(Box, Object.assign({ className: classNames(classes.header, { [classes.headerEdit]: editMode }) }, { children: _jsxs(Box, Object.assign({ className: classes.headerContent }, { children: [_jsx(Typography, Object.assign({ variant: "h4", textAlign: "center" }, { children: editMode ? (_jsx(FormattedMessage, { id: "ui.lessonDrawer.settings", defaultMessage: "ui.lessonDrawer.settings" })) : (_jsx(FormattedMessage, { id: `ui.lessonDrawer.${activePanel}`, defaultMessage: `ui.lessonDrawer.${activePanel}` })) })), _jsx(IconButton, Object.assign({ className: classes.headerAction, onClick: handleClose }, { children: _jsx(Icon, { children: "close" }) }))] })) })), _jsx(Divider, {}), editMode ? (_jsx(LessonEditForm, Object.assign({}, LessonEditFormProps))) : activePanel === SCLessonActionsType.COMMENTS ? (_jsx(LessonCommentObjects, Object.assign({ lessonObject: lesson }, LessonCommentObjectsProps))) : (_jsx(ScrollContainer, { children: _jsx(CourseContentMenu, { course: course, lesson: lesson, onLessonClick: handleChangeLesson, previewMode: previewMode }) }))] })));
34
34
  }