From 4d075095ad1cfc3546c9d03442280dfaa2bef959 Mon Sep 17 00:00:00 2001 From: Akinwale Ariwodola Date: Wed, 28 Nov 2018 15:44:08 +0100 Subject: [PATCH] implement send tip functionality (#366) --- app/src/component/walletSend/index.js | 10 ++-- app/src/page/file/index.js | 4 ++ app/src/page/file/view.js | 80 +++++++++++++++++++++------ app/src/styles/filePage.js | 54 +++++++++++++++++- 4 files changed, 124 insertions(+), 24 deletions(-) diff --git a/app/src/component/walletSend/index.js b/app/src/component/walletSend/index.js index e57233ea..080f0a66 100644 --- a/app/src/component/walletSend/index.js +++ b/app/src/component/walletSend/index.js @@ -8,15 +8,15 @@ import { } from 'lbry-redux'; import WalletSend from './view'; -const perform = dispatch => ({ - sendToAddress: (address, amount) => dispatch(doSendDraftTransaction(address, amount)), - notify: (data) => dispatch(doToast(data)) -}); - const select = state => ({ balance: selectBalance(state), draftTransaction: selectDraftTransaction(state), transactionError: selectDraftTransactionError(state), }); +const perform = dispatch => ({ + sendToAddress: (address, amount) => dispatch(doSendDraftTransaction(address, amount)), + notify: (data) => dispatch(doToast(data)) +}); + export default connect(select, perform)(WalletSend); diff --git a/app/src/page/file/index.js b/app/src/page/file/index.js index 36256b1b..888a2695 100644 --- a/app/src/page/file/index.js +++ b/app/src/page/file/index.js @@ -3,6 +3,7 @@ import { doFetchFileInfo, doFetchCostInfoForUri, doResolveUri, + doSendTip, doToast, makeSelectIsUriResolving, makeSelectCostInfoForUri, @@ -10,6 +11,7 @@ import { makeSelectClaimForUri, makeSelectContentTypeForUri, makeSelectMetadataForUri, + selectBalance, selectBlackListedOutpoints, } from 'lbry-redux'; import { selectRewardContentClaimIds } from 'lbryinc'; @@ -19,6 +21,7 @@ import FilePage from './view'; const select = (state, props) => { const selectProps = { uri: props.navigation.state.params.uri }; return { + balance: selectBalance(state), blackListedOutpoints: selectBlackListedOutpoints(state), claim: makeSelectClaimForUri(selectProps.uri)(state), isResolvingUri: makeSelectIsUriResolving(selectProps.uri)(state), @@ -40,6 +43,7 @@ const perform = dispatch => ({ fetchCostInfo: uri => dispatch(doFetchCostInfoForUri(uri)), notify: data => dispatch(doToast(data)), resolveUri: uri => dispatch(doResolveUri(uri)), + sendTip: (amount, claimId, uri, successCallback, errorCallback) => dispatch(doSendTip(amount, claimId, uri, successCallback, errorCallback)), stopDownload: (uri, fileInfo) => dispatch(doStopDownloadingFile(uri, fileInfo)), }); diff --git a/app/src/page/file/view.js b/app/src/page/file/view.js index b6f2d928..66dd066c 100644 --- a/app/src/page/file/view.js +++ b/app/src/page/file/view.js @@ -37,6 +37,8 @@ class FilePage extends React.PureComponent { title: '' }; + tipAmountInput = null; + playerBackground = null; startTime = null; @@ -55,8 +57,10 @@ class FilePage extends React.PureComponent { pageSuspended: false, showImageViewer: false, showWebView: false, + showTipView: false, playerBgHeight: 0, playerHeight: 0, + tipAmount: null, uri: null, stopDownloadConfirmed: false }; @@ -310,6 +314,21 @@ class FilePage extends React.PureComponent { this.setState({ fileViewLogged: true }); } + handleSendTip = () => { + const { claim, balance, navigation, notify, sendTip } = this.props; + const { uri } = navigation.state.params; + const { tipAmount } = this.state; + + if (tipAmount > balance) { + notify({ + message: 'Insufficient credits', + }); + return; + } + + sendTip(tipAmount, claim.claim_id, uri, () => { this.setState({ tipAmount: 0, showTipView: false }) }); + } + render() { const { claim, @@ -378,12 +397,12 @@ class FilePage extends React.PureComponent { const mediaType = Lbry.getMediaType(contentType); const isPlayable = mediaType === 'video' || mediaType === 'audio'; const { height, channel_name: channelName, value } = claim; - const showActions = !this.state.fullscreenMode && - !this.state.showImageViewer && - !this.state.showWebView && - (completed || (fileInfo && !fileInfo.stopped && fileInfo.written_bytes < fileInfo.total_bytes)); + const showActions = !this.state.fullscreenMode && !this.state.showImageViewer && !this.state.showWebView; + const showFileActions = (completed || (fileInfo && !fileInfo.stopped && fileInfo.written_bytes < fileInfo.total_bytes)); const channelClaimId = value && value.publisherSignature && value.publisherSignature.certificateId; + const canSendTip = this.state.tipAmount > 0; + const playerStyle = [filePageStyle.player, this.state.isLandscape ? filePageStyle.containedPlayerLandscape : @@ -473,21 +492,29 @@ class FilePage extends React.PureComponent { onPlaybackStarted={this.onPlaybackStarted} />} - {fileInfo && showActions && + {showActions && - {completed &&