function MainComponent() { const [prompt, setPrompt] = React.useState(''); const [imageUrl, setImageUrl] = React.useState(''); const [loading, setLoading] = React.useState(false); const [chatResponse, setChatResponse] = React.useState(''); const fetchImage = async (adjustedPrompt)=>{ try { const response = await fetch(`/integrations/stable-diffusion/?prompt=${encodeURIComponent(adjustedPrompt)}`, { method: 'GET' }); const data = await response.json(); if (data && data.data.length > 0) { setImageUrl(data.data[0]); } } catch (error) { console.error('Failed to generate image:', error); } }; const handleGeminiSubmission = async ()=>{ try { const chatResponse = await fetch('/integrations/google-gemini/', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: "user", content: prompt } ] }) }); const chatData = await chatResponse.json(); if (chatData && chatData.choices.length > 0) { return chatData.choices[0].message.content; } } catch (error) { console.error('Google Gemini Request failed:', error); } }; const handleSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setImageUrl(''); setChatResponse(''); const adjustedPrompt = await handleGeminiSubmission(); if (adjustedPrompt) { setChatResponse(adjustedPrompt); await fetchImage(adjustedPrompt); } setLoading(false); }; const handleChange = (e)=>{ setPrompt(e.target.value); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen p-4 bg-gray-100", __source: { fileName: "", lineNumber: 59, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-md p-8 bg-white rounded-lg shadow", __source: { fileName: "", lineNumber: 60, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { className: "space-y-4", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-semibold text-center text-gray-900", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, "画像生成アプリ"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "prompt", className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, "画像の説明"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "prompt", value: prompt, onChange: handleChange, className: "w-full p-2 mt-1 border border-gray-300 rounded-md shadow-sm focus:ring focus:ring-opacity-50 focus:ring-indigo-500", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-2", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "flex-1 py-2 text-sm font-semibold text-white bg-indigo-600 rounded-md shadow hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, loading ? '生成中...' : '生成'))), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: imageUrl, alt: prompt ? `${prompt}の調整された画像` : '生成された画像', className: "object-cover w-full h-64 rounded-md", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this })))); }