import React, { useEffect, useState } from "react";
import styles from "./styles.module.scss";
import { Fade, Grow, Modal } from "@mui/material";


const i18n = global.i18n;
const WCommonTextTip = () => {
    const [open, setOpen] = useState(false);
    const [texts, setTexts] = useState([]);
    const show = (text = []) => {
        setTexts(text);
        setOpen(true);
    };
    const hide = () => {
        setOpen(false);
    };
    useEffect(() => {
        const commonTextTip = {
            show,
            hide
        };
        global.commonTextTip = commonTextTip;
    }, []);

    return (
        <Modal open={open} onClose={() => setOpen(false)} closeAfterTransition>
            <Fade in={open} timeout={300}>
                <div className={styles.container}>
                    <div className={styles.popup}>
                        <div className={styles.texts}>
                            {
                                texts.map((item, index) => {
                                    return (
                                        <div className={styles.text} key={index}>
                                            <span>{item}</span>
                                        </div>
                                    );
                                }
                                )
                            }
                        </div>

                        <div className={styles.btnOK} onClick={() => setOpen(false)}>
                            OK
                        </div>
                    </div>
                </div>
            </Fade >
        </Modal >


    );
};
export default WCommonTextTip;