function RefreshPapersButton({ loading, onClick }) { const buttonClass = `py-2 px-4 text-white rounded mb-5 ${loading ? 'bg-gray-300 cursor-not-allowed' : 'bg-blue-600'}`; const buttonText = loading ? 'Loading...' : 'Refresh Papers'; return /*#__PURE__*/ React.createElement("button", { onClick: onClick, disabled: loading, className: buttonClass, __source: { fileName: "", lineNumber: 6, columnNumber: 5 }, __self: this }, buttonText); } function RefreshPapersButtonStory() { const [loading, setLoading] = React.useState(false); const fetchPapers = ()=>{ setLoading(true); setTimeout(()=>{ setLoading(false); }, 2000); }; return /*#__PURE__*/ React.createElement("div", { className: "p-5", __source: { fileName: "", lineNumber: 27, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(RefreshPapersButton, { loading: loading, onClick: fetchPapers, __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this })); } const MainComponent = ()=>{ const [papers, setPapers] = React.useState([]); const [loading, setLoading] = React.useState(false); const [error, setError] = React.useState(null); const fetchPapers = async ()=>{ setLoading(true); setError(null); try { const corsProxy = 'https://cors-anywhere.herokuapp.com/'; const arxivUrl = 'http://export.arxiv.org/api/query?search_query=all:electron&start=0&max_results=10&sortBy=submittedDate&sortOrder=descending'; const response = await fetch(corsProxy + arxivUrl, { headers: { 'Origin': window.location.origin } }); if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } const data = await response.text(); const parser = new DOMParser(); const xmlDoc = parser.parseFromString(data, "text/xml"); const entries = xmlDoc.getElementsByTagName('entry'); const paperList = Array.from(entries).map((entry)=>({ title: entry.getElementsByTagName('title')[0].textContent, authors: Array.from(entry.getElementsByTagName('author')).map((author)=>author.getElementsByTagName('name')[0].textContent), summary: entry.getElementsByTagName('summary')[0].textContent, link: entry.getElementsByTagName('id')[0].textContent })); setPapers(paperList); } catch (err) { setError('Failed to fetch papers. Please try again later.'); console.error('Error fetching papers:', err); } finally{ setLoading(false); } }; React.useEffect(()=>{ fetchPapers(); }, []); return /*#__PURE__*/ React.createElement("div", { className: "max-w-[800px] mx-auto p-5", __source: { fileName: "", lineNumber: 48, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold mb-5", __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this }, "Latest arXiv Papers"), /*#__PURE__*/ React.createElement(RefreshPapersButton, { loading: loading, onClick: fetchPapers, __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }), error && /*#__PURE__*/ React.createElement("p", { className: "text-red-500 mb-5", __source: { fileName: "", lineNumber: 51, columnNumber: 17 }, __self: this }, error), papers.map((paper, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "border border-gray-300 rounded p-4 mb-4", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold mb-2", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, paper.title), /*#__PURE__*/ React.createElement("p", { className: "font-semibold mb-2", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, "Authors: ", paper.authors.join(', ')), /*#__PURE__*/ React.createElement("p", { className: "mb-2", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, paper.summary.substring(0, 200), "..."), /*#__PURE__*/ React.createElement("a", { href: paper.link, target: "_blank", rel: "noopener noreferrer", className: "text-blue-600 no-underline", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }, "Read More")))); };