function MainComponent() { const [loading, setLoading] = React.useState(false); const [result, setResult] = React.useState(''); const [userData, setUserData] = React.useState({ students: 3, process: 1, done: 1, hold: 0 }); const handleMessageIntegration = async ()=>{ setLoading(true); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { "role": "user", "content": "the content of the message" } ], system_prompt: 'Explain this content' }) }); const data = await response.json(); if (data.status) { setResult(data.result); } else { throw new Error('Failed to get the result'); } } catch (error) { setResult('Error: ' + error.message); } finally{ setLoading(false); } }; React.useEffect(()=>{ handleMessageIntegration(); }, []); const cardClassName = "rounded-lg border p-4 flex flex-col items-center justify-between"; const iconClassName = "text-3xl mb-2"; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#EDF2F7] p-8", __source: { fileName: "", lineNumber: 46, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-4", __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `${cardClassName} w-full sm:w-[calc(50%-1rem)] lg:w-1/4`, __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${iconClassName} fa-solid fa-graduation-cap text-blue-500`, __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-xl", __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }, userData.students), /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, "students"), /*#__PURE__*/ React.createElement("div", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, "3 registrations are done"))), /*#__PURE__*/ React.createElement("div", { className: `${cardClassName} w-full sm:w-[calc(50%-1rem)] lg:w-1/4`, __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${iconClassName} fa-solid fa-gears text-yellow-500`, __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-xl", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }, userData.process), /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, "process"), /*#__PURE__*/ React.createElement("div", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 61, columnNumber: 13 }, __self: this }, "1 under process"))), /*#__PURE__*/ React.createElement("div", { className: `${cardClassName} w-full sm:w-[calc(50%-1rem)] lg:w-1/4`, __source: { fileName: "", lineNumber: 64, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${iconClassName} fa-solid fa-circle-check text-green-500`, __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-xl", __source: { fileName: "", lineNumber: 67, columnNumber: 13 }, __self: this }, userData.done), /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, "done"), /*#__PURE__*/ React.createElement("div", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, "1 done successfully"))), /*#__PURE__*/ React.createElement("div", { className: `${cardClassName} w-full sm:w-[calc(50%-1rem)] lg:w-1/4`, __source: { fileName: "", lineNumber: 72, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${iconClassName} fa-solid fa-pause-circle text-red-500`, __source: { fileName: "", lineNumber: 73, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-xl", __source: { fileName: "", lineNumber: 75, columnNumber: 13 }, __self: this }, userData.hold), /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 76, columnNumber: 13 }, __self: this }, "hold"), /*#__PURE__*/ React.createElement("div", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 77, columnNumber: 13 }, __self: this }, "1 on hold")))), /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 81, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-2", __source: { fileName: "", lineNumber: 82, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-semibold", __source: { fileName: "", lineNumber: 83, columnNumber: 11 }, __self: this }, "Process Tracker"), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-2", __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-xs font-semibold", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }, "processed"), /*#__PURE__*/ React.createElement("div", { className: "w-16 h-2 bg-purple-300 rounded-full overflow-hidden", __source: { fileName: "", lineNumber: 86, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-full bg-purple-600", style: { width: '40%' }, __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "text-xs font-semibold", __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this }, "under process"), /*#__PURE__*/ React.createElement("div", { className: "w-16 h-2 bg-purple-300 rounded-full overflow-hidden", __source: { fileName: "", lineNumber: 90, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-full bg-purple-600", style: { width: '60%' }, __source: { fileName: "", lineNumber: 91, columnNumber: 15 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 97, columnNumber: 7 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 100, columnNumber: 11 }, __self: this }, "Loading...") : /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 102, columnNumber: 11 }, __self: this }, result))); }