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

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

import React, { useState } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Stack, Icon, Button, Card, CardContent, CardActionArea } from "@mui/material"; //Интерфейсные элементы
import { BUTTONS } from "../../../../../app.text"; //Общие текстовые ресурсы
import { useQueryArgs } from "./hooks"; //Хуки для работы с аргументами запроса на сервере
import { QueryArgsDialog } from "./query_args_dialog"; //Диалог настройки состава атрибутов
import { Argument, ARGUMENT_SHAPE, ARGUMENT_VARIANT } from "../argument/argument"; //Аргумент запроса

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

//Компонент инспектора - Аргументы запроса
const InspectorQueryArguments = ({ query, args = [], onOptionsChanged = null }) => {
    //Собственное состояние - отображение диалога настройки состава аргументов
    const [openQueryArgsDialog, setOpenQueryArgsDialog] = useState(false);

    //Хук для взаимодействия с сервером
    const { addArg, editArg, removeArg } = useQueryArgs(query);

    //Уведомление родителя об изменении свойств
    const notifyOptionsChanged = () => onOptionsChanged && onOptionsChanged();

    //При нажатии на настройку аргументов
    const handleSetup = () => setOpenQueryArgsDialog(true);

    //При добавлении аргумента
    const handleArgAdd = async (arg, cb) => {
        await addArg(arg.name, arg.title, arg.dataType, arg.mandatory, arg.value);
        cb && cb();
        notifyOptionsChanged();
    };

    //При изменении аргумента
    const handleArgEdit = async (arg, cb) => {
        await editArg(arg.name, arg.title, arg.dataType, arg.mandatory, arg.value);
        cb && cb();
        notifyOptionsChanged();
    };

    //При удалении аргумента
    const handleArgRemove = async arg => {
        await removeArg(arg.name);
        notifyOptionsChanged();
    };

    //Закрытие диалога настройки состава аргументов по "Закрыть"
    const handleQueryArgsDialogClose = () => setOpenQueryArgsDialog(false);

    //Расчет флага "настроенности"
    const configured = args && args.length > 0 ? true : false;

    //Формирование представления
    return (
        <>
            {openQueryArgsDialog && (
                <QueryArgsDialog
                    args={args}
                    onArgAdd={handleArgAdd}
                    onArgEdit={handleArgEdit}
                    onArgRemove={handleArgRemove}
                    onClose={handleQueryArgsDialogClose}
                />
            )}
            {configured && (
                <Card variant={"outlined"}>
                    <CardActionArea onClick={handleSetup}>
                        <CardContent>
                            <Stack direction={"column"} spacing={1}>
                                {args.map((arg, i) => (
                                    <Argument key={i} arg={arg} variant={ARGUMENT_VARIANT.CHIP} />
                                ))}
                            </Stack>
                        </CardContent>
                    </CardActionArea>
                </Card>
            )}
            {!configured && (
                <Button startIcon={<Icon>build</Icon>} onClick={handleSetup}>
                    {BUTTONS.CONFIG}
                </Button>
            )}
        </>
    );
};

//Контроль свойств компонента - Компонент инспектора - Аргументы запроса
InspectorQueryArguments.propTypes = {
    query: PropTypes.number.isRequired,
    args: PropTypes.arrayOf(ARGUMENT_SHAPE),
    onOptionsChanged: PropTypes.func
};

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

export { InspectorQueryArguments };
