Skip to content

Commit

Permalink
Merge pull request #700 from dmytroshch/fix/derivatives
Browse files Browse the repository at this point in the history 
(fix) Derivatives: leverage tab conditions
  • Loading branch information
@bhoomij
bhoomij authored Oct 11, 2023
2 parents 0248f2a + 01c9c25 commit f7a420b
Show file tree
Hide file tree
Showing 5 changed files with 115 additions and 41 deletions.
21 changes: 21 additions & 0 deletions src/components/StrategyEditor/StrategyEditor.helpers.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@ import _find from 'lodash/find'
import _map from 'lodash/map'
import _reduce from 'lodash/reduce'
import _isEmpty from 'lodash/isEmpty'
import _includes from 'lodash/includes'
import _size from 'lodash/size'
import { isDerivativeCcy } from '@ufx-ui/utils'
import { MAX_STRATEGY_LABEL_LENGTH as MAX_LABEL_LENGTH } from '../../constants/variables'

import {
Expand Down Expand Up @@ -264,3 +266,22 @@ export const validateStrategyName = (label, t) => {

return ''
}

export const processMarketChangeInStrategy = (nextMarket, markets) => {
const market = _find(markets, (m) => m.wsID === nextMarket.wsID)
const options = {
[STRATEGY_OPTIONS_KEYS.SYMBOL]: market,
[STRATEGY_OPTIONS_KEYS.CAPITAL_ALLOCATION]: 0,
}

const isMarginPair = _includes(market?.contexts, 'm')
const isDerivativePair = isDerivativeCcy(market.wsID)
if (!isMarginPair) {
options[STRATEGY_OPTIONS_KEYS.MARGIN] = isDerivativePair
}
if (isMarginPair && !isDerivativePair) {
options[STRATEGY_OPTIONS_KEYS.USE_MAX_LEVERAGE] = true
}

return options
}
34 changes: 15 additions & 19 deletions src/components/StrategyOptionsPanel/StrategyMarketSelect.js
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
import React from 'react'
import React, { useCallback } from 'react'
import _isEmpty from 'lodash/isEmpty'
import _includes from 'lodash/includes'
import _find from 'lodash/find'
import PropTypes from 'prop-types'
import clsx from 'clsx'
import { Tooltip } from '@ufx-ui/core'
import { useTranslation } from 'react-i18next'
import MarketSelect from '../MarketSelect'
import { STRATEGY_OPTIONS_KEYS } from '../StrategyEditor/StrategyEditor.helpers'
import {
STRATEGY_OPTIONS_KEYS,
processMarketChangeInStrategy,
} from '../StrategyEditor/StrategyEditor.helpers'
import {
MARKET_SHAPE,
STRATEGY_SHAPE,
Expand All @@ -19,21 +20,16 @@ const StrategyMarketSelect = ({
markets,
isDisabled,
}) => {
const onMarketSelectChange = (selection) => {
if (isDisabled) {
return
}
const sel = _find(markets, (m) => m.wsID === selection.wsID)
const options = {
[STRATEGY_OPTIONS_KEYS.SYMBOL]: sel,
[STRATEGY_OPTIONS_KEYS.CAPITAL_ALLOCATION]: 0,
}

if (!_includes(sel?.contexts, 'm')) {
options[STRATEGY_OPTIONS_KEYS.MARGIN] = false
}
saveStrategyOptions(options)
}
const onMarketSelectChange = useCallback(
(selection) => {
if (isDisabled) {
return
}
const updatedStrategy = processMarketChangeInStrategy(selection, markets)
saveStrategyOptions(updatedStrategy)
},
[isDisabled, markets, saveStrategyOptions],
)

const { t } = useTranslation()

Expand Down
60 changes: 50 additions & 10 deletions src/modals/Strategy/StrategySettingsModal/StrategySettingsModal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,11 @@ import React, {
import { useSelector } from 'react-redux'
import PropTypes from 'prop-types'
import { useTranslation } from 'react-i18next'
import _map from 'lodash/map'
import { reduxSelectors } from '@ufx-ui/bfx-containers'

import _forEach from 'lodash/forEach'
import _includes from 'lodash/includes'
import _get from 'lodash/get'
import _isEmpty from 'lodash/isEmpty'
import Modal from '../../../ui/Modal'
import AmountInput from '../../../components/OrderForm/FieldComponents/input.amount'
Expand All @@ -26,6 +30,8 @@ import { STRATEGY_SHAPE } from '../../../constants/prop-types-shapes'

import './style.scss'

const { getIsDerivativePair: _getIsDerivativePair } = reduxSelectors

const convertNumberToString = (value) => (value ? String(AmountInput.processValue(value)) : '')

const StrategySettingsModal = (props) => {
Expand Down Expand Up @@ -73,6 +79,7 @@ const StrategySettingsModal = (props) => {
const [pendingForSaveOptions, setPendingForSaveOptions] = useState(false)

const isPaperTrading = useSelector(getIsPaperTrading)
const getIsDerivativePair = useSelector(_getIsDerivativePair)

const isFullFilled = isExecutionInputsFullFilled(
capitalAllocationValue,
Expand All @@ -81,6 +88,10 @@ const StrategySettingsModal = (props) => {
)

const isPairSelected = !_isEmpty(symbol)
const isDerivativePair = useMemo(
() => getIsDerivativePair(symbol.wsID),
[symbol, getIsDerivativePair],
)

const { t } = useTranslation()

Expand Down Expand Up @@ -155,6 +166,8 @@ const StrategySettingsModal = (props) => {
setIncreaseLeverage={setIncreaseLeverage}
increaseLeverage={increaseLeverage}
isPairSelected={isPairSelected}
disabledInputs={!isPaperTrading || !isPairSelected}
isDerivativePair={isDerivativePair}
/>
)

Expand All @@ -167,6 +180,8 @@ const StrategySettingsModal = (props) => {
setStopOrderValue={setStopOrderValue}
isPairSelected={isPairSelected}
setHasErrors={setHasErrors}
isPaperTrading={isPaperTrading}
disabledInputs={!isPaperTrading || !isPairSelected}
/>
)

Expand All @@ -188,27 +203,52 @@ const StrategySettingsModal = (props) => {
isPairSelected,
additionStopOrder,
stopOrderValue,
isDerivativePair,
],
)

const tabs = useMemo(() => {
return _map(STRATEGY_SETTINGS_TABS, (tab) => ({
key: tab,
label: t(`strategySettingsModal.${tab}`),
component: getTabContentComponent(tab),
}))
}, [t, getTabContentComponent])
const isMarginPair = useMemo(
() => _includes(_get(symbol, 'contexts', []), 'm'),
[symbol],
)

const tabsConfig = useMemo(() => {
const tabs = []
console.log(isDerivativePair, isMarginPair)

_forEach(STRATEGY_SETTINGS_TABS, (tab) => {
if (
tab === STRATEGY_SETTINGS_TABS.Leverage
&& !(isMarginPair || isDerivativePair)
) {
return
}
tabs.push({
key: tab,
label: t(`strategySettingsModal.${tab}`),
component: getTabContentComponent(tab),
})
})

return tabs
}, [t, getTabContentComponent, isMarginPair, isDerivativePair])

useEffect(() => {
setCapitalAllocationValue(convertNumberToString(capitalAllocation))
setMaxDrawdownPercValue(convertNumberToString(maxDrawdownPerc))
setStopLossPercValue(convertNumberToString(stopLossPerc))
setActiveTab(STRATEGY_SETTINGS_TABS.Execution)

setTradeOnMargin(margin)
if (!margin && isDerivativePair) {
setTradeOnMargin(true)
} else {
setTradeOnMargin(margin)
}

if (!useMaxLeverage) {
setMarginTradeMode(MARGIN_TRADE_MODES.FIXED)
}

if (leverage) {
setLeverageValue(convertNumberToString(leverage))
}
Expand Down Expand Up @@ -301,7 +341,7 @@ const StrategySettingsModal = (props) => {
<Modal.Tabs
activeTab={activeTab}
setActiveTab={setActiveTab}
tabs={tabs}
tabs={tabsConfig}
/>
<Modal.Footer>
{!isPaperTrading ? (
Expand Down
35 changes: 25 additions & 10 deletions src/modals/Strategy/StrategySettingsModal/tabs/StrategySettings.Leverage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import React, { useMemo } from 'react'
import PropTypes from 'prop-types'
import { Checkbox } from '@ufx-ui/core'
import _map from 'lodash/map'
import _forEach from 'lodash/forEach'
import { Trans, useTranslation } from 'react-i18next'
import AttentionBar from '../../../../ui/AttentionBar/AttentionBar'
import Dropdown from '../../../../ui/Dropdown'
Expand All @@ -21,15 +21,28 @@ const LeverageTab = ({
increaseLeverage,
setIncreaseLeverage,
isPairSelected,
disabledInputs,
isDerivativePair,
}) => {
const { t } = useTranslation()

const marginTradeModesOptions = useMemo(
() => _map(MARGIN_TRADE_MODES, (mode) => ({
label: t(`strategySettingsModal.${mode}`),
value: mode,
})),
[t],
() => {
const options = []

_forEach(MARGIN_TRADE_MODES, (mode) => {
if (mode === MARGIN_TRADE_MODES.FIXED && !isDerivativePair) {
return
}
options.push({
label: t(`strategySettingsModal.${mode}`),
value: mode,
})
})

return options
},
[t, isDerivativePair],
)

return (
Expand All @@ -44,7 +57,7 @@ const LeverageTab = ({
onChange={setTradeOnMargin}
label={t('strategySettingsModal.tradeOnMarginCheckbox')}
checked={tradeOnMargin}
disabled={!isPairSelected}
disabled={disabledInputs || isDerivativePair}
className='appsettings-modal__checkbox'
/>
<div className='appsettings-modal__description'>
Expand All @@ -59,7 +72,7 @@ const LeverageTab = ({
options={marginTradeModesOptions}
onChange={setMarginTradeMode}
value={marginTradeMode}
disabled={!isPairSelected}
disabled={disabledInputs}
/>
</div>
{marginTradeMode === MARGIN_TRADE_MODES.MAX && (
Expand All @@ -81,14 +94,14 @@ const LeverageTab = ({
value={leverageValue}
onChange={setLeverageValue}
className='hfui-execution-options-modal__option'
disabled={!isPairSelected}
disabled={disabledInputs}
/>
<div className='hfui-execution-options-modal__option'>
<Checkbox
onChange={setIncreaseLeverage}
label={t('strategySettingsModal.increaseLeverageCheckbox')}
checked={increaseLeverage}
disabled={!isPairSelected}
disabled={disabledInputs}
className='appsettings-modal__checkbox'
/>
<div className='appsettings-modal__description'>
Expand Down Expand Up @@ -132,6 +145,8 @@ LeverageTab.propTypes = {
increaseLeverage: PropTypes.bool.isRequired,
setIncreaseLeverage: PropTypes.func.isRequired,
isPairSelected: PropTypes.bool.isRequired,
disabledInputs: PropTypes.bool.isRequired,
isDerivativePair: PropTypes.bool.isRequired,
}

export default LeverageTab
6 changes: 4 additions & 2 deletions src/modals/Strategy/StrategySettingsModal/tabs/StrategySettings.Orders.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ const OrdersTab = ({
stopOrderValue,
isPairSelected,
setHasErrors,
disabledInputs,
}) => {
const [stopOrderValueError, setStopOrderValueError] = useState('')
const { t } = useTranslation()
Expand Down Expand Up @@ -51,7 +52,7 @@ const OrdersTab = ({
</p>
)}
checked={additionStopOrder}
disabled={!isPairSelected}
disabled={disabledInputs}
className='appsettings-modal__checkbox'
/>
<div className='appsettings-modal__description'>
Expand All @@ -78,7 +79,7 @@ const OrdersTab = ({
value={stopOrderValue}
min={0}
max={99}
disabled={!additionStopOrder || !isPairSelected}
disabled={!additionStopOrder || disabledInputs}
/>
<p className='hfui-execution-options-modal__right-placeholder'>
{t('strategySettingsModal.stopOrderValuePlaceholder')}
Expand All @@ -95,6 +96,7 @@ OrdersTab.propTypes = {
stopOrderValue: PropTypes.string.isRequired,
isPairSelected: PropTypes.bool.isRequired,
setHasErrors: PropTypes.func.isRequired,
disabledInputs: PropTypes.bool.isRequired,
}

export default OrdersTab

0 comments on commit f7a420b

Please sign in to comment.