@selfcommunity/react-ui
Version:
React UI Components to integrate a Community created with SelfCommunity Platform.
34 lines (33 loc) • 2.78 kB
JavaScript
import { __rest } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useThemeProps } from '@mui/system';
import classNames from 'classnames';
import { Box, Divider, Drawer, Icon, IconButton, Typography, styled } from '@mui/material';
import { PREFIX } from './constants';
import { SCLessonActionsType } from '../../types';
import { FormattedMessage } from 'react-intl';
import LessonEditForm from '../LessonEditForm';
import CourseContentMenu from '../CourseContentMenu';
import ScrollContainer from '../../shared/ScrollContainer';
import LessonCommentObjects from '../LessonCommentObjects';
const classes = {
root: `${PREFIX}-root`,
header: `${PREFIX}-header`,
headerAction: `${PREFIX}-header-action`,
headerContent: `${PREFIX}-header-content`,
headerEdit: `${PREFIX}-header-edit`
};
const Root = styled(Drawer, {
name: PREFIX,
slot: 'Root',
overridesResolver: (props, styles) => [styles.root]
})(() => ({}));
export default function LessonDrawer(inProps) {
// PROPS
const props = useThemeProps({
props: inProps,
name: PREFIX
});
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"]);
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 }) }))] })));
}