const Alert = ({ viuwAlert, titulo, mensaje, setViuwAlert }) => {
    return (
        <>
            {viuwAlert && 
                <div className="alert-container">
                    <div className="alert">
                        <div className="alert-header">
                            <p className="alert-title">
                                {titulo}
                            </p>
                            <button type="button"
                                    className="alert-close"
                                    aria-label="close"
                                    onClick={() => setViuwAlert(false)}>
                                ×
                            </button>
                        </div>
                        <div className="alert-body">
                            {mensaje}
                        </div>
                    </div>
                </div>
            }
        </>
    );
};

export default Alert;