Skip to content

Commit

Permalink
Maryia/67492/task_add_accumulators (deriv-com#6406)
Browse files Browse the repository at this point in the history
* Merge '67492_accumulators_purchase' into 'maryia/67492/task_add_accumulators'

* Maryia/75617/add_accu_to_trade_params (#3)

* initialized ACCU trade params for responsive

* added LabeledQuantityInputMobile & improved AccumulatorsAmountMobile

* feat: added Accumulator radio group for growth_rate

* feat: finalized Accumulator growth_rates radio group for mobile

* feat: responsive- added Take profit to trade params & aligned purchase button icon

* feat: improved mobile trade params for ACCU

* feat: finalized trade params for ACCU

* maryia/72761/task_add_recent_positions_drawer (#4)

* feat: initialized ACCU contract card in recent positions

* feat: initialized ProgressSliderSolidLine for ACCU

* feat: updated recent positions card for ACCU for open/lost/won states

* chore: improvements for ACCU card in responsive recent positions

* chore: added TickCounterProgressBar component

* feat: added TickCounterBar and reverted ProgressSlider & ProgressSliderMobile

* chore: reverted original Recent positions drawer width

* chore: improved TickCounterBar styling

* maryia/76528/task_implement_contract_details_drawer (#5)

* chore: updated Details in contract card for ACCU + styling

* feat: implemented ACCU contract card in contract details + improved recent positions

* chore: updated icons for ACCU trade type & contract category

* maryia/72769/add_ticks_history_stats_widget (#6)

* feat: init version of TicksHistoryStatsWidget for ACCU

* chore: TicksHistoryStats

* chore: improved tick history styling

* chore: added more styles & animated progress dots under latest counter

* feat: finalized desktop ticks history stats for dtrader page

* feat: added ticks history to contract details page

* improved ticks history stats for desktop & initialized it for responsive

* made responsive stats non-expandable

* maryia/77261/task_manual_for_history_widget (#8)

* chore: discarded getUpdatedTicksHistoryStats as BE will send 15 exact values instead of 100+latest

* feat: added AccumulatorsStatsManualModal

* feat: finalized AccumulatorsStatsManualModal for desktop & responsive

* chore: added getUpdatedTicksHistoryStats to process arrays of counters with epochs expected from BE

* feat: added expanded AccumulatorsStats dialog for responsive

* chore: contract card styling improvements + using ACCU tick_count as max_ticks_number

* chore: improved AccumulatorsStats to load after tick counters have loaded

* maryia/75621/task_add_tests_and_restyle_contract_card (#9)

* chore: improved ACCU contract type icon & label styling in contract card

* chore: added tests for accumulator.js helper function

* chore: added tests for Accumulator.jsx

* maryia/75621/part_2_task_accu_barriers (#10)

* chore: updated dummy data

* chore: fixed history stats styles & added tests for AccumulatorsStats

* chore: improved AccumulatorsStats and its tests

* chore: updated contract card & open positions

* maryia/75621/add barriers for stay in contract on trader page (#12)

* chore: test out passing trade data to all-markers for drawing barriers without contract + improvements

* feat: added barriers for accumulators without open contract

* feat: added markers and barriers for stay in contract on trader page

* chore: adjusted open contract profit label (#13)

* yauheni/77994/trader add break out contract type (#14)

* yauheni/77994/trader add break out contract type

* regexp fix

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* yauheni/78429/update styles of tick history widget (#15)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* chore: prepared data for connecting API (#16)

* Maryia/78473/part 2 prepare for api + improvements (#18)

* chore: improved barriers without contract and open contract label

* chore: prepared data for api connection

* chore: added price tags for barriers in contract details (#19)

* feat: initialized AccumulatorsProfitLossTooltip (#20)

* yauheni/78477/update params with buttons for responsive (#17)

* yauheni/78477/update params with buttons for responsive

* fix styles accordingly to design

* buttons gap fix

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* yauheni/resolve build errors (#21)

* yauheni/resolve build errors

* optional property for is_checkbox_hidden

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* Yauheni/78633/update styles for tick history widget (#22)

* yauheni/resolve build errors

* yauheni/78633/update styles for tick history widget

* yauheni/78633/update styles for tick history widget responsive

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* maryia/78839/complete_sold_labels (#23)

* chore: added tolltips for all sold positions & won/lost coloring

* feat: finalized AccumulatorsProfitLossTooltip

* maryia/improvements for stats and tooltip (#24)

* chore: accumulators stats improvements

* improvements

* maryia/improvements for sold contract label

* maryia/78574/add_barriers_to_contract_details

* maryia/79085/remove_break_out_history_from_stats_widget (#26)

* maryia/79085/remove_break_out_history_from_stats

* chore: made purchaseButtonsOverlay flexible

* chore: added tests for PurchaseButtonsOverlay

* Yauheni/77995/update trade params for stayin breakout (#25)

* yauheni/77995/update trade params for stayin breakout

* take profit alimngment

* buttons styles, take profit alingment

* maryia/78574/add_barriers_to_contract_details

* stake font and icon fix, go_tp_reports button styles

* update contract store from parent

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>
Co-authored-by: maryia-binary <maryia@binary.com>

* maryia/fix: styles & fonts for responsive trade types

* Maryia/79549/part 1: update tick markers for ACCU in contract details + improvements (#27)

* maryia/79549/add_tick_markers_contract_details

* chore: improvements for styles in responsive trade types desc

* yauheni/79530/remove breakout contract (#28)

* yauheni/79530/remove breakout contract

* proposal data fields fix

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* maryia/styling improvements

* maryia/fix: forcing Div100vh to re-render when height_offset for responsive has changed

* maryia/fix: observables + markers

* maryia/chore: prevented barriers, labels and markers from going outside axes (#30)

* maryia/79969/set_default_chart_type_and_interval_to_Area_and_1_tick

* maryia/chore: changed trade type name to Accumulators

* maryia/80163/set growth rate based on default value from BE contracts_for response

* yauheni/80091/hide chart mode icon for accumulators (#33)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* maryia/80166/connect_to_available_API (#34)

* chore: connected api without contracts_for for now

* chore: updated proposal

* chore: updated tests for new proposal

* maryia/80163/add-growth-rate-to-purchase-button

* maryia/refactored purchase button growth_rate text

* maryia/chore: removed unused code for outside barriers

* maryia/fix: barrier shade color for ongoing contract

* feat: restore chart mode set for non accumulators contract after switching (#37)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* yauheni/80158/update ui according to latest design (design flow 1-2) (#36)

* icon accumulator change

* purchase btn, stats fix

* fix styles, flow 1

* accumulator design flow 2

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* Maryia/80686/feat: profit text animation for ongoing contract (#39)

* fix: showing profit text next to current spot for open contract

* chore: animated profit text

* feat: added animated profit text for ongoing contract

* test: fixed a test

* chore: removed unused variable

* fix: maryia/80686/profit text color

* fix: maryia/using default growth rate only if no stored growth rate

* feat: allow accumulators only for demo account (#40)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* Yauheni/80158/update UI according to latest design part 2  (#38)

* accu design chart position fix

* accu page for reports rendering

* reports card design fix

* reports card design fix2

* updated design fix

* pseudoelement colon fix

* emphasizing value fix

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* maryia/80687/ticks_contract_details (#41)

* fix: tick markers in contract details & take profit logics

* feat: showing only 10 last ticks for accumulators ongoing contract

* chore: display all trade types when list is not empty

* style: typo

* chore: maryia/added opacity to profit text + connected contracts_for + refactoring

* chore: improved tick stream for ACCU in contract details + stats alignment

* chore: maryia/handled undefined profit & updated opacity animation timing

* chore: temporary dummy api connection

* fix: maryia/hide profit if undefined, display if number

* revert: dummi api

* feat: implement last design part 1 (#43)

* feat: implement last design part 1

* fix: test text fix

* refactor: stats style for mobile fix

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* Maryia/82425/task highlight crossing tick (#42)

* feat: hightlighting crossing tick

* feat: sync highlighting of crossing tick based on ticks_history_stats

* Maryia/83069/task: replace image with video manual (#44)

* feat: replaced manual image with video + responsive stats improvement

* test: fixed a test

* fix: entry tick marker in dtrader

* style: removed extra margin-bottom

* feat: implement last design part 2 (#45)

* feat: implement last design part 2

* fix: initial growth_rate added

* refactor: growth_rate from contract_for delete

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* refactor: accu sold contract tooltip animation change (#49)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* Maryia/82257/Contract Details tick markers + AccumulatorsProfitLossText refactoring (#48)

* chore: saving canvas context before accu barriers are drawn and restoring when finished drawing

* fix: endtime, avoid fetching history in replay, avoid 0 profit animation

* chore: forcing chart reload when start_epoch changes to earlier epoch + refactored profit-text

* refactor: accumulators-profit-loss-text

* refactor: tooltip style and tests (#51)

* refactor: tooltip style and tests

* refactor: accumulator info text

* refactor: profit tooltip text test add

* refactor: radiogroupwithinfomobile test added

* refactor: tickhistorycounter tests added

* refactor: tickcounterbar test added

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* Maryia/83311/Refactoring, tests, TS migration (#50)

* refactor: purchase-buttons-overlay.spec.js from enzyme to jest

* style: removed extra variable

* refactor: from accumulator.js with chai to accumulator.spec.js with jest

* refactor: removed unused dummy data

* test: added tests for accumulators-stats-manual-modal.jsx

* chore: improved accumulators-stats-manual-modal

* refactor: incapsulated AccumulatorsChartElements in trade.jsx

* fix: maryia/circleci eslint error

* feat: maryia/added dark theme video manual for stats + fix for circleci

* test: maryia/added tests for AccumulatorsInfoDisplay & LabeledQuantityInputMobile

* chore: maryia/ address review comments + updated videos

* fix: maryia/open positions: auto-select Accumulators if has open ACCU contracts

* refactor: accumulatorschartelements test added (#52)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* style: maryia/apply review suggestions

* style: maryia/apply review suggestions

* refactor: maryia/refactoring + small improvements & adjustments

* chore: add built icons file

* fix: circleci tests + improvements

* chore: refactoring + added loader before video manual first loads

* refactor: improvements + addressed review comments

* yauheni/qa checks refactoring 1 (#53)

* refactor: open recent position after buying contract for mobile

* fix: accu card curent stake name field

* fix: popover accumulator radio group text and alignment

* fix: open position accumulate column name

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* fix: last truncated counter in responsive (#54)

* Maryia/83807/stake validation (part 1) (#55)

* fix: set growth_rate based on accumulator_range_list (growth_rate_range) received in contracts_for

* fix: app crash caused by proposal error

* chore: removed unused classname

* fix: growth rate title alignment (#56)

* fix: growht rate title alignment

* refactor: category wrapper odd style

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* maryia/83807/fix: stake validation for ACCU broken because of barriers being set (#57)

* fix: stake validation for ACCU broken because of barriers being set

* fix: prevent app crash in profit table for unknown contracts

* fix: check if selected growth_rate is available on symbol change (#58)

* fix: able to buy multiply contract / growth rate fix BO change (#59)

* fix: able to buy multiply contract / growth rate fix BO change

* refactor: last contract check delete

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* revert: maryia/revert change of last_contract computed

* fix: accumulator is shown for real account (#60)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* feat: make cursor not allowd for overlay (#61)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* chore: built icons.js

* revert: maryia/ unnecessary bot file change

* refactor: contract categories in contract-type-widget.jsx

* refactor: according to pr review comments

* refactor: open positions + add keys to fix console warning

* fix: disable accu for real account, disable button having bought one contract (#62)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* refactor: purchase.jsx

* refactor: according to pr reviews

* refactor: able to buy contract per every available underlying (#63)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* Trigger Build

* yauheni/85032/ fix chart issue with dots and circles

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* fix: exit spot styles

* refactor: make barrier values string as on BE

* fix: unable accumulators for real

* maryia/refactor_accu_branch (#66)

* refactor: remove unused file

* refactor: refactor createTickMarkers

* refactor: introduce a local variable

* fix: 86705/ticks are not displayed correctly on chart in contract details

* maryia/86953/build: bump up deriv-charts version to 1.1.0 + improvement (#68)

* build: bump up deriv-charts version

* chore: show profit only when barriers are received

* test: updated mocked props

* build: maryia/removed extra package-lock.jsons

* evgeniy /87215/87226/ info description / glitch while switching account (#70)

* fix: description

* fix: disable trade params while switching account

---------

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* henry/87329/fix: FE not showing error message when accu trading is suspended (#72)

* fix: FE not showing error message when accu trading is suspended

* test: empty commit

---------

Co-authored-by: HENRY <henry@regentmarkets.com>

* refactor: glitching fix and deleted odd css (#73)

* refactor: glitching fix and deleted odd css

* fix: code refactor

---------

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* Maryia/86616/feat: calculating accu barriers based on ticks from ticks_history (#71)

* feat: calculating accu barriers based on ticks from ticks_history

* chore: rounded & refactored accu barriers

* refactor: added getAccumulatorBarriers for barrier calculation + fixed a test

* chore: improved barriers calculations

* refactor: getAccumulatorBarriers docs

* refactor: getAccumulatorBarriers

* fix: showing barriers only when having have barriers & always showing barrier lines in C.Details

* build: updated package-lock & icons + fixed conflicts + linting

* fix: max stake validation is missing (#81)

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* fix: maryia/87948/chart empty issue + profit text effects clean-up

* henry/87958/feat: Add Dropdown for rates in Accumulator (#86)

* feat: Add Dropdown for rates in Accumulator

* chore: code cleanup

* Update packages/reports/src/Containers/open-positions.jsx

Co-authored-by: Maryia <103177211+maryia-deriv@users.noreply.github.com>

---------

Co-authored-by: HENRY <henry@regentmarkets.com>
Co-authored-by: Maryia <103177211+maryia-deriv@users.noreply.github.com>

* Maryia/86616/make 2 last ticks bold + refactoring (#84)

* chore: make prelast & last tick bold

* chore: adjust styles for previous and last markers in c.details

* refactor: getSupportedContracts & getContractTypeDisplay in configs

* refactor: open-positions

* refactor: chart-markers slyles

* style: updated All rates casing

* build: update package-lock

* Henry/87958/feat add all rates dropdown accumulator (#89)

* feat: Add Dropdown for rates in Accumulator

* chore: code cleanup

* Update packages/reports/src/Containers/open-positions.jsx

Co-authored-by: Maryia <103177211+maryia-deriv@users.noreply.github.com>

* chore: remove console log

* fix: Change Open positions total for multiplier and accumulator to flex

---------

Co-authored-by: Maryia <103177211+maryia-deriv@users.noreply.github.com>

* refactor: open-positions

* fix: remove unused eslint disable

* revert: package-lock

* fix: sell button disappearing in mobile accumulators (#92)

* Henry/89489/fix sell button missing accumulator (#95)

* fix: sell button disappearing in mobile accumulators

* fix: fix cut off buy button issue

* fix: remove commented out code

* maryia/89432/fix: show barriers for current symbol correctly (#94)

* fix: show barriers for current symbol

* refactor: show barriers for current symbol only

* Maryia/test: added tests for getAccumulatorBarriers function (#99)

* test: added tests for getAccumulatorBarriers function

* test: added tests for getAccumulatorBarriers function

* test: renamed test cases for getAccumulatorBarriers function

* Maryia/89927_2/fix: ticks_history not forgotten because of chart mode & granularity change (#101)

* fix: logics for changing chart mode & granularity caused ticks_history streaming for previous symbol

* fix: update chart mode just once when switching contract type

* fix: maryia/fixed logics for chart mode switching

* refactor: maryia/address review comments

* Merge branch master of github.com:binary-com/deriv-app into maryia/67492/task_add_accumulators

* Update vanilla-options-card-body.jsx

* fix: vanillas + accumulators adjustments

* fix: maryia/restore overriden accu change

* fix: maryia/vanillas+accumulators adjustment

* fix: maryia/ improvements + refactoring to  address review comments

* fix: maryia/ update c.details chart when end_epoch is defined

* fix: reset accu barriers data on every contract type change

* fix: revert ui-store to master

* fix: chart mode change when switching to symbol without accu

* fix: purchase button styling for accumulators (#109)

Co-authored-by: Henry Hein <henryhein@Henry-Heins-MacBook-Pro-T90XTJ00Q4.local>

---------

Co-authored-by: Maryia <103177211+maryia-binary@users.noreply.github.com>
Co-authored-by: yauheni-kryzhyk-deriv <103182683+yauheni-kryzhyk-deriv@users.noreply.github.com>
Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>
Co-authored-by: yauheni-deriv <103182683+yauheni-deriv@users.noreply.github.com>
Co-authored-by: henry-deriv <118344354+henry-deriv@users.noreply.github.com>
Co-authored-by: HENRY <henry@regentmarkets.com>
Co-authored-by: Matin shafiei <matin@deriv.com>
Co-authored-by: Henry Hein <henryhein@Henry-Heins-MacBook-Pro-T90XTJ00Q4.local>
Co-authored-by: hirad-deriv <hirad@re-work.dev>
  • Loading branch information
10 people authored Mar 28, 2023
1 parent 36f9eee commit 447e91a
Show file tree
Hide file tree
Showing 148 changed files with 5,146 additions and 989 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
import React from 'react';
import { render, screen } from '@testing-library/react';
import TickCounterBar from '../tick-counter-bar';

describe('TickCounterBar', () => {
const mock_props = {
current_tick: 12345,
label: 'Ticks',
max_ticks_duration: 67890,
};
it('should render properly', () => {
render(<TickCounterBar {...mock_props} />);

const ticks_info_el = screen.getByText('12345/67890 Ticks');
expect(ticks_info_el).toHaveClass('dc-tick-counter-bar__text');
});
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,129 @@
import classNames from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import { isCryptocurrency, getLimitOrderAmount, isValidToSell } from '@deriv/shared';
import ContractCardItem from './contract-card-item.jsx';
import ToggleCardDialog from './toggle-card-dialog.jsx';
import Icon from '../../icon';
import MobileWrapper from '../../mobile-wrapper';
import Money from '../../money';
import { ResultStatusIcon } from '../result-overlay/result-overlay.jsx';

const AccumulatorCardBody = ({
addToast,
connectWithContractUpdate,
contract_info,
contract_update,
currency,
current_focus,
error_message_alignment,
getCardLabels,
getContractById,
indicative,
is_sold,
onMouseLeave,
removeToast,
setCurrentFocus,
status,
is_positions,
}) => {
const { buy_price, profit, limit_order, sell_price } = contract_info;
const { take_profit } = getLimitOrderAmount(contract_update || limit_order);
const is_valid_to_sell = isValidToSell(contract_info);
const { CURRENT_STAKE, STAKE, TAKE_PROFIT, TOTAL_PROFIT_LOSS } = getCardLabels();

return (
<React.Fragment>
<div className='dc-contract-card-items-wrapper'>
<ContractCardItem header={STAKE} className='dc-contract-card__stake'>
<Money amount={buy_price} currency={currency} />
</ContractCardItem>
<ContractCardItem header={CURRENT_STAKE} className='dc-contract-card__current-stake'>
<div
className={classNames({
'dc-contract-card--profit': +profit > 0,
'dc-contract-card--loss': +profit < 0,
})}
>
<Money amount={sell_price || indicative} currency={currency} />
</div>
<div
className={classNames('dc-contract-card__indicative--movement', {
'dc-contract-card__indicative--movement-complete': is_sold,
})}
>
{status === 'profit' && <Icon icon='IcProfit' />}
{status === 'loss' && <Icon icon='IcLoss' />}
</div>
</ContractCardItem>
<ContractCardItem
header={TOTAL_PROFIT_LOSS}
is_crypto={isCryptocurrency(currency)}
is_loss={+profit < 0}
is_won={+profit > 0}
>
<Money amount={profit} currency={currency} />
<div
className={classNames('dc-contract-card__indicative--movement', {
'dc-contract-card__indicative--movement-complete': is_sold,
})}
>
{status === 'profit' && <Icon icon='IcProfit' />}
{status === 'loss' && <Icon icon='IcLoss' />}
</div>
</ContractCardItem>
<ContractCardItem header={TAKE_PROFIT} className='dc-contract-card__take-profit'>
{take_profit ? <Money amount={take_profit} currency={currency} /> : <strong>-</strong>}
{is_valid_to_sell && (
<ToggleCardDialog
addToast={addToast}
connectWithContractUpdate={connectWithContractUpdate}
contract_id={contract_info.contract_id}
current_focus={current_focus}
error_message_alignment={error_message_alignment}
getCardLabels={getCardLabels}
getContractById={getContractById}
is_accumulator
onMouseLeave={onMouseLeave}
removeToast={removeToast}
setCurrentFocus={setCurrentFocus}
status={status}
/>
)}
</ContractCardItem>
</div>
{!!is_sold && (
<MobileWrapper>
<div
className={classNames('dc-contract-card__status', {
'dc-contract-card__status--accumulator-mobile-positions': is_positions,
})}
>
<ResultStatusIcon getCardLabels={getCardLabels} is_contract_won={+profit > 0} />
</div>
</MobileWrapper>
)}
</React.Fragment>
);
};

AccumulatorCardBody.propTypes = {
addToast: PropTypes.func,
connectWithContractUpdate: PropTypes.func,
contract_info: PropTypes.object,
contract_update: PropTypes.object,
currency: PropTypes.string,
current_focus: PropTypes.string,
error_message_alignment: PropTypes.string,
getCardLabels: PropTypes.func,
getContractById: PropTypes.func,
indicative: PropTypes.number,
is_positions: PropTypes.bool,
is_sold: PropTypes.bool,
onMouseLeave: PropTypes.func,
removeToast: PropTypes.func,
setCurrentFocus: PropTypes.func,
status: PropTypes.string,
};

export default React.memo(AccumulatorCardBody);
Loading

0 comments on commit 447e91a

Please sign in to comment.