add store "pipe" method to modify data

frontend/src/stores.js

@@ -10,6 +10,7 @@ let storeCallbackQueue = [];
 class Store {
     constructor(value=null, name="[no name]") {
         this._handlers = new Set();
+        this._pipes = new Set();
         this.value = value;
         this.name = name;
         this._isInBatch = false;
@@ -42,6 +43,16 @@ class Store {
         };
     }
 
+    pipe(handler) {
+        storeLog(`[Pipe] (${this.name})`, "handler:", handler);
+
+        this._pipes.add(handler);
+        return () => {
+            storeLog(`[Remove Pipe] (${this.name})`);
+            this._pipes.delete(handler);
+        };
+    }
+
     set(value) {
         if (value === this.value)
             return;
@@ -87,6 +98,8 @@ class Store {
             return;
         }
 
+        this.value = this._applyPipes(this.value);
+
         storeLog(`[Update] (${this.name}) Will queue ${this._handlers.size} handlers`, "value:", this.value, "handlers:", this._handlers);
 
         const isRootNode = storeCallbackQueue.length === 0;
@@ -98,6 +111,13 @@ class Store {
             this.flushCallbackQueue();
         }
     }
+
+    _applyPipes(value) {
+        this._pipes.forEach(p => {
+            value = p(value);
+        });
+        return value;
+    }
 }
 
 function createAction(name, handler) {
@@ -694,7 +714,9 @@ export const allStores = {
     typingStore,
     presenceStore,
     unreadStore,
+    pluginStore,
     setMessageInputEvent,
+    sendMessageAction,
 };
 
 selectedChannel.on((newSelectedChannel) => {