fix: pass relayPool as prop instead of using non-existent hook

- Fixed crash when opening bookmark bar
- Removed non-existent Hooks.useRelayPool() call
- Added relayPool prop to SidebarHeader, BookmarkList, and ThreePaneLayout
- Threaded relayPool through component hierarchy from Bookmarks down
- Web bookmark creation now works correctly

src/components/BookmarkList.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faChevronLeft, faBookmark, faSpinner, faList, faThLarge, faImage } from '@fortawesome/free-solid-svg-icons'
+import { RelayPool } from 'applesauce-relay'
 import { Bookmark, IndividualBookmark } from '../types/bookmarks'
 import { BookmarkItem } from './BookmarkItem'
 import SidebarHeader from './SidebarHeader'
@@ -21,6 +22,7 @@ interface BookmarkListProps {
   onRefresh?: () => void
   isRefreshing?: boolean
   loading?: boolean
+  relayPool: RelayPool | null
 }
 
 export const BookmarkList: React.FC<BookmarkListProps> = ({
@@ -35,7 +37,8 @@ export const BookmarkList: React.FC<BookmarkListProps> = ({
   onOpenSettings,
   onRefresh,
   isRefreshing,
-  loading = false
+  loading = false,
+  relayPool
 }) => {
   // Helper to check if a bookmark has either content or a URL
   const hasContentOrUrl = (ib: IndividualBookmark) => {
@@ -98,6 +101,7 @@ export const BookmarkList: React.FC<BookmarkListProps> = ({
         onOpenSettings={onOpenSettings}
         onRefresh={onRefresh}
         isRefreshing={isRefreshing}
+        relayPool={relayPool}
       />
       
       {loading ? (

src/components/Bookmarks.tsx

@@ -165,6 +165,7 @@ const Bookmarks: React.FC<BookmarksProps> = ({ relayPool, onLogout }) => {
         setIsHighlightsCollapsed(true)
       }}
       onRefresh={handleRefreshAll}
+      relayPool={relayPool}
       readerLoading={readerLoading}
       readerContent={readerContent}
       selectedUrl={selectedUrl}

src/components/SidebarHeader.tsx

@@ -6,6 +6,7 @@ import { Hooks } from 'applesauce-react'
 import { useEventModel } from 'applesauce-react/hooks'
 import { Models } from 'applesauce-core'
 import { Accounts } from 'applesauce-accounts'
+import { RelayPool } from 'applesauce-relay'
 import IconButton from './IconButton'
 import AddBookmarkModal from './AddBookmarkModal'
 import { createWebBookmark } from '../services/webBookmarkService'
@@ -17,15 +18,15 @@ interface SidebarHeaderProps {
   onOpenSettings: () => void
   onRefresh?: () => void
   isRefreshing?: boolean
+  relayPool: RelayPool | null
 }
 
-const SidebarHeader: React.FC<SidebarHeaderProps> = ({ onToggleCollapse, onLogout, onOpenSettings, onRefresh, isRefreshing }) => {
+const SidebarHeader: React.FC<SidebarHeaderProps> = ({ onToggleCollapse, onLogout, onOpenSettings, onRefresh, isRefreshing, relayPool }) => {
   const [isConnecting, setIsConnecting] = useState(false)
   const [showAddModal, setShowAddModal] = useState(false)
   const navigate = useNavigate()
   const activeAccount = Hooks.useActiveAccount()
   const accountManager = Hooks.useAccountManager()
-  const relayPool = Hooks.useRelayPool()
   const profile = useEventModel(Models.ProfileModel, activeAccount ? [activeAccount.pubkey] : null)
 
   const handleLogin = async () => {

src/components/ThreePaneLayout.tsx

@@ -1,4 +1,5 @@
 import React from 'react'
+import { RelayPool } from 'applesauce-relay'
 import { BookmarkList } from './BookmarkList'
 import ContentPanel from './ContentPanel'
 import { HighlightsPanel } from './HighlightsPanel'
@@ -30,6 +31,7 @@ interface ThreePaneLayoutProps {
   onViewModeChange: (mode: ViewMode) => void
   onOpenSettings: () => void
   onRefresh: () => void
+  relayPool: RelayPool | null
   
   // Content pane
   readerLoading: boolean
@@ -86,6 +88,7 @@ const ThreePaneLayout: React.FC<ThreePaneLayoutProps> = (props) => {
             onRefresh={props.onRefresh}
             isRefreshing={props.isRefreshing}
             loading={props.bookmarksLoading}
+            relayPool={props.relayPool}
           />
         </div>
         <div className="pane main">