function MainComponent() { const projects = [ { title: "Project A", description: "Description of Project A. Detailed information goes here.", manager: "Alice Johnson", dueDate: "2023-12-31" }, { title: "Project B", description: "Description of Project B. Detailed information goes here.", manager: "Bob Smith", dueDate: "2024-01-15" }, { title: "Project C", description: "Description of Project C. Detailed information goes here.", manager: "Chris Lee", dueDate: "2024-03-22" } ]; const [loadingMessage, setLoadingMessage] = React.useState(""); const [chatMessage, setChatMessage] = React.useState(""); const [imageUrl, setImageUrl] = React.useState(""); const fetchChatGPTResponse = async ()=>{ setLoadingMessage("Generating chat response..."); const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { "role": "user", "content": "Tell me about our borehole project status." } ] }) }); const data = await response.json(); setChatMessage(data.choices[0].message.content); setLoadingMessage(""); }; const fetchImage = async ()=>{ const response = await fetch('/integrations/stable-diffusion-v-3/?prompt=borehole+project', { method: 'GET' }); const data = await response.json(); setImageUrl(data.data[0]); }; React.useEffect(()=>{ fetchChatGPTResponse(); fetchImage(); }, []); return /*#__PURE__*/ React.createElement("div", { className: "p-6 bg-gray-100 min-h-screen font-roboto", __source: { fileName: "", lineNumber: 57, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-6", __source: { fileName: "", lineNumber: 58, columnNumber: 7 }, __self: this }, "Project Department"), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 59, columnNumber: 7 }, __self: this }, loadingMessage ? /*#__PURE__*/ React.createElement("p", { className: "text-blue-500", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, loadingMessage) : /*#__PURE__*/ React.createElement("p", { className: "text-gray-800", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, chatMessage)), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this }, projects.map((project, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white p-4 shadow-md rounded-lg", __source: { fileName: "", lineNumber: 68, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-2", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, project.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-4", __source: { fileName: "", lineNumber: 70, columnNumber: 13 }, __self: this }, project.description), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-500 mr-2 text-sm", __source: { fileName: "", lineNumber: 72, columnNumber: 15 }, __self: this }, "Manager:"), /*#__PURE__*/ React.createElement("span", { className: "text-gray-800 text-md font-medium", __source: { fileName: "", lineNumber: 73, columnNumber: 15 }, __self: this }, project.manager)), /*#__PURE__*/ React.createElement("div", { className: "mt-2 flex items-center", __source: { fileName: "", lineNumber: 75, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-calendar-alt text-gray-500 mr-2", __source: { fileName: "", lineNumber: 76, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-gray-800 text-sm", __source: { fileName: "", lineNumber: 77, columnNumber: 15 }, __self: this }, "Due Date: ", project.dueDate)), imageUrl && /*#__PURE__*/ React.createElement("img", { src: imageUrl, alt: "Borehole Project", className: "mt-4 w-full h-auto rounded-lg", __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this }))))); }