diff --git a/examples/web-chat/src/App.tsx b/examples/web-chat/src/App.tsx index 7ae79dd814..32ea1e4848 100644 --- a/examples/web-chat/src/App.tsx +++ b/examples/web-chat/src/App.tsx @@ -83,10 +83,8 @@ export default function App() { const persistedNick = window.localStorage.getItem('nick'); return persistedNick !== null ? persistedNick : generate(); }); - const [ - historicalMessagesRetrieved, - setHistoricalMessagesRetrieved, - ] = useState(false); + const [historicalMessagesRetrieved, setHistoricalMessagesRetrieved] = + useState(false); useEffect(() => { localStorage.setItem('nick', nick); @@ -122,29 +120,29 @@ export default function App() { if (!waku) return; if (historicalMessagesRetrieved) return; - const connectedToStorePeer = new Promise((resolve) => - waku.libp2p.peerStore.once( - 'change:protocols', - ({ peerId, protocols }) => { - if (protocols.includes(StoreCodec)) { - resolve(peerId); - } + const checkAndRetrieve = ({ protocols }: { protocols: string[] }) => { + if (protocols.includes(StoreCodec)) { + console.log(`Retrieving archived messages}`); + setHistoricalMessagesRetrieved(true); + + try { + retrieveStoreMessages(waku, dispatchMessages).then((length) => + console.log(`Messages retrieved:`, length) + ); + } catch (e) { + console.log(`Error encountered when retrieving archived messages`, e); } - ) - ); - - connectedToStorePeer.then(() => { - console.log(`Retrieving archived messages}`); - setHistoricalMessagesRetrieved(true); - - try { - retrieveStoreMessages(waku, dispatchMessages).then((length) => - console.log(`Messages retrieved:`, length) - ); - } catch (e) { - console.log(`Error encountered when retrieving archived messages`, e); } - }); + }; + + waku.libp2p.peerStore.on('change:protocols', checkAndRetrieve); + + return () => { + waku.libp2p.peerStore.removeListener( + 'change:protocols', + checkAndRetrieve + ); + }; }, [waku, historicalMessagesRetrieved]); return (