function MainComponent() { const [searchTopic, setSearchTopic] = React.useState(""); const [results, setResults] = React.useState([]); const [isLoading, setIsLoading] = React.useState(false); const [pageIndex, setPageIndex] = React.useState(0); const [suggestedUrls, setSuggestedUrls] = React.useState([]); const [suggestedTopics, setSuggestedTopics] = React.useState([]); const handleTopicChange = (event)=>{ setSearchTopic(event.target.value); }; const handleSubmit = async (event)=>{ event.preventDefault(); setIsLoading(true); setResults([]); setPageIndex(0); setSuggestedUrls([]); setSuggestedTopics([]); const formattedTopic = searchTopic.trim().replace(/\s+/g, "+"); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: "user", content: formattedTopic } ], system_prompt: 'Please provide 25 websites and 10 common search terms similar to the one entered.', max_tokens: 2000 }) }); const data = await response.json(); const urlsPattern = [ "https://news.google.com/news/section?output=rss&q=", "https://news.google.com/news/section?output=rss&q=", "http://hn.algolia.com/api/v1/search?query=", "http://www.reddit.com/search.xml?q=", "https://www.bing.com/news/search?q=", "https://news.yahoo.com/rss/", "http://feeds.bbci.co.uk/news/", "https://rss.cnn.com/rss/cnn_", "https://www.youtube.com/feeds/videos.xml?user=", "https://twitter.com/hashtag/", "https://feeds.feedburner.com/TechCrunch/", "https://en.wikipedia.org/w/index.php?title=Special:RecentChanges&feed=rss&" ]; const urlSuggestions = urlsPattern.map((url)=>`${url}${formattedTopic}&format=RSS`).slice(0, 25); setSuggestedUrls(urlSuggestions); const searchTerms = data.result.split('\n').filter((_, idx)=>idx % 2 !== 0).map((term)=>term.trim()).slice(0, 10); setSuggestedTopics(searchTerms); } catch (error) { setSuggestedUrls([ "There was an error connecting to the service. Please try again." ]); setSuggestedTopics([]); } setIsLoading(false); }; const handleFeedSelect = async (feedUrl)=>{ setIsLoading(true); setResults([]); try { const response = await fetch('/integrations/web-scraping/post', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ url: feedUrl }) }); const html = await response.text(); const parser = new DOMParser(); const doc = parser.parseFromString(html, "text/html"); const items = Array.from(doc.querySelectorAll("item, entry")); setResults(items.slice(0, 15).map((item)=>({ title: item.querySelector("title").textContent, link: item.querySelector("link").textContent, imageUrl: item.querySelector("media\\:content, content")?.getAttribute("url") || '/placeholder-image.png', description: item.querySelector("description, summary").textContent }))); } catch (error) { setResults([ "There was an error connecting to the service. Please try again." ]); } setIsLoading(false); }; const handleChangePage = (newPageIndex)=>{ setPageIndex(newPageIndex); }; const startIndex = pageIndex * 15; const endIndex = startIndex + 15; const pageResults = results.slice(startIndex, endIndex); const feedButtons = suggestedUrls.map((url, index)=>/*#__PURE__*/ React.createElement("button", { key: index, className: "text-sm lg:text-base text-blue-300 hover:text-blue-100", onClick: ()=>handleFeedSelect(url), disabled: isLoading, __source: { fileName: "", lineNumber: 100, columnNumber: 5 }, __self: this }, url)); const paginationButtons = results.length > 15 && /*#__PURE__*/ React.createElement("div", { className: "flex justify-between mt-4", __source: { fileName: "", lineNumber: 111, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-l", onClick: ()=>handleChangePage(pageIndex - 1), disabled: pageIndex === 0, __source: { fileName: "", lineNumber: 112, columnNumber: 7 }, __self: this }, "Previous"), /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-r", onClick: ()=>handleChangePage(pageIndex + 1), disabled: endIndex >= results.length, __source: { fileName: "", lineNumber: 119, columnNumber: 7 }, __self: this }, "Next")); const instructionText = isLoading ? "Loading..." : "Please select a feed from the left side to view the latest news articles on the right side."; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col lg:flex-row bg-[#121212] text-white", __source: { fileName: "", lineNumber: 132, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "lg:w-1/2 p-4 lg:p-8 overflow-auto", __source: { fileName: "", lineNumber: 133, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl lg:text-4xl font-semibold mb-4", __source: { fileName: "", lineNumber: 134, columnNumber: 9 }, __self: this }, "IDEAS For Us Content Hunter"), /*#__PURE__*/ React.createElement("p", { className: "mb-4", __source: { fileName: "", lineNumber: 135, columnNumber: 9 }, __self: this }, instructionText), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "mb-4", __source: { fileName: "", lineNumber: 136, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "w-full p-2 lg:p-4 mb-4 bg-white text-black", type: "text", name: "searchTopic", placeholder: "Enter a search topic...", onChange: handleTopicChange, value: searchTopic, __source: { fileName: "", lineNumber: 137, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: `w-full p-2 lg:p-4 text-white font-bold mb-4 ${isLoading ? 'bg-gray-500' : 'bg-blue-500 hover:bg-blue-600'}`, disabled: isLoading, __source: { fileName: "", lineNumber: 145, columnNumber: 11 }, __self: this }, "Search Topics")), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 153, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl mb-2", __source: { fileName: "", lineNumber: 154, columnNumber: 11 }, __self: this }, "Suggested Search Terms:"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc pl-5", __source: { fileName: "", lineNumber: 155, columnNumber: 11 }, __self: this }, suggestedTopics.map((term, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "mb-1", __source: { fileName: "", lineNumber: 157, columnNumber: 15 }, __self: this }, term)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 161, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl mb-2", __source: { fileName: "", lineNumber: 162, columnNumber: 11 }, __self: this }, "Suggested Sites:"), /*#__PURE__*/ React.createElement("div", { className: "space-y-1", __source: { fileName: "", lineNumber: 163, columnNumber: 11 }, __self: this }, feedButtons))), /*#__PURE__*/ React.createElement("div", { className: "lg:w-1/2 p-4 lg:p-8 overflow-auto", __source: { fileName: "", lineNumber: 166, columnNumber: 7 }, __self: this }, pageResults.map((article, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "p-4 border-b border-gray-400 mb-4", __source: { fileName: "", lineNumber: 168, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-semibold text-lg mb-2", __source: { fileName: "", lineNumber: 169, columnNumber: 13 }, __self: this }, article.title), /*#__PURE__*/ React.createElement("img", { src: article.imageUrl, alt: `Illustration for ${article.title}`, className: "mb-4 w-full max-h-[200px] object-cover", __source: { fileName: "", lineNumber: 170, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-gray-300 mb-4", __source: { fileName: "", lineNumber: 171, columnNumber: 13 }, __self: this }, article.description), /*#__PURE__*/ React.createElement("a", { href: article.link, className: "text-blue-500 hover:text-blue-400", __source: { fileName: "", lineNumber: 172, columnNumber: 13 }, __self: this }, "Read more"))), paginationButtons)); }