import React, {useState, useEffect} from 'react';
import Button from './Button';



function SECAPIData() {

    const [dataToBackend, setDataToBackend] = useState([]);
    const [displayData, setDisplayData] = useState("");

    const requestData = () => {
        // End early in debug to avoid too many requests.
        if (dataToBackend.length !== 0) {
            sendToBackend();
            return;
        }

        console.log("Makig request...");

        let date = new Date()
        let today = date.toISOString().slice(0, 10);

        let pastDate = new Date();
        pastDate.setDate(date.getDate() - 14);
        let past = pastDate.toISOString().slice(0, 10);

        fetch("https://api.sec-api.io?token=4d6ff81353d665c975d443e30020879b1ea882bc96a00cd8774a95bddd838fe5", {
            method: "POST",
            body: JSON.stringify({ 
                "query": { "query_string": { "query": "formType:4 AND filedAt:{"+ past +" TO "+ today +"} AND formType:(NOT \"N-4\") AND formType:(NOT \"4/A\")" } },
                "from": "0",
                "size": "1000", 
                "sort": [{ "filedAt": { "order": "desc" } }]
              }),
            headers: {
              "Content-Type": "application/json"
            },
            credentials: "same-origin"
          })
            .then(res => res.json())
            .then(data => {
                let list = [];
                data.filings.forEach(filing => {
                    if (filing.ticker === "") {
                        // TODO: why are there repitions of urls.
                        list.push({
                            timestamp: filing.filedAt,
                            url: filing.documentFormatFiles[1].documentUrl
                        });
                    }
                })
                setDataToBackend(list);
            })
        .catch(error => {
            console.log(error); 
        });
    }

    const sendToBackend = () => {
        console.log(dataToBackend);

        fetch("http://localhost:4567/data", {
            method: "POST",
            body: JSON.stringify({ 
               "data" : dataToBackend
              }),
              headers: {
                "Content-Type": "application/json",
              },
              credentials: "same-origin"
        })
        
        .then(response  => {
            setDisplayData(JSON.stringify(response));
            console.log(response);
        })
        .catch(function (error) {
            console.log(error); 
        });
    }

    // This hook is autocalled once the setDataToBackend takes effect.
    useEffect(() => sendToBackend(), [dataToBackend]);
  
    return (
      <div>
          <h1>SECAPIData</h1>
          <Button onPress={requestData}></Button>
          <p>DISPLAY DATA: {displayData}</p>
      </div>
    );
}
  
export default SECAPIData;