@@ -244,8 +221,7 @@ const IconTradeCategory = ({ category, className }) => {
default:
IconCategory = (
-
@@ -266,4 +242,4 @@ IconTradeCategory.propTypes = {
className: PropTypes.string,
};
-export { IconTradeCategory };
+export default IconTradeCategory;
diff --git a/src/javascript/app/Assets/Trading/Categories/index.js b/src/javascript/app/Assets/Trading/Categories/index.js
deleted file mode 100644
index 4453e967bbf2..000000000000
--- a/src/javascript/app/Assets/Trading/Categories/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export * from './icon-trade-categories.jsx';
-export * from './trade-categories.jsx';
-export * from './trade-categories-gif.jsx';
diff --git a/src/javascript/app/Assets/Trading/Categories/trade-categories-gif.jsx b/src/javascript/app/Assets/Trading/Categories/trade-categories-gif.jsx
index d43dceae0aa5..58c9999d8bb6 100644
--- a/src/javascript/app/Assets/Trading/Categories/trade-categories-gif.jsx
+++ b/src/javascript/app/Assets/Trading/Categories/trade-categories-gif.jsx
@@ -79,4 +79,4 @@ TradeCategoriesGIF.propTypes = {
is_dark : PropTypes.bool,
};
-export { TradeCategoriesGIF };
+export default TradeCategoriesGIF;
diff --git a/src/javascript/app/Assets/Trading/Categories/trade-categories.jsx b/src/javascript/app/Assets/Trading/Categories/trade-categories.jsx
index bc82d8b4c45f..bafbc8d2525d 100644
--- a/src/javascript/app/Assets/Trading/Categories/trade-categories.jsx
+++ b/src/javascript/app/Assets/Trading/Categories/trade-categories.jsx
@@ -112,4 +112,4 @@ TradeCategories.propTypes = {
category: PropTypes.string,
};
-export { TradeCategories };
+export default TradeCategories;
diff --git a/src/javascript/app/Assets/Trading/Types/icon-trade-types.jsx b/src/javascript/app/Assets/Trading/Types/icon-trade-types.jsx
index 9aa5ea5167e1..7f691c57608d 100644
--- a/src/javascript/app/Assets/Trading/Types/icon-trade-types.jsx
+++ b/src/javascript/app/Assets/Trading/Types/icon-trade-types.jsx
@@ -303,4 +303,4 @@ IconTradeType.propTypes = {
type : PropTypes.string,
};
-export { IconTradeType };
+export default IconTradeType;
diff --git a/src/javascript/app/Assets/Trading/Types/index.js b/src/javascript/app/Assets/Trading/Types/index.js
deleted file mode 100644
index e9876dc0187c..000000000000
--- a/src/javascript/app/Assets/Trading/Types/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export * from './icon-trade-types.jsx';
diff --git a/src/javascript/app/Assets/Trading/icon-lock.jsx b/src/javascript/app/Assets/Trading/icon-lock.jsx
index 2a81f5c8e49b..bbb3ae5bb4fe 100644
--- a/src/javascript/app/Assets/Trading/icon-lock.jsx
+++ b/src/javascript/app/Assets/Trading/icon-lock.jsx
@@ -16,4 +16,4 @@ IconLock.propTypes = {
className: PropTypes.string,
};
-export { IconLock };
+export default IconLock;
diff --git a/src/javascript/app/Assets/Trading/icon-price-move.jsx b/src/javascript/app/Assets/Trading/icon-price-move.jsx
index d114d4de5b8d..c75d84111e89 100644
--- a/src/javascript/app/Assets/Trading/icon-price-move.jsx
+++ b/src/javascript/app/Assets/Trading/icon-price-move.jsx
@@ -41,4 +41,4 @@ IconPriceMove.propTypes = {
type : PropTypes.string,
};
-export { IconPriceMove };
+export default IconPriceMove;
diff --git a/src/javascript/app/Assets/icon.jsx b/src/javascript/app/Assets/icon.jsx
new file mode 100644
index 000000000000..208f2a90ff3d
--- /dev/null
+++ b/src/javascript/app/Assets/icon.jsx
@@ -0,0 +1,128 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+class Icon extends React.PureComponent {
+ constructor(props) {
+ super(props);
+ /* When adding a new icon, arrange it by following the ascending file system arrangement */
+ this.icons = {
+ // Common
+ IconArrowBold : React.lazy(() => import('./Common/icon-arrow-bold.jsx')),
+ IconArrow : React.lazy(() => import('./Common/icon-arrow.jsx')),
+ IconBack : React.lazy(() => import('./Common/icon-back.jsx')),
+ IconCalendarToday : React.lazy(() => import('./Common/icon-calendar-today.jsx')),
+ IconCalendar : React.lazy(() => import('./Common/icon-calendar.jsx')),
+ IconChevronDoubleLeft : React.lazy(() => import('./Common/icon-chevron-double-left.jsx')),
+ IconChevronDoubleRight: React.lazy(() => import('./Common/icon-chevron-double-right.jsx')),
+ IconChevronLeft : React.lazy(() => import('./Common/icon-chevron-left.jsx')),
+ IconChevronRight : React.lazy(() => import('./Common/icon-chevron-right.jsx')),
+ IconClear : React.lazy(() => import('./Common/icon-clear.jsx')),
+ IconClock : React.lazy(() => import('./Common/icon-clock.jsx')),
+ IconClose : React.lazy(() => import('./Common/icon-close.jsx')),
+ IconCountryFlag : React.lazy(() => import('./Common/icon-country-flag.jsx')),
+ IconDanger : React.lazy(() => import('./Common/icon-danger.jsx')),
+ IconDeposit : React.lazy(() => import('./Common/icon-deposit.jsx')),
+ IconExclamation : React.lazy(() => import('./Common/icon-exclamation.jsx')),
+ IconFlag : React.lazy(() => import('./Common/icon-flag.jsx')),
+ IconInfoBlue : React.lazy(() => import('./Common/icon-info-blue.jsx')),
+ IconInfoOutline : React.lazy(() => import('./Common/icon-info-outline.jsx')),
+ IconInformation : React.lazy(() => import('./Common/icon-information.jsx')),
+ IconMinimize : React.lazy(() => import('./Common/icon-minimize.jsx')),
+ IconMinus : React.lazy(() => import('./Common/icon-minus.jsx')),
+ IconPlus : React.lazy(() => import('./Common/icon-plus.jsx')),
+ IconQuestion : React.lazy(() => import('./Common/icon-question.jsx')),
+ IconRedDot : React.lazy(() => import('./Common/icon-red-dot.jsx')),
+ IconSuccess : React.lazy(() => import('./Common/icon-success.jsx')),
+ IconWarning : React.lazy(() => import('./Common/icon-warning.jsx')),
+ IconWip : React.lazy(() => import('./Common/icon-wip.jsx')),
+ IconWithdrawal : React.lazy(() => import('./Common/icon-withdrawal.jsx')),
+
+ // Contract
+ ContractIconClose: React.lazy(() => import('./Contract/icon-close.jsx')),
+ IconEndTime : React.lazy(() => import('./Contract/icon-end-time.jsx')),
+ ContractIconFlag : React.lazy(() => import('./Contract/icon-flag.jsx')),
+ IconStartTime : React.lazy(() => import('./Contract/icon-start-time.jsx')),
+ IconTick : React.lazy(() => import('./Contract/icon-tick.jsx')),
+
+ // Footer
+ IconMaximize : React.lazy(() => import('./Footer/icon-maximize.jsx')),
+ IconPositions: React.lazy(() => import('./Footer/icon-positions.jsx')),
+ IconSettings : React.lazy(() => import('./Footer/icon-settings.jsx')),
+
+ // Header
+ IconAccountsCurrency: React.lazy(() => import('./Header/AccountsCurrency/icon_accounts_currency.jsx')),
+ IconLogout : React.lazy(() => import('./Header/Drawer/icon-logout.jsx')),
+ IconBell : React.lazy(() => import('./Header/NavBar/icon-bell.jsx')),
+ IconCashier : React.lazy(() => import('./Header/NavBar/icon-cashier.jsx')),
+ IconDeriv : React.lazy(() => import('./Header/NavBar/icon-deriv.jsx')),
+ IconHamburger : React.lazy(() => import('./Header/NavBar/icon-hamburger.jsx')),
+ IconPortfolio : React.lazy(() => import('./Header/NavBar/icon-portfolio.jsx')),
+ IconReports : React.lazy(() => import('./Header/NavBar/icon-reports.jsx')),
+ IconTrade : React.lazy(() => import('./Header/NavBar/icon-trade.jsx')),
+
+ // Reports
+ IconOpenPositions: React.lazy(() => import('./Reports/icon-open-positions.jsx')),
+ IconProfitTable : React.lazy(() => import('./Reports/icon-profit-table.jsx')),
+ IconStatement : React.lazy(() => import('./Reports/icon-statement.jsx')),
+
+ // Settings
+ IconCharts : React.lazy(() => import('./Settings/icon-charts.jsx')),
+ SettingsIconClose: React.lazy(() => import('./Settings/icon-close.jsx')),
+ IconLanguage : React.lazy(() => import('./Settings/icon-language.jsx')),
+ IconPurchase : React.lazy(() => import('./Settings/icon-purchase.jsx')),
+ IconTheme : React.lazy(() => import('./Settings/icon-theme.jsx')),
+
+ // Statement
+ IconBuy : React.lazy(() => import('./Statement/icon-buy.jsx')),
+ IconPayout: React.lazy(() => import('./Statement/icon-payout.jsx')),
+ IconSell : React.lazy(() => import('./Statement/icon-sell.jsx')),
+ IconWallet: React.lazy(() => import('./Statement/icon-wallet.jsx')),
+
+ // Trading
+ IconBarrierDown : React.lazy(() => import('./Trading/Barriers/icon-barrier-down.jsx')),
+ IconBarrierUp : React.lazy(() => import('./Trading/Barriers/icon-barrier-up.jsx')),
+ IconTradeCategory : React.lazy(() => import('./Trading/Categories/icon-trade-categories.jsx')),
+ TradeCategoriesGIF: React.lazy(() => import('./Trading/Categories/trade-categories-gif.jsx')),
+ TradeCategories : React.lazy(() => import('./Trading/Categories/trade-categories.jsx')),
+ IconTradeType : React.lazy(() => import('./Trading/Types/icon-trade-types.jsx')),
+ IconLock : React.lazy(() => import('./Trading/icon-lock.jsx')),
+ IconPriceMove : React.lazy(() => import('./Trading/icon-price-move.jsx')),
+ };
+ }
+
+ render() {
+ const options = {
+ category : this.props.category,
+ className : this.props.className,
+ classNamePath: this.props.classNamePath,
+ classNameRect: this.props.classNameRect,
+ is_disabled : this.props.is_disabled,
+ onClick : this.props.onClick,
+ onMouseEnter : this.props.onMouseEnter,
+ onMouseLeave : this.props.onMouseLeave,
+ type : this.props.type,
+ };
+
+ const IconLazy = this.icons[this.props.icon];
+ if (!IconLazy) return
;
+
+ return (
+
}>
+
+
+ );
+ }
+}
+
+Icon.propTypes = {
+ category : PropTypes.string,
+ className : PropTypes.string,
+ classNamePath: PropTypes.string,
+ classNameRect: PropTypes.string,
+ icon : PropTypes.string,
+ is_disabled : PropTypes.oneOfType([PropTypes.number, PropTypes.bool]),
+ onClick : PropTypes.func,
+ type : PropTypes.string,
+};
+
+export default Icon;
diff --git a/src/javascript/app/Constants/contract.js b/src/javascript/app/Constants/contract.js
index 0342684e9009..9271274322ea 100644
--- a/src/javascript/app/Constants/contract.js
+++ b/src/javascript/app/Constants/contract.js
@@ -71,7 +71,7 @@ export const getUnsupportedContracts = () => ({
},
});
-const getContractConfig = is_high_low => ({
+export const getSupportedContracts = is_high_low => ({
CALL: {
name : is_high_low ? localize('Higher') : localize('Rise'),
position: 'top',
@@ -120,6 +120,10 @@ const getContractConfig = is_high_low => ({
name : localize('No Touch'),
position: 'bottom',
},
+});
+
+const getContractConfig = is_high_low => ({
+ ...getSupportedContracts(is_high_low),
...getUnsupportedContracts(),
});
diff --git a/src/javascript/app/Constants/icons.js b/src/javascript/app/Constants/icons.js
deleted file mode 100644
index 091cb6261c73..000000000000
--- a/src/javascript/app/Constants/icons.js
+++ /dev/null
@@ -1,130 +0,0 @@
-import { IconArrow } from 'Assets/Common/icon-arrow.jsx';
-import { IconArrowBold } from 'Assets/Common/icon-arrow-bold.jsx';
-import { IconBack } from 'Assets/Common/icon-back.jsx';
-import { IconCalendar } from 'Assets/Common/icon-calendar.jsx';
-import { IconCalendarToday } from 'Assets/Common/icon-calendar-today.jsx';
-import { IconChevronDoubleLeft } from 'Assets/Common/icon-chevron-double-left.jsx';
-import { IconChevronDoubleRight } from 'Assets/Common/icon-chevron-double-right.jsx';
-import { IconChevronLeft } from 'Assets/Common/icon-chevron-left.jsx';
-import { IconChevronRight } from 'Assets/Common/icon-chevron-right.jsx';
-import { IconClear } from 'Assets/Common/icon-clear.jsx';
-import { IconClock } from 'Assets/Common/icon-clock.jsx';
-import { IconClose } from 'Assets/Common/icon-close.jsx';
-import { IconCountryFlag } from 'Assets/Common/icon-country-flag.jsx';
-import { IconDanger } from 'Assets/Common/icon-danger.jsx';
-import { IconExclamation } from 'Assets/Common/icon-exclamation.jsx';
-import { IconFlag } from 'Assets/Common/icon-flag.jsx';
-import { IconInfoBlue } from 'Assets/Common/icon-info-blue.jsx';
-import { IconInfoOutline } from 'Assets/Common/icon-info-outline.jsx';
-import { IconInformation } from 'Assets/Common/icon-information.jsx';
-import { IconMinimize } from 'Assets/Common/icon-minimize.jsx';
-import { IconMinus } from 'Assets/Common/icon-minus.jsx';
-import { IconPlus } from 'Assets/Common/icon-plus.jsx';
-import { IconQuestion } from 'Assets/Common/icon-question.jsx';
-import { IconRedDot } from 'Assets/Common/icon-red-dot.jsx';
-import { IconSuccess } from 'Assets/Common/icon-success.jsx';
-import { IconWarning } from 'Assets/Common/icon-warning.jsx';
-
-// import { IconEntrySpotSVG } from 'Assets/Contract/icon-entry-spot.jsx';
-import { IconEndTimeSVG } from 'Assets/Contract/icon-end-time.jsx';
-import { IconFlagSVG } from 'Assets/Contract/icon-flag.jsx';
-import { IconStartTimeSVG } from 'Assets/Contract/icon-start-time.jsx';
-import { IconTickSVG } from 'Assets/Contract/icon-tick.jsx';
-
-import { IconMaximize } from 'Assets/Footer/icon-maximize.jsx';
-import { IconPositions } from 'Assets/Footer/icon-positions.jsx';
-import { IconSettings } from 'Assets/Footer/icon-settings.jsx';
-
-import { IconAccountsCurrency } from 'Assets/Header/AccountsCurrency/icon_accounts_currency.jsx';
-import { IconLogout } from 'Assets/Header/Drawer/icon-logout.jsx';
-import { IconBell } from 'Assets/Header/NavBar/icon-bell.jsx';
-import { IconCashier } from 'Assets/Header/NavBar/icon-cashier.jsx';
-import { IconHamburger } from 'Assets/Header/NavBar/icon-hamburger.jsx';
-import { IconPortfolio } from 'Assets/Header/NavBar/icon-portfolio.jsx';
-import { IconReports } from 'Assets/Header/NavBar/icon-reports.jsx';
-import { IconTrade } from 'Assets/Header/NavBar/icon-trade.jsx';
-
-import { IconBuy } from 'Assets/Statement/icon-buy.jsx';
-import { IconDeposit } from 'Assets/Statement/icon-deposit.jsx';
-import { IconPayout } from 'Assets/Statement/icon-payout.jsx';
-import { IconSell } from 'Assets/Statement/icon-sell.jsx';
-import { IconWallet } from 'Assets/Statement/icon-wallet.jsx';
-import { IconWithdrawal } from 'Assets/Statement/icon-withdrawal.jsx';
-
-import { IconBarrierDown } from 'Assets/Trading/Barriers/icon-barrier-down.jsx';
-import { IconBarrierUp } from 'Assets/Trading/Barriers/icon-barrier-up.jsx';
-import { IconTradeCategory } from 'Assets/Trading/Categories/icon-trade-categories.jsx';
-import { IconTradeType } from 'Assets/Trading/Types/icon-trade-types.jsx';
-import { IconLock } from 'Assets/Trading/icon-lock.jsx';
-import { IconPriceMove } from 'Assets/Trading/icon-price-move.jsx';
-
-const ICONS = {
- COMMON: {
- ARROW : IconArrow,
- ARROW_BOLD : IconArrowBold,
- BACK : IconBack,
- CALENDAR_TODAY : IconCalendarToday,
- CALENDAR : IconCalendar,
- CHEVRON_DOUBLE_LEFT : IconChevronDoubleLeft,
- CHEVRON_DOUBLE_RIGHT: IconChevronDoubleRight,
- CHEVRON_LEFT : IconChevronLeft,
- CHEVRON_RIGHT : IconChevronRight,
- CLEAR : IconClear,
- CLOCK : IconClock,
- CLOSE : IconClose,
- COUNTRY_FLAG : IconCountryFlag,
- DANGER : IconDanger,
- EXCLAMATION : IconExclamation,
- FLAG : IconFlag,
- INFORMATION : IconInformation,
- INFO_BLUE : IconInfoBlue,
- INFO_OUTLINE : IconInfoOutline,
- MINIMIZE : IconMinimize,
- MINUS : IconMinus,
- PLUS : IconPlus,
- QUESTION : IconQuestion,
- RED_DOT : IconRedDot,
- SUCCESS : IconSuccess,
- WARNING : IconWarning,
- },
- CONTRACT: {
- // ENTRY_SPOT: IconEntrySpotSVG,
- END_TIME : IconEndTimeSVG,
- FLAG : IconFlagSVG,
- START_TIME: IconStartTimeSVG,
- TICK : IconTickSVG,
- },
- FOOTER: {
- MAXIMIZE : IconMaximize,
- POSITIONS: IconPositions,
- SETTINGS : IconSettings,
- },
- HEADER: {
- ACCOUNTS_CURRENCY: IconAccountsCurrency,
- LOGOUT : IconLogout,
- BELL : IconBell,
- CASHIER : IconCashier,
- HAMBURGER : IconHamburger,
- PORTFOLIO : IconPortfolio,
- REPORTS : IconReports,
- TRADE : IconTrade,
- },
- STATEMENT: {
- BUY : IconBuy,
- DEPOSIT : IconDeposit,
- PAYOUT : IconPayout,
- SELL : IconSell,
- WALLET : IconWallet,
- WITHDRAWAL: IconWithdrawal,
- },
- TRADING: {
- BARRIER_DOWN : IconBarrierDown,
- BARRIER_UP : IconBarrierUp,
- TRADE_CATEGORY: IconTradeCategory,
- TRADE_TYPES : IconTradeType,
- LOCK : IconLock,
- PRICE_MOVE : IconPriceMove,
- },
-};
-
-export { ICONS };
diff --git a/src/javascript/app/Constants/index.js b/src/javascript/app/Constants/index.js
index 227120929b86..cc269b578bdf 100644
--- a/src/javascript/app/Constants/index.js
+++ b/src/javascript/app/Constants/index.js
@@ -1,4 +1,3 @@
export * from './contract';
export routes from './routes';
export * from './ui';
-export * from './icons';
diff --git a/src/javascript/app/Modules/Contract/Components/InfoBox/info-box-expired.jsx b/src/javascript/app/Modules/Contract/Components/InfoBox/info-box-expired.jsx
index d6145e5903b5..7bc24d74fcef 100644
--- a/src/javascript/app/Modules/Contract/Components/InfoBox/info-box-expired.jsx
+++ b/src/javascript/app/Modules/Contract/Components/InfoBox/info-box-expired.jsx
@@ -3,8 +3,7 @@ import PropTypes from 'prop-types';
import React from 'react';
import { localize } from '_common/localize';
import Money from 'App/Components/Elements/money.jsx';
-import Icon from 'Assets/Common/icon.jsx';
-import IconFlag from 'Assets/Contract/icon-flag.jsx';
+import Icon from 'Assets/icon.jsx';
import SellInfo from '../Sell/sell-info.jsx';
const InfoBoxExpired = ({
@@ -27,7 +26,7 @@ const InfoBoxExpired = ({
}
{ has_flag &&
-
+
}
{localize('Profit/Loss')}:
diff --git a/src/javascript/app/Modules/Contract/Components/InfoBox/info-box-longcode.jsx b/src/javascript/app/Modules/Contract/Components/InfoBox/info-box-longcode.jsx
index 770ab2c48ec2..210daa74a431 100644
--- a/src/javascript/app/Modules/Contract/Components/InfoBox/info-box-longcode.jsx
+++ b/src/javascript/app/Modules/Contract/Components/InfoBox/info-box-longcode.jsx
@@ -1,15 +1,13 @@
import { observer } from 'mobx-react';
import PropTypes from 'prop-types';
import React from 'react';
-import {
- Icon,
- IconFlag } from 'Assets/Common';
+import Icon from 'Assets/icon.jsx';
const InfoBoxLongcode = ({
contract_info,
}) => (
-
+
{contract_info.longcode}
);
diff --git a/src/javascript/app/Modules/Contract/Components/LastDigitPrediction/last-digit-pointer.jsx b/src/javascript/app/Modules/Contract/Components/LastDigitPrediction/last-digit-pointer.jsx
index 182dc7296cfa..e332b6b69156 100644
--- a/src/javascript/app/Modules/Contract/Components/LastDigitPrediction/last-digit-pointer.jsx
+++ b/src/javascript/app/Modules/Contract/Components/LastDigitPrediction/last-digit-pointer.jsx
@@ -1,7 +1,7 @@
-import classNames from 'classnames';
-import PropTypes from 'prop-types';
-import React from 'react';
-import { IconPriceMove } from 'Assets/Trading/icon-price-move.jsx';
+import classNames from 'classnames';
+import PropTypes from 'prop-types';
+import React from 'react';
+import Icon from 'Assets/icon.jsx';
const LastDigitPointer = ({
is_lost,
@@ -12,7 +12,8 @@ const LastDigitPointer = ({
className='digits__pointer'
style={{ marginLeft: position }}
>
-
{message}
-
+
);
diff --git a/src/javascript/app/Modules/Contract/Containers/contract-replay.jsx b/src/javascript/app/Modules/Contract/Containers/contract-replay.jsx
index adf55e076ea3..ea2eca350368 100644
--- a/src/javascript/app/Modules/Contract/Containers/contract-replay.jsx
+++ b/src/javascript/app/Modules/Contract/Containers/contract-replay.jsx
@@ -7,8 +7,7 @@ import ChartLoader from 'App/Components/Elements/chart-loader.jsx';
import ContractDrawer from 'App/Components/Elements/ContractDrawer';
import NotificationMessages from 'App/Containers/notification-messages.jsx';
import { connect } from 'Stores/connect';
-import { Icon } from 'Assets/Common';
-import { IconClose } from 'Assets/Settings';
+import Icon from 'Assets/icon.jsx';
import AppRoutes from 'Constants/routes';
import { localize } from '_common/localize';
import InfoBox from './info-box.jsx';
@@ -53,7 +52,7 @@ class ContractReplay extends React.Component {
const action_bar_items = [
{
onClick: () => this.props.history.push(AppRoutes.trade),
- icon : IconClose,
+ icon : 'SettingsIconClose',
title : localize('Close'),
},
];
diff --git a/src/javascript/app/Modules/Portfolio/Components/contract-type-cell.jsx b/src/javascript/app/Modules/Portfolio/Components/contract-type-cell.jsx
index 4a9921c1a52e..64cd6b5a7408 100644
--- a/src/javascript/app/Modules/Portfolio/Components/contract-type-cell.jsx
+++ b/src/javascript/app/Modules/Portfolio/Components/contract-type-cell.jsx
@@ -1,13 +1,12 @@
import React from 'react';
import PropTypes from 'prop-types';
import { getContractTypeDisplay } from 'Constants/contract';
-import { Icon } from 'Assets/Common/icon.jsx';
-import { IconTradeType } from 'Assets/Trading/Types';
+import Icon from 'Assets/icon.jsx';
const ContractTypeCell = ({ type }) => (
-
+
{type && getContractTypeDisplay(type) || ''}
diff --git a/src/javascript/app/Modules/Portfolio/Components/empty-portfolio-message.jsx b/src/javascript/app/Modules/Portfolio/Components/empty-portfolio-message.jsx
index 3a1c0d25fbcc..c4349746296c 100644
--- a/src/javascript/app/Modules/Portfolio/Components/empty-portfolio-message.jsx
+++ b/src/javascript/app/Modules/Portfolio/Components/empty-portfolio-message.jsx
@@ -1,11 +1,11 @@
-import React from 'react';
-import { localize } from '_common/localize';
-import { IconPositions } from 'Assets/Footer';
+import React from 'react';
+import { localize } from '_common/localize';
+import Icon from 'Assets/icon.jsx';
const EmptyPortfolioMessage = () => (
-
+
{localize('No open positions')}
diff --git a/src/javascript/app/Modules/Reports/Components/empty-trade-history-message.jsx b/src/javascript/app/Modules/Reports/Components/empty-trade-history-message.jsx
index 5a2ee2ffeeae..96283a1d8c35 100644
--- a/src/javascript/app/Modules/Reports/Components/empty-trade-history-message.jsx
+++ b/src/javascript/app/Modules/Reports/Components/empty-trade-history-message.jsx
@@ -1,33 +1,30 @@
-import PropTypes from 'prop-types';
-import React from 'react';
+import PropTypes from 'prop-types';
+import React from 'react';
+import Icon from 'Assets/icon.jsx';
const EmptyTradeHistoryMessage = ({
has_selected_date,
component_icon,
localized_message,
localized_period_message,
-}) => {
- const ComponentIcon = component_icon;
-
- return (
-
-
-
-
- {
- !has_selected_date ?
- localized_message
- :
- localized_period_message
- }
-
-
-
- );
-};
+}) => (
+
+
+
+
+ {
+ !has_selected_date ?
+ localized_message
+ :
+ localized_period_message
+ }
+
+
+
+);
EmptyTradeHistoryMessage.propTypes = {
- component_icon : PropTypes.func,
+ component_icon : PropTypes.string,
has_selected_date : PropTypes.bool,
localized_message : PropTypes.string,
localized_period_message: PropTypes.string,
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
index 150eb9251be8..ac76df613633 100644
--- a/src/javascript/app/Modules/Reports/Components/market-symbol-icon-row.jsx
+++ b/src/javascript/app/Modules/Reports/Components/market-symbol-icon-row.jsx
@@ -1,11 +1,7 @@
import PropTypes from 'prop-types';
import React from 'react';
import { UnderlyingIcon } from 'App/Components/Elements/underlying-icon.jsx';
-import { Icon } from 'Assets/Common';
-import { IconDeposit } from 'Assets/Common/icon-deposit.jsx';
-import { IconWithdrawal } from 'Assets/Common/icon-withdrawal.jsx';
-import { IconTransfer } from 'Assets/Common/icon-transfer.jsx';
-import { IconTradeType } from 'Assets/Trading/Types';
+import Icon from 'Assets/icon.jsx';
import { getMarketInformation } from '../Helpers/market-underyling';
const MarketSymbolIconRow = ({ payload, show_description }) => {
@@ -21,17 +17,21 @@ const MarketSymbolIconRow = ({ payload, show_description }) => {
-
+
{show_description && market_information.category}
);
- } else if (['deposit', 'withdrawal', 'transfer'].includes(payload.action_type)) {
+ } else if (['deposit', 'withdrawal'].includes(payload.action_type)) {
return (
);
}
diff --git a/src/javascript/app/Modules/Reports/Components/placeholder-component.jsx b/src/javascript/app/Modules/Reports/Components/placeholder-component.jsx
index 16b83a1b0612..63fa7ea44aad 100644
--- a/src/javascript/app/Modules/Reports/Components/placeholder-component.jsx
+++ b/src/javascript/app/Modules/Reports/Components/placeholder-component.jsx
@@ -19,7 +19,7 @@ const PlaceholderComponent = (props) => {
};
PlaceholderComponent.propTypes = {
- component_icon : PropTypes.func,
+ component_icon : PropTypes.string,
empty_message_component: PropTypes.func,
has_selected_date : PropTypes.bool,
localized_message : PropTypes.string,
diff --git a/src/javascript/app/Modules/Reports/Components/profit-loss-card-content.jsx b/src/javascript/app/Modules/Reports/Components/profit-loss-card-content.jsx
index 0764c26efbdd..51771e0e4c67 100644
--- a/src/javascript/app/Modules/Reports/Components/profit-loss-card-content.jsx
+++ b/src/javascript/app/Modules/Reports/Components/profit-loss-card-content.jsx
@@ -1,9 +1,9 @@
-import classNames from 'classnames';
-import PropTypes from 'prop-types';
-import React from 'react';
-import Localize from 'App/Components/Elements/localize.jsx';
-import Money from 'App/Components/Elements/money.jsx';
-import { IconPriceMove } from 'Assets/Trading/icon-price-move.jsx';
+import classNames from 'classnames';
+import PropTypes from 'prop-types';
+import React from 'react';
+import Localize from 'App/Components/Elements/localize.jsx';
+import Money from 'App/Components/Elements/money.jsx';
+import Icon from 'Assets/icon.jsx';
const ProfitLossCardContent = ({
currency,
@@ -30,7 +30,8 @@ const ProfitLossCardContent = ({
},
)}
>
-