import React, { useContext, useEffect, useState } from 'react';
import { Content } from './styles';
import Canvas from '../Canvas';
import Confirm from './Confirm';
import Main from './Main';
import { useTranslation } from 'react-i18next';
import { ModalContext } from '../Context';
const FeedbackModal = ({ onLike, onDislike, onOpen, }) => {
    const { closeModal } = useContext(ModalContext);
    const { t } = useTranslation();
    const [clicked, setClicked] = useState(false);
    useEffect(onOpen, []);
    const handleLike = () => {
        setClicked(true);
        onLike();
    };
    const handleDislike = () => {
        setClicked(true);
        onDislike();
    };
    return (React.createElement(Canvas, { color: "RGBA(0, 0, 0, 0.5)" },
        React.createElement(Content, null,
            React.createElement("div", { className: "balloon" },
                clicked ? (React.createElement(Confirm, null)) : (React.createElement(Main, { onLike: handleLike, onDislike: handleDislike })),
                React.createElement("button", { type: "button", className: "close", onClick: () => closeModal() },
                    React.createElement("span", { className: "finish" }, clicked
                        ? t('feedback.confirm.button')
                        : t('feedback.main.button')))))));
};
export default FeedbackModal;
//# sourceMappingURL=index.js.map