function MainComponent() { const [searchQuery, setSearchQuery] = React.useState(""); const [searchResults, setSearchResults] = React.useState([]); const [imageResults, setImageResults] = React.useState([]); const [aiResponse, setAiResponse] = React.useState(""); const [loading, setLoading] = React.useState(false); const handleSearch = async (e)=>{ e.preventDefault(); setLoading(true); try { const searchResponse = await fetch(`/integrations/google-search/search?q=${searchQuery}`); const searchData = await searchResponse.json(); setSearchResults(searchData.items); const imageResponse = await fetch(`/integrations/image-search/imagesearch?q=${searchQuery}`); const imageData = await imageResponse.json(); setImageResults(imageData.items); const chatResponse = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: JSON.stringify({ messages: [ { role: 'user', content: `${searchQuery}について教えて` } ] }), headers: { 'Content-Type': 'application/json' } }); const chatData = await chatResponse.json(); setAiResponse(chatData.choices[0].message.content); } catch (error) { console.error("Error fetching data:", error); } finally{ setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#F5F5F5] flex flex-col items-center p-6", __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold font-crimson-text text-[#333] mb-6", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, "日本のお笑い情報検索アプリ"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[600px] mb-6", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { className: "flex space-x-4", onSubmit: handleSearch, __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "searchQuery", value: searchQuery, onChange: (e)=>setSearchQuery(e.target.value), placeholder: "お笑いやエンタメに関する質問を入力してください...", className: "flex-1 p-2 border border-[#CCCCCC] rounded-md", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#FF6347] text-white p-2 rounded-md font-bold", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, "検索"))), loading ? /*#__PURE__*/ React.createElement("div", { className: "text-center text-xl font-crimson-text", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, "読み込み中...") : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[600px]", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded-lg shadow-lg mb-4", __source: { fileName: "", lineNumber: 61, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold font-crimson-text text-[#333]", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "検索結果"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside space-y-4 mt-4", __source: { fileName: "", lineNumber: 63, columnNumber: 15 }, __self: this }, searchResults.map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-xl font-crimson-text", __source: { fileName: "", lineNumber: 65, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: item.link, className: "text-blue-500 underline", __source: { fileName: "", lineNumber: 66, columnNumber: 21 }, __self: this }, item.title))))), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold font-crimson-text text-[#333]", __source: { fileName: "", lineNumber: 72, columnNumber: 15 }, __self: this }, "おすすめ画像"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-4 mt-4", __source: { fileName: "", lineNumber: 73, columnNumber: 15 }, __self: this }, imageResults.map((item, index)=>/*#__PURE__*/ React.createElement("img", { key: index, src: item.thumbnailImageUrl, alt: `お笑い画像${index + 1}`, className: "w-full h-auto rounded-md", __source: { fileName: "", lineNumber: 75, columnNumber: 19 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded-lg shadow-lg mt-4", __source: { fileName: "", lineNumber: 79, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold font-crimson-text text-[#333]", __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this }, "AIの回答"), /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-xl font-crimson-text", __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this }, aiResponse))))); }