function MainComponent() { const [links, setLinks] = React.useState([]); const [newLink, setNewLink] = React.useState(''); const [chatGptMessages, setChatGptMessages] = React.useState([]); const [chatGptInput, setChatGptInput] = React.useState(''); const [isLoading, setIsLoading] = React.useState(false); const [activePage, setActivePage] = React.useState('links'); React.useEffect(()=>{ setLinks(JSON.parse(localStorage.getItem('allLinks')) || []); }, []); React.useEffect(()=>{ localStorage.setItem('allLinks', JSON.stringify(links)); }, [ links ]); const handleLinkSubmit = (e)=>{ e.preventDefault(); if (newLink) { const updatedLinks = [ ...new Set([ ...links, newLink ]) ]; setLinks(updatedLinks); setNewLink(''); } }; const handleChatGptSubmit = (e)=>{ e.preventDefault(); setIsLoading(true); fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: 'user', content: chatGptInput } ], system_prompt: 'Provide a response based on the input', max_tokens: 2000 }) }).then((response)=>response.json()).then((data)=>{ setChatGptMessages((previousMessages)=>[ ...previousMessages, { role: 'user', content: chatGptInput }, { role: 'assistant', content: data.result } ]); setChatGptInput(''); setIsLoading(false); }); }; const LinksPageContent = ()=>/*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen space-y-6 bg-white", __source: { fileName: "", lineNumber: 51, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleLinkSubmit, className: "flex w-3/4 md:w-1/2", __source: { fileName: "", lineNumber: 52, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "url", placeholder: "Put https:// before link", value: newLink, onChange: (e)=>setNewLink(e.target.value), className: "w-full p-2 text-black border rounded-l-lg focus:outline-none", name: "newLink", required: true, __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "p-2 bg-black text-white border-l-0 rounded-r-lg", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, "Add Link")), /*#__PURE__*/ React.createElement("ul", { className: "w-3/4 md:w-1/2 space-y-1", __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this }, links.map((link, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "py-2", __source: { fileName: "", lineNumber: 68, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: `https://www.google.com/search?q=${encodeURIComponent(link)}`, target: "_blank", rel: "noopener noreferrer", className: "text-black", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, link))))); const ChatGptPageContent = ()=>/*#__PURE__*/ React.createElement("div", { className: `flex flex-col items-center justify-center min-h-screen space-y-6 ${isLoading ? 'bg-gray-300' : 'bg-white'}`, __source: { fileName: "", lineNumber: 84, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleChatGptSubmit, className: "flex w-3/4 md:w-1/2", __source: { fileName: "", lineNumber: 85, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: chatGptInput, onChange: (e)=>setChatGptInput(e.target.value), className: "w-full p-2 border rounded-l-lg focus:outline-none", name: "chatGptInput", placeholder: "Type your message", disabled: isLoading, __source: { fileName: "", lineNumber: 86, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "p-2 bg-black text-white border-l-0 rounded-r-lg", disabled: isLoading, __source: { fileName: "", lineNumber: 95, columnNumber: 9 }, __self: this }, isLoading ? /*#__PURE__*/ React.createElement("i", { className: "fa fa-spinner fa-spin", __source: { fileName: "", lineNumber: 96, columnNumber: 24 }, __self: this }) : 'Send')), /*#__PURE__*/ React.createElement("div", { className: "w-3/4 md:w-1/2 h-[300px] overflow-y-auto", __source: { fileName: "", lineNumber: 99, columnNumber: 7 }, __self: this }, chatGptMessages.map((msg, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `p-2 ${msg.role === 'user' ? 'text-black' : 'text-gray-600'}`, __source: { fileName: "", lineNumber: 101, columnNumber: 11 }, __self: this }, msg.content)))); return /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white min-h-screen", __source: { fileName: "", lineNumber: 110, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "p-4 text-center bg-white", __source: { fileName: "", lineNumber: 111, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActivePage('links'), className: `mx-2 font-roboto ${activePage === 'links' ? 'text-black' : 'text-gray-400'}`, __source: { fileName: "", lineNumber: 112, columnNumber: 9 }, __self: this }, "Links"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActivePage('chat'), className: `mx-2 font-roboto ${activePage === 'chat' ? 'text-black' : 'text-gray-400'}`, __source: { fileName: "", lineNumber: 115, columnNumber: 9 }, __self: this }, "Chat with GPT")), /*#__PURE__*/ React.createElement("main", { __source: { fileName: "", lineNumber: 119, columnNumber: 7 }, __self: this }, activePage === 'links' ? /*#__PURE__*/ React.createElement(LinksPageContent, { __source: { fileName: "", lineNumber: 120, columnNumber: 35 }, __self: this }) : /*#__PURE__*/ React.createElement(ChatGptPageContent, { __source: { fileName: "", lineNumber: 120, columnNumber: 58 }, __self: this }))); }