import React, { useState, useEffect } from "react";
import PropTypes from "prop-types";
import Modal from 'antd/lib/modal';
import Spin from 'antd/lib/spin';
import Typography from 'antd/lib/typography';
import notification from 'antd/lib/notification';

const { Title } = Typography;

const JanelaPublicacoes = ({ pessoa, onclose }) => {
    const [ publicacoes, setPublicacoes ] = useState([]);
    const [ carregando, setCarregando ] = useState(false);

    useEffect(() => {
        setCarregando(true);
        const fail = () => {
            setCarregando(false);
            notification["error"]({
                message: 'Publicações',
                description:
                    'Houve uma falha ao carregar as publicações...',
                style: {
                    marginTop: 100
                }
            });
            onClose();
        };
        netuno.service({
            method: "GET",
            url: "/services/pessoas/publicacoes",
            data: {
                uid: pessoa.uid
            },
            credentials: "include",
            success: (response) => {
                console.log("Response", response)
                if(response.json) {
                    setPublicacoes(response.json);
                    setCarregando(false);
                } else {
                    fail();
                }
            },
            fail: (e) => {
                console.log("Pessoas/Publicacoes Fail.", e);
                fail();
            }
        });
    }, [])

    return (
        <Modal title="Publicações" visible={true} onOk={onClose} onCancel={onClose}>
            { carregando && <Spin/> }
            {
                publicacoes.length > 0 ?
                    publicacoes.map(
                        (publicacao) => (
                            <div key={publicacao.uid}>
                                <Title level={5}>{publicacao.comunidade}</Title>
                                {publicacao.mensagem}
                                <p><em>{ publicacao.momento.replace(".0", "") }</em></p>
                            </div>
                        )
                    )
                    : <p>Não fez publicações ainda.</p>
            }
        </Modal>
    );
};

JanelaPublicacoes.propTypes = {
    pessoa: PropTypes.object.isRequired,
    onClose: PropTypes.func.isRequired
}

export default JanelaPublicacoes;