fix: extracted data for tabs

Author: meenakshi-deriv

package-lock.json

@@ -115,6 +115,7 @@
     "davidshimjs-qrcodejs": "0.0.2",
     "event-source-polyfill": "0.0.9",
     "highstock-release": "5.0.14",
+    "html-react-parser": "^5.1.10",
     "jquery": "3.5.1",
     "jquery.scrollto": "2.1.2",
     "js-cookie": "2.2.0",

package.json

@@ -0,0 +1,59 @@
+// events.js
+import { useEffect, useState } from 'react';
+
+class EventEmitter {
+    constructor() {
+        this.events = {};
+    }
+
+    subscribe(event, callback) {
+        if (!this.events[event]) {
+            this.events[event] = [];
+        }
+        this.events[event].push(callback);
+        return () => {
+            this.events[event] = this.events[event].filter(cb => cb !== callback);
+        };
+    }
+
+    emit(event, data) {
+        if (this.events[event]) {
+            this.events[event].forEach(callback => callback(data));
+        }
+    }
+}
+
+const eventEmitter = new EventEmitter();
+
+// Custom hooks
+const useCustomEvent = (eventName) => {
+    const [hasNewChanges, setHasNewChanges] = useState(false);
+
+    useEffect(() => {
+        const handleEvent = () => {
+            setHasNewChanges(true);
+            setTimeout(() => setHasNewChanges(false), 0);
+        };
+
+        const unsubscribe = eventEmitter.subscribe(eventName, handleEvent);
+
+        return () => {
+            unsubscribe();
+        };
+    }, [eventName]);
+
+    return hasNewChanges;
+};
+
+// Trigger functions
+const triggerCustomEvent = (eventName) => {
+    eventEmitter.emit(eventName);
+};
+
+// Market Change
+export const useMarketChange = () => useCustomEvent('marketChange');
+export const triggerMarketChange = () => triggerCustomEvent('marketChange');
+
+// Contract Change
+export const useContractChange = () => useCustomEvent('contractChange');
+export const triggerContractChange = () => triggerCustomEvent('contractChange');