"use client"; function MainComponent() { const [loading, setLoading] = React.useState(false); const [verse, setVerse] = React.useState(""); const [audioUrl, setAudioUrl] = React.useState(""); const generateVerse = async ()=>{ setLoading(true); setVerse(""); setAudioUrl(""); try { const response = await fetch("https://hook.us1.make.com/gsphzt2lfmr3gn92cgdpwybeg8bhaltf", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ ocupo_versiculo: "ocupo versiculo" }) }); const data = await response.json(); setVerse(data.versiculo); const audioResponse = await fetch(`/integrations/text-to-speech/speech?text=${encodeURIComponent(data.versiculo)}`, { method: "GET" }); const audioBlob = await audioResponse.blob(); const audioUrl = URL.createObjectURL(audioBlob); setAudioUrl(audioUrl); } catch (error) { console.error("Error al obtener el versículo o el audio:", error); } finally{ setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center font-sans bg-gradient-to-b from-[#ff99cc] to-[#66ccff] text-[#333] w-full min-h-screen", __source: { fileName: "", lineNumber: 43, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center py-16", __source: { fileName: "", lineNumber: 44, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl font-bold mb-4", __source: { fileName: "", lineNumber: 45, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/f02169bf-6e15-4e75-9ce5-26471c5d9597/-/format/auto/", alt: "Aprende Inglés con la Biblia", className: "w-[300px] my-4 shadow-2xl rounded-lg", __source: { fileName: "", lineNumber: 46, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "text-lg text-center", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, "Practica tu inglés y fortalece tu fe con nuestras herramientas interactivas.")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row justify-center items-center bg-white text-[#333] w-full py-10 px-4 rounded-lg shadow-md", __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mx-4 mb-8 md:mb-0", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "🎧 Listening"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, "Escucha versículos en inglés y mejora tu comprensión auditiva."), /*#__PURE__*/ React.createElement("button", { onClick: generateVerse, className: "bg-yellow-500 text-white py-2 px-4 rounded-full mt-4 shadow-md hover:bg-yellow-400", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin", __source: { fileName: "", lineNumber: 65, columnNumber: 24 }, __self: this }) : "Listening"), verse && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-yellow-100 rounded", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, verse, audioUrl && /*#__PURE__*/ React.createElement("audio", { controls: true, src: audioUrl, className: "mt-4", __source: { fileName: "", lineNumber: 70, columnNumber: 28 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "text-center mx-4 mb-8 md:mb-0", __source: { fileName: "", lineNumber: 74, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, "🎤 Speaking"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 76, columnNumber: 11 }, __self: this }, "Practica tu pronunciación leyendo versículos en voz alta."), /*#__PURE__*/ React.createElement("a", { href: "/speaking-biblia-ingles", target: "_self", __source: { fileName: "", lineNumber: 77, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-green-500 text-white py-2 px-4 rounded-full mt-4 shadow-md hover:bg-green-400", __source: { fileName: "", lineNumber: 78, columnNumber: 13 }, __self: this }, "Speaking"))), /*#__PURE__*/ React.createElement("div", { className: "text-center mx-4", __source: { fileName: "", lineNumber: 83, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, "📖 Writing, Reading & Grammar"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 87, columnNumber: 11 }, __self: this }, "Conversa con nuestro chatbot de iA sobre la Biblia y gramática inglesa."), /*#__PURE__*/ React.createElement("a", { href: "/ingles-con-la-biblia", target: "_self", __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-purple-500 text-white py-2 px-4 rounded-full mt-4 shadow-md hover:bg-purple-400", __source: { fileName: "", lineNumber: 92, columnNumber: 13 }, __self: this }, "Iniciar Chatbot")))), /*#__PURE__*/ React.createElement("footer", { className: "flex flex-col items-center text-[#fafafa] bg-[#444] w-full py-4 mt-8", __source: { fileName: "", lineNumber: 99, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this }, "©", " ", /*#__PURE__*/ React.createElement("a", { target: "_self", href: "https://www.iapersonalizada.com/", className: "underline text-yellow-400 hover:text-yellow-300", __source: { fileName: "", lineNumber: 102, columnNumber: 11 }, __self: this }, "RLTec")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 110, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { target: "_self", href: "https://iapersonalizada.com", className: "underline text-yellow-400 hover:text-yellow-300", __source: { fileName: "", lineNumber: 111, columnNumber: 11 }, __self: this }, "iA Personalizada")))); }