function MainComponent() { const [loading, setLoading] = React.useState(false); const handleDoublageClick = async ()=>{ setLoading(true); const audioFile = document.getElementById("audio-upload").files[0]; if (!audioFile) { setLoading(false); return; } const formData = new FormData(); formData.append("file", audioFile); try { const response = await fetch('/integrations/google-gemini-1-5/', { method: 'POST', body: JSON.stringify({ messages: [ { role: "user", content: "doublage" } ] }), headers: { 'Content-Type': 'application/json' } }); const data = await response.json(); const messageContent = data.choices[0].message.content; console.log(messageContent); // Do something with the message content } catch (error) { console.error(error); } setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center h-screen bg-gray-100 font-roboto", __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-[600px] bg-white shadow-md rounded-lg p-6", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold mb-4 text-center", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, "Doublage et Acteur Français et Actrice Française Réconnaissance"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "audio-upload", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, "Upload Audio"), /*#__PURE__*/ React.createElement("input", { className: "w-full px-3 py-2 border rounded", type: "file", name: "audio-upload", id: "audio-upload", accept: "audio/*", __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleDoublageClick, className: "btn-doublage flex items-center justify-center w-[200px] py-2 bg-blue-500 text-white font-bold rounded hover:bg-blue-700", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-microphone-alt mr-2", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }), "Doublage"), /*#__PURE__*/ React.createElement("button", { className: "btn-actor flex items-center justify-center w-[200px] py-2 bg-green-500 text-white font-bold rounded hover:bg-green-700", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user mr-2", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }), "Acteur Français"), /*#__PURE__*/ React.createElement("button", { className: "btn-actress flex items-center justify-center w-[200px] py-2 bg-purple-500 text-white font-bold rounded hover:bg-purple-700", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user-female mr-2", __source: { fileName: "", lineNumber: 58, columnNumber: 13 }, __self: this }), "Actrice Française")), loading && /*#__PURE__*/ React.createElement("div", { id: "loading-message", className: "text-center text-gray-500 mt-4", __source: { fileName: "", lineNumber: 63, columnNumber: 21 }, __self: this }, "Loading audio doublage..."))); }