From 50d3cac3a8d024a9574a4a63fe1246d5bd5db739 Mon Sep 17 00:00:00 2001
From: Sasha <118575614+weboko@users.noreply.github.com>
Date: Thu, 12 Sep 2024 02:08:58 +0200
Subject: [PATCH] chore: add filter counter (#87)

---
 examples/dogfooding/index.html   |  5 ++++-
 examples/dogfooding/src/index.ts | 14 +++++++++++++-
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/examples/dogfooding/index.html b/examples/dogfooding/index.html
index 0b100f7..4e86cc3 100644
--- a/examples/dogfooding/index.html
+++ b/examples/dogfooding/index.html
@@ -31,6 +31,9 @@
         <br />
         <label for="numSent">Messages Sent:</label>
         <span id="numSent">0</span>
+        <br />
+        <label for="numReceived">Messages Received:</label>
+        <span id="numReceived">0</span>
       </div>
     </div>
     <div id="container">
@@ -45,4 +48,4 @@
     </div>
     <script src="./index.js"></script>
   </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/examples/dogfooding/src/index.ts b/examples/dogfooding/src/index.ts
index cffd04b..c6fbb01 100644
--- a/examples/dogfooding/src/index.ts
+++ b/examples/dogfooding/src/index.ts
@@ -29,6 +29,7 @@ const ProtoSequencedMessage = new Type("SequencedMessage")
 
 const sequenceCompletedEvent = new CustomEvent("sequenceCompleted");
 const messageSentEvent = new CustomEvent("messageSent");
+const messageReceivedEvent = new CustomEvent("messageReceived");
 
 const wakuNode = async (): Promise<LightNode> => {
   return await createLightNode({
@@ -165,6 +166,8 @@ export async function app(telemetryClient: TelemetryClient) {
       messageElement.textContent = `Message: ${sequencedMessage.hash} ${sequencedMessage.index} of ${sequencedMessage.total}`;
       messagesReceived.appendChild(messageElement);
       messagesReceived.appendChild(document.createElement("br"));
+
+      document.dispatchEvent(messageReceivedEvent);
     };
 
     await node.filter.subscribe(decoder, subscriptionCallback);
@@ -199,6 +202,15 @@ export async function app(telemetryClient: TelemetryClient) {
     sentMessagesCounter.textContent = sentMessagesCount.toString();
   });
 
+  let receivedMessagesCount = 0;
+  const receivedMessagesCounter = document.getElementById(
+    "numReceived"
+  ) as HTMLSpanElement;
+  document.addEventListener("messageReceived", () => {
+    receivedMessagesCount++;
+    receivedMessagesCounter.textContent = receivedMessagesCount.toString();
+  });
+
   function startSequence() {
     const numMessages = Math.floor(Math.random() * 16) + 5;
     const messagePeriod = Math.floor(Math.random() * 2001) + 5000;
@@ -207,4 +219,4 @@ export async function app(telemetryClient: TelemetryClient) {
 
   document.addEventListener(sequenceCompletedEvent.type, () => startSequence());
   startSequence();
-})();
+})();
\ No newline at end of file