import React, {ReactNode, useEffect, useState} from 'react';
import {useParams} from "react-router-dom";
import useLoading from "../../../hooks/useLoading";
import {getDocument, getDocumentPublic} from "../../../API/dynamic-forms";
import DynamicFormViewer from "./DynamicFormViewer";

type DocumentViewPublicProps = {
    children?: ReactNode
}

const DocumentViewPublic = ({children}: DocumentViewPublicProps) => {

    const {doc_id} = useParams();
    const [loading, setLoading] = useLoading(true);
    const [docForm, setdocForm] = useState<any>()

    const fetchSingleDoc = async () => {
        setLoading(true)
        const resp = await getDocumentPublic(doc_id as string)
        setdocForm(resp.data)
        setLoading(false)
    }

    useEffect(() => {
        fetchSingleDoc()
    }, [doc_id])

    return (
        <>
            {
                !loading && docForm && <DynamicFormViewer form={docForm.form} formDataI={docForm.form_data} mode="view"/>
            }
        </>

    )
}

export default DocumentViewPublic;