function MainComponent() { const [isLoading, setIsLoading] = React.useState(false); const [chatGPTResponse, setChatGPTResponse] = React.useState(''); const [weatherResponse, setWeatherResponse] = React.useState(''); const chatGPTInputRef = React.useRef(null); const handleChatGPTSubmit = async (e)=>{ e.preventDefault(); const chatGPTInput = chatGPTInputRef.current.value; setIsLoading(true); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: JSON.stringify({ messages: [ { "role": "user", "content": chatGPTInput } ], system_prompt: chatGPTInput }), headers: { 'Content-Type': 'application/json' } }); const data = await response.json(); setChatGPTResponse(data.choices[0].message.content); } catch (error) { console.error('Request to ChatGPT failed:', error); } finally{ setIsLoading(false); } }; const fetchWeather = async ()=>{ setIsLoading(true); try { const response = await fetch('/integrations/weather-by-city/weather/Tokyo', { method: 'GET' }); const data = await response.json(); setWeatherResponse(`Weather in ${data.location.name}, ${data.location.region}: ${data.current.temp_c}°C and ${data.current.condition.text}`); } catch (error) { console.error('Request to Weather API failed:', error); } finally{ setIsLoading(false); } }; React.useEffect(()=>{ fetchWeather(); }, []); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center space-y-4", __source: { fileName: "", lineNumber: 56, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-[#121212]", __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this }, "ChatGPT & Weather Integration"), /*#__PURE__*/ React.createElement("p", { className: "text-lg font-roboto text-[#121212]", __source: { fileName: "", lineNumber: 58, columnNumber: 7 }, __self: this }, "This example demonstrates integrating with ChatGPT for text processing and fetching weather information."), /*#__PURE__*/ React.createElement("form", { onSubmit: handleChatGPTSubmit, className: "space-y-3 w-full max-w-[400px]", __source: { fileName: "", lineNumber: 61, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "chatGPTInput", className: "block mb-2 font-semibold", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, "Ask ChatGPT:"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "chatGPTInput", name: "chatGPTInput", placeholder: "Type your question or request", className: "w-full p-2 border rounded", ref: chatGPTInputRef, __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[400px]", __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "mt-4 font-semibold", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, "Weather Information:"), /*#__PURE__*/ React.createElement("p", { className: "", __source: { fileName: "", lineNumber: 70, columnNumber: 9 }, __self: this }, weatherResponse || (isLoading ? 'Loading weather data...' : 'No weather data available')))); }