import {useEffect} from 'react';
import GenerativeForm from './Components/GenerativeForm';
import React from 'react';

const GenerateTkinter = ({ apiKey }) => {
  const inputFields = [
    { name: 'currentTkinter', label: 'Current Tkinter GUI', multiline: true },
    { name: 'description', label: 'Description', multiline: true }
  ];

  useEffect(()=>{
    if(!apiKey || apiKey === '') {
        console.log("You need to have an OPENAI API key, or Leumas Pro Membership to use our tools")
    }
  }, [apiKey])

  const handleGeneratedTkinter = (data) => {
    // Process the generated Tkinter GUI here
    console.log('Generated Tkinter GUI:', data);
  };

  return (
    <>
    
    <GenerativeForm 
      apiKey={apiKey}
      endpoint={`${import.meta.env.VITE_REACT_APP_LEUMAS_API_ENDPOINT}/generative/generate-tkinter`}
      inputFields={inputFields}
      onGenerate={handleGeneratedTkinter}
    />
    </>
  );
};

export default GenerateTkinter;