function MainComponent() { const [gptResponse, setGptResponse] = React.useState(""); const [loadingGpt, setLoadingGpt] = React.useState(false); const [imageSrc, setImageSrc] = React.useState(""); const title = "Test"; const content = "Hello World!"; const prompt = `a poster for an international programming, robotics, IoT, and AI test with certificate showcasing`; React.useEffect(()=>{ const fetchGptResponse = async ()=>{ setLoadingGpt(true); const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: 'user', content: 'Provide a compelling description for an international test on programming, robotics, IoT, and AI that also showcases a prestigious certificate.' } ], system_prompt: title }) }); const result = await response.json(); if (result.status) { setGptResponse(result.result); } setLoadingGpt(false); }; const fetchStableDiffusionImage = async ()=>{ const response = await fetch(`/integrations/stable-diffusion/?prompt=${encodeURIComponent(prompt)}&batch_size=1`, { method: 'GET' }); const result = await response.json(); setImageSrc(result.data[0]); }; fetchGptResponse(); fetchStableDiffusionImage(); }, []); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#fffdd0] text-[#36393b] font-roboto", __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "p-4 md:p-8 bg-[#36393b] text-[#fffdd0]", __source: { fileName: "", lineNumber: 44, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl md:text-5xl font-bold", __source: { fileName: "", lineNumber: 45, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-school-flag", __source: { fileName: "", lineNumber: 46, columnNumber: 21 }, __self: this }), ' ', "International Programming & AI Test")), /*#__PURE__*/ React.createElement("main", { className: "p-4 md:p-8", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-8 text-center", __source: { fileName: "", lineNumber: 51, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl md:text-3xl font-semibold", __source: { fileName: "", lineNumber: 52, columnNumber: 21 }, __self: this }, title), loadingGpt ? /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 54, columnNumber: 25 }, __self: this }, "Loading...") : /*#__PURE__*/ React.createElement("p", { className: "text-lg md:text-xl", __source: { fileName: "", lineNumber: 56, columnNumber: 25 }, __self: this }, gptResponse || content)), /*#__PURE__*/ React.createElement("section", { className: "grid grid-cols-1 md:grid-cols-2 gap-4 items-center mb-8", __source: { fileName: "", lineNumber: 60, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "order-2 md:order-1", __source: { fileName: "", lineNumber: 61, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl md:text-2xl font-semibold", __source: { fileName: "", lineNumber: 62, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-code", __source: { fileName: "", lineNumber: 62, columnNumber: 75 }, __self: this }), ' ', " Test Your Skills"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 63, columnNumber: 25 }, __self: this }, "Engage with challenges in programming, robotics, IoT, and AI, and earn a certificate recognized internationally."), /*#__PURE__*/ React.createElement("button", { className: "mt-4 px-6 py-2 bg-[#36393b] text-[#fffdd0] font-semibold rounded-md", __source: { fileName: "", lineNumber: 66, columnNumber: 25 }, __self: this }, "Start Now ", /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-arrow-right-long", __source: { fileName: "", lineNumber: 67, columnNumber: 39 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "order-1 md:order-2", __source: { fileName: "", lineNumber: 70, columnNumber: 21 }, __self: this }, imageSrc ? /*#__PURE__*/ React.createElement("img", { src: imageSrc, alt: "International test poster showcasing programming, robotics, IoT, AI and prestigious certificate", className: "w-full h-auto", __source: { fileName: "", lineNumber: 72, columnNumber: 29 }, __self: this }) : /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 74, columnNumber: 29 }, __self: this }, "Loading Image..."))), /*#__PURE__*/ React.createElement("section", { className: "text-center", __source: { fileName: "", lineNumber: 79, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl md:text-2xl font-semibold", __source: { fileName: "", lineNumber: 80, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-award", __source: { fileName: "", lineNumber: 80, columnNumber: 71 }, __self: this }), ' ', " Certificates"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 81, columnNumber: 21 }, __self: this }, "Showcase your expertise with a prestigious certificate. Get recognized for your skills globally."), /*#__PURE__*/ React.createElement("div", { className: "mt-4 inline-block", __source: { fileName: "", lineNumber: 84, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/images/certificate-example.png", alt: "Display of a prestigious international programming and AI test certificate", className: "w-full max-w-md h-auto", __source: { fileName: "", lineNumber: 85, columnNumber: 25 }, __self: this })))), /*#__PURE__*/ React.createElement("footer", { className: "p-4 md:p-8 bg-[#36393b] text-[#fffdd0]", __source: { fileName: "", lineNumber: 90, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 91, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 92, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-users", __source: { fileName: "", lineNumber: 92, columnNumber: 24 }, __self: this }), " Join a community of tech enthusiasts"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 93, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-graduation-cap", __source: { fileName: "", lineNumber: 93, columnNumber: 24 }, __self: this }), " Empowering education and innovation")))); }