function MainComponent() { const [chatGptResponse, setChatGptResponse] = React.useState(''); const [isLoading, setIsLoading] = React.useState(false); const sendMessageToChatGpt = async ()=>{ setIsLoading(true); const messages = [ { role: "system", content: "Describe GreenSeth's mission, vision, and services." } ]; try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages, system_prompt: 'GreenSeth is a tech developer in real estate. Explain its mission, vision, and services provided.' }) }); const data = await response.json(); if (data.status) { setChatGptResponse(data.result); } else { setChatGptResponse('An error occurred while fetching data from ChatGPT.'); } } catch (error) { setChatGptResponse('Failed to communicate with ChatGPT.'); } finally{ setIsLoading(false); } }; React.useEffect(()=>{ sendMessageToChatGpt(); }, []); const loadingIndicator = /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center", __source: { fileName: "", lineNumber: 42, columnNumber: 28 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-blue-900", __source: { fileName: "", lineNumber: 43, columnNumber: 5 }, __self: this })); const responseDisplay = /*#__PURE__*/ React.createElement("div", { className: "p-4 border border-gray-300 shadow rounded-md bg-white", __source: { fileName: "", lineNumber: 46, columnNumber: 27 }, __self: this }, chatGptResponse); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-green-200 p-6 font-roboto", __source: { fileName: "", lineNumber: 51, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl mx-auto bg-white rounded-lg shadow-lg overflow-hidden", __source: { fileName: "", lineNumber: 52, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-6 space-y-4", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-semibold text-gray-900", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, "GreenSeth - Tech Developer"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, "Connecting Real Estate Dreams with Sustainability and Technology.")), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold text-gray-800", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }, "Our Mission"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, "To establish solid connections with families, making their real estate dreams come true by creating high-standard residences that are both sustainable and digitally advanced.")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }, isLoading ? loadingIndicator : responseDisplay))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 70, columnNumber: 7 }, __self: this }, ` @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } `)); }