From b2593413ab417d0b718cb5a7ec6f8a095216f816 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 22 Jul 2021 22:37:49 +0200 Subject: [PATCH 01/54] fix frontend bug --- ui/component/walletSendTip/view.jsx | 510 +++++++++++++--------------- 1 file changed, 228 insertions(+), 282 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 7af9b6046..4f99fbbb4 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -122,7 +122,7 @@ function WalletSendTip(props: Props) { // check if creator has an account saved React.useEffect(() => { - const tipInputElement = document.getElementById('tip-input'); + var tipInputElement = document.getElementById('tip-input'); if (tipInputElement) { tipInputElement.focus() } }, []); @@ -141,8 +141,6 @@ function WalletSendTip(props: Props) { .then((accountCheckResponse) => { if (accountCheckResponse === true && canReceiveFiatTip !== true) { setCanReceiveFiatTip(true); - } else { - setCanReceiveFiatTip(false); } }) .catch(function (error) { @@ -171,8 +169,7 @@ function WalletSendTip(props: Props) { } const claimTypeText = setClaimTypeText(); - let iconToUse; - let explainerText = ''; + let iconToUse, explainerText; if (activeTab === TAB_BOOST) { iconToUse = ICONS.LBC; explainerText = __('This refundable boost will improve the discoverability of this %claimTypeText% while active.', {claimTypeText}); @@ -276,8 +273,8 @@ function WalletSendTip(props: Props) { Lbryio.call( 'customer', 'tip', - { // round to fix issues with floating point numbers - amount: Math.round(100 * tipAmount), // convert from dollars to cents + { + amount: 100 * tipAmount, // convert from dollars to cents creator_channel_name: tipChannelName, // creator_channel_name creator_channel_claim_id: channelClaimId, tipper_channel_name: sendAnonymously ? '' : activeChannelName, @@ -298,7 +295,7 @@ function WalletSendTip(props: Props) { }); }) .catch(function(error) { - let displayError = 'Sorry, there was an error in processing your payment!'; + var displayError = 'Sorry, there was an error in processing your payment!'; if (error.message !== 'payment intent failed to confirm') { displayError = error.message; @@ -316,53 +313,10 @@ function WalletSendTip(props: Props) { } } - const countDecimals = function(value) { - const text = value.toString(); - const index = text.indexOf('.'); - return (text.length - index - 1); - }; - function handleCustomPriceChange(event: SyntheticInputEvent<*>) { - let tipAmountAsString = event.target.value; + const tipAmount = parseFloat(event.target.value); - let tipAmount = parseFloat(tipAmountAsString); - - const howManyDecimals = countDecimals(tipAmountAsString); - - // fiat tip input - if (activeTab === TAB_FIAT) { - if (Number.isNaN(tipAmount)) { - setCustomTipAmount(''); - } - - // allow maximum of two decimal places - if (howManyDecimals > 2) { - tipAmount = Math.floor(tipAmount * 100) / 100; - } - - // remove decimals, and then get number of digits - const howManyDigits = Math.trunc(tipAmount).toString().length; - - if (howManyDigits > 4 && tipAmount !== 1000) { - setTipError('Amount cannot be over 1000 dollars'); - setCustomTipAmount(tipAmount); - } else if (tipAmount > 1000) { - setTipError('Amount cannot be over 1000 dollars'); - setCustomTipAmount(tipAmount); - } else { - setCustomTipAmount(tipAmount); - } - // LBC tip input - } else { - // TODO: this is a bit buggy, needs a touchup - // if (howManyDecimals > 9) { - // // only allows up to 8 decimal places - // tipAmount = Number(tipAmount.toString().match(/^-?\d+(?:\.\d{0,8})?/)[0]); - // - // setTipError('Please only use up to 8 decimals'); - // } - setCustomTipAmount(tipAmount); - } + setCustomTipAmount(tipAmount); } function buildButtonText() { @@ -377,14 +331,8 @@ function WalletSendTip(props: Props) { return false; } - function convertToTwoDecimals(number) { - return (Math.round(number * 100) / 100).toFixed(2); - } - - const amountToShow = activeTab === TAB_FIAT ? convertToTwoDecimals(tipAmount) : tipAmount; - // if it's a valid number display it, otherwise do an empty string - const displayAmount = !isNan(tipAmount) ? amountToShow : ''; + const displayAmount = !isNan(tipAmount) ? tipAmount : ''; if (activeTab === TAB_BOOST) { return (claimIsMine ? __('Boost Your %claimTypeText%', {claimTypeText}) : __('Boost This %claimTypeText%', {claimTypeText})); @@ -414,242 +362,240 @@ function WalletSendTip(props: Props) { return (
{/* if there is no LBC balance, show user frontend to get credits */} - {/* if there is lbc, the main tip/boost gui with the 3 tabs at the top */} - } - subtitle={ - - {!claimIsMine && ( -
- {/* tip LBC tab button */} -
- )} - - {/* short explainer under the button */} -
- {explainerText + ' '} - {/* {activeTab === TAB_FIAT && !hasCardSaved &&
- - } - actions={ - // confirmation modal, allow user to confirm or cancel transaction - isConfirming ? ( - <> -
+ } + /> + ) : ( + // if there is lbc, the main tip/boost gui with the 3 tabs at the top + } + subtitle={ + + {!claimIsMine && (
-
{__('To --[the tip recipient]--')}
-
{channelName || title}
-
{__('From --[the tip sender]--')}
-
- {activeChannelClaim && !incognito ? activeChannelClaim.name : __('Anonymous')} -
-
{setConfirmLabel()}
-
- {activeTab === TAB_FIAT ?

$ {(Math.round(tipAmount * 100) / 100).toFixed(2)}

: } -
+ {/* tip LBC tab button */} +
-
-
-
- - // only show the prompt to earn more if its lbc or boost tab and no balance - // otherwise you can show the full prompt - ) : (!((activeTab === TAB_LBC || activeTab === TAB_BOOST) && noBalance) - ? <> -
- -
- - {activeTab === TAB_FIAT && !hasCardSaved && ( -

-

)} - {/* section to pick tip/boost amount */} -
- {DEFAULT_TIP_AMOUNTS.map((amount) => ( + {/* short explainer under the button */} +
+ {explainerText + ' '} + {/* {activeTab === TAB_FIAT && !hasCardSaved &&
+ + } + actions={ + // confirmation modal, allow user to confirm or cancel transaction + isConfirming ? ( + <> +
+
+
{__('To --[the tip recipient]--')}
+
{channelName || title}
+
{__('From --[the tip sender]--')}
+
+ {activeChannelClaim && !incognito ? activeChannelClaim.name : __('Anonymous')} +
+
{setConfirmLabel()}
+
+ {activeTab === TAB_FIAT ?

$ {tipAmount}

: } +
+
+
+
+
+ + ) : ( + <> +
+ +
+ + {activeTab === TAB_FIAT && !hasCardSaved && ( +

+

+ )} + + {/* section to pick tip/boost amount */} +
+ {DEFAULT_TIP_AMOUNTS.map((amount) => ( +
- - {useCustomTip && ( -
- - {__('Custom support amount')}{' '} - {activeTab !== TAB_FIAT ? ( - }} - > - (%lbc_balance% Credits available) - - ) : ( - 'in USD' - )} - - } - error={tipError} - min="0" - step="any" - type="number" - style={{ - width: activeTab === TAB_FIAT ? '99px' : '160px', - }} - placeholder="1.23" - value={customTipAmount} - onChange={(event) => handleCustomPriceChange(event)} - /> + {DEFAULT_TIP_AMOUNTS.some((val) => val > balance) && activeTab !== TAB_FIAT && ( +
- )} - {/* send tip/boost button */} -
-
- {activeTab !== TAB_FIAT ? ( - - ) : !canReceiveFiatTip ? ( -
{__('Only select creators can receive tips at this time')}
- ) : ( -
{__('The payment will be made from your saved card')}
- )} - - // if it's LBC and there is no balance, you can prompt to purchase LBC - : }}>Supporting content requires %lbc%} - subtitle={ - }}> - With %lbc%, you can send tips to your favorite creators, or help boost their content for more people to - see. - - } - actions={ -
-
- } - /> - ) - } - /> + {useCustomTip && ( +
+ + {__('Custom support amount')}{' '} + {activeTab !== TAB_FIAT ? ( + }} + > + (%lbc_balance% Credits available) + + ) : ( + 'in USD' + )} + + } + className="form-field--price-amount" + error={tipError} + min="0" + step="any" + type="number" + placeholder="1.23" + value={customTipAmount} + onChange={(event) => handleCustomPriceChange(event)} + /> +
+ )} + + {/* send tip/boost button */} +
+
+ {activeTab !== TAB_FIAT ? ( + + ) : !canReceiveFiatTip ? ( +
{__('Only select creators can receive tips at this time')}
+ ) : ( +
{__('The payment will be made from your saved card')}
+ )} + + ) + } + /> + )} ); } -- 2.45.2 From fac1dae926e9921feab5ebd9179d26963ec4d83f Mon Sep 17 00:00:00 2001 From: Anthony Date: Sat, 24 Jul 2021 20:55:09 +0200 Subject: [PATCH 02/54] show superchats in order properly --- ui/component/livestreamComments/view.jsx | 135 ++++++++--------------- 1 file changed, 43 insertions(+), 92 deletions(-) diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 4341acc87..43cd71bfc 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -22,8 +22,9 @@ type Props = { fetchingComments: boolean, doSuperChatList: (string) => void, superChats: Array, + superChatsReversed: Array, + superChatsTotalAmount: number, myChannels: ?Array, - pinnedCommentsById: { [claimId: string]: Array }, }; const VIEW_MODE_CHAT = 'view_chat'; @@ -38,35 +39,55 @@ export default function LivestreamComments(props: Props) { embed, doCommentSocketConnect, doCommentSocketDisconnect, - comments: commentsByChronologicalOrder, + comments, // superchats in chronological format doCommentList, fetchingComments, doSuperChatList, + superChatsTotalAmount, myChannels, - superChats: superChatsByTipAmount, - pinnedCommentsById, + superChats, // superchats organized by tip amount } = props; - let superChatsFiatAmount, superChatsTotalAmount; + let { superChatsReversed } = props; + + if (superChats) { + const clonedSuperchats = JSON.parse(JSON.stringify(superChats)); + + // sort by fiat first then by support amount + superChatsReversed = clonedSuperchats.sort(function(a,b) { + if (a.is_fiat === b.is_fiat) { + return b.support_amount - a.support_amount; + } else { + return (a.is_fiat === b.is_fiat) ? 0 : a.is_fiat ? -1 : 1; + } + }).reverse(); + } const commentsRef = React.createRef(); const [scrollBottom, setScrollBottom] = React.useState(true); const [viewMode, setViewMode] = React.useState(VIEW_MODE_CHAT); const [performedInitialScroll, setPerformedInitialScroll] = React.useState(false); const claimId = claim && claim.claim_id; - const commentsLength = commentsByChronologicalOrder && commentsByChronologicalOrder.length; - const commentsToDisplay = viewMode === VIEW_MODE_CHAT ? commentsByChronologicalOrder : superChatsByTipAmount; + const commentsLength = comments && comments.length; + const commentsToDisplay = viewMode === VIEW_MODE_CHAT ? comments : superChats; const discussionElement = document.querySelector('.livestream__comments'); const commentElement = document.querySelector('.livestream-comment'); - let pinnedComment; - const pinnedCommentIds = (claimId && pinnedCommentsById[claimId]) || []; - if (pinnedCommentIds.length > 0) { - pinnedComment = commentsByChronologicalOrder.find((c) => c.comment_id === pinnedCommentIds[0]); + // todo: implement comment_list --mine in SDK so redux can grab with selectCommentIsMine + function isMyComment(channelId: string) { + if (myChannels != null && channelId != null) { + for (let i = 0; i < myChannels.length; i++) { + if (myChannels[i].claim_id === channelId) { + return true; + } + } + } + return false; } React.useEffect(() => { + if (claimId) { doCommentList(uri, '', 1, 75); doSuperChatList(uri); @@ -111,51 +132,6 @@ export default function LivestreamComments(props: Props) { } }, [commentsLength, discussionElement, handleScroll, performedInitialScroll, setPerformedInitialScroll]); - // sum total amounts for fiat tips and lbc tips - if (superChatsByTipAmount) { - let fiatAmount = 0; - let LBCAmount = 0; - for (const superChat of superChatsByTipAmount) { - if (superChat.is_fiat) { - fiatAmount = fiatAmount + superChat.support_amount; - } else { - LBCAmount = LBCAmount + superChat.support_amount; - } - } - - superChatsFiatAmount = fiatAmount; - superChatsTotalAmount = LBCAmount; - } - - let superChatsReversed; - // array of superchats organized by fiat or not first, then support amount - if (superChatsByTipAmount) { - const clonedSuperchats = JSON.parse(JSON.stringify(superChatsByTipAmount)); - - // sort by fiat first then by support amount - superChatsReversed = clonedSuperchats.sort(function(a, b) { - // if both are fiat, organize by support - if (a.is_fiat === b.is_fiat) { - return b.support_amount - a.support_amount; - // otherwise, if they are not both fiat, put the fiat transaction first - } else { - return (a.is_fiat === b.is_fiat) ? 0 : a.is_fiat ? -1 : 1; - } - }).reverse(); - } - - // todo: implement comment_list --mine in SDK so redux can grab with selectCommentIsMine - function isMyComment(channelId: string) { - if (myChannels != null && channelId != null) { - for (let i = 0; i < myChannels.length; i++) { - if (myChannels[i].claim_id === channelId) { - return true; - } - } - } - return false; - } - if (!claim) { return null; } @@ -171,7 +147,7 @@ export default function LivestreamComments(props: Props) {
{__('Live discussion')}
- {(superChatsTotalAmount || 0) > 0 && ( + {superChatsTotalAmount > 0 && (
{/* the superchats in chronological order button */} @@ -180,46 +156,36 @@ export default function LivestreamComments(props: Props) { 'button-toggle--active': viewMode === VIEW_MODE_CHAT, })} label={__('Chat')} - onClick={function() { - setViewMode(VIEW_MODE_CHAT); - const livestreamCommentsDiv = document.getElementsByClassName('livestream__comments')[0]; - const divHeight = livestreamCommentsDiv.scrollHeight; - livestreamCommentsDiv.scrollTop = divHeight; - }} + onClick={() => setViewMode(VIEW_MODE_CHAT)} /> - {/* the button to show superchats listed by most to least support amount */} + {/* the list by tip amount value button */}
)}
<> - {fetchingComments && !commentsByChronologicalOrder && ( + {fetchingComments && !comments && (
)}
- {viewMode === VIEW_MODE_CHAT && superChatsByTipAmount && (superChatsTotalAmount || 0) > 0 && ( + {viewMode === VIEW_MODE_CHAT && superChatsTotalAmount > 0 && superChats && (
- {superChatsByTipAmount.map((superChat: Comment) => ( + {superChats.map((superChat: Comment) => (
@@ -242,24 +208,8 @@ export default function LivestreamComments(props: Props) {
)} - {pinnedComment && ( -
- -
- )} - {/* top to bottom comment display */} - {!fetchingComments && commentsByChronologicalOrder.length > 0 ? ( + {!fetchingComments && comments.length > 0 ? (
{viewMode === VIEW_MODE_CHAT && commentsToDisplay.map((comment) => ( ))} +
) : (
-- 2.45.2 From 77104003f0d1e0da8f8f080079cac5158c339a97 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sat, 24 Jul 2021 22:32:51 +0200 Subject: [PATCH 03/54] scroll properly when switching tabs --- ui/component/livestreamComments/view.jsx | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 43cd71bfc..2eb1cbcd5 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -156,10 +156,15 @@ export default function LivestreamComments(props: Props) { 'button-toggle--active': viewMode === VIEW_MODE_CHAT, })} label={__('Chat')} - onClick={() => setViewMode(VIEW_MODE_CHAT)} + onClick={function() { + setViewMode(VIEW_MODE_CHAT); + const livestreamCommentsDiv = document.getElementsByClassName('livestream__comments')[0] + const divHeight = livestreamCommentsDiv.scrollHeight; + livestreamCommentsDiv.scrollTop = divHeight; + }} /> - {/* the list by tip amount value button */} + {/* the button to show superchats listed by most to least support amount */}
)} @@ -236,7 +246,6 @@ export default function LivestreamComments(props: Props) { commentIsMine={comment.channel_id && isMyComment(comment.channel_id)} /> ))} -
) : (
-- 2.45.2 From 74d4779c1233ee783e9b18804817c48668354f47 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sat, 24 Jul 2021 23:03:09 +0200 Subject: [PATCH 04/54] calculate fiat tips properly --- ui/component/livestreamComments/view.jsx | 40 ++++++++++++++++++++++-- 1 file changed, 38 insertions(+), 2 deletions(-) diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 2eb1cbcd5..6944cdfee 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -24,6 +24,7 @@ type Props = { superChats: Array, superChatsReversed: Array, superChatsTotalAmount: number, + superChatsFiatAmount: number, myChannels: ?Array, }; @@ -48,7 +49,42 @@ export default function LivestreamComments(props: Props) { superChats, // superchats organized by tip amount } = props; - let { superChatsReversed } = props; + let { superChatsReversed, superChatsFiatAmount } = props; + + superChatsFiatAmount = 0; + + if(superChats){ + console.log(superChats); + + let fiatAmount = 0; + for(const superChat of superChats){ + if(superChat.is_fiat){ + fiatAmount = fiatAmount + superChat.support_amount; + } + } + + superChatsFiatAmount = fiatAmount; + + } + + // TODO: why doesn't this work? + React.useEffect(() => { + if(superChats){ + console.log(superChats); + + // let fiatAmount = 0; + // for(const superChat of superChats){ + // if(superChat.is_fiat){ + // fiatAmount = fiatAmount + superChat.support_amount; + // } + // } + // + // console.log(fiatAmount); + // + // superChatsFiatAmount = fiatAmount.toString(); + } + }, [superChats]); + if (superChats) { const clonedSuperchats = JSON.parse(JSON.stringify(superChats)); @@ -172,7 +208,7 @@ export default function LivestreamComments(props: Props) { label={ <> / - {' '}{__('Tipped')} + {' '}{__('Tipped')} } onClick={function() { -- 2.45.2 From 30b8784cc928334fdd8d3d97f7aa0dd2a949b84c Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 20:03:54 +0200 Subject: [PATCH 05/54] sum up lbc amounts --- ui/component/livestreamComments/view.jsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 6944cdfee..8d1574ee4 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -44,27 +44,27 @@ export default function LivestreamComments(props: Props) { doCommentList, fetchingComments, doSuperChatList, - superChatsTotalAmount, myChannels, superChats, // superchats organized by tip amount } = props; - let { superChatsReversed, superChatsFiatAmount } = props; - - superChatsFiatAmount = 0; + let { superChatsReversed, superChatsFiatAmount, superChatsTotalAmount } = props; + // sum total amounts for fiat tips and lbc tips if(superChats){ - console.log(superChats); let fiatAmount = 0; + let LBCAmount = 0; for(const superChat of superChats){ if(superChat.is_fiat){ fiatAmount = fiatAmount + superChat.support_amount; + } else { + LBCAmount = LBCAmount + superChat.support_amount; } } superChatsFiatAmount = fiatAmount; - + superChatsTotalAmount = LBCAmount; } // TODO: why doesn't this work? -- 2.45.2 From 891af95437fe7db5bc4a6f90a79b05034e9e09f3 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 21:30:35 +0200 Subject: [PATCH 06/54] refactor code a bit remove why isnt this working bit --- ui/component/livestreamComments/view.jsx | 79 +++++++++--------------- 1 file changed, 30 insertions(+), 49 deletions(-) diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 8d1574ee4..0ed35c9e3 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -50,55 +50,6 @@ export default function LivestreamComments(props: Props) { let { superChatsReversed, superChatsFiatAmount, superChatsTotalAmount } = props; - // sum total amounts for fiat tips and lbc tips - if(superChats){ - - let fiatAmount = 0; - let LBCAmount = 0; - for(const superChat of superChats){ - if(superChat.is_fiat){ - fiatAmount = fiatAmount + superChat.support_amount; - } else { - LBCAmount = LBCAmount + superChat.support_amount; - } - } - - superChatsFiatAmount = fiatAmount; - superChatsTotalAmount = LBCAmount; - } - - // TODO: why doesn't this work? - React.useEffect(() => { - if(superChats){ - console.log(superChats); - - // let fiatAmount = 0; - // for(const superChat of superChats){ - // if(superChat.is_fiat){ - // fiatAmount = fiatAmount + superChat.support_amount; - // } - // } - // - // console.log(fiatAmount); - // - // superChatsFiatAmount = fiatAmount.toString(); - } - }, [superChats]); - - - if (superChats) { - const clonedSuperchats = JSON.parse(JSON.stringify(superChats)); - - // sort by fiat first then by support amount - superChatsReversed = clonedSuperchats.sort(function(a,b) { - if (a.is_fiat === b.is_fiat) { - return b.support_amount - a.support_amount; - } else { - return (a.is_fiat === b.is_fiat) ? 0 : a.is_fiat ? -1 : 1; - } - }).reverse(); - } - const commentsRef = React.createRef(); const [scrollBottom, setScrollBottom] = React.useState(true); const [viewMode, setViewMode] = React.useState(VIEW_MODE_CHAT); @@ -110,6 +61,36 @@ export default function LivestreamComments(props: Props) { const discussionElement = document.querySelector('.livestream__comments'); const commentElement = document.querySelector('.livestream-comment'); + // sum total amounts for fiat tips and lbc tips + if (superChats) { + let fiatAmount = 0; + let LBCAmount = 0; + for (const superChat of superChats) { + if (superChat.is_fiat) { + fiatAmount = fiatAmount + superChat.support_amount; + } else { + LBCAmount = LBCAmount + superChat.support_amount; + } + } + + superChatsFiatAmount = fiatAmount; + superChatsTotalAmount = LBCAmount; + } + + // array of superchats organized by fiat or not first, then support amount + if (superChats) { + const clonedSuperchats = JSON.parse(JSON.stringify(superChats)); + + // sort by fiat first then by support amount + superChatsReversed = clonedSuperchats.sort(function(a,b) { + if (a.is_fiat === b.is_fiat) { + return b.support_amount - a.support_amount; + } else { + return (a.is_fiat === b.is_fiat) ? 0 : a.is_fiat ? -1 : 1; + } + }).reverse(); + } + // todo: implement comment_list --mine in SDK so redux can grab with selectCommentIsMine function isMyComment(channelId: string) { if (myChannels != null && channelId != null) { -- 2.45.2 From 620a3e5d1d0455e365ce8c5d5c2c7c13bd43a637 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 21:34:37 +0200 Subject: [PATCH 07/54] bugfix cant tip fiat if no lbc balance --- ui/component/walletSendTip/view.jsx | 31 +++++++++++++++++++++++++---- 1 file changed, 27 insertions(+), 4 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 4f99fbbb4..4a87141c8 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -362,7 +362,7 @@ function WalletSendTip(props: Props) { return (
{/* if there is no LBC balance, show user frontend to get credits */} - {noBalance ? ( + {1 == 2 ? ( }}>Supporting content requires %lbc%} subtitle={ @@ -479,8 +479,10 @@ function WalletSendTip(props: Props) {
- ) : ( - <> + // only show the prompt to earn more if its lbc or boost tab and no balance + // otherwise you can show the full prompt + ) : (!((activeTab === TAB_LBC || activeTab === TAB_BOOST) && noBalance) + ? <>
@@ -591,7 +593,28 @@ function WalletSendTip(props: Props) { ) : (
{__('The payment will be made from your saved card')}
)} - + : <> + }}>Supporting content requires %lbc%} + subtitle={ + }}> + With %lbc%, you can send tips to your favorite creators, or help boost their content for more people to + see. + + } + actions={ +
+
+ } + /> ) } /> -- 2.45.2 From 2dfc51e9f9848226799cd5abf2ef6073028208b9 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 23:17:44 +0200 Subject: [PATCH 08/54] add toast when someone does a tip for a comment --- ui/component/commentCreate/view.jsx | 18 ++++++++---------- 1 file changed, 8 insertions(+), 10 deletions(-) diff --git a/ui/component/commentCreate/view.jsx b/ui/component/commentCreate/view.jsx index 238187cb4..a7a0d64eb 100644 --- a/ui/component/commentCreate/view.jsx +++ b/ui/component/commentCreate/view.jsx @@ -131,7 +131,7 @@ export function CommentCreate(props: Props) { return; } - // if comment post didn't work, but tip was already made, try again to create comment + // if comment post didn't work, but tip was already made, try againt o create comment if (commentFailure && tipAmount === successTip.tipAmount) { handleCreateComment(successTip.txid); return; @@ -161,6 +161,8 @@ export function CommentCreate(props: Props) { tipChannelName = claim.name; } + console.log(activeChannelClaim); + setIsSubmitting(true); if (activeTab === TAB_LBC) { @@ -178,7 +180,7 @@ export function CommentCreate(props: Props) { doToast({ message: __("You sent %tipAmount% LBRY Credits as a tip to %tipChannelName%, I'm sure they appreciate it!", { tipAmount: tipAmount, // force show decimal places - tipChannelName, + tipChannelName }), }); @@ -190,14 +192,15 @@ export function CommentCreate(props: Props) { } ); } else { + const sourceClaimId = claim.claim_id; const roundedAmount = Math.round(tipAmount * 100) / 100; Lbryio.call( 'customer', 'tip', - { // round to deal with floating point precision - amount: Math.round(100 * roundedAmount), // convert from dollars to cents + { + amount: 100 * roundedAmount, // convert from dollars to cents creator_channel_name: tipChannelName, // creator_channel_name creator_channel_claim_id: channelClaimId, tipper_channel_name: activeChannelName, @@ -341,12 +344,7 @@ export function CommentCreate(props: Props) { } onClick={handleSupportComment} /> -
); -- 2.45.2 From 553722a42fc455923248485db09af4734b299be7 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 23:26:57 +0200 Subject: [PATCH 09/54] add error toast for card page --- ui/page/settingsStripeCard/view.jsx | 27 ++++++++++++++++++++++----- 1 file changed, 22 insertions(+), 5 deletions(-) diff --git a/ui/page/settingsStripeCard/view.jsx b/ui/page/settingsStripeCard/view.jsx index ba8763143..f222d4f6a 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -19,9 +19,6 @@ if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) { stripeEnvironment = 'live'; } -const APIS_DOWN_ERROR_RESPONSE = __('There was an error from the server, please try again later'); -const CARD_SETUP_ERROR_RESPONSE = __('There was an error getting your card setup, please try again later'); - // eslint-disable-next-line flowtype/no-types-missing-file-annotation type Props = { disabled: boolean, @@ -60,6 +57,8 @@ class SettingsStripeCard extends React.Component { componentDidMount() { let that = this; + console.log(this.props); + let doToast = this.props.doToast; const script = document.createElement('script'); @@ -101,6 +100,8 @@ class SettingsStripeCard extends React.Component { let topOfDisplay = customer.email.split('@')[0]; let bottomOfDisplay = '@' + customer.email.split('@')[1]; + console.log(customerStatusResponse.Customer); + let cardDetails = { brand: card.brand, expiryYear: card.exp_year, @@ -132,6 +133,8 @@ class SettingsStripeCard extends React.Component { }, 'post' ).then((customerSetupResponse) => { + console.log(customerSetupResponse); + clientSecret = customerSetupResponse.client_secret; // instantiate stripe elements @@ -151,10 +154,14 @@ class SettingsStripeCard extends React.Component { that.setState({ customerTransactions: customerTransactionsResponse, }); + + console.log(customerTransactionsResponse); }); // if the status call fails, either an actual error or need to run setup first }) .catch(function (error) { + console.log(error); + // errorString passed from the API (with a 403 error) const errorString = 'user as customer is not setup yet'; @@ -174,6 +181,8 @@ class SettingsStripeCard extends React.Component { }, 'post' ).then((customerSetupResponse) => { + console.log(customerSetupResponse); + clientSecret = customerSetupResponse.client_secret; // instantiate stripe elements @@ -181,10 +190,14 @@ class SettingsStripeCard extends React.Component { }); // 500 error from the backend being down } else if (error === 'internal_apis_down') { - doToast({ message: APIS_DOWN_ERROR_RESPONSE, isError: true }); + var displayString = 'There was an error from the server, please let support know'; + doToast({ message: displayString, isError: true }); } else { // probably an error from stripe - doToast({ message: CARD_SETUP_ERROR_RESPONSE, isError: true }); + var displayString = 'There was an error getting your card setup, please let support know'; + doToast({ message: displayString, isError: true }); + + console.log('Unseen before error'); } }); }, 250); @@ -253,6 +266,8 @@ class SettingsStripeCard extends React.Component { }) .then(function (result) { if (result.error) { + console.log(result); + changeLoadingState(false); var displayError = document.getElementById('card-errors'); displayError.textContent = result.error.message; @@ -336,6 +351,8 @@ class SettingsStripeCard extends React.Component { }); }); + console.log(result); + changeLoadingState(false); }); }; -- 2.45.2 From f4d8de2ac6c3def9f606734f94b3c2f00916ab56 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 23:31:46 +0200 Subject: [PATCH 10/54] show error on account connection page --- ui/page/settingsStripeAccount/view.jsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index 2821b4423..febfef6f3 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -32,7 +32,6 @@ type Props = { source: string, user: User, doOpenModal: (string, {}) => void, - doToast: ({ message: string }) => void, }; type State = { @@ -131,8 +130,10 @@ class StripeAccountConnection extends React.Component { ).then((accountListResponse: any) => { // TODO type this that.setState({ - accountTransactions: accountListResponse.reverse(), + accountTransactions: accountListResponse, }); + + console.log(accountListResponse); }); } @@ -168,11 +169,12 @@ class StripeAccountConnection extends React.Component { getAndSetAccountLink(true); } else { // probably an error from stripe - const displayString = __('There was an error getting your account setup, please try again later'); + var displayString = 'There was an error getting your account setup, please let support know'; doToast({ message: displayString, isError: true }); // not an error from Beamer, throw it throw new Error(error); } + }); } @@ -301,7 +303,7 @@ class StripeAccountConnection extends React.Component { {accountTransactions && - accountTransactions.map((transaction) => ( + accountTransactions.reverse().map((transaction) => ( {moment(transaction.created_at).format('LLL')} -- 2.45.2 From 96fc536547eaf0a680b85f8bd5cadfa3fa046509 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 23:58:32 +0200 Subject: [PATCH 11/54] automatically truncate to two decimals --- ui/component/walletSendTip/view.jsx | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 4a87141c8..c8acff5ea 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -314,7 +314,18 @@ function WalletSendTip(props: Props) { } function handleCustomPriceChange(event: SyntheticInputEvent<*>) { - const tipAmount = parseFloat(event.target.value); + let tipAmount = parseFloat(event.target.value); + + // allow maximum two decimalds + if (activeTab === TAB_FIAT) { + tipAmount = Math.round(tipAmount * 100) / 100; + } + + // TODO: add limit to 4 digits + // can also do setTipError('Maximum 1000') that way + if(tipAmount.length > 5 && tipAmount > 1000){ + tipAmount.length = 4 + } setCustomTipAmount(tipAmount); } -- 2.45.2 From 9a4ad2dcc95f6561206d3ea2af45a6211cc79608 Mon Sep 17 00:00:00 2001 From: Anthony Date: Mon, 26 Jul 2021 20:51:41 +0200 Subject: [PATCH 12/54] close to working perfectly --- ui/component/walletSendTip/view.jsx | 62 ++++++++++++++++++++++++----- 1 file changed, 52 insertions(+), 10 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index c8acff5ea..43cf4aa02 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -313,21 +313,63 @@ function WalletSendTip(props: Props) { } } + var countDecimals = function(value) { + var text = value.toString(); + var index = text.indexOf('.'); + return (text.length - index - 1); + } + function handleCustomPriceChange(event: SyntheticInputEvent<*>) { - let tipAmount = parseFloat(event.target.value); - // allow maximum two decimalds + console.log(event.target.value); + + let tipAmountAsString = event.target.value; + + let tipAmount = parseFloat(tipAmountAsString); + + // allow maximum two decimals if (activeTab === TAB_FIAT) { - tipAmount = Math.round(tipAmount * 100) / 100; - } - // TODO: add limit to 4 digits - // can also do setTipError('Maximum 1000') that way - if(tipAmount.length > 5 && tipAmount > 1000){ - tipAmount.length = 4 - } + console.log(tipAmount); - setCustomTipAmount(tipAmount); + console.log(Number.isNaN(tipAmount)) + + if (Number.isNaN(tipAmount)) { + setCustomTipAmount(''); + } + + + const howManyDecimals = countDecimals(tipAmountAsString); + + console.log('how many decimals'); + console.log(howManyDecimals) + + if (howManyDecimals > 2) { + tipAmount = Math.floor(tipAmount * 100) / 100; + // setTipError('Value can only have two decimal places'); + } + // else { + // tipAmount = ((tipAmount * 100) / 100).toFixed(2); + // } + + + // console.log(howManyDecimals); + + console.log(tipAmount); + + const howManyDigits = Math.trunc(tipAmount).toString().length; + + if (howManyDigits > 4 && tipAmount !== 1000) { + setTipError('Value must be below 1000 dollars'); + } else if (tipAmount > 1000) { + setTipError('Value must be below 1000 dollars'); + setCustomTipAmount(tipAmount); + } else { + setCustomTipAmount(tipAmount); + } + } else { + setCustomTipAmount(tipAmount); + } } function buildButtonText() { -- 2.45.2 From 001ce65bf44da2a7143fc1fe2ebbe46b5c9a3e6a Mon Sep 17 00:00:00 2001 From: Anthony Date: Mon, 26 Jul 2021 21:07:16 +0200 Subject: [PATCH 13/54] show decimals value better --- ui/component/walletSendTip/view.jsx | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 43cf4aa02..ac5c6727e 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -360,9 +360,9 @@ function WalletSendTip(props: Props) { const howManyDigits = Math.trunc(tipAmount).toString().length; if (howManyDigits > 4 && tipAmount !== 1000) { - setTipError('Value must be below 1000 dollars'); + setTipError('Amount cannot be over 1000 dollars'); } else if (tipAmount > 1000) { - setTipError('Value must be below 1000 dollars'); + setTipError('Amount cannot be over 1000 dollars'); setCustomTipAmount(tipAmount); } else { setCustomTipAmount(tipAmount); @@ -384,8 +384,14 @@ function WalletSendTip(props: Props) { return false; } + function convertToTwoDecimals(number){ + return (Math.round(number * 100) / 100).toFixed(2); + } + + const amountToShow = activeTab === TAB_FIAT ? convertToTwoDecimals(tipAmount) : tipAmount; + // if it's a valid number display it, otherwise do an empty string - const displayAmount = !isNan(tipAmount) ? tipAmount : ''; + const displayAmount = !isNan(tipAmount) ? amountToShow : ''; if (activeTab === TAB_BOOST) { return (claimIsMine ? __('Boost Your %claimTypeText%', {claimTypeText}) : __('Boost This %claimTypeText%', {claimTypeText})); @@ -517,7 +523,7 @@ function WalletSendTip(props: Props) {
{setConfirmLabel()}
- {activeTab === TAB_FIAT ?

$ {tipAmount}

: } + {activeTab === TAB_FIAT ?

$ {(Math.round(tipAmount * 100) / 100).toFixed(2)}

: }
-- 2.45.2 From de29d55f25cb4b790b58c742420ec9bb2a065b70 Mon Sep 17 00:00:00 2001 From: Anthony Date: Mon, 26 Jul 2021 21:40:01 +0200 Subject: [PATCH 14/54] increase size of input value --- ui/component/walletSendTip/view.jsx | 4 ++++ ui/scss/component/_form-field.scss | 6 +++--- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index ac5c6727e..0e3d58890 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -601,6 +601,7 @@ function WalletSendTip(props: Props) { {__('Custom support amount')}{' '} @@ -620,6 +621,9 @@ function WalletSendTip(props: Props) { min="0" step="any" type="number" + style={{ + width: activeTab === TAB_FIAT ? '99px' : '160px', + }} placeholder="1.23" value={customTipAmount} onChange={(event) => handleCustomPriceChange(event)} diff --git a/ui/scss/component/_form-field.scss b/ui/scss/component/_form-field.scss index 5c4a3a2c8..2b4b161d8 100644 --- a/ui/scss/component/_form-field.scss +++ b/ui/scss/component/_form-field.scss @@ -404,9 +404,9 @@ fieldset-group { } } -.form-field--price-amount { - max-width: 6em; -} + //.form-field--price-amount { + // max-width: 6em; + //} .form-field--price-amount--auto { width: auto; -- 2.45.2 From f7efff3faa87023626a9f29b4cbf667abb2d7987 Mon Sep 17 00:00:00 2001 From: Anthony Date: Mon, 26 Jul 2021 21:55:21 +0200 Subject: [PATCH 15/54] one bug left but almost working perfectly --- ui/component/walletSendTip/view.jsx | 29 +++++++---------------------- 1 file changed, 7 insertions(+), 22 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 0e3d58890..c5ce96f1a 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -321,41 +321,22 @@ function WalletSendTip(props: Props) { function handleCustomPriceChange(event: SyntheticInputEvent<*>) { - console.log(event.target.value); - let tipAmountAsString = event.target.value; let tipAmount = parseFloat(tipAmountAsString); + const howManyDecimals = countDecimals(tipAmountAsString); + // allow maximum two decimals if (activeTab === TAB_FIAT) { - console.log(tipAmount); - - console.log(Number.isNaN(tipAmount)) - if (Number.isNaN(tipAmount)) { setCustomTipAmount(''); } - - const howManyDecimals = countDecimals(tipAmountAsString); - - console.log('how many decimals'); - console.log(howManyDecimals) - if (howManyDecimals > 2) { tipAmount = Math.floor(tipAmount * 100) / 100; - // setTipError('Value can only have two decimal places'); } - // else { - // tipAmount = ((tipAmount * 100) / 100).toFixed(2); - // } - - - // console.log(howManyDecimals); - - console.log(tipAmount); const howManyDigits = Math.trunc(tipAmount).toString().length; @@ -368,6 +349,11 @@ function WalletSendTip(props: Props) { setCustomTipAmount(tipAmount); } } else { + if (howManyDecimals > 9) { + tipAmount = Number(tipAmount.toString().match(/^-?\d+(?:\.\d{0,8})?/)[0]); + + setTipError('Please only use up to 8 decimals') + } setCustomTipAmount(tipAmount); } } @@ -601,7 +587,6 @@ function WalletSendTip(props: Props) { {__('Custom support amount')}{' '} -- 2.45.2 From f8b73328af6efa2326cba2053f0c03bb62978dc6 Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 27 Jul 2021 19:15:15 +0200 Subject: [PATCH 16/54] reverse so newest transactions come first --- ui/page/settingsStripeAccount/view.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index febfef6f3..dc21de5b3 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -130,7 +130,7 @@ class StripeAccountConnection extends React.Component { ).then((accountListResponse: any) => { // TODO type this that.setState({ - accountTransactions: accountListResponse, + accountTransactions: accountListResponse.reverse(), }); console.log(accountListResponse); @@ -303,7 +303,7 @@ class StripeAccountConnection extends React.Component { {accountTransactions && - accountTransactions.reverse().map((transaction) => ( + accountTransactions.map((transaction) => ( {moment(transaction.created_at).format('LLL')} -- 2.45.2 From 347b804e471529a363dcc08510caff9c0cd34d72 Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 27 Jul 2021 19:48:57 +0200 Subject: [PATCH 17/54] fixing bug caused by floating point precision --- ui/component/commentCreate/view.jsx | 4 ++-- ui/component/walletSendTip/view.jsx | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/ui/component/commentCreate/view.jsx b/ui/component/commentCreate/view.jsx index a7a0d64eb..3d78b4133 100644 --- a/ui/component/commentCreate/view.jsx +++ b/ui/component/commentCreate/view.jsx @@ -199,8 +199,8 @@ export function CommentCreate(props: Props) { Lbryio.call( 'customer', 'tip', - { - amount: 100 * roundedAmount, // convert from dollars to cents + { // round to deal with floating point precision + amount: Math.round(100 * roundedAmount), // convert from dollars to cents creator_channel_name: tipChannelName, // creator_channel_name creator_channel_claim_id: channelClaimId, tipper_channel_name: activeChannelName, diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index c5ce96f1a..76f75851d 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -273,8 +273,8 @@ function WalletSendTip(props: Props) { Lbryio.call( 'customer', 'tip', - { - amount: 100 * tipAmount, // convert from dollars to cents + { // round to fix issues with floating point numbers + amount: Math.round(100 * tipAmount), // convert from dollars to cents creator_channel_name: tipChannelName, // creator_channel_name creator_channel_claim_id: channelClaimId, tipper_channel_name: sendAnonymously ? '' : activeChannelName, -- 2.45.2 From f213023f07146e10819346db3adb95fa70b1ca2e Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 10 Aug 2021 20:01:46 +0200 Subject: [PATCH 18/54] eslint fixes --- ui/component/commentCreate/view.jsx | 3 +- ui/component/livestreamComments/view.jsx | 97 ++++++++++++------------ ui/component/walletSendTip/view.jsx | 12 ++- ui/page/settingsStripeAccount/view.jsx | 2 +- 4 files changed, 56 insertions(+), 58 deletions(-) diff --git a/ui/component/commentCreate/view.jsx b/ui/component/commentCreate/view.jsx index 3d78b4133..fbed0757b 100644 --- a/ui/component/commentCreate/view.jsx +++ b/ui/component/commentCreate/view.jsx @@ -180,7 +180,7 @@ export function CommentCreate(props: Props) { doToast({ message: __("You sent %tipAmount% LBRY Credits as a tip to %tipChannelName%, I'm sure they appreciate it!", { tipAmount: tipAmount, // force show decimal places - tipChannelName + tipChannelName, }), }); @@ -192,7 +192,6 @@ export function CommentCreate(props: Props) { } ); } else { - const sourceClaimId = claim.claim_id; const roundedAmount = Math.round(tipAmount * 100) / 100; diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 0ed35c9e3..9ecf27da0 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -22,7 +22,6 @@ type Props = { fetchingComments: boolean, doSuperChatList: (string) => void, superChats: Array, - superChatsReversed: Array, superChatsTotalAmount: number, superChatsFiatAmount: number, myChannels: ?Array, @@ -48,7 +47,7 @@ export default function LivestreamComments(props: Props) { superChats, // superchats organized by tip amount } = props; - let { superChatsReversed, superChatsFiatAmount, superChatsTotalAmount } = props; + let { superChatsFiatAmount, superChatsTotalAmount } = props; const commentsRef = React.createRef(); const [scrollBottom, setScrollBottom] = React.useState(true); @@ -61,50 +60,7 @@ export default function LivestreamComments(props: Props) { const discussionElement = document.querySelector('.livestream__comments'); const commentElement = document.querySelector('.livestream-comment'); - // sum total amounts for fiat tips and lbc tips - if (superChats) { - let fiatAmount = 0; - let LBCAmount = 0; - for (const superChat of superChats) { - if (superChat.is_fiat) { - fiatAmount = fiatAmount + superChat.support_amount; - } else { - LBCAmount = LBCAmount + superChat.support_amount; - } - } - - superChatsFiatAmount = fiatAmount; - superChatsTotalAmount = LBCAmount; - } - - // array of superchats organized by fiat or not first, then support amount - if (superChats) { - const clonedSuperchats = JSON.parse(JSON.stringify(superChats)); - - // sort by fiat first then by support amount - superChatsReversed = clonedSuperchats.sort(function(a,b) { - if (a.is_fiat === b.is_fiat) { - return b.support_amount - a.support_amount; - } else { - return (a.is_fiat === b.is_fiat) ? 0 : a.is_fiat ? -1 : 1; - } - }).reverse(); - } - - // todo: implement comment_list --mine in SDK so redux can grab with selectCommentIsMine - function isMyComment(channelId: string) { - if (myChannels != null && channelId != null) { - for (let i = 0; i < myChannels.length; i++) { - if (myChannels[i].claim_id === channelId) { - return true; - } - } - } - return false; - } - React.useEffect(() => { - if (claimId) { doCommentList(uri, '', 1, 75); doSuperChatList(uri); @@ -149,6 +105,51 @@ export default function LivestreamComments(props: Props) { } }, [commentsLength, discussionElement, handleScroll, performedInitialScroll, setPerformedInitialScroll]); + // sum total amounts for fiat tips and lbc tips + if (superChats) { + let fiatAmount = 0; + let LBCAmount = 0; + for (const superChat of superChats) { + if (superChat.is_fiat) { + fiatAmount = fiatAmount + superChat.support_amount; + } else { + LBCAmount = LBCAmount + superChat.support_amount; + } + } + + superChatsFiatAmount = fiatAmount; + superChatsTotalAmount = LBCAmount; + } + + let superChatsReversed; + // array of superchats organized by fiat or not first, then support amount + if (superChats) { + const clonedSuperchats = JSON.parse(JSON.stringify(superChats)); + + // sort by fiat first then by support amount + superChatsReversed = clonedSuperchats.sort(function(a, b) { + // if both are fiat, organize by support + if (a.is_fiat === b.is_fiat) { + return b.support_amount - a.support_amount; + // otherwise, if they are not both fiat, put the fiat transaction first + } else { + return (a.is_fiat === b.is_fiat) ? 0 : a.is_fiat ? -1 : 1; + } + }).reverse(); + } + + // todo: implement comment_list --mine in SDK so redux can grab with selectCommentIsMine + function isMyComment(channelId: string) { + if (myChannels != null && channelId != null) { + for (let i = 0; i < myChannels.length; i++) { + if (myChannels[i].claim_id === channelId) { + return true; + } + } + } + return false; + } + if (!claim) { return null; } @@ -175,7 +176,7 @@ export default function LivestreamComments(props: Props) { label={__('Chat')} onClick={function() { setViewMode(VIEW_MODE_CHAT); - const livestreamCommentsDiv = document.getElementsByClassName('livestream__comments')[0] + const livestreamCommentsDiv = document.getElementsByClassName('livestream__comments')[0]; const divHeight = livestreamCommentsDiv.scrollHeight; livestreamCommentsDiv.scrollTop = divHeight; }} @@ -189,12 +190,12 @@ export default function LivestreamComments(props: Props) { label={ <> / - {' '}{__('Tipped')} + {' '}{__('Tipped')} } onClick={function() { setViewMode(VIEW_MODE_SUPER_CHAT); - const livestreamCommentsDiv = document.getElementsByClassName('livestream__comments')[0] + const livestreamCommentsDiv = document.getElementsByClassName('livestream__comments')[0]; const divHeight = livestreamCommentsDiv.scrollHeight; livestreamCommentsDiv.scrollTop = divHeight * -1; }} diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 76f75851d..faf950567 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -317,10 +317,9 @@ function WalletSendTip(props: Props) { var text = value.toString(); var index = text.indexOf('.'); return (text.length - index - 1); - } + }; function handleCustomPriceChange(event: SyntheticInputEvent<*>) { - let tipAmountAsString = event.target.value; let tipAmount = parseFloat(tipAmountAsString); @@ -329,7 +328,6 @@ function WalletSendTip(props: Props) { // allow maximum two decimals if (activeTab === TAB_FIAT) { - if (Number.isNaN(tipAmount)) { setCustomTipAmount(''); } @@ -350,9 +348,9 @@ function WalletSendTip(props: Props) { } } else { if (howManyDecimals > 9) { - tipAmount = Number(tipAmount.toString().match(/^-?\d+(?:\.\d{0,8})?/)[0]); + tipAmount = Number(tipAmount.toString().match(/^-?\d+(?:\.\d{0,8})?/)[0]); - setTipError('Please only use up to 8 decimals') + setTipError('Please only use up to 8 decimals'); } setCustomTipAmount(tipAmount); } @@ -370,7 +368,7 @@ function WalletSendTip(props: Props) { return false; } - function convertToTwoDecimals(number){ + function convertToTwoDecimals(number) { return (Math.round(number * 100) / 100).toFixed(2); } @@ -407,7 +405,7 @@ function WalletSendTip(props: Props) { return ( {/* if there is no LBC balance, show user frontend to get credits */} - {1 == 2 ? ( + {1 === 2 ? ( }}>Supporting content requires %lbc%} subtitle={ diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index dc21de5b3..5ed9faa79 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -32,6 +32,7 @@ type Props = { source: string, user: User, doOpenModal: (string, {}) => void, + doToast: ({ message: string }) => void, }; type State = { @@ -174,7 +175,6 @@ class StripeAccountConnection extends React.Component { // not an error from Beamer, throw it throw new Error(error); } - }); } -- 2.45.2 From 71e7a5bfa73175d127747f14fc3c701a4488597b Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 10 Aug 2021 20:27:58 +0200 Subject: [PATCH 19/54] remove unused conditional --- ui/component/walletSendTip/view.jsx | 466 +++++++++++++--------------- 1 file changed, 222 insertions(+), 244 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index faf950567..750aa929f 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -405,266 +405,244 @@ function WalletSendTip(props: Props) { return ( {/* if there is no LBC balance, show user frontend to get credits */} - {1 === 2 ? ( - }}>Supporting content requires %lbc%} - subtitle={ - }}> - With %lbc%, you can send tips to your favorite creators, or help boost their content for more people to - see. - - } - actions={ -
-
+ )} + + {/* short explainer under the button */} +
+ {explainerText + ' '} + {/* {activeTab === TAB_FIAT && !hasCardSaved &&
- } - /> - ) : ( - // if there is lbc, the main tip/boost gui with the 3 tabs at the top - } - subtitle={ - - {!claimIsMine && ( + + } + actions={ + // confirmation modal, allow user to confirm or cancel transaction + isConfirming ? ( + <> +
- {/* tip LBC tab button */} +
{__('To --[the tip recipient]--')}
+
{channelName || title}
+
{__('From --[the tip sender]--')}
+
+ {activeChannelClaim && !incognito ? activeChannelClaim.name : __('Anonymous')} +
+
{setConfirmLabel()}
+
+ {activeTab === TAB_FIAT ?

$ {(Math.round(tipAmount * 100) / 100).toFixed(2)}

: } +
+
+
+
+
+ + // only show the prompt to earn more if its lbc or boost tab and no balance + // otherwise you can show the full prompt + ) : (!((activeTab === TAB_LBC || activeTab === TAB_BOOST) && noBalance) + ? <> +
+ +
+ + {activeTab === TAB_FIAT && !hasCardSaved && ( +

+

+ )} + + {/* section to pick tip/boost amount */} +
+ {DEFAULT_TIP_AMOUNTS.map((amount) => (
+ + {useCustomTip && ( +
+ + {__('Custom support amount')}{' '} + {activeTab !== TAB_FIAT ? ( + }} + > + (%lbc_balance% Credits available) + + ) : ( + 'in USD' + )} + + } + className="form-field--price-amount" + error={tipError} + min="0" + step="any" + type="number" + style={{ + width: activeTab === TAB_FIAT ? '99px' : '160px', }} - className={classnames('button-toggle', { 'button-toggle--active': activeTab === TAB_BOOST })} + placeholder="1.23" + value={customTipAmount} + onChange={(event) => handleCustomPriceChange(event)} />
)} - {/* short explainer under the button */} -
- {explainerText + ' '} - {/* {activeTab === TAB_FIAT && !hasCardSaved &&
- - } - actions={ - // confirmation modal, allow user to confirm or cancel transaction - isConfirming ? ( - <> -
-
-
{__('To --[the tip recipient]--')}
-
{channelName || title}
-
{__('From --[the tip sender]--')}
-
- {activeChannelClaim && !incognito ? activeChannelClaim.name : __('Anonymous')} + {activeTab !== TAB_FIAT ? ( + + ) : !canReceiveFiatTip ? ( +
{__('Only select creators can receive tips at this time')}
+ ) : ( +
{__('The payment will be made from your saved card')}
+ )} + + // if it's LBC and there is no balance, you can prompt to purchase LBC + : <> + }}>Supporting content requires %lbc%} + subtitle={ + }}> + With %lbc%, you can send tips to your favorite creators, or help boost their content for more people to + see. + + } + actions={ +
+
-
{setConfirmLabel()}
-
- {activeTab === TAB_FIAT ?

$ {(Math.round(tipAmount * 100) / 100).toFixed(2)}

: } -
-
-
-
-
- - // only show the prompt to earn more if its lbc or boost tab and no balance - // otherwise you can show the full prompt - ) : (!((activeTab === TAB_LBC || activeTab === TAB_BOOST) && noBalance) - ? <> -
- -
- - {activeTab === TAB_FIAT && !hasCardSaved && ( -

-

- )} - - {/* section to pick tip/boost amount */} -
- {DEFAULT_TIP_AMOUNTS.map((amount) => ( -
- - {useCustomTip && ( -
- - {__('Custom support amount')}{' '} - {activeTab !== TAB_FIAT ? ( - }} - > - (%lbc_balance% Credits available) - - ) : ( - 'in USD' - )} - - } - className="form-field--price-amount" - error={tipError} - min="0" - step="any" - type="number" - style={{ - width: activeTab === TAB_FIAT ? '99px' : '160px', - }} - placeholder="1.23" - value={customTipAmount} - onChange={(event) => handleCustomPriceChange(event)} - /> -
- )} - - {/* send tip/boost button */} -
-
- {activeTab !== TAB_FIAT ? ( - - ) : !canReceiveFiatTip ? ( -
{__('Only select creators can receive tips at this time')}
- ) : ( -
{__('The payment will be made from your saved card')}
- )} - : <> - }}>Supporting content requires %lbc%} - subtitle={ - }}> - With %lbc%, you can send tips to your favorite creators, or help boost their content for more people to - see. - - } - actions={ -
-
- } - /> - ) - } - /> - )} + } + /> + ) + } + /> ); } -- 2.45.2 From de4f1896cf88b90d48eeece4f10326749f7e85d7 Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 10 Aug 2021 21:08:15 +0200 Subject: [PATCH 20/54] get stuff ready for merge --- ui/page/settingsStripeAccount/view.jsx | 4 +--- ui/page/settingsStripeCard/view.jsx | 8 ++------ ui/scss/component/_form-field.scss | 6 +++--- 3 files changed, 6 insertions(+), 12 deletions(-) diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index 5ed9faa79..6bc0fabf8 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -133,8 +133,6 @@ class StripeAccountConnection extends React.Component { that.setState({ accountTransactions: accountListResponse.reverse(), }); - - console.log(accountListResponse); }); } @@ -170,7 +168,7 @@ class StripeAccountConnection extends React.Component { getAndSetAccountLink(true); } else { // probably an error from stripe - var displayString = 'There was an error getting your account setup, please let support know'; + const displayString = 'There was an error getting your account setup, please let support know'; doToast({ message: displayString, isError: true }); // not an error from Beamer, throw it throw new Error(error); diff --git a/ui/page/settingsStripeCard/view.jsx b/ui/page/settingsStripeCard/view.jsx index f222d4f6a..06768fb28 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -181,8 +181,6 @@ class SettingsStripeCard extends React.Component { }, 'post' ).then((customerSetupResponse) => { - console.log(customerSetupResponse); - clientSecret = customerSetupResponse.client_secret; // instantiate stripe elements @@ -190,14 +188,12 @@ class SettingsStripeCard extends React.Component { }); // 500 error from the backend being down } else if (error === 'internal_apis_down') { - var displayString = 'There was an error from the server, please let support know'; + const displayString = 'There was an error from the server, please let support know'; doToast({ message: displayString, isError: true }); } else { // probably an error from stripe - var displayString = 'There was an error getting your card setup, please let support know'; + const displayString = 'There was an error getting your card setup, please let support know'; doToast({ message: displayString, isError: true }); - - console.log('Unseen before error'); } }); }, 250); diff --git a/ui/scss/component/_form-field.scss b/ui/scss/component/_form-field.scss index 2b4b161d8..5c4a3a2c8 100644 --- a/ui/scss/component/_form-field.scss +++ b/ui/scss/component/_form-field.scss @@ -404,9 +404,9 @@ fieldset-group { } } - //.form-field--price-amount { - // max-width: 6em; - //} +.form-field--price-amount { + max-width: 6em; +} .form-field--price-amount--auto { width: auto; -- 2.45.2 From 908ca99c2c30c513139c7ee1730f7545bbe5ec06 Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 10 Aug 2021 21:55:38 +0200 Subject: [PATCH 21/54] bugfix and cleanup --- ui/component/commentCreate/view.jsx | 4 +--- ui/component/livestreamComments/view.jsx | 6 ++---- ui/component/walletSendTip/view.jsx | 5 ++++- 3 files changed, 7 insertions(+), 8 deletions(-) diff --git a/ui/component/commentCreate/view.jsx b/ui/component/commentCreate/view.jsx index fbed0757b..0f0932fe8 100644 --- a/ui/component/commentCreate/view.jsx +++ b/ui/component/commentCreate/view.jsx @@ -131,7 +131,7 @@ export function CommentCreate(props: Props) { return; } - // if comment post didn't work, but tip was already made, try againt o create comment + // if comment post didn't work, but tip was already made, try again to create comment if (commentFailure && tipAmount === successTip.tipAmount) { handleCreateComment(successTip.txid); return; @@ -161,8 +161,6 @@ export function CommentCreate(props: Props) { tipChannelName = claim.name; } - console.log(activeChannelClaim); - setIsSubmitting(true); if (activeTab === TAB_LBC) { diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 9ecf27da0..b606c7f85 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -22,8 +22,6 @@ type Props = { fetchingComments: boolean, doSuperChatList: (string) => void, superChats: Array, - superChatsTotalAmount: number, - superChatsFiatAmount: number, myChannels: ?Array, }; @@ -39,7 +37,7 @@ export default function LivestreamComments(props: Props) { embed, doCommentSocketConnect, doCommentSocketDisconnect, - comments, // superchats in chronological format + comments, // comments in chronological order (oldest first) doCommentList, fetchingComments, doSuperChatList, @@ -47,7 +45,7 @@ export default function LivestreamComments(props: Props) { superChats, // superchats organized by tip amount } = props; - let { superChatsFiatAmount, superChatsTotalAmount } = props; + let superChatsFiatAmount, superChatsTotalAmount; const commentsRef = React.createRef(); const [scrollBottom, setScrollBottom] = React.useState(true); diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 750aa929f..6bb67592e 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -141,6 +141,8 @@ function WalletSendTip(props: Props) { .then((accountCheckResponse) => { if (accountCheckResponse === true && canReceiveFiatTip !== true) { setCanReceiveFiatTip(true); + } else { + setCanReceiveFiatTip(false); } }) .catch(function (error) { @@ -332,6 +334,7 @@ function WalletSendTip(props: Props) { setCustomTipAmount(''); } + // allow maximum of two decimal places if (howManyDecimals > 2) { tipAmount = Math.floor(tipAmount * 100) / 100; } @@ -340,6 +343,7 @@ function WalletSendTip(props: Props) { if (howManyDigits > 4 && tipAmount !== 1000) { setTipError('Amount cannot be over 1000 dollars'); + setCustomTipAmount(tipAmount); } else if (tipAmount > 1000) { setTipError('Amount cannot be over 1000 dollars'); setCustomTipAmount(tipAmount); @@ -576,7 +580,6 @@ function WalletSendTip(props: Props) { )} } - className="form-field--price-amount" error={tipError} min="0" step="any" -- 2.45.2 From 202d8db09e219f0e3ddd0c100ddb66e5029acafd Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 10 Aug 2021 22:06:13 +0200 Subject: [PATCH 22/54] requested changes --- ui/component/livestreamComments/view.jsx | 24 ++++++++++++------------ ui/component/walletSendTip/view.jsx | 4 ++-- ui/page/settingsStripeCard/view.jsx | 9 +++++---- 3 files changed, 19 insertions(+), 18 deletions(-) diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index b606c7f85..931af568a 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -37,12 +37,12 @@ export default function LivestreamComments(props: Props) { embed, doCommentSocketConnect, doCommentSocketDisconnect, - comments, // comments in chronological order (oldest first) + comments: commentsByChronologicalOrder, doCommentList, fetchingComments, doSuperChatList, myChannels, - superChats, // superchats organized by tip amount + superChats: superChatsByTipAmount, } = props; let superChatsFiatAmount, superChatsTotalAmount; @@ -52,8 +52,8 @@ export default function LivestreamComments(props: Props) { const [viewMode, setViewMode] = React.useState(VIEW_MODE_CHAT); const [performedInitialScroll, setPerformedInitialScroll] = React.useState(false); const claimId = claim && claim.claim_id; - const commentsLength = comments && comments.length; - const commentsToDisplay = viewMode === VIEW_MODE_CHAT ? comments : superChats; + const commentsLength = commentsByChronologicalOrder && commentsByChronologicalOrder.length; + const commentsToDisplay = viewMode === VIEW_MODE_CHAT ? commentsByChronologicalOrder : superChatsByTipAmount; const discussionElement = document.querySelector('.livestream__comments'); const commentElement = document.querySelector('.livestream-comment'); @@ -104,10 +104,10 @@ export default function LivestreamComments(props: Props) { }, [commentsLength, discussionElement, handleScroll, performedInitialScroll, setPerformedInitialScroll]); // sum total amounts for fiat tips and lbc tips - if (superChats) { + if (superChatsByTipAmount) { let fiatAmount = 0; let LBCAmount = 0; - for (const superChat of superChats) { + for (const superChat of superChatsByTipAmount) { if (superChat.is_fiat) { fiatAmount = fiatAmount + superChat.support_amount; } else { @@ -121,8 +121,8 @@ export default function LivestreamComments(props: Props) { let superChatsReversed; // array of superchats organized by fiat or not first, then support amount - if (superChats) { - const clonedSuperchats = JSON.parse(JSON.stringify(superChats)); + if (superChatsByTipAmount) { + const clonedSuperchats = JSON.parse(JSON.stringify(superChatsByTipAmount)); // sort by fiat first then by support amount superChatsReversed = clonedSuperchats.sort(function(a, b) { @@ -202,16 +202,16 @@ export default function LivestreamComments(props: Props) { )}
<> - {fetchingComments && !comments && ( + {fetchingComments && !commentsByChronologicalOrder && (
)}
- {viewMode === VIEW_MODE_CHAT && superChatsTotalAmount > 0 && superChats && ( + {viewMode === VIEW_MODE_CHAT && superChatsTotalAmount > 0 && superChatsByTipAmount && (
- {superChats.map((superChat: Comment) => ( + {superChatsByTipAmount.map((superChat: Comment) => (
@@ -235,7 +235,7 @@ export default function LivestreamComments(props: Props) { )} {/* top to bottom comment display */} - {!fetchingComments && comments.length > 0 ? ( + {!fetchingComments && commentsByChronologicalOrder.length > 0 ? (
{viewMode === VIEW_MODE_CHAT && commentsToDisplay.map((comment) => ( // if it's LBC and there is no balance, you can prompt to purchase LBC - : <> + : }}>Supporting content requires %lbc%} subtitle={ @@ -642,7 +642,7 @@ function WalletSendTip(props: Props) {
} - /> + /> ) } /> diff --git a/ui/page/settingsStripeCard/view.jsx b/ui/page/settingsStripeCard/view.jsx index 06768fb28..89dcb2d93 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -19,6 +19,9 @@ if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) { stripeEnvironment = 'live'; } +const APIS_DOWN_ERROR_RESPONSE = 'There was an error from the server, please let support know'; +const CARD_SETUP_ERROR_RESPONSE = 'There was an error getting your card setup, please let support know'; + // eslint-disable-next-line flowtype/no-types-missing-file-annotation type Props = { disabled: boolean, @@ -188,12 +191,10 @@ class SettingsStripeCard extends React.Component { }); // 500 error from the backend being down } else if (error === 'internal_apis_down') { - const displayString = 'There was an error from the server, please let support know'; - doToast({ message: displayString, isError: true }); + doToast({ message: APIS_DOWN_ERROR_RESPONSE, isError: true }); } else { // probably an error from stripe - const displayString = 'There was an error getting your card setup, please let support know'; - doToast({ message: displayString, isError: true }); + doToast({ message: CARD_SETUP_ERROR_RESPONSE, isError: true }); } }); }, 250); -- 2.45.2 From 78fc649b10c79b1197ecbd6490e5b28d72f17710 Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 10 Aug 2021 22:57:01 +0200 Subject: [PATCH 23/54] fixing flow errors --- ui/component/livestreamComments/view.jsx | 8 ++++---- ui/component/walletSendTip/view.jsx | 9 ++++----- 2 files changed, 8 insertions(+), 9 deletions(-) diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 931af568a..2e3c73cdb 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -163,7 +163,7 @@ export default function LivestreamComments(props: Props) {
{__('Live discussion')}
- {superChatsTotalAmount > 0 && ( + {(superChatsTotalAmount || 0) > 0 && (
{/* the superchats in chronological order button */} @@ -187,8 +187,8 @@ export default function LivestreamComments(props: Props) { })} label={ <> - / - {' '}{__('Tipped')} + / + {' '}{__('Tipped')} } onClick={function() { @@ -208,7 +208,7 @@ export default function LivestreamComments(props: Props) {
)}
- {viewMode === VIEW_MODE_CHAT && superChatsTotalAmount > 0 && superChatsByTipAmount && ( + {viewMode === VIEW_MODE_CHAT && superChatsByTipAmount && (superChatsTotalAmount || 0) > 0 && (
{superChatsByTipAmount.map((superChat: Comment) => ( diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 085f6a18b..4fd41e9f7 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -621,16 +621,15 @@ function WalletSendTip(props: Props) { )} // if it's LBC and there is no balance, you can prompt to purchase LBC - : - }}>Supporting content requires %lbc%} - subtitle={ + : }}>Supporting content requires %lbc%} + subtitle={ }}> With %lbc%, you can send tips to your favorite creators, or help boost their content for more people to see. } - actions={ + actions={
+ )} + + {/* @if TARGET='app' */} + {hasSynced ? ( +

+ {__('A backup of your wallet is synced with lbry.tv.')} + +

+ ) : ( +

+ {__('Your wallet is not currently synced with lbry.tv. You are in control of backing up your wallet.')} + +

+ )} + {/* @endif */} +
+
+ {(otherCount > WALLET_CONSOLIDATE_UTXOS || consolidateIsPending || consolidatingUtxos) && ( +

+ doUtxoConsolidate()} + disabled={operationPending} + label={ + consolidateIsPending || consolidatingUtxos ? __('Consolidating...') : __('Consolidate Now') + } + /> + ), + help: , + }} + > + Your wallet has a lot of change lying around. Consolidating will speed up your transactions. This could + take some time. %now%%help% + +

+ )} + + } + /> + ); +}; + +export default WalletBalance; diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 7c92b2e7d..5a9071539 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -2,6 +2,7 @@ import React from 'react'; import { withRouter } from 'react-router'; import WalletBalance from 'component/walletBalance'; +import WalletFiatBalance from 'component/WalletFiatBalance'; import TxoList from 'component/txoList'; import Page from 'component/page'; import Spinner from 'component/spinner'; @@ -18,32 +19,27 @@ const WalletPage = (props: Props) => { const tab = new URLSearchParams(props.location.search).get('tab'); - React.useEffect(()=>{ - if(tab === 'currency'){ + React.useEffect(() => { + // if (tab === 'currency') { + if (1 === 1) { document.getElementsByClassName('lbc-transactions')[0].style.display = 'none'; document.getElementsByClassName('fiat-transactions')[0].style.display = 'inline'; document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'underline'; } - },[]) - + }, []); const { location, totalBalance } = props; const { search } = location; const showIntro = totalBalance === 0; const loading = totalBalance === undefined; - const TAB_LBC_TRANSACTIONS = 'TabLBCTransactions'; - const TAB_FIAT_TRANSACTIONS = 'TabFiatTransactions'; - - const [activeTab, setActiveTab] = React.useState(TAB_LBC_TRANSACTIONS); - return ( {/* tabs to switch between fiat and lbc */}

{ document.getElementsByClassName('lbc-transactions')[0].style.display = 'inline'; document.getElementsByClassName('fiat-transactions')[0].style.display = 'none'; @@ -60,9 +56,8 @@ const WalletPage = (props: Props) => { document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'underline'; - }} - >Fiat Transactions

+ >USD Transactions
{/* if the transactions are loading */} { loading && ( @@ -87,7 +82,7 @@ const WalletPage = (props: Props) => { {( <>
-

Here's your fiat transactions

+
)} -- 2.45.2 From cd873486dadc3fa26d9b997af1f57bf15062968a Mon Sep 17 00:00:00 2001 From: Anthony Date: Wed, 28 Jul 2021 15:24:28 +0200 Subject: [PATCH 28/54] fixing naming --- ui/component/walletFiatBalance/view.jsx | 5 ++--- ui/page/wallet/view.jsx | 2 +- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index 074c76fe3..89737583f 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -78,12 +78,11 @@ const WalletBalance = (props: Props) => { actions={ <>

- - 413 Received Total + $413 Received Total

- $100 Already Withdrawn!!!! + $100 Withdrawn

+ + {/* view more section */} {detailsExpanded && (
@@ -137,48 +135,13 @@ const WalletBalance = (props: Props) => {
)} - {/* @if TARGET='app' */} - {hasSynced ? ( -

- {__('A backup of your wallet is synced with lbry.tv.')} - -

- ) : ( -

- {__('Your wallet is not currently synced with lbry.tv. You are in control of backing up your wallet.')} - -

- )} - {/* @endif */}
- {(otherCount > WALLET_CONSOLIDATE_UTXOS || consolidateIsPending || consolidatingUtxos) && ( -

- doUtxoConsolidate()} - disabled={operationPending} - label={ - consolidateIsPending || consolidatingUtxos ? __('Consolidating...') : __('Consolidate Now') - } - /> - ), - help: , - }} - > - Your wallet has a lot of change lying around. Consolidating will speed up your transactions. This could - take some time. %now%%help% - -

- )} } - /> + />} ); }; diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 6cb21ec41..82076f149 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -111,7 +111,7 @@ const WalletPage = (props: Props) => {
- + {/**/}
)} -- 2.45.2 From 01902f8e0b6fe170792822255314738c654ff68f Mon Sep 17 00:00:00 2001 From: Anthony Date: Wed, 28 Jul 2021 23:10:46 +0200 Subject: [PATCH 32/54] transaction listing working --- ui/component/walletFiatBalance/view.jsx | 4 +- ui/component/walletFiatTransactions/view.jsx | 70 ++++++++++++++++---- ui/page/wallet/view.jsx | 46 +++++++++++-- 3 files changed, 99 insertions(+), 21 deletions(-) diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index 284e27caa..7e099cbe4 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -136,8 +136,8 @@ const WalletBalance = (props: Props) => { )}
-
} diff --git a/ui/component/walletFiatTransactions/view.jsx b/ui/component/walletFiatTransactions/view.jsx index 7c68ee2b2..61ef1c43f 100644 --- a/ui/component/walletFiatTransactions/view.jsx +++ b/ui/component/walletFiatTransactions/view.jsx @@ -12,6 +12,7 @@ import LbcSymbol from 'component/common/lbc-symbol'; import I18nMessage from 'component/i18nMessage'; import { formatNumberWithCommas } from 'util/number'; import { Lbryio } from 'lbryinc'; +import moment from 'moment'; type Props = { balance: number, @@ -30,6 +31,7 @@ type Props = { massClaimIsPending: boolean, utxoCounts: { [string]: number }, accountDetails: any, + transactions: any, }; export const WALLET_CONSOLIDATE_UTXOS = 400; @@ -51,6 +53,9 @@ const WalletBalance = (props: Props) => { massClaimIsPending, utxoCounts, } = props; + + const accountTransactions = props.transactions; + const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); @@ -92,19 +97,58 @@ const WalletBalance = (props: Props) => { return ( 313 USD} - subtitle={ - totalLocked > 0 ? ( - - This is your remaining balance that can still be withdrawn to your bank account - - ) : ( - {__('Your total balance.')} - ) - } - body={ -

Hello!

- } + title={'Tip History'} + body={accountTransactions && accountTransactions.length > 0 && ( + <> +
+ + + + + + + + + + + + + + {accountTransactions && + accountTransactions.map((transaction) => ( + + + + + + + + + + ))} + +
{__('Date')}{<>{__('Receiving Channel Name')}}{__('Tip Location')}{__('Amount (USD)')} {__('Processing Fee')}{__('Odysee Fee')}{__('Received Amount')}
{moment(transaction.created_at).format('LLL')} + + ${transaction.tipped_amount / 100}${transaction.transaction_fee / 100}${transaction.application_fee / 100}${transaction.received_amount / 100}
+
+ + )} actions={ <> {accountStatusResponse && accountStatusResponse.charges_enabled &&

Charges Enabled: True

} diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 82076f149..8a470b8ea 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -19,18 +19,30 @@ type Props = { const WalletPage = (props: Props) => { console.log(props); - var environment = 'test'; + var stripeEnvironment = 'test'; const tab = new URLSearchParams(props.location.search).get('tab'); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); + const [accountTransactionResponse, setAccountTransactionResponse] = React.useState(); function getAccountStatus(){ return Lbryio.call( 'account', 'status', { - environment + environment: stripeEnvironment, + }, + 'post' + ); + } + + function getAccountTransactionsa(){ + return Lbryio.call( + 'account', + 'list', + { + environment: stripeEnvironment, }, 'post' ); @@ -38,11 +50,33 @@ const WalletPage = (props: Props) => { React.useEffect(() => { (async function(){ - const response = await getAccountStatus(); + try { + const response = await getAccountStatus(); + + console.log('account status'); + + console.log(response); + + setAccountStatusResponse(response); + + // TODO: some weird naming clash + const getAccountTransactions = await getAccountTransactionsa(); + + console.log('transactions'); + + setAccountTransactionResponse(getAccountTransactions) + + console.log(getAccountTransactions); + + } catch (err){ + + + + + + } - setAccountStatusResponse(response); - console.log(response); })(); }, []); @@ -111,7 +145,7 @@ const WalletPage = (props: Props) => {
- {/**/} +
)} -- 2.45.2 From f64f36ba38b39e41340a8ac9b2a6d54a239fee8a Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 13:27:01 +0200 Subject: [PATCH 33/54] add no transactions thing --- ui/component/walletFiatTransactions/view.jsx | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/ui/component/walletFiatTransactions/view.jsx b/ui/component/walletFiatTransactions/view.jsx index 61ef1c43f..ef1baf4aa 100644 --- a/ui/component/walletFiatTransactions/view.jsx +++ b/ui/component/walletFiatTransactions/view.jsx @@ -98,7 +98,7 @@ const WalletBalance = (props: Props) => { return ( 0 && ( + body={1 == 1 && ( <>
@@ -146,16 +146,10 @@ const WalletBalance = (props: Props) => { ))}
+ {!accountTransactions &&

No Transactions

}
)} - actions={ - <> - {accountStatusResponse && accountStatusResponse.charges_enabled &&

Charges Enabled: True

} - {accountStatusResponse &&

Total Received Tips: ${accountStatusResponse.total_tipped / 100}

} -

Hello

- - } /> ); }; -- 2.45.2 From c0e4f59f498089773508616f0093e9d073b64d9e Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 13:48:33 +0200 Subject: [PATCH 34/54] about to add a third tab --- ui/component/walletFiatTransactions/view.jsx | 10 +++++++++- ui/page/wallet/view.jsx | 4 ++-- 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/ui/component/walletFiatTransactions/view.jsx b/ui/component/walletFiatTransactions/view.jsx index ef1baf4aa..bd7447b69 100644 --- a/ui/component/walletFiatTransactions/view.jsx +++ b/ui/component/walletFiatTransactions/view.jsx @@ -54,7 +54,13 @@ const WalletBalance = (props: Props) => { utxoCounts, } = props; - const accountTransactions = props.transactions; + // receive transactions from parent component + let accountTransactions = props.transactions; + + // reverse so most recent payments come first + if(accountTransactions){ + accountTransactions = accountTransactions.reverse(); + } const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); @@ -86,6 +92,8 @@ const WalletBalance = (props: Props) => { } React.useEffect(() => { + + (async function(){ const response = await getAccountStatus(); diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 8a470b8ea..6ab10482b 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -108,7 +108,7 @@ const WalletPage = (props: Props) => { document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'underline'; document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'none'; }} - >LBC Transactions + >LBC Wallet

{ @@ -118,7 +118,7 @@ const WalletPage = (props: Props) => { document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'underline'; }} - >USD Transactions

+ >Account History
{/* if the transactions are loading */} { loading && ( -- 2.45.2 From 83531b22db1751bf42bd633388de46fc88c515ad Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 14:18:16 +0200 Subject: [PATCH 35/54] add third tab --- ui/page/wallet/view.jsx | 72 ++++++++++++++++++++++++++++++----------- 1 file changed, 54 insertions(+), 18 deletions(-) diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 6ab10482b..f324c2b55 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -80,14 +80,44 @@ const WalletPage = (props: Props) => { })(); }, []); - React.useEffect(() => { - // if (tab === 'currency') { - if (1 === 1) { - document.getElementsByClassName('lbc-transactions')[0].style.display = 'none'; - document.getElementsByClassName('fiat-transactions')[0].style.display = 'inline'; + function focusLBCTab(){ + document.getElementsByClassName('lbc-transactions')[0].style.display = 'inline'; + document.getElementsByClassName('fiat-transactions')[0].style.display = 'none'; + document.getElementsByClassName('payment-history-tab')[0].style.display = 'none'; - document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; - document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'underline'; + document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'underline'; + document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'none'; + document.getElementsByClassName('fiat-payment-history-switcher')[0].style.textDecoration = 'none'; + + } + + function focusAccountHistoryTab(){ + document.getElementsByClassName('lbc-transactions')[0].style.display = 'none'; + document.getElementsByClassName('payment-history-tab')[0].style.display = 'none'; + document.getElementsByClassName('fiat-transactions')[0].style.display = 'inline'; + + document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; + document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'underline'; + document.getElementsByClassName('fiat-payment-history-switcher')[0].style.textDecoration = 'none'; + + } + + function focusPaymentHistoryTab(){ + document.getElementsByClassName('lbc-transactions')[0].style.display = 'none'; + document.getElementsByClassName('fiat-transactions')[0].style.display = 'none'; + document.getElementsByClassName('payment-history-tab')[0].style.display = 'inline'; + + document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; + document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'none'; + document.getElementsByClassName('fiat-payment-history-switcher')[0].style.textDecoration = 'underline'; + + } + + // select the first tab + React.useEffect(() => { + // if (tab === 'account-history') { + if (1 === 1) { + focusAccountHistoryTab() } }, []); @@ -102,23 +132,22 @@ const WalletPage = (props: Props) => {

{ - document.getElementsByClassName('lbc-transactions')[0].style.display = 'inline'; - document.getElementsByClassName('fiat-transactions')[0].style.display = 'none'; - - document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'underline'; - document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'none'; + focusLBCTab(); }} >LBC Wallet

{ - document.getElementsByClassName('lbc-transactions')[0].style.display = 'none'; - document.getElementsByClassName('fiat-transactions')[0].style.display = 'inline'; - - document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; - document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'underline'; + focusAccountHistoryTab(); }} >Account History

+ +

{ + focusPaymentHistoryTab(); + }} + >Payment History

{/* if the transactions are loading */} { loading && ( @@ -149,6 +178,13 @@ const WalletPage = (props: Props) => {
)} + + <> +
+

Card Transaction History

+
+ + ); }; -- 2.45.2 From 39143227efbc4d927e1a39ea5ffa95fb78e03223 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 14:22:46 +0200 Subject: [PATCH 36/54] add card last 4 to transaction history --- ui/page/settingsStripeCard/view.jsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/ui/page/settingsStripeCard/view.jsx b/ui/page/settingsStripeCard/view.jsx index 89dcb2d93..7237a716c 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -459,6 +459,7 @@ class SettingsStripeCard extends React.Component { {<>{__('Receiving Channel Name')}} {__('Tip Location')} {__('Amount (USD)')} + {__('Card Last 4')} {__('Anonymous')} @@ -488,6 +489,7 @@ class SettingsStripeCard extends React.Component { /> ${transaction.tipped_amount / 100} + {userCardDetails && userCardDetails.lastFour} {transaction.private_tip ? 'Yes' : 'No'} ))} -- 2.45.2 From 232ca014550945686e7473adb1f7af6d51bc6bbb Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 17:45:02 +0200 Subject: [PATCH 37/54] some renaming --- .../index.js | 0 .../view.jsx | 0 .../walletFiatPaymentHistory/index.js | 40 +++++ .../walletFiatPaymentHistory/view.jsx | 165 ++++++++++++++++++ ui/page/wallet/view.jsx | 14 +- 5 files changed, 214 insertions(+), 5 deletions(-) rename ui/component/{walletFiatTransactions => walletFiatAccountHistory}/index.js (100%) rename ui/component/{walletFiatTransactions => walletFiatAccountHistory}/view.jsx (100%) create mode 100644 ui/component/walletFiatPaymentHistory/index.js create mode 100644 ui/component/walletFiatPaymentHistory/view.jsx diff --git a/ui/component/walletFiatTransactions/index.js b/ui/component/walletFiatAccountHistory/index.js similarity index 100% rename from ui/component/walletFiatTransactions/index.js rename to ui/component/walletFiatAccountHistory/index.js diff --git a/ui/component/walletFiatTransactions/view.jsx b/ui/component/walletFiatAccountHistory/view.jsx similarity index 100% rename from ui/component/walletFiatTransactions/view.jsx rename to ui/component/walletFiatAccountHistory/view.jsx diff --git a/ui/component/walletFiatPaymentHistory/index.js b/ui/component/walletFiatPaymentHistory/index.js new file mode 100644 index 000000000..83b0a30cf --- /dev/null +++ b/ui/component/walletFiatPaymentHistory/index.js @@ -0,0 +1,40 @@ +import { connect } from 'react-redux'; +import { + selectBalance, + selectClaimsBalance, + selectSupportsBalance, + selectTipsBalance, + selectIsFetchingUtxoCounts, + selectUtxoCounts, + doFetchUtxoCounts, + doUtxoConsolidate, + selectIsConsolidatingUtxos, + selectIsMassClaimingTips, + selectPendingConsolidateTxid, + selectPendingMassClaimTxid, +} from 'lbry-redux'; +import { doOpenModal } from 'redux/actions/app'; +import { selectSyncHash } from 'redux/selectors/sync'; +import { selectClaimedRewards } from 'redux/selectors/rewards'; +import WalletBalance from './view'; + +const select = state => ({ + balance: selectBalance(state), + claimsBalance: selectClaimsBalance(state) || 0, + supportsBalance: selectSupportsBalance(state) || 0, + tipsBalance: selectTipsBalance(state) || 0, + rewards: selectClaimedRewards(state), + hasSynced: Boolean(selectSyncHash(state)), + fetchingUtxoCounts: selectIsFetchingUtxoCounts(state), + consolidatingUtxos: selectIsConsolidatingUtxos(state), + massClaimingTips: selectIsMassClaimingTips(state), + utxoCounts: selectUtxoCounts(state), + consolidateIsPending: selectPendingConsolidateTxid(state), + massClaimIsPending: selectPendingMassClaimTxid(state), +}); + +export default connect(select, { + doOpenModal, + doFetchUtxoCounts, + doUtxoConsolidate, +})(WalletBalance); diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx new file mode 100644 index 000000000..bd7447b69 --- /dev/null +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -0,0 +1,165 @@ +// @flow +import * as ICONS from 'constants/icons'; +import * as MODALS from 'constants/modal_types'; +import * as PAGES from 'constants/pages'; +import React from 'react'; +import CreditAmount from 'component/common/credit-amount'; +import Button from 'component/button'; +import HelpLink from 'component/common/help-link'; +import Card from 'component/common/card'; +import Icon from 'component/common/icon'; +import LbcSymbol from 'component/common/lbc-symbol'; +import I18nMessage from 'component/i18nMessage'; +import { formatNumberWithCommas } from 'util/number'; +import { Lbryio } from 'lbryinc'; +import moment from 'moment'; + +type Props = { + balance: number, + totalBalance: number, + claimsBalance: number, + supportsBalance: number, + tipsBalance: number, + doOpenModal: (string) => void, + hasSynced: boolean, + doFetchUtxoCounts: () => void, + doUtxoConsolidate: () => void, + fetchingUtxoCounts: boolean, + consolidatingUtxos: boolean, + consolidateIsPending: boolean, + massClaimingTips: boolean, + massClaimIsPending: boolean, + utxoCounts: { [string]: number }, + accountDetails: any, + transactions: any, +}; + +export const WALLET_CONSOLIDATE_UTXOS = 400; +const LARGE_WALLET_BALANCE = 100; + +const WalletBalance = (props: Props) => { + const { + balance, + claimsBalance, + supportsBalance, + tipsBalance, + doOpenModal, + hasSynced, + doUtxoConsolidate, + doFetchUtxoCounts, + consolidatingUtxos, + consolidateIsPending, + massClaimingTips, + massClaimIsPending, + utxoCounts, + } = props; + + // receive transactions from parent component + let accountTransactions = props.transactions; + + // reverse so most recent payments come first + if(accountTransactions){ + accountTransactions = accountTransactions.reverse(); + } + + const [detailsExpanded, setDetailsExpanded] = React.useState(false); + const [accountStatusResponse, setAccountStatusResponse] = React.useState(); + + + const { other: otherCount = 0 } = utxoCounts || {}; + + const totalBalance = balance + tipsBalance + supportsBalance + claimsBalance; + const totalLocked = tipsBalance + claimsBalance + supportsBalance; + const operationPending = massClaimIsPending || massClaimingTips || consolidateIsPending || consolidatingUtxos; + + React.useEffect(() => { + if (balance > LARGE_WALLET_BALANCE && detailsExpanded) { + doFetchUtxoCounts(); + } + }, [doFetchUtxoCounts, balance, detailsExpanded]); + + var environment = 'test'; + + function getAccountStatus(){ + return Lbryio.call( + 'account', + 'status', + { + environment + }, + 'post' + ); + } + + React.useEffect(() => { + + + (async function(){ + const response = await getAccountStatus(); + + setAccountStatusResponse(response); + + console.log(response); + })(); + }, []); + + return ( + +
+ + + + + + + + + + + + + + {accountTransactions && + accountTransactions.map((transaction) => ( + + + + + + + + + + ))} + +
{__('Date')}{<>{__('Receiving Channel Name')}}{__('Tip Location')}{__('Amount (USD)')} {__('Processing Fee')}{__('Odysee Fee')}{__('Received Amount')}
{moment(transaction.created_at).format('LLL')} + + ${transaction.tipped_amount / 100}${transaction.transaction_fee / 100}${transaction.application_fee / 100}${transaction.received_amount / 100}
+ {!accountTransactions &&

No Transactions

} +
+ + )} + /> + ); +}; + +export default WalletBalance; diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index f324c2b55..fdd5441e3 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -3,7 +3,8 @@ import React from 'react'; import { withRouter } from 'react-router'; import WalletBalance from 'component/walletBalance'; import WalletFiatBalance from 'component/walletFiatBalance'; -import WalletFiatTransactions from 'component/walletFiatTransactions'; +import WalletFiatAccountHistory from 'component/walletFiatAccountHistory'; +import WalletFiatPaymentHistory from 'component/walletFiatPaymentHistory'; import TxoList from 'component/txoList'; import Page from 'component/page'; import Spinner from 'component/spinner'; @@ -116,8 +117,11 @@ const WalletPage = (props: Props) => { // select the first tab React.useEffect(() => { // if (tab === 'account-history') { - if (1 === 1) { - focusAccountHistoryTab() + if (1 === 2) { + focusAccountHistoryTab(); + // } else if (tab === 'payment-history'){ + } else if (1 === 1){ + focusPaymentHistoryTab(); } }, []); @@ -174,14 +178,14 @@ const WalletPage = (props: Props) => {
- +
)} <>
-

Card Transaction History

+
-- 2.45.2 From 70f597b664dde44c7b3a90921b6baf46ecdd8282 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 18:32:50 +0200 Subject: [PATCH 38/54] show payments successfully --- .../walletFiatPaymentBalance/index.js | 40 +++++ .../walletFiatPaymentBalance/view.jsx | 148 ++++++++++++++++++ .../walletFiatPaymentHistory/view.jsx | 135 +++++++++------- ui/page/wallet/view.jsx | 5 +- 4 files changed, 273 insertions(+), 55 deletions(-) create mode 100644 ui/component/walletFiatPaymentBalance/index.js create mode 100644 ui/component/walletFiatPaymentBalance/view.jsx diff --git a/ui/component/walletFiatPaymentBalance/index.js b/ui/component/walletFiatPaymentBalance/index.js new file mode 100644 index 000000000..83b0a30cf --- /dev/null +++ b/ui/component/walletFiatPaymentBalance/index.js @@ -0,0 +1,40 @@ +import { connect } from 'react-redux'; +import { + selectBalance, + selectClaimsBalance, + selectSupportsBalance, + selectTipsBalance, + selectIsFetchingUtxoCounts, + selectUtxoCounts, + doFetchUtxoCounts, + doUtxoConsolidate, + selectIsConsolidatingUtxos, + selectIsMassClaimingTips, + selectPendingConsolidateTxid, + selectPendingMassClaimTxid, +} from 'lbry-redux'; +import { doOpenModal } from 'redux/actions/app'; +import { selectSyncHash } from 'redux/selectors/sync'; +import { selectClaimedRewards } from 'redux/selectors/rewards'; +import WalletBalance from './view'; + +const select = state => ({ + balance: selectBalance(state), + claimsBalance: selectClaimsBalance(state) || 0, + supportsBalance: selectSupportsBalance(state) || 0, + tipsBalance: selectTipsBalance(state) || 0, + rewards: selectClaimedRewards(state), + hasSynced: Boolean(selectSyncHash(state)), + fetchingUtxoCounts: selectIsFetchingUtxoCounts(state), + consolidatingUtxos: selectIsConsolidatingUtxos(state), + massClaimingTips: selectIsMassClaimingTips(state), + utxoCounts: selectUtxoCounts(state), + consolidateIsPending: selectPendingConsolidateTxid(state), + massClaimIsPending: selectPendingMassClaimTxid(state), +}); + +export default connect(select, { + doOpenModal, + doFetchUtxoCounts, + doUtxoConsolidate, +})(WalletBalance); diff --git a/ui/component/walletFiatPaymentBalance/view.jsx b/ui/component/walletFiatPaymentBalance/view.jsx new file mode 100644 index 000000000..7e099cbe4 --- /dev/null +++ b/ui/component/walletFiatPaymentBalance/view.jsx @@ -0,0 +1,148 @@ +// @flow +import * as ICONS from 'constants/icons'; +import * as MODALS from 'constants/modal_types'; +import * as PAGES from 'constants/pages'; +import React from 'react'; +import CreditAmount from 'component/common/credit-amount'; +import Button from 'component/button'; +import HelpLink from 'component/common/help-link'; +import Card from 'component/common/card'; +import Icon from 'component/common/icon'; +import LbcSymbol from 'component/common/lbc-symbol'; +import I18nMessage from 'component/i18nMessage'; +import { formatNumberWithCommas } from 'util/number'; + +type Props = { + balance: number, + totalBalance: number, + claimsBalance: number, + supportsBalance: number, + tipsBalance: number, + doOpenModal: (string) => void, + hasSynced: boolean, + doFetchUtxoCounts: () => void, + doUtxoConsolidate: () => void, + fetchingUtxoCounts: boolean, + consolidatingUtxos: boolean, + consolidateIsPending: boolean, + massClaimingTips: boolean, + massClaimIsPending: boolean, + utxoCounts: { [string]: number }, + accountDetails: any, +}; + +export const WALLET_CONSOLIDATE_UTXOS = 400; +const LARGE_WALLET_BALANCE = 100; + +const WalletBalance = (props: Props) => { + const { + balance, + claimsBalance, + supportsBalance, + tipsBalance, + doOpenModal, + hasSynced, + doUtxoConsolidate, + doFetchUtxoCounts, + consolidatingUtxos, + consolidateIsPending, + massClaimingTips, + massClaimIsPending, + utxoCounts, + accountDetails, + } = props; + + console.log('account details'); + console.log(accountDetails); + + const [detailsExpanded, setDetailsExpanded] = React.useState(false); + + const { other: otherCount = 0 } = utxoCounts || {}; + + const totalBalance = balance + tipsBalance + supportsBalance + claimsBalance; + const totalLocked = tipsBalance + claimsBalance + supportsBalance; + const operationPending = massClaimIsPending || massClaimingTips || consolidateIsPending || consolidatingUtxos; + + React.useEffect(() => { + if (balance > LARGE_WALLET_BALANCE && detailsExpanded) { + doFetchUtxoCounts(); + } + }, [doFetchUtxoCounts, balance, detailsExpanded]); + + return ( + <>{1 == 1 && {accountDetails && accountDetails.total_received_unpaid/100} USD} + subtitle={ + + This is your remaining balance that can still be withdrawn to your bank account + + } + actions={ + <> +

+ ${accountDetails && accountDetails.total_tipped / 100 } Received Total +

+ +

+ ${accountDetails && accountDetails.total_paid_out/100 } Withdrawn +

+ + {/* view more section */} + {detailsExpanded && ( +
+
+
+ {__('...earned from others')} + ({__('Unlock to spend')}) +
+
+ + {Boolean(tipsBalance) && ( +
+ +
+ {__('...on initial publishes')} + ({__('Delete or edit past content to spend')}) +
+
+ +
+ +
+ {__('...supporting content')} + ({__('Delete supports to spend')}) +
+
+ +
+
+
+ )} + +
+
+ + } + />} + ); +}; + +export default WalletBalance; diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx index bd7447b69..4f2847b6a 100644 --- a/ui/component/walletFiatPaymentHistory/view.jsx +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -64,6 +64,9 @@ const WalletBalance = (props: Props) => { const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); + const [paymentHistoryTransactions, setPaymentHistoryTransactions] = React.useState(); + + const [lastFour, setLastFour] = React.useState(); const { other: otherCount = 0 } = utxoCounts || {}; @@ -91,13 +94,40 @@ const WalletBalance = (props: Props) => { ); } + function getPaymentHistory() { + return Lbryio.call( + 'customer', + 'list', + { + environment, + }, + 'post' + )}; + + function getCustomerStatus(){ + return Lbryio.call( + 'customer', + 'status', + { + environment, + }, + 'post' + ) + } + React.useEffect(() => { (async function(){ - const response = await getAccountStatus(); + let response = await getPaymentHistory(); - setAccountStatusResponse(response); + const customerStatusResponse = await getCustomerStatus(); + + setLastFour(customerStatusResponse.PaymentMethods[0].card.last4); + + if (response.length > 10) response.length = 10; + + setPaymentHistoryTransactions(response); console.log(response); })(); @@ -105,59 +135,56 @@ const WalletBalance = (props: Props) => { return ( -
- - - - - - - - - - + title={__('Payment History')} + body={ + <> +
+
{__('Date')}{<>{__('Receiving Channel Name')}}{__('Tip Location')}{__('Amount (USD)')} {__('Processing Fee')}{__('Odysee Fee')}{__('Received Amount')}
+ + + + + + + + + + + + {paymentHistoryTransactions && + paymentHistoryTransactions.reverse().map((transaction) => ( + + + + + + + - - - {accountTransactions && - accountTransactions.map((transaction) => ( - - - - - - - - - - ))} - -
{__('Date')}{<>{__('Receiving Channel Name')}}{__('Tip Location')}{__('Amount (USD)')} {__('Card Last 4')}{__('Anonymous')}
{moment(transaction.created_at).format('LLL')} + + ${transaction.tipped_amount / 100}{lastFour}{transaction.private_tip ? 'Yes' : 'No'}
{moment(transaction.created_at).format('LLL')} - - ${transaction.tipped_amount / 100}${transaction.transaction_fee / 100}${transaction.application_fee / 100}${transaction.received_amount / 100}
- {!accountTransactions &&

No Transactions

} -
- - )} + ))} + + +
+ + } /> ); }; diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index fdd5441e3..d35c113b2 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -3,6 +3,7 @@ import React from 'react'; import { withRouter } from 'react-router'; import WalletBalance from 'component/walletBalance'; import WalletFiatBalance from 'component/walletFiatBalance'; +import WalletFiatBalance from 'component/walletFiatBalance'; import WalletFiatAccountHistory from 'component/walletFiatAccountHistory'; import WalletFiatPaymentHistory from 'component/walletFiatPaymentHistory'; import TxoList from 'component/txoList'; @@ -177,7 +178,7 @@ const WalletPage = (props: Props) => { <>
-
+
@@ -185,6 +186,8 @@ const WalletPage = (props: Props) => { <>
+ +
-- 2.45.2 From 48b5fe3c21cea1a182c28a24b1d87f59d99e8778 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 18:44:32 +0200 Subject: [PATCH 39/54] show filler for subscriptions --- ui/component/walletFiatBalance/view.jsx | 12 --- .../walletFiatPaymentHistory/view.jsx | 98 +++++++++++++------ ui/page/wallet/view.jsx | 4 +- 3 files changed, 71 insertions(+), 43 deletions(-) diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index 7e099cbe4..0d22daa1d 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -57,18 +57,6 @@ const WalletBalance = (props: Props) => { const [detailsExpanded, setDetailsExpanded] = React.useState(false); - const { other: otherCount = 0 } = utxoCounts || {}; - - const totalBalance = balance + tipsBalance + supportsBalance + claimsBalance; - const totalLocked = tipsBalance + claimsBalance + supportsBalance; - const operationPending = massClaimIsPending || massClaimingTips || consolidateIsPending || consolidatingUtxos; - - React.useEffect(() => { - if (balance > LARGE_WALLET_BALANCE && detailsExpanded) { - doFetchUtxoCounts(); - } - }, [doFetchUtxoCounts, balance, detailsExpanded]); - return ( <>{1 == 1 && {accountDetails && accountDetails.total_received_unpaid/100} USD} diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx index 4f2847b6a..40f5f520d 100644 --- a/ui/component/walletFiatPaymentHistory/view.jsx +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -65,35 +65,13 @@ const WalletBalance = (props: Props) => { const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); const [paymentHistoryTransactions, setPaymentHistoryTransactions] = React.useState(); + const [subscriptions, setSubscriptions] = React.useState(); + const [lastFour, setLastFour] = React.useState(); - - const { other: otherCount = 0 } = utxoCounts || {}; - - const totalBalance = balance + tipsBalance + supportsBalance + claimsBalance; - const totalLocked = tipsBalance + claimsBalance + supportsBalance; - const operationPending = massClaimIsPending || massClaimingTips || consolidateIsPending || consolidatingUtxos; - - React.useEffect(() => { - if (balance > LARGE_WALLET_BALANCE && detailsExpanded) { - doFetchUtxoCounts(); - } - }, [doFetchUtxoCounts, balance, detailsExpanded]); - var environment = 'test'; - function getAccountStatus(){ - return Lbryio.call( - 'account', - 'status', - { - environment - }, - 'post' - ); - } - function getPaymentHistory() { return Lbryio.call( 'customer', @@ -116,8 +94,6 @@ const WalletBalance = (props: Props) => { } React.useEffect(() => { - - (async function(){ let response = await getPaymentHistory(); @@ -129,13 +105,76 @@ const WalletBalance = (props: Props) => { setPaymentHistoryTransactions(response); + const subscriptions = [...response]; + + if(subscriptions.length > 2){ + subscriptions.length = 2 + setSubscriptions(subscriptions) + } else { + setSubscriptions([]) + } + console.log(response); })(); }, []); return ( + <> + +
+ + + + + + + + + + + + + {paymentHistoryTransactions && + paymentHistoryTransactions.reverse().map((transaction) => ( + + + + + + + + + ))} + +
{__('Date')}{<>{__('Receiving Channel Name')}}{__('Tip Location')}{__('Amount (USD)')} {__('Card Last 4')}{__('Anonymous')}
{moment(transaction.created_at).format('LLL')} + + ${transaction.tipped_amount / 100}{lastFour}{transaction.private_tip ? 'Yes' : 'No'}
+
+ + } + /> +
@@ -151,8 +190,8 @@ const WalletBalance = (props: Props) => { - {paymentHistoryTransactions && - paymentHistoryTransactions.reverse().map((transaction) => ( + {subscriptions && + subscriptions.reverse().map((transaction) => ( {moment(transaction.created_at).format('LLL')} @@ -186,6 +225,7 @@ const WalletBalance = (props: Props) => { } /> + ); }; diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index d35c113b2..2342f2c18 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -3,7 +3,7 @@ import React from 'react'; import { withRouter } from 'react-router'; import WalletBalance from 'component/walletBalance'; import WalletFiatBalance from 'component/walletFiatBalance'; -import WalletFiatBalance from 'component/walletFiatBalance'; +import WalletFiatPaymentBalance from 'component/walletFiatPaymentBalance'; import WalletFiatAccountHistory from 'component/walletFiatAccountHistory'; import WalletFiatPaymentHistory from 'component/walletFiatPaymentHistory'; import TxoList from 'component/txoList'; @@ -186,7 +186,7 @@ const WalletPage = (props: Props) => { <>
- +
-- 2.45.2 From 70394db8f799ae3e278fd41c5116190fff4dc862 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 18:49:07 +0200 Subject: [PATCH 40/54] display if no transactions or subs --- ui/component/walletFiatPaymentHistory/view.jsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx index 40f5f520d..501e2cac6 100644 --- a/ui/component/walletFiatPaymentHistory/view.jsx +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -109,7 +109,7 @@ const WalletBalance = (props: Props) => { if(subscriptions.length > 2){ subscriptions.length = 2 - setSubscriptions(subscriptions) + setSubscriptions([]) } else { setSubscriptions([]) } @@ -168,6 +168,7 @@ const WalletBalance = (props: Props) => { ))} + {(!paymentHistoryTransactions || paymentHistoryTransactions.length === 0) &&

No Transactions

}
} @@ -221,6 +222,7 @@ const WalletBalance = (props: Props) => { ))} + {(!subscriptions || subscriptions.length === 0) &&

No Subscriptions

}
} -- 2.45.2 From 0b07d9afc087939c41d7618a6527b83929615f1b Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 19:09:30 +0200 Subject: [PATCH 41/54] working but in the wrong component --- ui/component/walletFiatBalance/view.jsx | 12 ------- .../walletFiatPaymentHistory/view.jsx | 34 ++++++++++--------- 2 files changed, 18 insertions(+), 28 deletions(-) diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index 0d22daa1d..93bb1b747 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -31,24 +31,12 @@ type Props = { accountDetails: any, }; -export const WALLET_CONSOLIDATE_UTXOS = 400; -const LARGE_WALLET_BALANCE = 100; - const WalletBalance = (props: Props) => { const { - balance, claimsBalance, supportsBalance, tipsBalance, doOpenModal, - hasSynced, - doUtxoConsolidate, - doFetchUtxoCounts, - consolidatingUtxos, - consolidateIsPending, - massClaimingTips, - massClaimIsPending, - utxoCounts, accountDetails, } = props; diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx index 501e2cac6..33d30a500 100644 --- a/ui/component/walletFiatPaymentHistory/view.jsx +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -32,31 +32,23 @@ type Props = { utxoCounts: { [string]: number }, accountDetails: any, transactions: any, + totalTippedAmount: number, }; -export const WALLET_CONSOLIDATE_UTXOS = 400; -const LARGE_WALLET_BALANCE = 100; - const WalletBalance = (props: Props) => { const { - balance, - claimsBalance, - supportsBalance, - tipsBalance, - doOpenModal, - hasSynced, - doUtxoConsolidate, - doFetchUtxoCounts, - consolidatingUtxos, - consolidateIsPending, - massClaimingTips, - massClaimIsPending, - utxoCounts, + } = props; // receive transactions from parent component let accountTransactions = props.transactions; + // let totalTippedAmount = props.totalTippedAmount; + + // totalTippedAmount = 0; + + + // reverse so most recent payments come first if(accountTransactions){ accountTransactions = accountTransactions.reverse(); @@ -66,6 +58,7 @@ const WalletBalance = (props: Props) => { const [accountStatusResponse, setAccountStatusResponse] = React.useState(); const [paymentHistoryTransactions, setPaymentHistoryTransactions] = React.useState(); const [subscriptions, setSubscriptions] = React.useState(); + const [totalTippedAmount, setTotalTippedAmount] = React.useState(0); const [lastFour, setLastFour] = React.useState(); @@ -99,6 +92,14 @@ const WalletBalance = (props: Props) => { const customerStatusResponse = await getCustomerStatus(); + let totalTippedAmount = 0; + + for(const transaction of response){ + totalTippedAmount = totalTippedAmount + transaction.tipped_amount + } + + setTotalTippedAmount(totalTippedAmount / 100); + setLastFour(customerStatusResponse.PaymentMethods[0].card.last4); if (response.length > 10) response.length = 10; @@ -124,6 +125,7 @@ const WalletBalance = (props: Props) => { title={__('Payment History')} body={ <> +

{totalTippedAmount}

-- 2.45.2 From 497f37ae4cd43641ac6721d6c96803f2d2d5fce0 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 19:29:05 +0200 Subject: [PATCH 42/54] approaching something thats working --- .../walletFiatAccountHistory/view.jsx | 30 +-------- .../walletFiatPaymentHistory/view.jsx | 62 ++++++++----------- ui/page/wallet/view.jsx | 40 +++++++++--- 3 files changed, 60 insertions(+), 72 deletions(-) diff --git a/ui/component/walletFiatAccountHistory/view.jsx b/ui/component/walletFiatAccountHistory/view.jsx index bd7447b69..bc8b2219a 100644 --- a/ui/component/walletFiatAccountHistory/view.jsx +++ b/ui/component/walletFiatAccountHistory/view.jsx @@ -34,24 +34,9 @@ type Props = { transactions: any, }; -export const WALLET_CONSOLIDATE_UTXOS = 400; -const LARGE_WALLET_BALANCE = 100; - const WalletBalance = (props: Props) => { const { - balance, - claimsBalance, - supportsBalance, - tipsBalance, - doOpenModal, - hasSynced, - doUtxoConsolidate, - doFetchUtxoCounts, - consolidatingUtxos, - consolidateIsPending, - massClaimingTips, - massClaimIsPending, - utxoCounts, + } = props; // receive transactions from parent component @@ -65,19 +50,6 @@ const WalletBalance = (props: Props) => { const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); - - const { other: otherCount = 0 } = utxoCounts || {}; - - const totalBalance = balance + tipsBalance + supportsBalance + claimsBalance; - const totalLocked = tipsBalance + claimsBalance + supportsBalance; - const operationPending = massClaimIsPending || massClaimingTips || consolidateIsPending || consolidatingUtxos; - - React.useEffect(() => { - if (balance > LARGE_WALLET_BALANCE && detailsExpanded) { - doFetchUtxoCounts(); - } - }, [doFetchUtxoCounts, balance, detailsExpanded]); - var environment = 'test'; function getAccountStatus(){ diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx index 33d30a500..0e13e366c 100644 --- a/ui/component/walletFiatPaymentHistory/view.jsx +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -15,21 +15,6 @@ import { Lbryio } from 'lbryinc'; import moment from 'moment'; type Props = { - balance: number, - totalBalance: number, - claimsBalance: number, - supportsBalance: number, - tipsBalance: number, - doOpenModal: (string) => void, - hasSynced: boolean, - doFetchUtxoCounts: () => void, - doUtxoConsolidate: () => void, - fetchingUtxoCounts: boolean, - consolidatingUtxos: boolean, - consolidateIsPending: boolean, - massClaimingTips: boolean, - massClaimIsPending: boolean, - utxoCounts: { [string]: number }, accountDetails: any, transactions: any, totalTippedAmount: number, @@ -43,6 +28,9 @@ const WalletBalance = (props: Props) => { // receive transactions from parent component let accountTransactions = props.transactions; + console.log('heres transactions') + console.log(accountTransactions); + // let totalTippedAmount = props.totalTippedAmount; // totalTippedAmount = 0; @@ -88,34 +76,38 @@ const WalletBalance = (props: Props) => { React.useEffect(() => { (async function(){ - let response = await getPaymentHistory(); + let response = accountTransactions; - const customerStatusResponse = await getCustomerStatus(); + console.log('payment transactions'); + console.log(response); - let totalTippedAmount = 0; + const customerStatusResponse = await getCustomerStatus(); - for(const transaction of response){ - totalTippedAmount = totalTippedAmount + transaction.tipped_amount - } + let totalTippedAmount = 0; - setTotalTippedAmount(totalTippedAmount / 100); + for(const transaction of response){ + totalTippedAmount = totalTippedAmount + transaction.tipped_amount + } - setLastFour(customerStatusResponse.PaymentMethods[0].card.last4); + setTotalTippedAmount(totalTippedAmount / 100); - if (response.length > 10) response.length = 10; + setLastFour(customerStatusResponse.PaymentMethods[0].card.last4); - setPaymentHistoryTransactions(response); + if (response.length > 10) response.length = 10; - const subscriptions = [...response]; + setPaymentHistoryTransactions(response); - if(subscriptions.length > 2){ - subscriptions.length = 2 - setSubscriptions([]) - } else { - setSubscriptions([]) - } + const subscriptions = [...response]; + + if(subscriptions.length > 2){ + subscriptions.length = 2 + setSubscriptions([]) + } else { + setSubscriptions([]) + } + + console.log(response); - console.log(response); })(); }, []); @@ -139,8 +131,8 @@ const WalletBalance = (props: Props) => { - {paymentHistoryTransactions && - paymentHistoryTransactions.reverse().map((transaction) => ( + {accountTransactions && + accountTransactions.map((transaction) => (
{moment(transaction.created_at).format('LLL')} diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 2342f2c18..52b6c277f 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -22,11 +22,34 @@ const WalletPage = (props: Props) => { console.log(props); var stripeEnvironment = 'test'; + var environment = 'test'; const tab = new URLSearchParams(props.location.search).get('tab'); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); const [accountTransactionResponse, setAccountTransactionResponse] = React.useState(); + const [customerTransactions, setCustomerTransactions] = React.useState(); + + function getPaymentHistory() { + return Lbryio.call( + 'customer', + 'list', + { + environment: stripeEnvironment, + }, + 'post' + )}; + + function getCustomerStatus(){ + return Lbryio.call( + 'customer', + 'status', + { + environment: stripeEnvironment, + }, + 'post' + ) + } function getAccountStatus(){ return Lbryio.call( @@ -55,13 +78,19 @@ const WalletPage = (props: Props) => { try { const response = await getAccountStatus(); + const customerTransactionResponse = await getPaymentHistory(); + + console.log(customerTransactionResponse); + + setCustomerTransactions(customerTransactionResponse) + console.log('account status'); console.log(response); setAccountStatusResponse(response); - // TODO: some weird naming clash + // TODO: some weird naming clash hence getAccountTransactionsa const getAccountTransactions = await getAccountTransactionsa(); console.log('transactions'); @@ -72,13 +101,7 @@ const WalletPage = (props: Props) => { } catch (err){ - - - - } - - })(); }, []); @@ -185,10 +208,11 @@ const WalletPage = (props: Props) => { )} <> + {/* fiat payment history for tips made by user */}
- +
-- 2.45.2 From bff0cd9a9988b5eb687915783562b0a273e5d8cc Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 19:45:16 +0200 Subject: [PATCH 43/54] showing total tipped amount --- .../walletFiatPaymentBalance/view.jsx | 53 ++++--------------- .../walletFiatPaymentHistory/view.jsx | 15 ++---- ui/page/wallet/view.jsx | 15 +++++- 3 files changed, 25 insertions(+), 58 deletions(-) diff --git a/ui/component/walletFiatPaymentBalance/view.jsx b/ui/component/walletFiatPaymentBalance/view.jsx index 7e099cbe4..b3ccd9a92 100644 --- a/ui/component/walletFiatPaymentBalance/view.jsx +++ b/ui/component/walletFiatPaymentBalance/view.jsx @@ -13,68 +13,33 @@ import I18nMessage from 'component/i18nMessage'; import { formatNumberWithCommas } from 'util/number'; type Props = { - balance: number, - totalBalance: number, - claimsBalance: number, - supportsBalance: number, - tipsBalance: number, - doOpenModal: (string) => void, - hasSynced: boolean, - doFetchUtxoCounts: () => void, - doUtxoConsolidate: () => void, - fetchingUtxoCounts: boolean, - consolidatingUtxos: boolean, - consolidateIsPending: boolean, - massClaimingTips: boolean, - massClaimIsPending: boolean, - utxoCounts: { [string]: number }, + totalTippedAmount: number, accountDetails: any, }; -export const WALLET_CONSOLIDATE_UTXOS = 400; -const LARGE_WALLET_BALANCE = 100; + const WalletBalance = (props: Props) => { const { - balance, - claimsBalance, - supportsBalance, - tipsBalance, - doOpenModal, - hasSynced, - doUtxoConsolidate, - doFetchUtxoCounts, - consolidatingUtxos, - consolidateIsPending, - massClaimingTips, - massClaimIsPending, - utxoCounts, accountDetails, + totalTippedAmount, } = props; - console.log('account details'); - console.log(accountDetails); - const [detailsExpanded, setDetailsExpanded] = React.useState(false); - const { other: otherCount = 0 } = utxoCounts || {}; - const totalBalance = balance + tipsBalance + supportsBalance + claimsBalance; - const totalLocked = tipsBalance + claimsBalance + supportsBalance; - const operationPending = massClaimIsPending || massClaimingTips || consolidateIsPending || consolidatingUtxos; + console.log('total tipped amount') + console.log(totalTippedAmount) - React.useEffect(() => { - if (balance > LARGE_WALLET_BALANCE && detailsExpanded) { - doFetchUtxoCounts(); - } - }, [doFetchUtxoCounts, balance, detailsExpanded]); + // console.log('account details'); + // console.log(accountDetails); return ( <>{1 == 1 && {accountDetails && accountDetails.total_received_unpaid/100} USD} + title={<>{totalTippedAmount} USD} subtitle={ - This is your remaining balance that can still be withdrawn to your bank account + The total amount you have tipped to different creators } actions={ diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx index 0e13e366c..575330223 100644 --- a/ui/component/walletFiatPaymentHistory/view.jsx +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -83,23 +83,15 @@ const WalletBalance = (props: Props) => { const customerStatusResponse = await getCustomerStatus(); - let totalTippedAmount = 0; - - for(const transaction of response){ - totalTippedAmount = totalTippedAmount + transaction.tipped_amount - } - - setTotalTippedAmount(totalTippedAmount / 100); - setLastFour(customerStatusResponse.PaymentMethods[0].card.last4); - if (response.length > 10) response.length = 10; + if (response && response.length > 10) response.length = 10; setPaymentHistoryTransactions(response); const subscriptions = [...response]; - if(subscriptions.length > 2){ + if(subscriptions && subscriptions.length > 2){ subscriptions.length = 2 setSubscriptions([]) } else { @@ -109,7 +101,7 @@ const WalletBalance = (props: Props) => { console.log(response); })(); - }, []); + }, [accountTransactions]); return ( <> @@ -117,7 +109,6 @@ const WalletBalance = (props: Props) => { title={__('Payment History')} body={ <> -

{totalTippedAmount}

diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 52b6c277f..72d5f67cf 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -29,6 +29,8 @@ const WalletPage = (props: Props) => { const [accountStatusResponse, setAccountStatusResponse] = React.useState(); const [accountTransactionResponse, setAccountTransactionResponse] = React.useState(); const [customerTransactions, setCustomerTransactions] = React.useState(); + const [totalTippedAmount, setTotalTippedAmount] = React.useState(0); + function getPaymentHistory() { return Lbryio.call( @@ -78,8 +80,17 @@ const WalletPage = (props: Props) => { try { const response = await getAccountStatus(); + // get card payments customer has made const customerTransactionResponse = await getPaymentHistory(); + let totalTippedAmount = 0; + + for(const transaction of customerTransactionResponse){ + totalTippedAmount = totalTippedAmount + transaction.tipped_amount + } + + setTotalTippedAmount(totalTippedAmount / 100); + console.log(customerTransactionResponse); setCustomerTransactions(customerTransactionResponse) @@ -100,7 +111,7 @@ const WalletPage = (props: Props) => { console.log(getAccountTransactions); } catch (err){ - + console.log(err); } })(); }, []); @@ -210,7 +221,7 @@ const WalletPage = (props: Props) => { <> {/* fiat payment history for tips made by user */}
- +
-- 2.45.2 From d98eabbcb9f49a0d007e4f7bbb6be6241f06b2cc Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 20:41:26 +0200 Subject: [PATCH 44/54] about to add last couple features --- ui/component/walletFiatBalance/view.jsx | 29 +++---------------- .../walletFiatPaymentBalance/view.jsx | 9 +++--- 2 files changed, 8 insertions(+), 30 deletions(-) diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index 93bb1b747..b471da0e5 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -13,30 +13,11 @@ import I18nMessage from 'component/i18nMessage'; import { formatNumberWithCommas } from 'util/number'; type Props = { - balance: number, - totalBalance: number, - claimsBalance: number, - supportsBalance: number, - tipsBalance: number, - doOpenModal: (string) => void, - hasSynced: boolean, - doFetchUtxoCounts: () => void, - doUtxoConsolidate: () => void, - fetchingUtxoCounts: boolean, - consolidatingUtxos: boolean, - consolidateIsPending: boolean, - massClaimingTips: boolean, - massClaimIsPending: boolean, - utxoCounts: { [string]: number }, accountDetails: any, }; const WalletBalance = (props: Props) => { const { - claimsBalance, - supportsBalance, - tipsBalance, - doOpenModal, accountDetails, } = props; @@ -79,16 +60,14 @@ const WalletBalance = (props: Props) => {
- {Boolean(tipsBalance) && ( + {Boolean(1) && (
@@ -97,7 +76,7 @@ const WalletBalance = (props: Props) => { ({__('Delete or edit past content to spend')})
- +
@@ -105,7 +84,7 @@ const WalletBalance = (props: Props) => { ({__('Delete supports to spend')})
- +
diff --git a/ui/component/walletFiatPaymentBalance/view.jsx b/ui/component/walletFiatPaymentBalance/view.jsx index b3ccd9a92..825a4aed1 100644 --- a/ui/component/walletFiatPaymentBalance/view.jsx +++ b/ui/component/walletFiatPaymentBalance/view.jsx @@ -68,16 +68,15 @@ const WalletBalance = (props: Props) => {
- {Boolean(tipsBalance) && ( + {Boolean(1) && (
@@ -86,7 +85,7 @@ const WalletBalance = (props: Props) => { ({__('Delete or edit past content to spend')})
- +
@@ -94,7 +93,7 @@ const WalletBalance = (props: Props) => { ({__('Delete supports to spend')})
- +
-- 2.45.2 From 982f30c01d8be8f175703fa06bcf80d55be6ac2e Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 21:01:21 +0200 Subject: [PATCH 45/54] cleanup --- ui/component/walletFiatBalance/view.jsx | 6 ++-- .../walletFiatPaymentBalance/view.jsx | 4 +-- ui/page/wallet/view.jsx | 34 +++++++++---------- 3 files changed, 22 insertions(+), 22 deletions(-) diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index b471da0e5..986f6b239 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -28,7 +28,7 @@ const WalletBalance = (props: Props) => { return ( <>{1 == 1 && {accountDetails && accountDetails.total_received_unpaid/100} USD} + title={<>{accountDetails && accountDetails.total_received_unpaid/100} || 0 USD} subtitle={ This is your remaining balance that can still be withdrawn to your bank account @@ -37,11 +37,11 @@ const WalletBalance = (props: Props) => { actions={ <>

- ${accountDetails && accountDetails.total_tipped / 100 } Received Total + ${accountDetails && accountDetails.total_tipped / 100 || 0} Received Total

- ${accountDetails && accountDetails.total_paid_out/100 } Withdrawn + ${accountDetails && accountDetails.total_paid_out/100 || 0} Withdrawn

- {(!paymentHistoryTransactions || paymentHistoryTransactions.length === 0) &&

No Transactions

} + {(!accountTransactions || accountTransactions.length === 0) &&

No Transactions

}
} diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 97b95cbdf..c66a27b89 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -75,11 +75,30 @@ const WalletPage = (props: Props) => { ); } + + // calculate account transactions section React.useEffect(() => { (async function(){ try { const response = await getAccountStatus(); + setAccountStatusResponse(response); + + // TODO: some weird naming clash hence getAccountTransactionsa + const getAccountTransactions = await getAccountTransactionsa(); + + setAccountTransactionResponse(getAccountTransactions) + + } catch (err){ + console.log(err); + } + })(); + }, []); + + // populate customer payment data + React.useEffect(() => { + (async function(){ + try { // get card payments customer has made const customerTransactionResponse = await getPaymentHistory(); @@ -91,25 +110,8 @@ const WalletPage = (props: Props) => { setTotalTippedAmount(totalTippedAmount / 100); - console.log(customerTransactionResponse); - setCustomerTransactions(customerTransactionResponse) - console.log('account status'); - - console.log(response); - - setAccountStatusResponse(response); - - // TODO: some weird naming clash hence getAccountTransactionsa - const getAccountTransactions = await getAccountTransactionsa(); - - console.log('transactions'); - - setAccountTransactionResponse(getAccountTransactions) - - console.log(getAccountTransactions); - } catch (err){ console.log(err); } -- 2.45.2 From 0d1d173fc31153d481b0a48b607e8143da507c5d Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 22:09:16 +0200 Subject: [PATCH 47/54] adding last features --- .../walletFiatAccountHistory/view.jsx | 4 ++++ ui/component/walletFiatBalance/view.jsx | 24 +++++++++---------- .../walletFiatPaymentBalance/view.jsx | 20 ++++++++-------- .../walletFiatPaymentHistory/view.jsx | 2 +- 4 files changed, 27 insertions(+), 23 deletions(-) diff --git a/ui/component/walletFiatAccountHistory/view.jsx b/ui/component/walletFiatAccountHistory/view.jsx index bc8b2219a..0e06a4a7d 100644 --- a/ui/component/walletFiatAccountHistory/view.jsx +++ b/ui/component/walletFiatAccountHistory/view.jsx @@ -47,6 +47,10 @@ const WalletBalance = (props: Props) => { accountTransactions = accountTransactions.reverse(); } + if(accountTransactions && accountTransactions.length > 10 ){ + accountTransactions.length = 10; + } + const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index c91ad98b7..a802599ea 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -37,7 +37,7 @@ const WalletBalance = (props: Props) => { actions={ <>

- ${accountDetails && accountDetails.total_tipped / 100 || 0} Received Total + ${accountDetails && accountDetails.total_tipped / 100 || 0} Total Received Tips

@@ -55,8 +55,8 @@ const WalletBalance = (props: Props) => {
- {__('...earned from others')} - ({__('Unlock to spend')}) + {__('Earned from uploads')} + {/*({__('Earned from channel page')})*/}
@@ -72,20 +72,20 @@ const WalletBalance = (props: Props) => {
- {__('...on initial publishes')} - ({__('Delete or edit past content to spend')}) + {__('Earned from channel page')} + {/*({__('Delete or edit past content to spend')})*/}
-
- {__('...supporting content')} - ({__('Delete supports to spend')}) -
-
- -
+ {/*
*/} + {/* {__('...supporting content')}*/} + {/* ({__('Delete supports to spend')})*/} + {/*
*/} + {/*
*/} + {/* */} + {/*
*/}
)} diff --git a/ui/component/walletFiatPaymentBalance/view.jsx b/ui/component/walletFiatPaymentBalance/view.jsx index ce6713190..501a1a2b2 100644 --- a/ui/component/walletFiatPaymentBalance/view.jsx +++ b/ui/component/walletFiatPaymentBalance/view.jsx @@ -45,17 +45,17 @@ const WalletBalance = (props: Props) => { actions={ <>

- ${accountDetails && accountDetails.total_tipped / 100 || 0 } Received Total + ${totalTippedAmount} Total Paid Out

- ${accountDetails && accountDetails.total_paid_out/100 || 0 } Withdrawn -

{/* view more section */} @@ -100,8 +100,8 @@ const WalletBalance = (props: Props) => { )}
-
} diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx index a848eedfb..a9c9f9f83 100644 --- a/ui/component/walletFiatPaymentHistory/view.jsx +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -207,7 +207,7 @@ const WalletBalance = (props: Props) => { ))}
- {(!subscriptions || subscriptions.length === 0) &&

No Subscriptions

} + {(!subscriptions || subscriptions.length === 0) &&

No Subscriptions

}
} -- 2.45.2 From 3a341b033fa2825caca594477e7f610313e4492c Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 22:27:55 +0200 Subject: [PATCH 48/54] calculate the total amount of unique creators tipped --- .../walletFiatAccountHistory/view.jsx | 15 ---- .../walletFiatPaymentBalance/view.jsx | 71 +++++-------------- ui/page/wallet/view.jsx | 2 +- 3 files changed, 18 insertions(+), 70 deletions(-) diff --git a/ui/component/walletFiatAccountHistory/view.jsx b/ui/component/walletFiatAccountHistory/view.jsx index 0e06a4a7d..3000722e5 100644 --- a/ui/component/walletFiatAccountHistory/view.jsx +++ b/ui/component/walletFiatAccountHistory/view.jsx @@ -15,21 +15,6 @@ import { Lbryio } from 'lbryinc'; import moment from 'moment'; type Props = { - balance: number, - totalBalance: number, - claimsBalance: number, - supportsBalance: number, - tipsBalance: number, - doOpenModal: (string) => void, - hasSynced: boolean, - doFetchUtxoCounts: () => void, - doUtxoConsolidate: () => void, - fetchingUtxoCounts: boolean, - consolidatingUtxos: boolean, - consolidateIsPending: boolean, - massClaimingTips: boolean, - massClaimIsPending: boolean, - utxoCounts: { [string]: number }, accountDetails: any, transactions: any, }; diff --git a/ui/component/walletFiatPaymentBalance/view.jsx b/ui/component/walletFiatPaymentBalance/view.jsx index 501a1a2b2..95d89c138 100644 --- a/ui/component/walletFiatPaymentBalance/view.jsx +++ b/ui/component/walletFiatPaymentBalance/view.jsx @@ -15,6 +15,7 @@ import { formatNumberWithCommas } from 'util/number'; type Props = { totalTippedAmount: number, accountDetails: any, + transactions: any, }; @@ -23,16 +24,26 @@ const WalletBalance = (props: Props) => { const { accountDetails, totalTippedAmount, + transactions, } = props; const [detailsExpanded, setDetailsExpanded] = React.useState(false); + const [totalCreatorsSupported, setTotalCreatorsSupported] = React.useState(false); + // calculate how many unique users tipped + React.useEffect(() => { + if(transactions){ + let channelNames = [] - console.log('total tipped amount') - console.log(totalTippedAmount) + for(const transaction of transactions){ + channelNames.push(transaction.channel_name) + console.log(transaction.channel_name); + } - // console.log('account details'); - // console.log(accountDetails); + let unique = [...new Set(channelNames)]; + setTotalCreatorsSupported(unique.length); + } + }, [transactions]); return ( <>{1 == 1 && { actions={ <>

- ${totalTippedAmount} Total Paid Out + {transactions && transactions.length} Total Tips

- {'totalCreatorsSupported'} Creators Supported - {/* setDetailsExpanded(!detailsExpanded)}*/} - {/*/>*/} + {totalCreatorsSupported || 0} Creators Supported

- {/* view more section */} - {detailsExpanded && ( -
-
-
- {__('...earned from others')} - ({__('Unlock to spend')}) -
-
- - {Boolean(1) && ( -
- -
- {__('...on initial publishes')} - ({__('Delete or edit past content to spend')}) -
-
- -
- -
- {__('...supporting content')} - ({__('Delete supports to spend')}) -
-
- -
-
-
- )} -
- {/*
diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index c66a27b89..759ec013d 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -224,7 +224,7 @@ const WalletPage = (props: Props) => { {/* fiat payment history for tips made by user */}
- +
-- 2.45.2 From 35021077814b2143659e23803d91046c78135ed5 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 22:37:16 +0200 Subject: [PATCH 49/54] couple touchups --- ui/component/walletFiatBalance/view.jsx | 2 +- ui/component/walletFiatPaymentBalance/view.jsx | 2 +- ui/page/wallet/view.jsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index a802599ea..fbf08ba55 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -92,7 +92,7 @@ const WalletBalance = (props: Props) => {
} diff --git a/ui/component/walletFiatPaymentBalance/view.jsx b/ui/component/walletFiatPaymentBalance/view.jsx index 95d89c138..669806d08 100644 --- a/ui/component/walletFiatPaymentBalance/view.jsx +++ b/ui/component/walletFiatPaymentBalance/view.jsx @@ -64,7 +64,7 @@ const WalletBalance = (props: Props) => {
-
} diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 759ec013d..15d4a40e2 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -157,7 +157,7 @@ const WalletPage = (props: Props) => { if (1 === 2) { focusAccountHistoryTab(); // } else if (tab === 'payment-history'){ - } else if (1 === 1){ + } else if (1 === 2){ focusPaymentHistoryTab(); } }, []); -- 2.45.2 From 46847d0bdeea92d5c0d1ddad9b19d5ca27dc568a Mon Sep 17 00:00:00 2001 From: Anthony Date: Fri, 30 Jul 2021 19:28:38 +0200 Subject: [PATCH 50/54] remove transaction listings from settings --- ui/page/settingsStripeAccount/view.jsx | 74 +------------------------- ui/page/settingsStripeCard/view.jsx | 64 ---------------------- 2 files changed, 1 insertion(+), 137 deletions(-) diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index 6bc0fabf8..28404f157 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -228,25 +228,11 @@ class StripeAccountConnection extends React.Component {

{__('Congratulations! Your account has been connected with Odysee.')}

- {unpaidBalance > 0 ? ( -
-
-

- {__('Your pending account balance is $%balance% USD.', { balance: unpaidBalance / 100 })} -

-
- ) : ( -
-
-

- {__('Your account balance is $0 USD. When you receive a tip you will see it here.')} -

-
- )}
)} + {/* TODO: hopefully we won't be using this anymore and can remove it */} {accountNotConfirmedButReceivedTips && (
@@ -279,64 +265,6 @@ class StripeAccountConnection extends React.Component { } />
- - {/* customer already has transactions */} - {accountTransactions && accountTransactions.length > 0 && ( - -
- - - - - - - - - - - - - - {accountTransactions && - accountTransactions.map((transaction) => ( - - - - - - - - - - ))} - -
{__('Date')}{<>{__('Receiving Channel Name')}}{__('Tip Location')}{__('Amount (USD)')} {__('Processing Fee')}{__('Odysee Fee')}{__('Received Amount')}
{moment(transaction.created_at).format('LLL')} - - ${transaction.tipped_amount / 100}${transaction.transaction_fee / 100}${transaction.application_fee / 100}${transaction.received_amount / 100}
-
- - } - /> - )} ); } else { diff --git a/ui/page/settingsStripeCard/view.jsx b/ui/page/settingsStripeCard/view.jsx index 7237a716c..935d7bd32 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -434,72 +434,8 @@ class SettingsStripeCard extends React.Component { } />
- - {/* if a user has no transactions yet */} - {(!customerTransactions || customerTransactions.length === 0) && ( - - )}
)} - - {/* customer already has transactions */} - {customerTransactions && customerTransactions.length > 0 && ( - -
- - - - - - - - - - - - - {customerTransactions && - customerTransactions.reverse().map((transaction) => ( - - - - - - - - - ))} - -
{__('Date')}{<>{__('Receiving Channel Name')}}{__('Tip Location')}{__('Amount (USD)')} {__('Card Last 4')}{__('Anonymous')}
{moment(transaction.created_at).format('LLL')} - - ${transaction.tipped_amount / 100}{userCardDetails && userCardDetails.lastFour}{transaction.private_tip ? 'Yes' : 'No'}
-
- - } - /> - )} ); } -- 2.45.2 From 98ab745a91f5b072cbf09fef5d431d15c9c99738 Mon Sep 17 00:00:00 2001 From: Anthony Date: Fri, 30 Jul 2021 19:46:16 +0200 Subject: [PATCH 51/54] add view transactions buttons --- ui/page/settingsStripeAccount/view.jsx | 10 ++++++++++ ui/page/settingsStripeCard/view.jsx | 10 ++++++++++ ui/page/wallet/view.jsx | 8 ++++---- 3 files changed, 24 insertions(+), 4 deletions(-) diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index 28404f157..ea91bf98d 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -1,9 +1,11 @@ // @flow import * as ICONS from 'constants/icons'; +import * as PAGES from 'constants/pages'; import React from 'react'; import Button from 'component/button'; import Card from 'component/common/card'; import Page from 'component/page'; + import { Lbryio } from 'lbryinc'; import { URL, WEBPACK_WEB_PORT, STRIPE_PUBLIC_KEY } from 'config'; import moment from 'moment'; @@ -263,6 +265,14 @@ class StripeAccountConnection extends React.Component { )}
} + actions={ +
diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 15d4a40e2..868d0a7ce 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -153,11 +153,11 @@ const WalletPage = (props: Props) => { // select the first tab React.useEffect(() => { - // if (tab === 'account-history') { - if (1 === 2) { + if (tab === 'account-history') { + // if (1 === 2) { focusAccountHistoryTab(); - // } else if (tab === 'payment-history'){ - } else if (1 === 2){ + } else if (tab === 'payment-history'){ + // } else if (1 === 2){ focusPaymentHistoryTab(); } }, []); -- 2.45.2 From 158de327bee1893f29867b89118ef690e848fb46 Mon Sep 17 00:00:00 2001 From: Anthony Date: Fri, 30 Jul 2021 19:50:13 +0200 Subject: [PATCH 52/54] small optimization --- ui/page/wallet/view.jsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index 868d0a7ce..d0dce8e17 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -159,6 +159,8 @@ const WalletPage = (props: Props) => { } else if (tab === 'payment-history'){ // } else if (1 === 2){ focusPaymentHistoryTab(); + } else { + focusLBCTab() } }, []); @@ -172,7 +174,7 @@ const WalletPage = (props: Props) => { {/* tabs to switch between fiat and lbc */} {/* lbc button */}

{ focusLBCTab(); }} -- 2.45.2 From adc1e0e8e2602b64242c796fb3cad7ae9986660e Mon Sep 17 00:00:00 2001 From: Anthony Date: Fri, 30 Jul 2021 19:59:39 +0200 Subject: [PATCH 53/54] add subscriptions section --- .../walletFiatAccountHistory/view.jsx | 57 ++++++++++++++++++- 1 file changed, 56 insertions(+), 1 deletion(-) diff --git a/ui/component/walletFiatAccountHistory/view.jsx b/ui/component/walletFiatAccountHistory/view.jsx index 3000722e5..3c83c3d69 100644 --- a/ui/component/walletFiatAccountHistory/view.jsx +++ b/ui/component/walletFiatAccountHistory/view.jsx @@ -38,6 +38,7 @@ const WalletBalance = (props: Props) => { const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); + const [subscriptions, setSubscriptions] = React.useState([]); var environment = 'test'; @@ -65,7 +66,7 @@ const WalletBalance = (props: Props) => { }, []); return ( - @@ -120,6 +121,60 @@ const WalletBalance = (props: Props) => { )} /> + + +
+ + + + + + + + + + + + + {subscriptions && + subscriptions.reverse().map((transaction) => ( + + + + + + + + + ))} + +
{__('Date')}{<>{__('Receiving Channel Name')}}{__('Tip Location')}{__('Amount (USD)')} {__('Card Last 4')}{__('Anonymous')}
{moment(transaction.created_at).format('LLL')} + + ${transaction.tipped_amount / 100}{lastFour}{transaction.private_tip ? 'Yes' : 'No'}
+ {(!subscriptions || subscriptions.length === 0) &&

No Subscriptions

} +
+ + } + /> ); }; -- 2.45.2 From 6bb4d4ff39beb601fee81a293306bb00503687fb Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 12 Aug 2021 13:53:28 +0200 Subject: [PATCH 54/54] fix lot of linting errors and make command more userful --- package.json | 2 +- .../walletFiatAccountHistory/view.jsx | 33 +++------ ui/component/walletFiatBalance/view.jsx | 30 ++++---- .../walletFiatPaymentBalance/view.jsx | 21 ++---- .../walletFiatPaymentHistory/view.jsx | 64 +++++++---------- ui/page/settingsStripeAccount/view.jsx | 3 +- ui/page/settingsStripeCard/view.jsx | 4 +- ui/page/wallet/view.jsx | 70 ++++++++----------- 8 files changed, 87 insertions(+), 140 deletions(-) diff --git a/package.json b/package.json index e6765f310..eb99f3de0 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "build:dir": "yarn build -- --dir -c.compression=store -c.mac.identity=null", "crossenv": "./node_modules/cross-env/dist/bin/cross-env", "lint": "eslint 'ui/**/*.{js,jsx}' && eslint 'web/**/*.{js,jsx}' && eslint 'electron/**/*.js' && flow", - "lint-fix": "eslint --fix 'ui/**/*.{js,jsx}' && eslint --fix 'web/**/*.{js,jsx}' && eslint --fix 'electron/**/*.js' && flow", + "lint-fix": "eslint --fix --quiet 'ui/**/*.{js,jsx}' && eslint --fix --quiet 'web/**/*.{js,jsx}' && eslint --fix --quiet 'electron/**/*.js'", "format": "prettier 'src/**/*.{js,jsx,scss,json}' --write", "flow-defs": "flow-typed install", "precommit": "lint-staged", diff --git a/ui/component/walletFiatAccountHistory/view.jsx b/ui/component/walletFiatAccountHistory/view.jsx index 3c83c3d69..dd40d08c4 100644 --- a/ui/component/walletFiatAccountHistory/view.jsx +++ b/ui/component/walletFiatAccountHistory/view.jsx @@ -1,16 +1,7 @@ // @flow -import * as ICONS from 'constants/icons'; -import * as MODALS from 'constants/modal_types'; -import * as PAGES from 'constants/pages'; import React from 'react'; -import CreditAmount from 'component/common/credit-amount'; import Button from 'component/button'; -import HelpLink from 'component/common/help-link'; import Card from 'component/common/card'; -import Icon from 'component/common/icon'; -import LbcSymbol from 'component/common/lbc-symbol'; -import I18nMessage from 'component/i18nMessage'; -import { formatNumberWithCommas } from 'util/number'; import { Lbryio } from 'lbryinc'; import moment from 'moment'; @@ -20,43 +11,37 @@ type Props = { }; const WalletBalance = (props: Props) => { - const { - - } = props; - // receive transactions from parent component let accountTransactions = props.transactions; // reverse so most recent payments come first - if(accountTransactions){ + if (accountTransactions) { accountTransactions = accountTransactions.reverse(); } - if(accountTransactions && accountTransactions.length > 10 ){ + if (accountTransactions && accountTransactions.length > 10) { accountTransactions.length = 10; } - const [detailsExpanded, setDetailsExpanded] = React.useState(false); + // const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [accountStatusResponse, setAccountStatusResponse] = React.useState(); const [subscriptions, setSubscriptions] = React.useState([]); var environment = 'test'; - function getAccountStatus(){ + function getAccountStatus() { return Lbryio.call( 'account', 'status', { - environment + environment, }, 'post' ); } React.useEffect(() => { - - - (async function(){ + (async function() { const response = await getAccountStatus(); setAccountStatusResponse(response); @@ -68,7 +53,7 @@ const WalletBalance = (props: Props) => { return ( <>
@@ -116,7 +101,7 @@ const WalletBalance = (props: Props) => { ))}
- {!accountTransactions &&

No Transactions

} + {!accountTransactions &&

No Transactions

}
)} @@ -170,7 +155,7 @@ const WalletBalance = (props: Props) => { ))} - {(!subscriptions || subscriptions.length === 0) &&

No Subscriptions

} + {(!subscriptions || subscriptions.length === 0) &&

No Subscriptions

}

} diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index fbf08ba55..4661aa2f9 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -1,16 +1,12 @@ // @flow import * as ICONS from 'constants/icons'; -import * as MODALS from 'constants/modal_types'; import * as PAGES from 'constants/pages'; import React from 'react'; import CreditAmount from 'component/common/credit-amount'; import Button from 'component/button'; -import HelpLink from 'component/common/help-link'; import Card from 'component/common/card'; import Icon from 'component/common/icon'; -import LbcSymbol from 'component/common/lbc-symbol'; import I18nMessage from 'component/i18nMessage'; -import { formatNumberWithCommas } from 'util/number'; type Props = { accountDetails: any, @@ -27,8 +23,8 @@ const WalletBalance = (props: Props) => { const [detailsExpanded, setDetailsExpanded] = React.useState(false); return ( - <>{1 == 1 && {accountDetails && accountDetails.total_received_unpaid/100 || 0} USD} + <>{{(accountDetails && (accountDetails.total_received_unpaid / 100)) || 0} USD} subtitle={ This is your remaining balance that can still be withdrawn to your bank account @@ -37,11 +33,11 @@ const WalletBalance = (props: Props) => { actions={ <>

- ${accountDetails && accountDetails.total_tipped / 100 || 0} Total Received Tips + ${(accountDetails && (accountDetails.total_tipped / 100)) || 0} Total Received Tips

- ${accountDetails && accountDetails.total_paid_out/100 || 0} Withdrawn + ${(accountDetails && (accountDetails.total_paid_out / 100)) || 0} Withdrawn

)} diff --git a/ui/component/walletFiatPaymentBalance/view.jsx b/ui/component/walletFiatPaymentBalance/view.jsx index 669806d08..20b5c121a 100644 --- a/ui/component/walletFiatPaymentBalance/view.jsx +++ b/ui/component/walletFiatPaymentBalance/view.jsx @@ -1,16 +1,11 @@ // @flow import * as ICONS from 'constants/icons'; -import * as MODALS from 'constants/modal_types'; import * as PAGES from 'constants/pages'; import React from 'react'; -import CreditAmount from 'component/common/credit-amount'; import Button from 'component/button'; -import HelpLink from 'component/common/help-link'; import Card from 'component/common/card'; import Icon from 'component/common/icon'; -import LbcSymbol from 'component/common/lbc-symbol'; import I18nMessage from 'component/i18nMessage'; -import { formatNumberWithCommas } from 'util/number'; type Props = { totalTippedAmount: number, @@ -18,25 +13,23 @@ type Props = { transactions: any, }; - - const WalletBalance = (props: Props) => { const { - accountDetails, + // accountDetails, totalTippedAmount, transactions, } = props; - const [detailsExpanded, setDetailsExpanded] = React.useState(false); + // const [detailsExpanded, setDetailsExpanded] = React.useState(false); const [totalCreatorsSupported, setTotalCreatorsSupported] = React.useState(false); // calculate how many unique users tipped React.useEffect(() => { - if(transactions){ - let channelNames = [] + if (transactions) { + let channelNames = []; - for(const transaction of transactions){ - channelNames.push(transaction.channel_name) + for (const transaction of transactions) { + channelNames.push(transaction.channel_name); console.log(transaction.channel_name); } @@ -46,7 +39,7 @@ const WalletBalance = (props: Props) => { }, [transactions]); return ( - <>{1 == 1 && {{totalTippedAmount} USD} subtitle={ diff --git a/ui/component/walletFiatPaymentHistory/view.jsx b/ui/component/walletFiatPaymentHistory/view.jsx index a9c9f9f83..5eeb1e879 100644 --- a/ui/component/walletFiatPaymentHistory/view.jsx +++ b/ui/component/walletFiatPaymentHistory/view.jsx @@ -1,16 +1,7 @@ // @flow -import * as ICONS from 'constants/icons'; -import * as MODALS from 'constants/modal_types'; -import * as PAGES from 'constants/pages'; import React from 'react'; -import CreditAmount from 'component/common/credit-amount'; import Button from 'component/button'; -import HelpLink from 'component/common/help-link'; import Card from 'component/common/card'; -import Icon from 'component/common/icon'; -import LbcSymbol from 'component/common/lbc-symbol'; -import I18nMessage from 'component/i18nMessage'; -import { formatNumberWithCommas } from 'util/number'; import { Lbryio } from 'lbryinc'; import moment from 'moment'; @@ -21,49 +12,43 @@ type Props = { }; const WalletBalance = (props: Props) => { - const { - - } = props; - // receive transactions from parent component let accountTransactions = props.transactions; - console.log('heres transactions') + console.log('heres transactions'); console.log(accountTransactions); // let totalTippedAmount = props.totalTippedAmount; // totalTippedAmount = 0; - - // reverse so most recent payments come first - if(accountTransactions){ + if (accountTransactions) { accountTransactions = accountTransactions.reverse(); } - const [detailsExpanded, setDetailsExpanded] = React.useState(false); - const [accountStatusResponse, setAccountStatusResponse] = React.useState(); + // const [detailsExpanded, setDetailsExpanded] = React.useState(false); + // const [accountStatusResponse, setAccountStatusResponse] = React.useState(); + // const [totalTippedAmount, setTotalTippedAmount] = React.useState(0); + const [paymentHistoryTransactions, setPaymentHistoryTransactions] = React.useState(); const [subscriptions, setSubscriptions] = React.useState(); - const [totalTippedAmount, setTotalTippedAmount] = React.useState(0); - const [lastFour, setLastFour] = React.useState(); var environment = 'test'; - function getPaymentHistory() { - return Lbryio.call( - 'customer', - 'list', - { - environment, - }, - 'post' - )}; + // function getPaymentHistory() { + // return Lbryio.call( + // 'customer', + // 'list', + // { + // environment, + // }, + // 'post' + // ); }; - function getCustomerStatus(){ + function getCustomerStatus() { return Lbryio.call( 'customer', 'status', @@ -71,11 +56,11 @@ const WalletBalance = (props: Props) => { environment, }, 'post' - ) + ); } React.useEffect(() => { - (async function(){ + (async function() { let response = accountTransactions; console.log('payment transactions'); @@ -91,15 +76,14 @@ const WalletBalance = (props: Props) => { const subscriptions = [...response]; - if(subscriptions && subscriptions.length > 2){ - subscriptions.length = 2 - setSubscriptions([]) + if (subscriptions && subscriptions.length > 2) { + subscriptions.length = 2; + setSubscriptions([]); } else { - setSubscriptions([]) + setSubscriptions([]); } console.log(response); - })(); }, [accountTransactions]); @@ -153,7 +137,7 @@ const WalletBalance = (props: Props) => { ))} - {(!accountTransactions || accountTransactions.length === 0) &&

No Transactions

} + {(!accountTransactions || accountTransactions.length === 0) &&

No Transactions

}
} @@ -207,7 +191,7 @@ const WalletBalance = (props: Props) => { ))} - {(!subscriptions || subscriptions.length === 0) &&

No Subscriptions

} + {(!subscriptions || subscriptions.length === 0) &&

No Subscriptions

}
} diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index ea91bf98d..79cbdc6bb 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -8,7 +8,6 @@ import Page from 'component/page'; import { Lbryio } from 'lbryinc'; import { URL, WEBPACK_WEB_PORT, STRIPE_PUBLIC_KEY } from 'config'; -import moment from 'moment'; const isDev = process.env.NODE_ENV !== 'production'; @@ -186,7 +185,7 @@ class StripeAccountConnection extends React.Component { unpaidBalance, accountNotConfirmedButReceivedTips, pageTitle, - accountTransactions, + // accountTransactions, } = this.state; const { user } = this.props; diff --git a/ui/page/settingsStripeCard/view.jsx b/ui/page/settingsStripeCard/view.jsx index ee05abcb9..175e2e055 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -6,14 +6,12 @@ import Page from 'component/page'; import Card from 'component/common/card'; import { Lbryio } from 'lbryinc'; import { STRIPE_PUBLIC_KEY } from 'config'; -import moment from 'moment'; import Plastic from 'react-plastic'; import Button from 'component/button'; import * as ICONS from 'constants/icons'; import * as MODALS from 'constants/modal_types'; import * as PAGES from 'constants/pages'; - let stripeEnvironment = 'test'; // if the key contains pk_live it's a live key // update the environment for the calls to the backend to indicate which environment to hit @@ -370,7 +368,7 @@ class SettingsStripeCard extends React.Component { const { scriptFailedToLoad, openModal } = this.props; - const { currentFlowStage, customerTransactions, pageTitle, userCardDetails, paymentMethodId } = this.state; + const { currentFlowStage, pageTitle, userCardDetails, paymentMethodId } = this.state; return ( diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index d0dce8e17..2bc991b5d 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -21,8 +21,7 @@ type Props = { const WalletPage = (props: Props) => { console.log(props); - var stripeEnvironment = 'test'; - var environment = 'test'; + const stripeEnvironment = 'test'; const tab = new URLSearchParams(props.location.search).get('tab'); @@ -31,7 +30,6 @@ const WalletPage = (props: Props) => { const [customerTransactions, setCustomerTransactions] = React.useState(); const [totalTippedAmount, setTotalTippedAmount] = React.useState(0); - function getPaymentHistory() { return Lbryio.call( 'customer', @@ -40,20 +38,20 @@ const WalletPage = (props: Props) => { environment: stripeEnvironment, }, 'post' - )}; + ); }; - function getCustomerStatus(){ - return Lbryio.call( - 'customer', - 'status', - { - environment: stripeEnvironment, - }, - 'post' - ) - } + // function getCustomerStatus() { + // return Lbryio.call( + // 'customer', + // 'status', + // { + // environment: stripeEnvironment, + // }, + // 'post' + // ); + // } - function getAccountStatus(){ + function getAccountStatus() { return Lbryio.call( 'account', 'status', @@ -64,7 +62,7 @@ const WalletPage = (props: Props) => { ); } - function getAccountTransactionsa(){ + function getAccountTransactionsa() { return Lbryio.call( 'account', 'list', @@ -75,10 +73,9 @@ const WalletPage = (props: Props) => { ); } - // calculate account transactions section React.useEffect(() => { - (async function(){ + (async function() { try { const response = await getAccountStatus(); @@ -87,9 +84,8 @@ const WalletPage = (props: Props) => { // TODO: some weird naming clash hence getAccountTransactionsa const getAccountTransactions = await getAccountTransactionsa(); - setAccountTransactionResponse(getAccountTransactions) - - } catch (err){ + setAccountTransactionResponse(getAccountTransactions); + } catch (err) { console.log(err); } })(); @@ -97,28 +93,27 @@ const WalletPage = (props: Props) => { // populate customer payment data React.useEffect(() => { - (async function(){ + (async function() { try { // get card payments customer has made const customerTransactionResponse = await getPaymentHistory(); let totalTippedAmount = 0; - for(const transaction of customerTransactionResponse){ - totalTippedAmount = totalTippedAmount + transaction.tipped_amount + for (const transaction of customerTransactionResponse) { + totalTippedAmount = totalTippedAmount + transaction.tipped_amount; } setTotalTippedAmount(totalTippedAmount / 100); - setCustomerTransactions(customerTransactionResponse) - - } catch (err){ + setCustomerTransactions(customerTransactionResponse); + } catch (err) { console.log(err); } })(); }, []); - function focusLBCTab(){ + function focusLBCTab() { document.getElementsByClassName('lbc-transactions')[0].style.display = 'inline'; document.getElementsByClassName('fiat-transactions')[0].style.display = 'none'; document.getElementsByClassName('payment-history-tab')[0].style.display = 'none'; @@ -126,10 +121,9 @@ const WalletPage = (props: Props) => { document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'underline'; document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'none'; document.getElementsByClassName('fiat-payment-history-switcher')[0].style.textDecoration = 'none'; - } - function focusAccountHistoryTab(){ + function focusAccountHistoryTab() { document.getElementsByClassName('lbc-transactions')[0].style.display = 'none'; document.getElementsByClassName('payment-history-tab')[0].style.display = 'none'; document.getElementsByClassName('fiat-transactions')[0].style.display = 'inline'; @@ -137,10 +131,9 @@ const WalletPage = (props: Props) => { document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'underline'; document.getElementsByClassName('fiat-payment-history-switcher')[0].style.textDecoration = 'none'; - } - function focusPaymentHistoryTab(){ + function focusPaymentHistoryTab() { document.getElementsByClassName('lbc-transactions')[0].style.display = 'none'; document.getElementsByClassName('fiat-transactions')[0].style.display = 'none'; document.getElementsByClassName('payment-history-tab')[0].style.display = 'inline'; @@ -148,7 +141,6 @@ const WalletPage = (props: Props) => { document.getElementsByClassName('lbc-tab-switcher')[0].style.textDecoration = 'none'; document.getElementsByClassName('fiat-tab-switcher')[0].style.textDecoration = 'none'; document.getElementsByClassName('fiat-payment-history-switcher')[0].style.textDecoration = 'underline'; - } // select the first tab @@ -156,11 +148,11 @@ const WalletPage = (props: Props) => { if (tab === 'account-history') { // if (1 === 2) { focusAccountHistoryTab(); - } else if (tab === 'payment-history'){ + } else if (tab === 'payment-history') { // } else if (1 === 2){ focusPaymentHistoryTab(); } else { - focusLBCTab() + focusLBCTab(); } }, []); @@ -220,15 +212,15 @@ const WalletPage = (props: Props) => { {/* account received transactions section */}
-
- +
+
{/* fiat payment history for tips made by user */}
-
- +
+
-- 2.45.2