import { useState, useEffect } from 'react';
import axios from 'axios';
import RequestEditor from "./RequestEditor"
import { sendBulkRequests } from './Helpers/sendBulkRequests';
import React from 'react';

const DEFAULT_ENDPOINT = `${import.meta.env.VITE_REACT_APP_LEUMAS_API_ENDPOINT}/wildcards/bulk-request`;

const BulkApiComponent = ({ requests }) => {
  const [results, setResults] = useState([]);
  const [isEditing, setIsEditing] = useState(false);
  const [customRequests, setCustomRequests] = useState([]);

  useEffect(() => {
    if (requests && requests.length > 0) {
      sendBulkRequests(DEFAULT_ENDPOINT, requests, 
        (data) => setResults(data),
        (error) => console.error(error)
      );
    } else {
      setIsEditing(true);
    }
  }, [requests]);

  return (
    <div>
      {isEditing ? (
        <RequestEditor setCustomRequests={setCustomRequests} sendBulkRequests={sendBulkRequests} />
      ) : (
        <div>
          <h3>Results:</h3>
          <pre>{JSON.stringify(results, null, 2)}</pre>
        </div>
      )}
    </div>
  );
};

export default BulkApiComponent;