UNPKG

leumas-private-shared

Version:

Private React JSX Package For Leumas Shared Components, Headers, Footers, Asides, Login Pages, API Key Manager and much more. Styles and everything reusable to avoid DRY code across all of our subdomains

42 lines (33 loc) 1.85 kB
import {useEffect} from 'react'; import GenerativeForm from './Components/GenerativeForm'; import React from 'react'; const GenerateSchema = ({ apiKey = "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" }) => { const inputFields = [ { name: 'current', label: 'Current Schema', 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") alert("You must set an api key!") // Ask the user if they would like the set their api key now f they do not have one set already } }, [apiKey]) const handleGeneratedSchema = (data) => { // Process the generated schema here, e.g., save it or display it differently console.log('Generated Schema:', data); }; return ( <> <GenerativeForm apiKey={apiKey} endpoint={`${import.meta.env.VITE_REACT_APP_LEUMAS_API_ENDPOINT}/generative/generate-schema`} inputFields={inputFields} onGenerate={handleGeneratedSchema} /> {/* Down below in these areas will be our Actual UI. So the generative form is good for providing the raw data, either json, an array, some text, etc.. We need to take the data returned from chatGPT to allow for more ineractions below. For example if they generate a circuit we will show a circuit / table for it. Or if its a table we should see the table and be able to export the table to various places */} {/* In this case Generate Schema we will likely receive JS code so we would like to be able to see it in a extarea, as well as some type of visual for the mongodb schema we will be creating here, */} </> ); }; export default GenerateSchema;