+ Set active_symbols on trade init()

+ Set formatResponse for all report pages to attach `display_name` + Added function to get display name of symbol + Modified test cases to test for new requirements
msamprz · Jun 13, 2019 · 39d7f39 · 39d7f39
1 parent 9e5349c
commit 39d7f39
Show file tree

Hide file tree

Showing 12 changed files with 78 additions and 42 deletions.
diff --git a/src/javascript/app/Modules/Reports/Components/market-symbol-icon-row.jsx b/src/javascript/app/Modules/Reports/Components/market-symbol-icon-row.jsx
@@ -17,7 +17,7 @@ const MarketSymbolIconRow = ({ payload, show_description }) => {
                     <Popover
                         classNameBubble='market-symbol-icon__tooltip'
                         alignment='top'
-                        message={market_information.underlying}
+                        message={payload.display_name}
                         disable_target_icon
                     >
                         <UnderlyingIcon market={market_information.underlying} />

diff --git a/src/javascript/app/Modules/Reports/Helpers/market-underyling.js b/src/javascript/app/Modules/Reports/Helpers/market-underyling.js
@@ -5,7 +5,7 @@ export const getMarketInformation = (payload) => {
     };
 
     const pattern = new RegExp('^([A-Z]+)_((OTC_[A-Z0-9]+)|R_[\\d]{2,3}|[A-Z]+)_'); // Used to get market name from shortcode
-    const extracted = pattern.exec(payload.shortcode);
+    const extracted = pattern.exec(typeof payload === 'string' ? payload : payload.shortcode);
     if (extracted !== null) {
         market_info.category   = extracted[1].toLowerCase();
         market_info.underlying = extracted[2];

diff --git a/src/javascript/app/Stores/Modules/Portfolio/Helpers/__tests__/format-response.js b/src/javascript/app/Stores/Modules/Portfolio/Helpers/__tests__/format-response.js
@@ -3,19 +3,22 @@ import React                       from 'react';
 import { formatPortfolioPosition } from '../format-response';
 
 describe('formatPortfolioPosition', () => {
+    const mock_active_symbols = [ { display_name: 'Volatility 25 Index', symbol: 'R_25' } ];
     const portfolio_pos = {
         buy_price     : 2500.5,
         contract_id   : 1234,
         contract_type : 'ASIANU',
         longcode      : 'test \n test \n test',
         payout        : 3500.1,
         symbol        : 'R_25',
+        shortcode     : 'ASIANU_R_25_',
         transaction_id: 5678,
     };
 
     it('should return an object with values in object passed as argument', () => {
-        expect(formatPortfolioPosition(portfolio_pos)).to.eql({
+        expect(formatPortfolioPosition(portfolio_pos, mock_active_symbols)).to.eql({
             details        :'test <br /> test <br /> test',
+            display_name   :'Volatility 25 Index',
             id             : 1234,
             indicative     : 0,
             is_unsupported : true,

diff --git a/src/javascript/app/Stores/Modules/Portfolio/Helpers/format-response.js b/src/javascript/app/Stores/Modules/Portfolio/Helpers/format-response.js
@@ -1,12 +1,19 @@
 import { getUnsupportedContracts } from 'Constants';
+import { getSymbolDisplayName }    from '../../Trading/Helpers/active-symbols';
+import { getMarketInformation }    from '../../../../Modules/Reports/Helpers/market-underyling';
 
-export const formatPortfolioPosition = (portfolio_pos) => {
-    const purchase = parseFloat(portfolio_pos.buy_price);
-    const payout   = parseFloat(portfolio_pos.payout);
+export const formatPortfolioPosition = (portfolio_pos, active_symbols = []) => {
+    const purchase     = parseFloat(portfolio_pos.buy_price);
+    const payout       = parseFloat(portfolio_pos.payout);
+    const display_name = getSymbolDisplayName(
+        active_symbols,
+        getMarketInformation(portfolio_pos.shortcode).underlying
+    );
 
     return {
         contract_info : portfolio_pos,
         details       : portfolio_pos.longcode.replace(/\n/g, '<br />'),
+        display_name,
         id            : portfolio_pos.contract_id,
         indicative    : 0,
         payout,

diff --git a/src/javascript/app/Stores/Modules/Portfolio/portfolio-store.js b/src/javascript/app/Stores/Modules/Portfolio/portfolio-store.js
@@ -51,7 +51,7 @@ export default class PortfolioStore extends BaseStore {
         this.error = '';
         if (response.portfolio.contracts) {
             this.positions = response.portfolio.contracts
-                .map(pos => formatPortfolioPosition(pos))
+                .map(pos => formatPortfolioPosition(pos, this.root_store.modules.trade.active_symbols))
                 .sort((pos1, pos2) => pos2.reference - pos1.reference); // new contracts first
         }
     }
@@ -187,7 +187,7 @@ export default class PortfolioStore extends BaseStore {
 
     @action.bound
     pushNewPosition(new_pos) {
-        this.positions.unshift(formatPortfolioPosition(new_pos));
+        this.positions.unshift(formatPortfolioPosition(new_pos, this.root_store.modules.trade.active_symbols));
     }
 
     @action.bound

diff --git a/src/javascript/app/Stores/Modules/Profit/Helpers/format-response.js b/src/javascript/app/Stores/Modules/Profit/Helpers/format-response.js
@@ -1,15 +1,21 @@
-import { formatMoney } from '_common/base/currency_base';
-import { toMoment }    from 'Utils/Date';
+import { formatMoney }          from '_common/base/currency_base';
+import { toMoment }             from 'Utils/Date';
+import { getMarketInformation } from '../../../../Modules/Reports/Helpers/market-underyling';
+import { getSymbolDisplayName } from '../../Trading/Helpers/active-symbols';
 
-export const formatProfitTableTransactions = (transaction, currency) => {
-    const format_string = 'DD MMM YYYY - HH:mm:ss';
-    const purchase_time = `${toMoment(+transaction.purchase_time).format(format_string)  }`;
-    const sell_time     = `${toMoment(+transaction.sell_time).format(format_string)  }`;
-    const payout        = parseFloat(transaction.payout);
-    const sell_price    = parseFloat(transaction.sell_price);
-    const buy_price     = parseFloat(transaction.buy_price);
-    const profit_loss  = formatMoney(currency, Number(sell_price - buy_price), true);
+export const formatProfitTableTransactions = (transaction, currency, active_symbols = []) => {
+    const format_string           = 'DD MMM YYYY - HH:mm:ss';
+    const purchase_time           = `${toMoment(+transaction.purchase_time).format(format_string)}`;
+    const sell_time               = `${toMoment(+transaction.sell_time).format(format_string)}`;
+    const payout                  = parseFloat(transaction.payout);
+    const sell_price              = parseFloat(transaction.sell_price);
+    const buy_price               = parseFloat(transaction.buy_price);
+    const profit_loss             = formatMoney(currency, Number(sell_price - buy_price), true);
     const should_exclude_currency = true;
+    const display_name            = getSymbolDisplayName(
+        active_symbols,
+        getMarketInformation(transaction.shortcode).underlying
+    );
 
     return {
         ...transaction,
@@ -20,6 +26,7 @@ export const formatProfitTableTransactions = (transaction, currency) => {
             profit_loss,
             sell_time,
             purchase_time,
+            display_name,
         },
     };
 };
diff --git a/src/javascript/app/Stores/Modules/Profit/profit-store.js b/src/javascript/app/Stores/Modules/Profit/profit-store.js
@@ -63,6 +63,7 @@ export default class ProfitTableStore extends BaseStore {
             .map(transaction => formatProfitTableTransactions(
                 transaction,
                 this.root_store.client.currency,
+                this.root_store.modules.trade.active_symbols,
             ));
 
         this.data           = [...this.data, ...formatted_transactions];

diff --git a/src/javascript/app/Stores/Modules/Statement/Helpers/__tests__/format-response.spec.js b/src/javascript/app/Stores/Modules/Statement/Helpers/__tests__/format-response.spec.js
@@ -6,7 +6,7 @@ describe('formatStatementTransaction', () => {
     const constant = {
         id: 1234,
         action_type: 'buy',
-    }
+    };
 
     const currency = 'USD';
     let transaction = {
@@ -23,18 +23,19 @@ describe('formatStatementTransaction', () => {
     };
 
     let expected_result = {
-        action     : toTitleCase(constant.action_type),
-        action_type: constant.action_type,
-        date       : '29 Nov 1973 - 21:33:09',
-        refid      : constant.id,
-        payout     : '1,000.00',
-        amount     : '2,000.00',
-        balance    : '3,000.00',
-        desc       : 'test <br /> test <br /> test',
-        id         : constant.id,
-        app_id     : constant.id,
-        shortcode  : 'shortcode',
-    }
+        action      : toTitleCase(constant.action_type),
+        action_type : constant.action_type,
+        date        : '29 Nov 1973 - 21:33:09',
+        display_name: '',
+        refid       : constant.id,
+        payout      : '1,000.00',
+        amount      : '2,000.00',
+        balance     : '3,000.00',
+        desc        : 'test <br /> test <br /> test',
+        id          : constant.id,
+        app_id      : constant.id,
+        shortcode   : 'shortcode',
+    };
 
     it('should return an object with values of object passed as argument', () => {
         expect(formatStatementTransaction(transaction, currency)).to.eql(expected_result);

diff --git a/src/javascript/app/Stores/Modules/Statement/Helpers/format-response.js b/src/javascript/app/Stores/Modules/Statement/Helpers/format-response.js
@@ -1,27 +1,35 @@
-import { formatMoney } from '_common/base/currency_base';
-import { localize }    from '_common/localize';
-import { toTitleCase } from '_common/string_util';
-import { toMoment }    from 'Utils/Date';
+import { formatMoney }          from '_common/base/currency_base';
+import { localize }             from '_common/localize';
+import { toTitleCase }          from '_common/string_util';
+import { toMoment }             from 'Utils/Date';
+import { getSymbolDisplayName } from '../../Trading/Helpers/active-symbols';
+import { getMarketInformation } from '../../../../Modules/Reports/Helpers/market-underyling';
 
-export const formatStatementTransaction = (transaction, currency) => {
-    const format_string = 'DD MMM YYYY - HH:mm:ss';
-    const transaction_time   = toMoment(transaction.transaction_time).format(format_string);
-    const payout     = parseFloat(transaction.payout);
-    const amount     = parseFloat(transaction.amount);
-    const balance    = parseFloat(transaction.balance_after);
+export const formatStatementTransaction = (transaction, currency, active_symbols = []) => {
+    const format_string           = 'DD MMM YYYY - HH:mm:ss';
+    const transaction_time        = toMoment(transaction.transaction_time).format(format_string);
+    const payout                  = parseFloat(transaction.payout);
+    const amount                  = parseFloat(transaction.amount);
+    const balance                 = parseFloat(transaction.balance_after);
     const should_exclude_currency = true;
+    const shortcode               = ['buy', 'sell'].includes(transaction.action_type) ? transaction.shortcode : null;
+    const display_name            = shortcode ? getSymbolDisplayName(
+        active_symbols,
+        getMarketInformation(shortcode).underlying
+    ) : '';
 
     return {
         action     : localize(toTitleCase(transaction.action_type) /* localize-ignore */), // handled in static_strings_app.js: 'Buy', 'Sell', 'Deposit', 'Withdrawal'
         date       : transaction_time,
+        display_name,
         refid      : transaction.transaction_id,
         payout     : isNaN(payout) ? '-' : formatMoney(currency, payout, should_exclude_currency),
         amount     : isNaN(amount) ? '-' : formatMoney(currency, amount, should_exclude_currency),
         balance    : isNaN(balance) ? '-' : formatMoney(currency, balance, should_exclude_currency),
         desc       : transaction.longcode.replace(/\n/g, '<br />'),
         id         : transaction.contract_id,
         app_id     : transaction.app_id,
-        shortcode  : ['buy', 'sell'].includes(transaction.action_type) ? transaction.shortcode : null,
+        shortcode,
         action_type: transaction.action_type,
     };
 };
diff --git a/src/javascript/app/Stores/Modules/Statement/statement-store.js b/src/javascript/app/Stores/Modules/Statement/statement-store.js
@@ -67,6 +67,7 @@ export default class StatementStore extends BaseStore {
         const formatted_transactions = response.statement.transactions
             .map(transaction => formatStatementTransaction(transaction,
                 this.root_store.client.currency,
+                this.root_store.modules.trade.active_symbols,
             ));
 
         this.data           = [...this.data, ...formatted_transactions];

diff --git a/src/javascript/app/Stores/Modules/Trading/Helpers/active-symbols.js b/src/javascript/app/Stores/Modules/Trading/Helpers/active-symbols.js
@@ -34,3 +34,8 @@ export const isMarketClosed = (active_symbols = [], symbol) => {
         :
         false;
 };
+
+export const getSymbolDisplayName = (active_symbols = [], symbol) => (
+    (active_symbols.find(symbol_info => symbol_info.symbol.toUpperCase() === symbol.toUpperCase()) || { display_name: '' })
+        .display_name
+);
diff --git a/src/javascript/app/Stores/Modules/Trading/trade-store.js b/src/javascript/app/Stores/Modules/Trading/trade-store.js
@@ -111,6 +111,9 @@ export default class TradeStore extends BaseStore {
     init = async () => {
         // To be sure that the website_status response has been received before processing trading page.
         await BinarySocket.wait('website_status');
+        action(async() => {
+            this.active_symbols = await WS.activeSymbols().active_symbols;
+        });
     };
 
     constructor({ root_store }) {