diff options
author | PaddyMc <paddymchale@hotmail.com> | 2018-11-14 01:19:12 +0800 |
---|---|---|
committer | Whymarrh Whitby <whymarrh.whitby@gmail.com> | 2018-11-14 01:19:12 +0800 |
commit | 7ce2cf4572f80b71d5ab4d4c479a49bcca9ccdf1 (patch) | |
tree | 388ef4fdb4d07864a6e6a37faa2b90532191112a /ui/app/components/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js | |
parent | d943345151b7caf723533721a37ceea2e5286b9c (diff) | |
download | tangerine-wallet-browser-7ce2cf4572f80b71d5ab4d4c479a49bcca9ccdf1.tar.gz tangerine-wallet-browser-7ce2cf4572f80b71d5ab4d4c479a49bcca9ccdf1.tar.zst tangerine-wallet-browser-7ce2cf4572f80b71d5ab4d4c479a49bcca9ccdf1.zip |
Fixes #3425: Better support for batch transactions (#5437)
Diffstat (limited to 'ui/app/components/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js')
-rwxr-xr-x | ui/app/components/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js | 69 |
1 files changed, 69 insertions, 0 deletions
diff --git a/ui/app/components/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js b/ui/app/components/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js new file mode 100755 index 000000000..8327f997b --- /dev/null +++ b/ui/app/components/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js @@ -0,0 +1,69 @@ +import React from 'react' +import PropTypes from 'prop-types' + +const ConfirmPageContainerNavigation = props => { + const { onNextTx, totalTx, positionOfCurrentTx, nextTxId, prevTxId, showNavigation, firstTx, lastTx, ofText, requestsWaitingText } = props + + return ( + <div className="confirm-page-container-navigation" + style={{ + display: showNavigation ? 'flex' : 'none', + }} + > + <div className="confirm-page-container-navigation__container" + style={{ + visibility: prevTxId ? 'initial' : 'hidden', + }}> + <div + className="confirm-page-container-navigation__arrow" + onClick={() => onNextTx(firstTx)}> + <img src="/images/double-arrow.svg" /> + </div> + <div + className="confirm-page-container-navigation__arrow" + onClick={() => onNextTx(prevTxId)}> + <img src="/images/single-arrow.svg" /> + </div> + </div> + <div className="confirm-page-container-navigation__textcontainer"> + <div className="confirm-page-container-navigation__navtext"> + {positionOfCurrentTx} {ofText} {totalTx} + </div> + <div className="confirm-page-container-navigation__longtext"> + {requestsWaitingText} + </div> + </div> + <div + className="confirm-page-container-navigation__container" + style={{ + visibility: nextTxId ? 'initial' : 'hidden', + }}> + <div + className="confirm-page-container-navigation__arrow" + onClick={() => onNextTx(nextTxId)}> + <img className="confirm-page-container-navigation__imageflip" src="/images/single-arrow.svg" /> + </div> + <div + className="confirm-page-container-navigation__arrow" + onClick={() => onNextTx(lastTx)}> + <img className="confirm-page-container-navigation__imageflip" src="/images/double-arrow.svg" /> + </div> + </div> + </div> + ) +} + +ConfirmPageContainerNavigation.propTypes = { + totalTx: PropTypes.number, + positionOfCurrentTx: PropTypes.number, + onNextTx: PropTypes.func, + nextTxId: PropTypes.string, + prevTxId: PropTypes.string, + showNavigation: PropTypes.bool, + firstTx: PropTypes.string, + lastTx: PropTypes.string, + ofText: PropTypes.string, + requestsWaitingText: PropTypes.string, +} + +export default ConfirmPageContainerNavigation |