diff --git a/src/components/Bookmarks.tsx b/src/components/Bookmarks.tsx index ce6c186b..b1b5cf47 100644 --- a/src/components/Bookmarks.tsx +++ b/src/components/Bookmarks.tsx @@ -6,6 +6,8 @@ import { RelayPool } from 'applesauce-relay' import { Bookmark } from '../types/bookmarks' import { BookmarkList } from './BookmarkList' import { fetchBookmarks } from '../services/bookmarkService' +import ContentPanel from './ContentPanel' +import { fetchReadableContent, ReadableContent } from '../services/readerService' interface BookmarksProps { relayPool: RelayPool | null @@ -15,6 +17,9 @@ interface BookmarksProps { const Bookmarks: React.FC = ({ relayPool, onLogout }) => { const [bookmarks, setBookmarks] = useState([]) const [loading, setLoading] = useState(true) + const [selectedUrl, setSelectedUrl] = useState(undefined) + const [readerLoading, setReaderLoading] = useState(false) + const [readerContent, setReaderContent] = useState(undefined) const activeAccount = Hooks.useActiveAccount() const accountManager = Hooks.useAccountManager() @@ -51,6 +56,20 @@ const Bookmarks: React.FC = ({ relayPool, onLogout }) => { await fetchBookmarks(relayPool, fullAccount || activeAccount, setBookmarks, setLoading, timeoutId) } + const handleSelectUrl = async (url: string) => { + setSelectedUrl(url) + setReaderLoading(true) + setReaderContent(undefined) + try { + const content = await fetchReadableContent(url) + setReaderContent(content) + } catch (err) { + console.warn('Failed to fetch readable content:', err) + } finally { + setReaderLoading(false) + } + } + const formatUserDisplay = () => { @@ -91,12 +110,25 @@ const Bookmarks: React.FC = ({ relayPool, onLogout }) => { } return ( - +
+
+ +
+
+ +
+
) }