From ae81843c051c668147ea35b881bc4284829c3446 Mon Sep 17 00:00:00 2001 From: hackrush Date: Sat, 16 Sep 2017 16:32:54 +0530 Subject: [PATCH] Additional tipping fixes/changes - [x] Display empty message on empty filtered Tx list - [ ] Tipping form has to stay open until success is detected(or closed by user) - [ ] Storing the older transaction list, and refreshing the new one in the background. Tip Box shown until valid Txn or manually cancelled Cleanup of show tip box logic --- ui/js/actions/claims.js | 13 ++++++-- ui/js/component/fileActions/index.js | 2 ++ ui/js/component/fileActions/view.jsx | 6 +--- ui/js/component/tipLink/index.js | 3 +- ui/js/component/tipLink/view.jsx | 5 ++-- .../internal/TransactionListBody.jsx | 21 ++++++++++--- ui/js/constants/action_types.js | 2 ++ ui/js/page/file/index.js | 2 ++ ui/js/page/file/view.jsx | 28 ++--------------- ui/js/reducers/claims.js | 30 +++++++++++++++++-- ui/js/selectors/claims.js | 5 ++++ 11 files changed, 75 insertions(+), 42 deletions(-) diff --git a/ui/js/actions/claims.js b/ui/js/actions/claims.js index 71f94852c..e8e45f341 100644 --- a/ui/js/actions/claims.js +++ b/ui/js/actions/claims.js @@ -4,6 +4,14 @@ import { doOpenModal, doShowSnackBar } from "actions/app"; import * as types from "constants/action_types"; import * as modals from "constants/modal_types"; +export function doShowTipBox() { + return { type: types.SHOW_TIP_BOX }; +} + +export function doHideTipBox() { + return { type: types.HIDE_TIP_BOX }; +} + export function doSendSupport(amount, claim_id) { return function(dispatch, getState) { const state = getState(); @@ -22,6 +30,7 @@ export function doSendSupport(amount, claim_id) { dispatch({ type: types.SUPPORT_TRANSACTION_COMPLETED, }); + dispatch(doHideTipBox); dispatch( doShowSnackBar({ message: __(`You sent ${amount} LBC as support, Mahalo!`), @@ -32,7 +41,7 @@ export function doSendSupport(amount, claim_id) { } else { dispatch({ type: types.SUPPORT_TRANSACTION_FAILED, - data: { error: results }, + data: { error: results.code }, }); dispatch(doOpenModal(modals.TRANSACTION_FAILED)); } @@ -41,7 +50,7 @@ export function doSendSupport(amount, claim_id) { const errorCallback = error => { dispatch({ type: types.SUPPORT_TRANSACTION_FAILED, - data: { error: error.message }, + data: { error: error.code }, }); dispatch(doOpenModal(modals.TRANSACTION_FAILED)); }; diff --git a/ui/js/component/fileActions/index.js b/ui/js/component/fileActions/index.js index b94e2bbcb..851b28507 100644 --- a/ui/js/component/fileActions/index.js +++ b/ui/js/component/fileActions/index.js @@ -9,6 +9,7 @@ import { doOpenFileInShell, doOpenFileInFolder } from "actions/file_info"; import { makeSelectClaimIsMine } from "selectors/claims"; import { doPurchaseUri, doLoadVideo, doStartDownload } from "actions/content"; import { doNavigate } from "actions/navigation"; +import { doShowTipBox } from "actions/claims"; import FileActions from "./view"; const select = (state, props) => ({ @@ -25,6 +26,7 @@ const perform = dispatch => ({ startDownload: uri => dispatch(doPurchaseUri(uri)), restartDownload: (uri, outpoint) => dispatch(doStartDownload(uri, outpoint)), editClaim: claimId => dispatch(doNavigate("/publish", { id: claimId })), + showTipBox: () => dispatch(doShowTipBox()), }); export default connect(select, perform)(FileActions); diff --git a/ui/js/component/fileActions/view.jsx b/ui/js/component/fileActions/view.jsx index 361338b89..bffcfa664 100644 --- a/ui/js/component/fileActions/view.jsx +++ b/ui/js/component/fileActions/view.jsx @@ -4,10 +4,6 @@ import FileDownloadLink from "component/fileDownloadLink"; import * as modals from "constants/modal_types"; class FileActions extends React.PureComponent { - handleSupportButtonClicked() { - this.props.onTipShow(); - } - render() { const { fileInfo, @@ -37,7 +33,7 @@ class FileActions extends React.PureComponent { button="text" icon="icon-gift" label={__("Support")} - onClick={this.handleSupportButtonClicked.bind(this)} + onClick={this.props.showTipBox} /> ({}); const perform = dispatch => ({ sendSupport: (amount, claim_id) => dispatch(doSendSupport(amount, claim_id)), + hideTipBox: () => dispatch(doHideTipBox()), }); export default connect(select, perform)(TipLink); diff --git a/ui/js/component/tipLink/view.jsx b/ui/js/component/tipLink/view.jsx index 831806d48..00c2639f3 100644 --- a/ui/js/component/tipLink/view.jsx +++ b/ui/js/component/tipLink/view.jsx @@ -7,7 +7,7 @@ class TipLink extends React.PureComponent { super(props); this.state = { - tipAmount: 1.0, + tipAmount: 0.0, }; } @@ -15,11 +15,10 @@ class TipLink extends React.PureComponent { let claim_id = this.props.claim_id; let amount = this.state.tipAmount; this.props.sendSupport(amount, claim_id); - this.props.onTipHide(); } handleSupportCancelButtonClicked() { - this.props.onTipHide(); + this.props.hideTipBox(); } handleSupportPriceChange(event) { diff --git a/ui/js/component/transactionList/internal/TransactionListBody.jsx b/ui/js/component/transactionList/internal/TransactionListBody.jsx index 12beb2e8d..6ad795f05 100644 --- a/ui/js/component/transactionList/internal/TransactionListBody.jsx +++ b/ui/js/component/transactionList/internal/TransactionListBody.jsx @@ -125,13 +125,26 @@ class TransactionTableBody extends React.PureComponent { render() { const { transactions, filter } = this.props; + let transactionList = transactions + .filter(this.filterList, this) + .filter(this.removeFeeTx, this) + .map(this.renderBody, this); + + if (transactionList.length == 0) { + return ( + + + + {__("There are no transactions of this type.")} + + + + ); + } return ( - {transactions - .filter(this.filterList, this) - .filter(this.removeFeeTx, this) - .map(this.renderBody, this)} + {transactionList} ); } diff --git a/ui/js/constants/action_types.js b/ui/js/constants/action_types.js index 5281e6b97..57466b17f 100644 --- a/ui/js/constants/action_types.js +++ b/ui/js/constants/action_types.js @@ -136,6 +136,8 @@ export const FETCH_REWARD_CONTENT_COMPLETED = "FETCH_REWARD_CONTENT_COMPLETED"; export const SUPPORT_TRANSACTION_STARTED = "SUPPORT_TRANSACTION_STARTED"; export const SUPPORT_TRANSACTION_COMPLETED = "SUPPORT_TRANSACTION_COMPLETED"; export const SUPPORT_TRANSACTION_FAILED = "SUPPORT_TRANSACTION_FAILED"; +export const HIDE_TIP_BOX = "HIDE_TIP_BOX"; +export const SHOW_TIP_BOX = "SHOW_TIP_BOX"; //Language export const DOWNLOAD_LANGUAGE_SUCCEEDED = "DOWNLOAD_LANGUAGE_SUCCEEDED"; diff --git a/ui/js/page/file/index.js b/ui/js/page/file/index.js index d0d1fb476..0154d00a0 100644 --- a/ui/js/page/file/index.js +++ b/ui/js/page/file/index.js @@ -9,6 +9,7 @@ import { makeSelectClaimForUri, makeSelectContentTypeForUri, makeSelectMetadataForUri, + selectShowTipBox, } from "selectors/claims"; import { makeSelectCostInfoForUri } from "selectors/cost_info"; import { selectShowNsfw } from "selectors/settings"; @@ -20,6 +21,7 @@ const select = (state, props) => ({ costInfo: makeSelectCostInfoForUri(props.uri)(state), metadata: makeSelectMetadataForUri(props.uri)(state), obscureNsfw: !selectShowNsfw(state), + showTipBox: selectShowTipBox(state), fileInfo: makeSelectFileInfoForUri(props.uri)(state), rewardedContentClaimIds: selectRewardContentClaimIds(state, props), }); diff --git a/ui/js/page/file/view.jsx b/ui/js/page/file/view.jsx index 3e1a2e2f9..f27d0ab01 100644 --- a/ui/js/page/file/view.jsx +++ b/ui/js/page/file/view.jsx @@ -71,18 +71,6 @@ class FilePage extends React.PureComponent { } } - handleTipShow() { - this.setState({ - showTipBox: true, - }); - } - - handleTipHide() { - this.setState({ - showTipBox: false, - }); - } - render() { const { claim, @@ -91,10 +79,9 @@ class FilePage extends React.PureComponent { contentType, uri, rewardedContentClaimIds, + showTipBox, } = this.props; - const { showTipBox } = this.state; - if (!claim || !metadata) { return ( {__("Empty claim or metadata info.")} @@ -156,10 +143,7 @@ class FilePage extends React.PureComponent { : uriIndicator} - + {!showTipBox &&
@@ -179,13 +163,7 @@ class FilePage extends React.PureComponent { />
: ""} - {showTipBox - ? - : ""} + {showTipBox ? : ""} {!showTipBox &&
({ + tipBoxShown: false, +}); + +const defaultState = { + supportTransaction: buildSupportTransaction(), +}; reducers[types.RESOLVE_URI_COMPLETED] = function(state, action) { const { uri, certificate, claim } = action.data; @@ -189,6 +196,22 @@ reducers[types.CREATE_CHANNEL_COMPLETED] = function(state, action) { }); }; +reducers[types.HIDE_TIP_BOX] = function(state, action) { + return Object.assign({}, state, { + supportTransaction: buildSupportTransaction(), + }); +}; + +reducers[types.SHOW_TIP_BOX] = function(state, action) { + const newSupportTransaction = Object.assign({}, state.supportTransaction, { + tipBoxShown: true, + }); + + return Object.assign({}, state, { + supportTransaction: newSupportTransaction, + }); +}; + reducers[types.SUPPORT_TRANSACTION_STARTED] = function(state, action) { const newSupportTransaction = Object.assign({}, state.supportTransaction, { sendingSupport: true, @@ -200,13 +223,16 @@ reducers[types.SUPPORT_TRANSACTION_STARTED] = function(state, action) { }; reducers[types.SUPPORT_TRANSACTION_COMPLETED] = function(state, action) { - return Object.assign({}, state); + return Object.assign({}, state, { + supportTransaction: buildSupportTransaction(), + }); }; reducers[types.SUPPORT_TRANSACTION_FAILED] = function(state, action) { const newSupportTransaction = Object.assign({}, state.supportTransaction, { sendingSupport: false, error: action.data.error, + tipBoxShown: true, }); return Object.assign({}, state, { diff --git a/ui/js/selectors/claims.js b/ui/js/selectors/claims.js index ce8ebc8cd..45643722a 100644 --- a/ui/js/selectors/claims.js +++ b/ui/js/selectors/claims.js @@ -174,3 +174,8 @@ export const selectMyChannelClaims = createSelector( return claims; } ); + +export const selectShowTipBox = createSelector( + _selectState, + state => state.supportTransaction.tipBoxShown +);