function MainComponent() { const [inputValue, setInputValue] = React.useState(""); const [results, setResults] = React.useState(""); const [loading, setLoading] = React.useState(false); const handleInputChange = (event)=>{ setInputValue(event.target.value); }; const handleSubmit = async (event)=>{ event.preventDefault(); setLoading(true); setResults(""); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { "role": "user", "content": inputValue } ], system_prompt: 'Calculate the bias resistors values for a transistor amplifier circuit', max_tokens: 150 }) }); if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } const result = await response.json(); setResults(result.result); } catch (error) { setResults("Failed to calculate the values. Please try again."); } finally{ setLoading(false); } }; const isButtonDisabled = !inputValue || loading; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f7f7f7] p-4", __source: { fileName: "", lineNumber: 42, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-lg p-6 bg-white shadow-md rounded-md", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-semibold text-[#333] mb-4", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, "Transistor Bias Resistor Calculator"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 46, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "circuitSpecs", className: "text-[#333] font-roboto", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, "Enter your circuit specifications:"), /*#__PURE__*/ React.createElement("textarea", { id: "circuitSpecs", name: "circuitSpecs", rows: "4", className: "w-full p-2 text-[#333] border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500", placeholder: "Input voltage, transistor type, desired quiescent point, etc.", value: inputValue, onChange: handleInputChange, __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isButtonDisabled, className: `w-full p-3 text-white font-medium rounded-md ${isButtonDisabled ? 'bg-gray-400 cursor-not-allowed' : 'bg-blue-600 hover:bg-blue-700'}`, __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, loading ? 'Calculating...' : 'Calculate')), /*#__PURE__*/ React.createElement("div", { className: "mt-6", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold text-[#333] mb-2", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, "Results:"), /*#__PURE__*/ React.createElement("div", { className: "w-full p-4 text-[#333] border border-gray-300 rounded-md", __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this }, results)))); }