import {React, useCallback, useEffect, useState} from "react";
import Modal from "react-bootstrap/Modal";
import * as EgovNet from "../../api/egovFetch";
import {VwDiv} from "./Sb.style";

const BookmarkModal = ({docCode, docPart}) => {
    const [modalTitle, setModalTitle] = useState();
    const [modalBody, setModalBody] = useState();

    const getModalContent = useCallback(() => {
        EgovNet.requestFetch(
            '/standardCode/getCodeDetailInfo.do',
            {
                method: "POST",
                headers: {
                    'Content-type': 'application/json'
                },
                body: JSON.stringify({
                    docCode: docCode,
                    docPart: docPart
                })
            },
            (resp) => {
                setModalTitle(docCode + " " + docPart);
                let bodyTag = []
                if(resp.result.document.length>0){
                    resp.result.document.forEach(function (item, index){
                        const isTitle = item.full_content.includes(item.group_title);
                        bodyTag.push(
                            <VwDiv depth={item.cont_level} isTitle={isTitle} id={item.cont_type_cd} dangerouslySetInnerHTML={ {__html: item.full_content} }></VwDiv>
                        )
                    })
                }
                setModalBody(bodyTag);
            },
            (resp) => {
                console.log("err response : ", resp);
            }
        );
    })

    useEffect(() => {
        getModalContent();
    }, []);

    return (
        <>
            <Modal.Header closeButton>
                <Modal.Title>
                    {modalTitle}
                </Modal.Title>
            </Modal.Header>
            <Modal.Body>
                {modalBody}
            </Modal.Body>
        </>
    );
}
export default BookmarkModal