diff --git a/web-chat/package.json b/web-chat/package.json
index 2cabda2..e7bd707 100644
--- a/web-chat/package.json
+++ b/web-chat/package.json
@@ -6,7 +6,7 @@
   "dependencies": {
     "@livechat/ui-kit": "^0.5.0-20",
     "@multiformats/multiaddr": "^10.4.0",
-    "js-waku": "0.27.0",
+    "js-waku": "0.28.0",
     "process": "^0.11.10",
     "protons-runtime": "^3.1.0",
     "react": "^17.0.2",
diff --git a/web-chat/pnpm-lock.yaml b/web-chat/pnpm-lock.yaml
index f3df525..6c8daed 100644
--- a/web-chat/pnpm-lock.yaml
+++ b/web-chat/pnpm-lock.yaml
@@ -9,7 +9,7 @@ specifiers:
   '@types/react-dom': ^17.0.11
   cspell: ^6.0.0
   gh-pages: ^4.0.0
-  js-waku: 0.27.0
+  js-waku: 0.28.0
   npm-run-all: ^4.1.5
   prettier: ^2.6.2
   process: ^0.11.10
@@ -26,7 +26,7 @@ specifiers:
 dependencies:
   '@livechat/ui-kit': 0.5.0-20_ibvs32p3vr2bbtbo3dwziny444
   '@multiformats/multiaddr': 10.4.0
-  js-waku: 0.27.0
+  js-waku: 0.28.0
   process: 0.11.10
   protons-runtime: 3.1.0_uint8arraylist@2.3.2
   react: 17.0.2
@@ -8382,8 +8382,8 @@ packages:
   /js-tokens/4.0.0:
     resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
 
-  /js-waku/0.27.0:
-    resolution: {integrity: sha512-uIh1h2Gu+aEyrGb4qmyk2Sc91in3fMfOil0kdtrps9HnA7ESbC5c6d148LeJaxqH5rfOkrfXXIhw1zwA3hlauw==}
+  /js-waku/0.28.0:
+    resolution: {integrity: sha512-MEIFugvio2IaQMQT+g+bn24BvlJ5S4PdSKD0AGVZlR7q1BhECwlpRoytyz0A/hC1+EJWhrZB8cpIAmxwtYWTBw==}
     engines: {node: '>=16'}
     dependencies:
       '@chainsafe/libp2p-gossipsub': 4.1.1
diff --git a/web-chat/src/App.tsx b/web-chat/src/App.tsx
index 1bbb34a..cc545e3 100644
--- a/web-chat/src/App.tsx
+++ b/web-chat/src/App.tsx
@@ -51,19 +51,7 @@ export const ChatContentTopic = "/toy-chat/2/huilong/proto";
 async function retrieveStoreMessages(
   waku: WakuLight,
   setArchivedMessages: (value: Message[]) => void
-): Promise<number> {
-  const callback = (wakuMessages: WakuMessage[]): void => {
-    const messages: Message[] = [];
-    wakuMessages
-      .map((wakuMsg) => Message.fromWakuMessage(wakuMsg))
-      .forEach((message) => {
-        if (message) {
-          messages.push(message);
-        }
-      });
-    setArchivedMessages(messages);
-  };
-
+): Promise<void> {
   const startTime = new Date();
   // Only retrieve a week of history
   startTime.setTime(Date.now() - 1000 * 60 * 60 * 24 * 7);
@@ -71,20 +59,32 @@ async function retrieveStoreMessages(
   const endTime = new Date();
 
   try {
-    const res = await waku.store.queryHistory([ChatContentTopic], {
-      pageSize: 5,
-      pageDirection: PageDirection.FORWARD,
-      timeFilter: {
-        startTime,
-        endTime,
-      },
-      callback,
-    });
+    for await (const messagesPromises of waku.store.queryGenerator(
+      [ChatContentTopic],
+      {
+        pageSize: 5,
+        pageDirection: PageDirection.FORWARD,
+        timeFilter: {
+          startTime,
+          endTime,
+        },
+      }
+    )) {
+      const messages: Message[] = [];
+      const wakuMessages = await Promise.all(messagesPromises);
 
-    return res.length;
+      wakuMessages
+        .filter(isWakuMessageDefined)
+        .map((wakuMsg) => Message.fromWakuMessage(wakuMsg))
+        .forEach((message) => {
+          if (message) {
+            messages.push(message);
+          }
+        });
+      setArchivedMessages(messages);
+    }
   } catch (e) {
     console.log("Failed to retrieve messages", e);
-    return 0;
   }
 }
 
@@ -228,3 +228,9 @@ function selectFleetEnv() {
 function reduceMessages(state: Message[], newMessages: Message[]) {
   return state.concat(newMessages);
 }
+
+const isWakuMessageDefined = (
+  msg: WakuMessage | undefined
+): msg is WakuMessage => {
+  return !!msg;
+};