From 86deadf09903145805ca2448472109273b7b226e Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 22 Jul 2021 18:44:30 +0200 Subject: [PATCH 01/50] add check for two decimals and fix showing error for fiat tip --- ui/component/walletSendTip/view.jsx | 17 +++++++++++++---- ui/component/walletTipAmountSelector/view.jsx | 17 +++++++++++++---- 2 files changed, 26 insertions(+), 8 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 981833ffe..8d035fdea 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -186,8 +186,7 @@ function WalletSendTip(props: Props) { React.useEffect(() => { // Regex for number up to 8 decimal places - const regexp = RegExp(/^(\d*([.]\d{0,8})?)$/); - const validTipInput = regexp.test(String(tipAmount)); + let regexp; let tipError; if (tipAmount === 0) { @@ -198,8 +197,13 @@ function WalletSendTip(props: Props) { // if it's not fiat, aka it's boost or lbc tip else if (activeTab !== TAB_FIAT) { + regexp = RegExp(/^(\d*([.]\d{0,8})?)$/); + const validTipInput = regexp.test(String(tipAmount)); + if (!validTipInput) { tipError = __('Amount must have no more than 8 decimal places'); + } else if (!validTipInput) { + tipError = __('Amount must have no more than 8 decimal places'); } else if (tipAmount === balance) { tipError = __('Please decrease the amount to account for transaction fees'); } else if (tipAmount > balance) { @@ -209,7 +213,12 @@ function WalletSendTip(props: Props) { } // if tip fiat tab } else { - if (tipAmount < 1) { + regexp = RegExp(/^(\d*([.]\d{0,2})?)$/); + const validTipInput = regexp.test(String(tipAmount)); + + if (!validTipInput) { + tipError = __('Amount must have no more than 2 decimal places'); + } else if (tipAmount < 1) { tipError = __('Amount must be at least one dollar'); } else if (tipAmount > 1000) { tipError = __('Amount cannot be over 1000 dollars'); @@ -544,7 +553,7 @@ function WalletSendTip(props: Props) { } className="form-field--price-amount" - error={tipError && activeTab !== TAB_FIAT} + error={tipError} min="0" step="any" type="number" diff --git a/ui/component/walletTipAmountSelector/view.jsx b/ui/component/walletTipAmountSelector/view.jsx index a0246ca47..98006abe7 100644 --- a/ui/component/walletTipAmountSelector/view.jsx +++ b/ui/component/walletTipAmountSelector/view.jsx @@ -120,9 +120,7 @@ function WalletTipAmountSelector(props: Props) { // setHasSavedCard(false); // setCanReceiveFiatTip(true); - const regexp = RegExp(/^(\d*([.]\d{0,8})?)$/); - const validTipInput = regexp.test(String(amount)); - let tipError = ''; + let regexp, tipError; if (amount === 0) { tipError = __('Amount must be a positive number'); @@ -132,6 +130,9 @@ function WalletTipAmountSelector(props: Props) { // if it's not fiat, aka it's boost or lbc tip else if (activeTab !== TAB_FIAT) { + regexp = RegExp(/^(\d*([.]\d{0,8})?)$/); + const validTipInput = regexp.test(String(amount)); + if (!validTipInput) { tipError = __('Amount must have no more than 8 decimal places'); } else if (amount === balance) { @@ -143,7 +144,12 @@ function WalletTipAmountSelector(props: Props) { } // if tip fiat tab } else { - if (amount < 1) { + regexp = RegExp(/^(\d*([.]\d{0,2})?)$/); + const validTipInput = regexp.test(String(amount)); + + if (!validTipInput) { + tipError = __('Amount must have no more than 2 decimal places'); + } else if (amount < 1) { tipError = __('Amount must be at least one dollar'); } else if (amount > 1000) { tipError = __('Amount cannot be over 1000 dollars'); @@ -154,8 +160,10 @@ function WalletTipAmountSelector(props: Props) { onTipErrorChange(tipError); }, [amount, balance, setTipError, activeTab]); + // parse number as float and sets it in the parent component function handleCustomPriceChange(amount: number) { const tipAmount = parseFloat(amount); + onChange(tipAmount); } @@ -229,6 +237,7 @@ function WalletTipAmountSelector(props: Props) { )} + {/* custom number input form */} {useCustomTip && (
Date: Thu, 22 Jul 2021 18:47:41 +0200 Subject: [PATCH 02/50] disable button if theres a fiat tip error --- ui/component/walletSendTip/view.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 8d035fdea..a6b67ff84 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -574,7 +574,7 @@ function WalletSendTip(props: Props) { disabled={ fetchingChannels || isPending || - (tipError && activeTab !== TAB_FIAT) || + tipError || !tipAmount || (activeTab === TAB_FIAT && (!hasCardSaved || !canReceiveFiatTip)) } -- 2.45.2 From 99bb95c9a083a5a7fd1c7977f0056933368e943e Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 22 Jul 2021 20:05:46 +0200 Subject: [PATCH 03/50] pull out variable for max and min fiat amounts --- ui/component/walletSendTip/view.jsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index a6b67ff84..97fe1186e 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -25,6 +25,8 @@ if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) { } const DEFAULT_TIP_AMOUNTS = [1, 5, 25, 100]; +const MINIMUM_FIAT_TIP = 1; +const MAXIMUM_FIAT_TIP = 1000; const TAB_BOOST = 'TabBoost'; const TAB_FIAT = 'TabFiat'; @@ -218,9 +220,9 @@ function WalletSendTip(props: Props) { if (!validTipInput) { tipError = __('Amount must have no more than 2 decimal places'); - } else if (tipAmount < 1) { + } else if (tipAmount < MINIMUM_FIAT_TIP) { tipError = __('Amount must be at least one dollar'); - } else if (tipAmount > 1000) { + } else if (tipAmount > MAXIMUM_FIAT_TIP) { tipError = __('Amount cannot be over 1000 dollars'); } } -- 2.45.2 From 27f754ac069585dba0d197fea281b68c6b17b2d6 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 22 Jul 2021 22:03:42 +0200 Subject: [PATCH 04/50] bugfix not updating the frontend on account add --- ui/page/settingsStripeAccount/view.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index 7c0b6d8d2..4276ca306 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -163,7 +163,7 @@ class StripeAccountConnection extends React.Component { // if it's beamer's error indicating the account is not linked yet if (error.message.indexOf(errorString) > -1) { // get stripe link and set it on the frontend - getAndSetAccountLink(); + getAndSetAccountLink(true); } else { // not an error from Beamer, throw it throw new Error(error); -- 2.45.2 From 311a3cb721c03c7c71941dfebd53a67516f3c874 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 22 Jul 2021 22:37:49 +0200 Subject: [PATCH 05/50] fix frontend bug --- ui/component/walletSendTip/view.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/component/walletSendTip/view.jsx b/ui/component/walletSendTip/view.jsx index 97fe1186e..4f99fbbb4 100644 --- a/ui/component/walletSendTip/view.jsx +++ b/ui/component/walletSendTip/view.jsx @@ -444,7 +444,7 @@ function WalletSendTip(props: Props) { {/* short explainer under the button */}
- {explainerText} + {explainerText + ' '} {/* {activeTab === TAB_FIAT && !hasCardSaved &&
-- 2.45.2 From 87c66253cb136b31685abe8170b2ef107c48a23e Mon Sep 17 00:00:00 2001 From: Anthony Date: Sat, 24 Jul 2021 20:55:09 +0200 Subject: [PATCH 06/50] show superchats in order properly --- ui/component/livestreamComments/view.jsx | 44 +++++++++++++++++++++--- 1 file changed, 40 insertions(+), 4 deletions(-) diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index f4b073fef..43cd71bfc 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -22,6 +22,7 @@ type Props = { fetchingComments: boolean, doSuperChatList: (string) => void, superChats: Array, + superChatsReversed: Array, superChatsTotalAmount: number, myChannels: ?Array, }; @@ -38,15 +39,30 @@ export default function LivestreamComments(props: Props) { embed, doCommentSocketConnect, doCommentSocketDisconnect, - comments, + comments, // superchats in chronological format doCommentList, fetchingComments, doSuperChatList, - superChats, superChatsTotalAmount, myChannels, + superChats, // superchats organized by tip amount } = props; + 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); @@ -71,6 +87,7 @@ export default function LivestreamComments(props: Props) { } React.useEffect(() => { + if (claimId) { doCommentList(uri, '', 1, 75); doSuperChatList(uri); @@ -132,6 +149,8 @@ export default function LivestreamComments(props: Props) {
{__('Live discussion')}
{superChatsTotalAmount > 0 && (
+ + {/* the superchats in chronological order button */}
)} + {/* top to bottom comment display */} {!fetchingComments && comments.length > 0 ? (
- {commentsToDisplay.map((comment) => ( + {viewMode === VIEW_MODE_CHAT && commentsToDisplay.map((comment) => ( ))} + + {viewMode === VIEW_MODE_SUPER_CHAT && superChatsReversed && superChatsReversed.map((comment) => ( + + ))} +
) : (
-- 2.45.2 From 070763f164b44be654aab7bea62998e720813022 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sat, 24 Jul 2021 22:32:51 +0200 Subject: [PATCH 07/50] 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 2161abd844b485a126985163f2ca3789bb4da2e2 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sat, 24 Jul 2021 23:03:09 +0200 Subject: [PATCH 08/50] 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 5ce3af3c4b58f3fe6b550019bc08148512ef4630 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 20:03:54 +0200 Subject: [PATCH 09/50] 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 86be1c9b3fc2efc9689975ff506a6bbb44f4647d Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 21:30:35 +0200 Subject: [PATCH 10/50] 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 7257d1a88436abe7f21a62ef8c5fe07a142b06c7 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 21:34:37 +0200 Subject: [PATCH 11/50] 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 61051855343f8881063eddcd097cbe04cc482685 Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 23:17:44 +0200 Subject: [PATCH 12/50] add toast when someone does a tip for a comment --- ui/component/commentCreate/view.jsx | 34 +++++++++++++++++++---------- 1 file changed, 22 insertions(+), 12 deletions(-) diff --git a/ui/component/commentCreate/view.jsx b/ui/component/commentCreate/view.jsx index 12028b6de..137727907 100644 --- a/ui/component/commentCreate/view.jsx +++ b/ui/component/commentCreate/view.jsx @@ -131,6 +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 (commentFailure && tipAmount === successTip.tipAmount) { handleCreateComment(successTip.txid); return; @@ -147,6 +148,19 @@ export function CommentCreate(props: Props) { const activeChannelName = activeChannelClaim && activeChannelClaim.name; const activeChannelId = activeChannelClaim && activeChannelClaim.claim_id; + // setup variables for tip API + let channelClaimId, tipChannelName; + // if there is a signing channel it's on a file + if (claim.signing_channel) { + channelClaimId = claim.signing_channel.claim_id; + tipChannelName = claim.signing_channel.name; + + // otherwise it's on the channel page + } else { + channelClaimId = claim.claim_id; + tipChannelName = claim.name; + } + console.log(activeChannelClaim); setIsSubmitting(true); @@ -162,6 +176,14 @@ export function CommentCreate(props: Props) { setTimeout(() => { handleCreateComment(txid); }, 1500); + + 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 + }), + }); + setSuccessTip({ txid, tipAmount }); }, () => { @@ -170,18 +192,6 @@ export function CommentCreate(props: Props) { } ); } else { - // setup variables for tip API - let channelClaimId, tipChannelName; - // if there is a signing channel it's on a file - if (claim.signing_channel) { - channelClaimId = claim.signing_channel.claim_id; - tipChannelName = claim.signing_channel.name; - - // otherwise it's on the channel page - } else { - channelClaimId = claim.claim_id; - tipChannelName = claim.name; - } const sourceClaimId = claim.claim_id; -- 2.45.2 From be91b2ccf4e32a710b45b9fb783e7fbe065bb2db Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 23:26:57 +0200 Subject: [PATCH 13/50] add error toast for card page --- ui/page/settingsStripeCard/view.jsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/ui/page/settingsStripeCard/view.jsx b/ui/page/settingsStripeCard/view.jsx index 7fd138038..f222d4f6a 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -188,10 +188,15 @@ class SettingsStripeCard extends React.Component { // instantiate stripe elements setupStripe(); }); + // 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'; 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'; + doToast({ message: displayString, isError: true }); + console.log('Unseen before error'); } }); -- 2.45.2 From 02f3e59541154d37db2793e01e32bc50b66982fd Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 23:31:46 +0200 Subject: [PATCH 14/50] show error on account connection page --- ui/page/settingsStripeAccount/index.js | 7 +++++-- ui/page/settingsStripeAccount/view.jsx | 7 +++++++ 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/ui/page/settingsStripeAccount/index.js b/ui/page/settingsStripeAccount/index.js index 633726701..87eb38809 100644 --- a/ui/page/settingsStripeAccount/index.js +++ b/ui/page/settingsStripeAccount/index.js @@ -2,12 +2,15 @@ import { connect } from 'react-redux'; import { withRouter } from 'react-router'; import StripeAccountConnection from './view'; import { selectUser } from 'redux/selectors/user'; +import { doToast } from 'redux/actions/notifications'; // function that receives state parameter and returns object of functions that accept state const select = (state) => ({ user: selectUser(state), }); -// const perform = (dispatch) => ({}); +const perform = (dispatch) => ({ + doToast: (options) => dispatch(doToast(options)), +}); -export default withRouter(connect(select)(StripeAccountConnection)); +export default withRouter(connect(select, perform)(StripeAccountConnection)); diff --git a/ui/page/settingsStripeAccount/view.jsx b/ui/page/settingsStripeAccount/view.jsx index 4276ca306..febfef6f3 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -31,6 +31,7 @@ if (isDev) { type Props = { source: string, user: User, + doOpenModal: (string, {}) => void, }; type State = { @@ -68,6 +69,8 @@ class StripeAccountConnection extends React.Component { componentDidMount() { const { user } = this.props; + let doToast = this.props.doToast; + // $FlowFixMe this.experimentalUiEnabled = user && user.experimental_ui; @@ -165,9 +168,13 @@ class StripeAccountConnection extends React.Component { // get stripe link and set it on the frontend getAndSetAccountLink(true); } else { + // probably an error from stripe + 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); } + }); } -- 2.45.2 From d7b1ec5037bc69004af306df69f28ad964199dbb Mon Sep 17 00:00:00 2001 From: Anthony Date: Sun, 25 Jul 2021 23:58:32 +0200 Subject: [PATCH 15/50] 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 c7702670cf07cb130be5dcc79eb469ae91dad132 Mon Sep 17 00:00:00 2001 From: Anthony Date: Mon, 26 Jul 2021 20:51:41 +0200 Subject: [PATCH 16/50] 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 82ddbb2547637b5967c48727ac9b40c2c4f23773 Mon Sep 17 00:00:00 2001 From: Anthony Date: Mon, 26 Jul 2021 21:07:16 +0200 Subject: [PATCH 17/50] 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 368c7f069d096b6f1d20c1ce34ccb9f95ac07f76 Mon Sep 17 00:00:00 2001 From: Anthony Date: Mon, 26 Jul 2021 21:40:01 +0200 Subject: [PATCH 18/50] 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 71ad82eb6..0471ee06c 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 d97f5c97dd7756dd2e64f1a2468445891a4d6660 Mon Sep 17 00:00:00 2001 From: Anthony Date: Mon, 26 Jul 2021 21:55:21 +0200 Subject: [PATCH 19/50] 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 3e07cf33122c5981b0e40aa3d52377bdf05a4999 Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 27 Jul 2021 19:15:15 +0200 Subject: [PATCH 20/50] 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 dae121bfe38bdff3cef602a57f7a3e9ecac561f4 Mon Sep 17 00:00:00 2001 From: Anthony Date: Tue, 27 Jul 2021 19:48:57 +0200 Subject: [PATCH 21/50] 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 137727907..25a3bf8bb 100644 --- a/ui/component/commentCreate/view.jsx +++ b/ui/component/commentCreate/view.jsx @@ -200,8 +200,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 1978b936ad0513de8f1ded04dd590fce204704bb Mon Sep 17 00:00:00 2001 From: Anthony Date: Wed, 28 Jul 2021 13:08:28 +0200 Subject: [PATCH 22/50] fiat and lbc tabs coming along --- ui/page/wallet/view.jsx | 57 +++++++++++++++++++++++++++++++---------- 1 file changed, 43 insertions(+), 14 deletions(-) diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index ba284ffe1..c39285f3e 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -19,23 +19,52 @@ const WalletPage = (props: Props) => { 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 ( - {loading && ( -
- -
- )} - {!loading && ( + {/* tabs to switch between fiat and lbc */} +

{ + document.getElementsByClassName('lbc-transactions')[0].style.display = 'inline'; + document.getElementsByClassName('fiat-transactions')[0].style.display = 'none'; + }} + >LBC Transactions

+

{ + document.getElementsByClassName('lbc-transactions')[0].style.display = 'none'; + document.getElementsByClassName('fiat-transactions')[0].style.display = 'inline'; + }} + >Fiat Transactions

+
+ {/* if the transactions are loading */} + { loading && ( +
+ +
+ )} + {/* when the transactions are finished loading */} + { !loading && ( + <> + {showIntro ? ( + + ) : ( +
+ + +
+ )} + + )} +
+ {( <> - {showIntro ? ( - - ) : ( -
- - -
- )} +
+

Here's your fiat transactions

+
)}
-- 2.45.2 From 16bb3491942ddd6056ac5bfc19e930f9d2fdab70 Mon Sep 17 00:00:00 2001 From: Anthony Date: Wed, 28 Jul 2021 13:35:53 +0200 Subject: [PATCH 23/50] support setting currency as the default tab via query param --- ui/page/wallet/view.jsx | 30 +++++++++++++++++++++++++++--- 1 file changed, 27 insertions(+), 3 deletions(-) diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx index c39285f3e..7c92b2e7d 100644 --- a/ui/page/wallet/view.jsx +++ b/ui/page/wallet/view.jsx @@ -14,6 +14,21 @@ type Props = { }; const WalletPage = (props: Props) => { + console.log(props); + + const tab = new URLSearchParams(props.location.search).get('tab'); + + React.useEffect(()=>{ + if(tab === 'currency'){ + 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; @@ -27,16 +42,25 @@ const WalletPage = (props: Props) => { return ( {/* tabs to switch between fiat and lbc */} -

{ 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'; }} >LBC Transactions

-

{ 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'; + }} >Fiat Transactions

@@ -62,7 +86,7 @@ const WalletPage = (props: Props) => {
{( <> -
+

Here's your fiat transactions

-- 2.45.2 From 097da298b373037aa56ca1c78e8ffcac05c66ba8 Mon Sep 17 00:00:00 2001 From: Anthony Date: Wed, 28 Jul 2021 15:18:06 +0200 Subject: [PATCH 24/50] add wallet fiat balance --- ui/component/walletFiatBalance/index.js | 40 ++++++ ui/component/walletFiatBalance/view.jsx | 180 ++++++++++++++++++++++++ ui/page/wallet/view.jsx | 21 ++- 3 files changed, 228 insertions(+), 13 deletions(-) create mode 100644 ui/component/walletFiatBalance/index.js create mode 100644 ui/component/walletFiatBalance/view.jsx diff --git a/ui/component/walletFiatBalance/index.js b/ui/component/walletFiatBalance/index.js new file mode 100644 index 000000000..83b0a30cf --- /dev/null +++ b/ui/component/walletFiatBalance/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/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx new file mode 100644 index 000000000..074c76fe3 --- /dev/null +++ b/ui/component/walletFiatBalance/view.jsx @@ -0,0 +1,180 @@ +// @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 }, +}; + +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; + 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 ( + 313 USD} + subtitle={ + totalLocked > 0 ? ( + + This is your remaining balance that can still be withdrawn to your bank account + + ) : ( + {__('Your total balance.')} + ) + } + actions={ + <> +

+ + 413 Received Total +

+ +

+ $100 Already Withdrawn!!!! +

+ {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')}) +
+
+ +
+
+
+ )} + + {/* @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 3426f20a475a34b4bc3dd6f0b6713430a5cbe3b8 Mon Sep 17 00:00:00 2001 From: Anthony Date: Wed, 28 Jul 2021 15:24:28 +0200 Subject: [PATCH 25/50] 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 && (
@@ -136,49 +134,14 @@ 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 89ff6f2c66e22993d822a7e7897c2ea9cf249d43 Mon Sep 17 00:00:00 2001 From: Anthony Date: Wed, 28 Jul 2021 23:10:46 +0200 Subject: [PATCH 29/50] transaction listing working --- ui/component/walletFiatBalance/view.jsx | 6 +- ui/component/walletFiatTransactions/view.jsx | 70 ++++++++++++++++---- ui/page/wallet/view.jsx | 46 +++++++++++-- 3 files changed, 100 insertions(+), 22 deletions(-) diff --git a/ui/component/walletFiatBalance/view.jsx b/ui/component/walletFiatBalance/view.jsx index d0f9968f1..7e099cbe4 100644 --- a/ui/component/walletFiatBalance/view.jsx +++ b/ui/component/walletFiatBalance/view.jsx @@ -134,10 +134,10 @@ 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 a6b4a84c149d30d0adccf02a9250f8d144c61011 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 13:27:01 +0200 Subject: [PATCH 30/50] 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 f60e6b48027fda2edeb0f4d2c832920db631a6a5 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 13:48:33 +0200 Subject: [PATCH 31/50] 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 df93f795b60d4e29be40f6715bc076149f980101 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 14:18:16 +0200 Subject: [PATCH 32/50] 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 dbe35f4e40d0892e56e28922ed7247e000791159 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 14:22:46 +0200 Subject: [PATCH 33/50] 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 f222d4f6a..7adc927a7 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -462,6 +462,7 @@ class SettingsStripeCard extends React.Component { {<>{__('Receiving Channel Name')}} {__('Tip Location')} {__('Amount (USD)')} + {__('Card Last 4')} {__('Anonymous')} @@ -491,6 +492,7 @@ class SettingsStripeCard extends React.Component { /> ${transaction.tipped_amount / 100} + {userCardDetails && userCardDetails.lastFour} {transaction.private_tip ? 'Yes' : 'No'} ))} -- 2.45.2 From 4d24627291795a0c5aed14b9ff85398b467a87b3 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 17:45:02 +0200 Subject: [PATCH 34/50] 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 1affe0a77d7c94b7e949cdb56f3b6817ae2a3cf9 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 18:32:50 +0200 Subject: [PATCH 35/50] 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 b50687148d3413eaca6967de6019a63c134c16ed Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 18:44:32 +0200 Subject: [PATCH 36/50] 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 53980f9aaf8281dde4f7aa38a44b3867e470d470 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 18:49:07 +0200 Subject: [PATCH 37/50] 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 35c73b00f83490ff9b50e99857e7f206770331bc Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 19:09:30 +0200 Subject: [PATCH 38/50] 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 83ea59b794bb5efe4a85ed14942d2b199b5433d8 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 19:29:05 +0200 Subject: [PATCH 39/50] 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 c0e49c5643f3187e159c4146609606450e922352 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 19:45:16 +0200 Subject: [PATCH 40/50] 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 dff8e917b069353b22758bae8ae3edd386d7f3b6 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 20:41:26 +0200 Subject: [PATCH 41/50] 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 56facb7b9ed1e7e7994b2101d3b4dedb38075e2f Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 21:01:21 +0200 Subject: [PATCH 42/50] 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 1ea40afd4237add6cf9d45bf30863cb97721619f Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 22:09:16 +0200 Subject: [PATCH 44/50] 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 9afe5fb6ca93f50276b08f6fc48e6ab322c67e4a Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 22:27:55 +0200 Subject: [PATCH 45/50] 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 ade748af9ff8d7cbf4adb1fba337f13a5ca1d194 Mon Sep 17 00:00:00 2001 From: Anthony Date: Thu, 29 Jul 2021 22:37:16 +0200 Subject: [PATCH 46/50] 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 7808039691e0deae4a05a10921bb904081284344 Mon Sep 17 00:00:00 2001 From: Anthony Date: Fri, 30 Jul 2021 19:28:38 +0200 Subject: [PATCH 47/50] 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 dc21de5b3..2177fb648 100644 --- a/ui/page/settingsStripeAccount/view.jsx +++ b/ui/page/settingsStripeAccount/view.jsx @@ -230,25 +230,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 && (
@@ -281,64 +267,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 7adc927a7..502867e49 100644 --- a/ui/page/settingsStripeCard/view.jsx +++ b/ui/page/settingsStripeCard/view.jsx @@ -437,72 +437,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 c59c093be6e0dfc3d233d444c5778c10a148b302 Mon Sep 17 00:00:00 2001 From: Anthony Date: Fri, 30 Jul 2021 19:46:16 +0200 Subject: [PATCH 48/50] 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 2177fb648..fdb9e3d81 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'; @@ -265,6 +267,14 @@ class StripeAccountConnection extends React.Component { )}
} + actions={ +