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

const DocumentSingle = () => {
    const { doc_id } = useParams<{ doc_id: string }>();
    const [loading, setLoading] = useLoading(true);
    const [docForm, setdocForm] = useState<any>()
    const fetchSingleDoc = async () => {
        setLoading(true)
        const resp = await getDocument(doc_id as string)
        setdocForm(resp.data)
        setLoading(false)
    }

    useEffect(() => {
        fetchSingleDoc()
    }, [doc_id])
    return (
        <>
            {
                !loading && docForm && <DynamicFormViewer doc_id={doc_id} form={docForm.form} formDataI={docForm.form_data} mode="view"/>
            }
            {
                docForm?.attachments && <DocumentAttachments attachments={docForm.attachments}/>
            }
        </>

    )

}

export default DocumentSingle;