fix: refactor data-manager

deriv-com · Aug 7, 2024 · 150fbdc · 150fbdc
1 parent 7a4101f
commit 150fbdc
Show file tree

Hide file tree

Showing 29 changed files with 314 additions and 263 deletions.
diff --git a/src/javascript/app/common/currency.js b/src/javascript/app/common/currency.js
@@ -23,9 +23,9 @@ const getCurrencyList = (currencies) => {
             currency_list.fiat.push({ value: currency, text: currency_name });
         }
     });
-    dataManager.set({
+    dataManager.setTrade({
         currency_list,
-    }, 'trade');
+    });
 
     return $currencies.append($fiat_currencies.children().length ? $fiat_currencies : '').append($cryptocurrencies.children().length ? $cryptocurrencies : '');
 };

diff --git a/src/javascript/app/common/data_manager.js b/src/javascript/app/common/data_manager.js
@@ -37,28 +37,30 @@ class DataManager {
                 window.dispatchEvent(new CustomEvent(changeTypeMap[data_type], {
                     detail: { oldValues, newValues },
                 }));
-                if (optional_trigger === 'barrier') {
-                    triggerBarrierChange();
-                } else if (optional_trigger === 'time') {
-                    triggerTimeChange();
-                } else {
-                    switch (data_type) {
-                        case 'trade':
+
+                switch (data_type) {
+                    case 'trade':
+                        if (optional_trigger === 'barrier') {
+                            triggerBarrierChange();
+                        } else if (optional_trigger === 'time') {
+                            triggerTimeChange();
+                        } else {
                             triggerTradeChange();
-                            break;
-
-                        case 'purchase':
-                            triggerPurchaseChange();
-                            break;
-
-                        case 'contract':
-                            triggerContractChange();
-                            break;
-
-                        default:
-                            break;
-                    }
+                        }
+                        break;
+
+                    case 'purchase':
+                        triggerPurchaseChange();
+                        break;
+
+                    case 'contract':
+                        triggerContractChange();
+                        break;
+
+                    default:
+                        break;
                 }
+
             }
         }
     }
@@ -92,6 +94,70 @@ class DataManager {
     has(key, data_type) {
         return Object.prototype.hasOwnProperty.call(this.data[data_type], key);
     }
+
+    // methods for trade
+    setTrade(data, optional_trigger) {
+        this.set(data, 'trade', optional_trigger);
+    }
+
+    getTrade(key) {
+        return this.get(key, 'trade');
+    }
+
+    getAllTrades() {
+        return this.getAll('trade');
+    }
+
+    clearTrades() {
+        this.clear('trade');
+    }
+
+    hasTrade(key) {
+        return this.has(key, 'trade');
+    }
+
+    // methods for purchase
+    setPurchase(data) {
+        this.set(data, 'purchase');
+    }
+
+    getPurchase(key) {
+        return this.get(key, 'purchase');
+    }
+
+    getAllPurchases() {
+        return this.getAll('purchase');
+    }
+
+    clearPurchases() {
+        this.clear('purchase');
+    }
+
+    hasPurchase(key) {
+        return this.has(key, 'purchase');
+    }
+
+    // methods for contract
+    setContract(data) {
+        this.set(data, 'contract');
+    }
+
+    getContract(key) {
+        return this.get(key, 'contract');
+    }
+
+    getAllContracts() {
+        return this.getAll('contract');
+    }
+
+    clearContracts() {
+        this.clear('contract');
+    }
+
+    hasContract(key) {
+        return this.has(key, 'contract');
+    }
+
 }
 
 const dataManager = new DataManager();

diff --git a/src/javascript/app/common/helpers.js b/src/javascript/app/common/helpers.js
@@ -99,10 +99,10 @@ const setMinMaxTimeObj = (options) => {
         }
     }
 
-    dataManager.set({
+    dataManager.setTrade({
         starttime_obj,
         expirytime_obj,
-    }, 'trade', 'time');
+    }, 'time');
 };
 
 export {

diff --git a/src/javascript/app/components/loading-spinner.js b/src/javascript/app/components/loading-spinner.js
@@ -28,9 +28,9 @@ export const show = (content_id) => {
  * @param content_id
  */
 export const hide = (content_id) => {
-    dataManager.set({
+    dataManager.setContract({
         hidePageLoader: true,
-    }, 'contract');
+    });
 
     assertContainerExists(content_id);
     const $container = $(`#${content_id}`);

diff --git a/src/javascript/app/pages/bottom/explanation.jsx b/src/javascript/app/pages/bottom/explanation.jsx
@@ -15,7 +15,7 @@ export const Explanation = ({ explanationOnly = false }) => {
     const hasContractChanges = useContractChange();
 
     useEffect(() => {
-        const actualFormName = dataManager.get('explanationFormName', 'contract');
+        const actualFormName = dataManager.getContract('explanationFormName');
         setFormName(null);
 
         setTimeout(() => {

diff --git a/src/javascript/app/pages/bottom/tabs.jsx b/src/javascript/app/pages/bottom/tabs.jsx
@@ -69,7 +69,7 @@ const BottomTabs = () => {
         : tabs;
 
     useEffect(() => {
-        setFormName(dataManager.get('explanationFormName', 'contract'));
+        setFormName(dataManager.getContract('explanationFormName'));
     }, [hasContractChange, hasMarketChange]);
 
     useEffect(() => {

diff --git a/src/javascript/app/pages/form/barrier-fields.jsx b/src/javascript/app/pages/form/barrier-fields.jsx
@@ -21,7 +21,7 @@ const BarrierFields = ({ formName, handleAmountChange }) => {
     useEffect(() => {
         setBarrierData((oldData) => ({
             ...oldData,
-            ...dataManager.getAll('trade'),
+            ...dataManager.getAllTrades(),
         }));
     }, [hasBarrierChange]);
 

diff --git a/src/javascript/app/pages/form/form-component.jsx b/src/javascript/app/pages/form/form-component.jsx
@@ -32,7 +32,7 @@ export const FormComponent = () => {
     useEffect(() => {
         setTradeData((oldData) => ({
             ...oldData,
-            ...dataManager.getAll('trade'),
+            ...dataManager.getAllTrades(),
         }));
     }, [hasTradeChange, hasSessionChange]);
 

diff --git a/src/javascript/app/pages/form/time-selection.jsx b/src/javascript/app/pages/form/time-selection.jsx
@@ -12,8 +12,8 @@ const TimeContent = ({ time, onUpdate, elementId }) => {
     const { close } = useDropdown();
 
     useEffect(() => {
-        setStartTimeData(dataManager.get('starttime_obj', 'trade'));
-        setExpiryTimeData(dataManager.get('expirytime_obj', 'trade'));
+        setStartTimeData(dataManager.getTrade('starttime_obj'));
+        setExpiryTimeData(dataManager.getTrade('expirytime_obj'));
     }, [hasTimeChange]);
 
     const formatTime = (timeObj) => {

diff --git a/src/javascript/app/pages/loader.jsx b/src/javascript/app/pages/loader.jsx
@@ -45,7 +45,7 @@ const Loader = () => {
     const page = getPageType().name;
 
     useEffect(() => {
-        const hidePageLoader = dataManager.get('hidePageLoader', 'contract');
+        const hidePageLoader = dataManager.getContract('hidePageLoader');
 
         if (hidePageLoader){
             setLoading(false);

diff --git a/src/javascript/app/pages/trade/analysis.js b/src/javascript/app/pages/trade/analysis.js
@@ -36,10 +36,10 @@ const TradingAnalysis = (() => {
         const tab_form_name     = tab_obj[form_name] || form_name;
         form_name = map_obj[form_name] || form_name;
 
-        dataManager.set({
+        dataManager.setContract({
             actualFormName     : form_name,
             explanationFormName: tab_form_name,
-        }, 'contract');
+        });
 
         $('#tab_last_digit').setVisibility(/digits|overunder|evenodd/.test(tab_form_name));
 

diff --git a/src/javascript/app/pages/trade/barriers.js b/src/javascript/app/pages/trade/barriers.js
@@ -87,9 +87,9 @@ const Barriers = (() => {
                     showHideRelativeTip(barrier.barrier, [tooltip, span]);
                     barrier_data.show_barrier = true;
                     barrier_data.show_barrier_highlow = false;
-                    dataManager.set({
+                    dataManager.setTrade({
                         barrier_data,
-                    }, 'trade', 'barrier');
+                    }, 'barrier');
                     return;
                 } else if (barrier.count === 2) {
                     getElementById('barrier_row').style.display = 'none';
@@ -170,9 +170,9 @@ const Barriers = (() => {
                     Defaults.set(BARRIER_LOW, low_elm.value);
                     barrier_data.show_barrier = false;
                     barrier_data.show_barrier_highlow = true;
-                    dataManager.set({
+                    dataManager.setTrade({
                         barrier_data,
-                    }, 'trade', 'barrier');
+                    }, 'barrier');
                     return;
                 }
             }
@@ -215,9 +215,9 @@ const Barriers = (() => {
             }
         }
 
-        dataManager.set({
+        dataManager.setTrade({
             barrier_error,
-        }, 'trade', 'barrier');
+        }, 'barrier');
     };
 
     const showHideRelativeTip = (barrier, arr_el) => {

diff --git a/src/javascript/app/pages/trade/common.js b/src/javascript/app/pages/trade/common.js
@@ -42,8 +42,6 @@ const commonTrading = (() => {
         UNDERLYING,
     } = Defaults.PARAM_NAMES;
 
-    const type_purchase = 'purchase';
-
     const displayContractForms = (id, elements, selected) => {
         if (!id || !elements || !selected) return;
 
@@ -53,12 +51,12 @@ const commonTrading = (() => {
         const contract_to_show = /^(callputequal)$/.test(selected) ? 'risefall' : selected;
 
         if (!contracts_element) {
-            dataManager.set({
+            dataManager.setContract({
                 contractsTree  : contracts_tree,
                 contracts      : all_contracts,
                 formName       : selected || Defaults.get('formname'),
                 contractElement: getElementById('contract'),
-            }, 'contract');
+            });
         } else { // Update the component.
             contracts_element.updater.enqueueSetState(contracts_element, {
                 contracts_tree,
@@ -159,9 +157,9 @@ const commonTrading = (() => {
         showHideOverlay('contract_confirmation_container', 'none');
         showHideOverlay('contracts_list', 'flex');
         $('.purchase_button').text(localize('Purchase'));
-        dataManager.set({
+        dataManager.setPurchase({
             showPurchaseResults: false,
-        }, type_purchase);
+        });
     };
 
     const getContractCategoryTree = (elements) => {
@@ -255,9 +253,9 @@ const commonTrading = (() => {
             } else {
                 node.show();
                 elementInnerHtml(node, comment);
-                dataManager.set({
+                dataManager.setPurchase({
                     [`${position}Comment`]: comment,
-                }, type_purchase);
+                });
             }
         }
     };
@@ -477,15 +475,15 @@ const commonTrading = (() => {
         requireHighstock,
         showPriceOverlay: () => {
             showHideOverlay('loading_container2', 'block');
-            dataManager.set({
+            dataManager.setPurchase({
                 isPurchaseFormDisabled: true,
-            }, type_purchase);
+            });
         },
         hidePriceOverlay: () => {
             showHideOverlay('loading_container2', 'none');
-            dataManager.set({
+            dataManager.setPurchase({
                 isPurchaseFormDisabled: false,
-            }, type_purchase);
+            });
         },
         hideFormOverlay: () => { showHideOverlay('loading_container3', 'none'); },
         showFormOverlay: () => { showHideOverlay('loading_container3', 'block'); },

diff --git a/src/javascript/app/pages/trade/common_independent.js b/src/javascript/app/pages/trade/common_independent.js
@@ -4,30 +4,29 @@ const dataManager      = require('../../common/data_manager').default;
 const getElementById   = require('../../../_common/common_functions').getElementById;
 const getPropertyValue = require('../../../_common/utility').getPropertyValue;
 
-const type_purchase = 'purchase';
 /*
  * Display price/spot movement variation to depict price moved up or down
  */
 const displayPriceMovement = (element, old_value, current_value, data_key) => {
     element.classList.remove('price_moved_down');
     element.classList.remove('price_moved_up');
 
-    dataManager.set({
+    dataManager.setPurchase({
         [data_key]: '',
-    }, type_purchase);
+    });
 
     if (parseFloat(current_value) > parseFloat(old_value)) {
         element.classList.remove('price_moved_down');
         element.classList.add('price_moved_up');
-        dataManager.set({
+        dataManager.setPurchase({
             [data_key]: 'price_moved_up',
-        }, type_purchase);
+        });
     } else if (parseFloat(current_value) < parseFloat(old_value)) {
         element.classList.remove('price_moved_up');
         element.classList.add('price_moved_down');
-        dataManager.set({
+        dataManager.setPurchase({
             [data_key]: 'price_moved_down',
-        }, type_purchase);
+        });
     }
 };