function SendButton({ label, buttonClass }) { return /*#__PURE__*/ React.createElement("button", { className: `bg-blue-500 text-white p-2 rounded ${buttonClass}`, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, label); } function SendButtonStory() { return /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Send", buttonClass: "", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(SendButton, { label: "Send Now", buttonClass: "uppercase font-bold", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(SendButton, { label: "Send Message", buttonClass: "italic underline", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this })); } function MainComponent() { const [chatGptInput, setChatGptInput] = React.useState(""); const [stableDiffusionInput, setStableDiffusionInput] = React.useState(""); const [dalleInput, setDalleInput] = React.useState(""); const [translateInput, setTranslateInput] = React.useState(""); const [imageSearchInput, setImageSearchInput] = React.useState(""); const [webScrapingInput, setWebScrapingInput] = React.useState(""); const [googleGeminiInput, setGoogleGeminiInput] = React.useState(""); const [googleGemini15Input, setGoogleGemini15Input] = React.useState(""); const [loading, setLoading] = React.useState(false); const [result, setResult] = React.useState(""); const handleSubmit = async (integration)=>{ setLoading(true); let response; switch(integration){ case 'chat-gpt': response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: JSON.stringify({ messages: [ { role: 'user', content: chatGptInput } ], system_prompt: 'Explain this content' }) }); const chatGptData = await response.json(); setResult(chatGptData.choices[0].message.content); break; case 'stable-diffusion': response = await fetch(`/integrations/stable-diffusion/?prompt=${encodeURIComponent(stableDiffusionInput)}`, { method: 'GET' }); const stableDiffusionData = await response.json(); setResult(stableDiffusionData.data[0]); break; case 'dall-e-3': response = await fetch(`/integrations/dall-e-3/?prompt=${encodeURIComponent(dalleInput)}`, { method: 'GET' }); const dalleData = await response.json(); setResult(dalleData.data[0]); break; case 'google-translate': response = await fetch('/integrations/google-translate/language/translate/v2', { method: 'POST', body: new URLSearchParams({ q: translateInput, target: 'en' }) }); const translateData = await response.json(); setResult(translateData.data.translations[0].translatedText); break; case 'image-search': response = await fetch(`/integrations/image-search/imagesearch?q=${encodeURIComponent(imageSearchInput)}`, { method: 'GET' }); const imageSearchData = await response.json(); setResult(imageSearchData.items[0].thumbnailImageUrl); break; case 'web-scraping': response = await fetch('/integrations/web-scraping/post', { method: 'POST', body: JSON.stringify({ url: webScrapingInput, getText: true }) }); const webScrapingText = await response.text(); setResult(webScrapingText); break; case 'google-gemini': response = await fetch('/integrations/google-gemini/', { method: 'POST', body: JSON.stringify({ messages: [ { role: 'user', content: googleGeminiInput } ] }) }); const googleGeminiData = await response.json(); setResult(googleGeminiData.choices[0].message.content); break; case 'google-gemini-1-5': response = await fetch('/integrations/google-gemini-1-5/', { method: 'POST', body: JSON.stringify({ messages: [ { role: 'user', content: googleGemini15Input } ] }) }); const googleGemini15Data = await response.json(); setResult(googleGemini15Data.choices[0].message.content); break; default: break; } setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 98, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 99, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 font-semibold", htmlFor: "chatGptInput", __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this }, "ChatGPT"), /*#__PURE__*/ React.createElement("textarea", { id: "chatGptInput", name: "chatGptInput", className: "w-full p-2 border rounded", value: chatGptInput, onChange: (e)=>setChatGptInput(e.target.value), __source: { fileName: "", lineNumber: 101, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 102, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Send to ChatGPT", buttonClass: "w-full", onClick: ()=>handleSubmit('chat-gpt'), __source: { fileName: "", lineNumber: 103, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 106, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 font-semibold", htmlFor: "stableDiffusionInput", __source: { fileName: "", lineNumber: 107, columnNumber: 9 }, __self: this }, "Stable Diffusion"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "stableDiffusionInput", name: "stableDiffusionInput", className: "w-full p-2 border rounded", value: stableDiffusionInput, onChange: (e)=>setStableDiffusionInput(e.target.value), __source: { fileName: "", lineNumber: 108, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 109, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Generate Image", buttonClass: "w-full", onClick: ()=>handleSubmit('stable-diffusion'), __source: { fileName: "", lineNumber: 110, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 113, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 font-semibold", htmlFor: "dalleInput", __source: { fileName: "", lineNumber: 114, columnNumber: 9 }, __self: this }, "DALL-E 3"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "dalleInput", name: "dalleInput", className: "w-full p-2 border rounded", value: dalleInput, onChange: (e)=>setDalleInput(e.target.value), __source: { fileName: "", lineNumber: 115, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 116, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Generate Image", buttonClass: "w-full", onClick: ()=>handleSubmit('dall-e-3'), __source: { fileName: "", lineNumber: 117, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 120, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 font-semibold", htmlFor: "translateInput", __source: { fileName: "", lineNumber: 121, columnNumber: 9 }, __self: this }, "Google Translate"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "translateInput", name: "translateInput", className: "w-full p-2 border rounded", value: translateInput, onChange: (e)=>setTranslateInput(e.target.value), __source: { fileName: "", lineNumber: 122, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 123, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Translate", buttonClass: "w-full", onClick: ()=>handleSubmit('google-translate'), __source: { fileName: "", lineNumber: 124, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 127, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 font-semibold", htmlFor: "imageSearchInput", __source: { fileName: "", lineNumber: 128, columnNumber: 9 }, __self: this }, "Image Search"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "imageSearchInput", name: "imageSearchInput", className: "w-full p-2 border rounded", value: imageSearchInput, onChange: (e)=>setImageSearchInput(e.target.value), __source: { fileName: "", lineNumber: 129, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 130, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Search Image", buttonClass: "w-full", onClick: ()=>handleSubmit('image-search'), __source: { fileName: "", lineNumber: 131, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 134, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 font-semibold", htmlFor: "webScrapingInput", __source: { fileName: "", lineNumber: 135, columnNumber: 9 }, __self: this }, "Web Scraping"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "webScrapingInput", name: "webScrapingInput", className: "w-full p-2 border rounded", value: webScrapingInput, onChange: (e)=>setWebScrapingInput(e.target.value), __source: { fileName: "", lineNumber: 136, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 137, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Scrape Website", buttonClass: "w-full", onClick: ()=>handleSubmit('web-scraping'), __source: { fileName: "", lineNumber: 138, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 141, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 font-semibold", htmlFor: "googleGeminiInput", __source: { fileName: "", lineNumber: 142, columnNumber: 9 }, __self: this }, "Google Gemini"), /*#__PURE__*/ React.createElement("textarea", { id: "googleGeminiInput", name: "googleGeminiInput", className: "w-full p-2 border rounded", value: googleGeminiInput, onChange: (e)=>setGoogleGeminiInput(e.target.value), __source: { fileName: "", lineNumber: 143, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 144, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Send to Google Gemini", buttonClass: "w-full", onClick: ()=>handleSubmit('google-gemini'), __source: { fileName: "", lineNumber: 145, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 148, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 font-semibold", htmlFor: "googleGemini15Input", __source: { fileName: "", lineNumber: 149, columnNumber: 9 }, __self: this }, "Google Gemini 1.5"), /*#__PURE__*/ React.createElement("textarea", { id: "googleGemini15Input", name: "googleGemini15Input", className: "w-full p-2 border rounded", value: googleGemini15Input, onChange: (e)=>setGoogleGemini15Input(e.target.value), __source: { fileName: "", lineNumber: 150, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 151, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SendButton, { label: "Send to Google Gemini 1.5", buttonClass: "w-full", onClick: ()=>handleSubmit('google-gemini-1-5'), __source: { fileName: "", lineNumber: 152, columnNumber: 11 }, __self: this }))), loading && /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 155, columnNumber: 19 }, __self: this }, "Loading..."), result && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 border rounded", __source: { fileName: "", lineNumber: 156, columnNumber: 18 }, __self: this }, result)); }