@selfcommunity/react-ui
Version:
React UI Components to integrate a Community created with SelfCommunity Platform.
31 lines (30 loc) • 2.61 kB
JavaScript
import { __rest } from "tslib";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useThemeProps } from '@mui/system';
import classNames from 'classnames';
import { AppBar, Icon, IconButton, Toolbar, Typography, Box, styled } from '@mui/material';
import { PREFIX } from './constants';
import { SCLessonActionsType } from '../../types';
import { FormattedMessage } from 'react-intl';
import { LoadingButton } from '@mui/lab';
const classes = {
root: `${PREFIX}-root`,
startItems: `${PREFIX}-start-items`,
endItems: `${PREFIX}-end-items`,
title: `${PREFIX}-title`
};
const Root = styled(AppBar, {
name: PREFIX,
slot: 'Root',
overridesResolver: (props, styles) => [styles.root],
shouldForwardProp: (prop) => prop !== 'open'
})(({ theme }) => ({}));
export default function LessonAppbar(inProps) {
// PROPS
const props = useThemeProps({
props: inProps,
name: PREFIX
});
const { className = null, title = '', showComments, activePanel = null, handleOpen, onSave, editMode, onArrowBackClick, updating } = props, rest = __rest(props, ["className", "title", "showComments", "activePanel", "handleOpen", "onSave", "editMode", "onArrowBackClick", "updating"]);
return (_jsx(Root, Object.assign({ position: "fixed", open: Boolean(activePanel), className: classNames(classes.root, className) }, rest, { children: _jsxs(Toolbar, { children: [_jsxs(Box, Object.assign({ className: classes.startItems }, { children: [_jsx(IconButton, Object.assign({ edge: "start", onClick: onArrowBackClick }, { children: _jsx(Icon, { children: "arrow_back" }) })), _jsx(Typography, Object.assign({ variant: "h6", className: classes.title }, { children: title }))] })), editMode ? (_jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ onClick: () => handleOpen(SCLessonActionsType.SETTINGS), color: "primary" }, { children: _jsx(Icon, { children: "settings" }) })), _jsx(LoadingButton, Object.assign({ variant: "contained", size: "small", onClick: onSave, loading: updating }, { children: _jsx(FormattedMessage, { id: "ui.lessonAppbar.button.save", defaultMessage: "ui.lessonAppbar.button.save" }) }))] })) : (_jsxs(Box, Object.assign({ className: classes.endItems }, { children: [showComments && (_jsx(IconButton, Object.assign({ onClick: () => handleOpen(SCLessonActionsType.COMMENTS) }, { children: _jsx(Icon, { children: "chat_bubble_outline" }) }))), _jsx(IconButton, Object.assign({ onClick: () => handleOpen(SCLessonActionsType.LESSONS) }, { children: _jsx(Icon, { children: "courses" }) }))] })))] }) })));
}