/*
    Парус 8 - Панели мониторинга - Редакторы панелей
    Компонент: Контейнер редактора
*/

//---------------------
//Подключение библиотек
//---------------------

import React from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Box, Divider, IconButton, Icon, Stack } from "@mui/material"; //Интерфейсные компоненты MUI
import { BUTTONS } from "../../../app.text"; //Общие текстовые ресурсы

//-----------
//Тело модуля
//-----------

//Контейнер редактора
const P8PEditorBox = ({ title, children, onSave, allowClose = true }) => {
    //При нажатии на "Сохранить"
    const handleSaveClick = (closeEditor = false) => onSave && onSave(closeEditor);

    //Флаг отображения кнопок сохранения
    const showSaveBar = onSave ? true : false;

    //Формирование представления
    return (
        <Box p={2}>
            <Divider>{title}</Divider>
            <Stack direction={"column"} spacing={1}>
                {children}
            </Stack>
            {showSaveBar && (
                <Stack direction={"row"} justifyContent={"right"} p={1}>
                    <IconButton onClick={() => handleSaveClick(false)} title={BUTTONS.APPLY}>
                        <Icon>done</Icon>
                    </IconButton>
                    {allowClose ? (
                        <IconButton onClick={() => handleSaveClick(true)} title={BUTTONS.SAVE}>
                            <Icon>done_all</Icon>
                        </IconButton>
                    ) : null}
                </Stack>
            )}
        </Box>
    );
};

//Контроль свойств компонента - Контейнер редактора
P8PEditorBox.propTypes = {
    title: PropTypes.string.isRequired,
    children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
    onSave: PropTypes.func,
    allowClose: PropTypes.bool
};

//----------------
//Интерфейс модуля
//----------------

export { P8PEditorBox };
