Chore desktop cleanup #6896
15 changed files with 464 additions and 448 deletions
|
@ -19,7 +19,7 @@ THUMBNAIL_CDN_URL=https://image-processor.vanwanet.com/optimize/
|
|||
WELCOME_VERSION=1.0
|
||||
|
||||
# STRIPE
|
||||
STRIPE_PUBLIC_KEY='pk_test_NoL1JWL7i1ipfhVId5KfDZgo'
|
||||
# STRIPE_PUBLIC_KEY='pk_test_NoL1JWL7i1ipfhVId5KfDZgo'
|
||||
|
||||
# Analytics
|
||||
MATOMO_URL=https://analytics.lbry.com/
|
||||
|
|
|
@ -2090,5 +2090,8 @@
|
|||
"Expand Comments": "Expand Comments",
|
||||
"Expand": "Expand",
|
||||
"Load More": "Load More",
|
||||
"Collection": "Collection",
|
||||
"%channelName% isn't live right now, but the chat is! Check back later to watch the stream.": "%channelName% isn't live right now, but the chat is! Check back later to watch the stream.",
|
||||
"Review": "Review",
|
||||
"--end--": "--end--"
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
// @flow
|
||||
import type { ElementRef } from 'react';
|
||||
import { SIMPLE_SITE, STRIPE_PUBLIC_KEY } from 'config';
|
||||
import { SIMPLE_SITE } from 'config';
|
||||
import * as PAGES from 'constants/pages';
|
||||
import * as ICONS from 'constants/icons';
|
||||
import React from 'react';
|
||||
|
@ -21,12 +21,8 @@ import Empty from 'component/common/empty';
|
|||
import { getChannelIdFromClaim } from 'util/claim';
|
||||
import { Lbryio } from 'lbryinc';
|
||||
|
||||
let stripeEnvironment = 'test';
|
||||
// if the key contains pk_live it's a live key
|
||||
// update the environment for the calls to the backend to indicate which environment to hit
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
stripeEnvironment = 'live';
|
||||
}
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
let stripeEnvironment = getStripeEnvironment();
|
||||
|
||||
const TAB_FIAT = 'TabFiat';
|
||||
const TAB_LBC = 'TabLBC';
|
||||
|
@ -245,10 +241,13 @@ export function CommentCreate(props: Props) {
|
|||
}, 1500);
|
||||
|
||||
doToast({
|
||||
message: __("You sent %tipAmount% LBRY Credits as a tip to %tipChannelName%, I'm sure they appreciate it!", {
|
||||
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 });
|
||||
|
@ -265,7 +264,8 @@ export function CommentCreate(props: Props) {
|
|||
Lbryio.call(
|
||||
'customer',
|
||||
'tip',
|
||||
{ // round to deal with floating point precision
|
||||
{
|
||||
// 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,
|
||||
|
@ -387,12 +387,7 @@ export function CommentCreate(props: Props) {
|
|||
}
|
||||
}}
|
||||
>
|
||||
<FormField
|
||||
type="textarea"
|
||||
name={'comment_signup_prompt'}
|
||||
placeholder={__('Say something about this...')}
|
||||
label={isFetchingChannels ? __('Comment') : undefined}
|
||||
/>
|
||||
<FormField type="textarea" name={'comment_signup_prompt'} placeholder={__('Say something about this...')} />
|
||||
<div className="section__actions--no-margin">
|
||||
<Button disabled button="primary" label={__('Post --[button to submit something]--')} requiresAuth={IS_WEB} />
|
||||
</div>
|
||||
|
@ -534,7 +529,8 @@ export function CommentCreate(props: Props) {
|
|||
}}
|
||||
/>
|
||||
)}
|
||||
{!claimIsMine && (
|
||||
{/* @if TARGET='web' */}
|
||||
{!claimIsMine && stripeEnvironment && (
|
||||
<Button
|
||||
disabled={disabled}
|
||||
button="alt"
|
||||
|
@ -546,6 +542,7 @@ export function CommentCreate(props: Props) {
|
|||
}}
|
||||
/>
|
||||
)}
|
||||
{/* @endif */}
|
||||
{isReply && !minTip && (
|
||||
<Button
|
||||
button="link"
|
||||
|
|
|
@ -4,14 +4,8 @@ import Button from 'component/button';
|
|||
import Card from 'component/common/card';
|
||||
import { Lbryio } from 'lbryinc';
|
||||
import moment from 'moment';
|
||||
import { STRIPE_PUBLIC_KEY } from 'config';
|
||||
|
||||
let stripeEnvironment = 'test';
|
||||
// if the key contains pk_live it's a live key
|
||||
// update the environment for the calls to the backend to indicate which environment to hit
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
stripeEnvironment = 'live';
|
||||
}
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
let stripeEnvironment = getStripeEnvironment();
|
||||
|
||||
type Props = {
|
||||
accountDetails: any,
|
||||
|
@ -44,7 +38,10 @@ const WalletBalance = (props: Props) => {
|
|||
(async function () {
|
||||
const customerStatusResponse = await getCustomerStatus();
|
||||
|
||||
const lastFour = customerStatusResponse.PaymentMethods && customerStatusResponse.PaymentMethods.length && customerStatusResponse.PaymentMethods[0].card.last4;
|
||||
const lastFour =
|
||||
customerStatusResponse.PaymentMethods &&
|
||||
customerStatusResponse.PaymentMethods.length &&
|
||||
customerStatusResponse.PaymentMethods[0].card.last4;
|
||||
|
||||
setLastFour(lastFour);
|
||||
})();
|
||||
|
@ -100,7 +97,11 @@ const WalletBalance = (props: Props) => {
|
|||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
{(!accountTransactions || accountTransactions.length === 0) && <p style={{textAlign: 'center', marginTop: '20px', fontSize: '13px', color: 'rgb(171, 171, 171)'}}>No Transactions</p>}
|
||||
{(!accountTransactions || accountTransactions.length === 0) && (
|
||||
<p style={{ textAlign: 'center', marginTop: '20px', fontSize: '13px', color: 'rgb(171, 171, 171)' }}>
|
||||
No Transactions
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
|
|
|
@ -15,14 +15,8 @@ import LbcSymbol from 'component/common/lbc-symbol';
|
|||
import { parseURI } from 'lbry-redux';
|
||||
import usePersistedState from 'effects/use-persisted-state';
|
||||
import WalletSpendableBalanceHelp from 'component/walletSpendableBalanceHelp';
|
||||
import { STRIPE_PUBLIC_KEY } from 'config';
|
||||
|
||||
let stripeEnvironment = 'test';
|
||||
// if the key contains pk_live it's a live key
|
||||
// update the environment for the calls to the backend to indicate which environment to hit
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
stripeEnvironment = 'live';
|
||||
}
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
let stripeEnvironment = getStripeEnvironment();
|
||||
|
||||
const DEFAULT_TIP_AMOUNTS = [1, 5, 25, 100];
|
||||
const MINIMUM_FIAT_TIP = 1;
|
||||
|
@ -100,7 +94,7 @@ function WalletSendTip(props: Props) {
|
|||
|
||||
// check if creator has a payment method saved
|
||||
React.useEffect(() => {
|
||||
if (channelClaimId && isAuthenticated) {
|
||||
if (channelClaimId && isAuthenticated && stripeEnvironment) {
|
||||
Lbryio.call(
|
||||
'customer',
|
||||
'status',
|
||||
|
@ -118,16 +112,18 @@ function WalletSendTip(props: Props) {
|
|||
setHasSavedCard(Boolean(defaultPaymentMethodId));
|
||||
});
|
||||
}
|
||||
}, [channelClaimId, isAuthenticated]);
|
||||
}, [channelClaimId, isAuthenticated, stripeEnvironment]);
|
||||
|
||||
// check if creator has an account saved
|
||||
React.useEffect(() => {
|
||||
const tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (tipInputElement) {
|
||||
tipInputElement.focus();
|
||||
}
|
||||
}, []);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (channelClaimId) {
|
||||
if (channelClaimId && stripeEnvironment) {
|
||||
Lbryio.call(
|
||||
'account',
|
||||
'check',
|
||||
|
@ -149,14 +145,14 @@ function WalletSendTip(props: Props) {
|
|||
// console.log(error);
|
||||
});
|
||||
}
|
||||
}, [channelClaimId]);
|
||||
}, [channelClaimId, stripeEnvironment]);
|
||||
|
||||
const noBalance = balance === 0;
|
||||
const tipAmount = useCustomTip ? customTipAmount : presetTipAmount;
|
||||
|
||||
const [activeTab, setActiveTab] = React.useState(claimIsMine ? TAB_BOOST : TAB_LBC);
|
||||
|
||||
function setClaimTypeText() {
|
||||
function getClaimTypeText() {
|
||||
if (claim.value_type === 'stream') {
|
||||
return __('Content');
|
||||
} else if (claim.value_type === 'channel') {
|
||||
|
@ -169,13 +165,15 @@ function WalletSendTip(props: Props) {
|
|||
return __('Claim');
|
||||
}
|
||||
}
|
||||
const claimTypeText = setClaimTypeText();
|
||||
const claimTypeText = getClaimTypeText();
|
||||
|
||||
let iconToUse;
|
||||
let explainerText = '';
|
||||
if (activeTab === TAB_BOOST) {
|
||||
iconToUse = ICONS.LBC;
|
||||
explainerText = __('This refundable boost will improve the discoverability of this %claimTypeText% while active.', {claimTypeText});
|
||||
explainerText = __('This refundable boost will improve the discoverability of this %claimTypeText% while active.', {
|
||||
claimTypeText,
|
||||
});
|
||||
} else if (activeTab === TAB_FIAT) {
|
||||
iconToUse = ICONS.FINANCE;
|
||||
explainerText = __('Show this channel your appreciation by sending a donation in USD.');
|
||||
|
@ -276,7 +274,8 @@ function WalletSendTip(props: Props) {
|
|||
Lbryio.call(
|
||||
'customer',
|
||||
'tip',
|
||||
{ // round to fix issues with floating point numbers
|
||||
{
|
||||
// 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,
|
||||
|
@ -319,7 +318,7 @@ function WalletSendTip(props: Props) {
|
|||
const countDecimals = function (value) {
|
||||
const text = value.toString();
|
||||
const index = text.indexOf('.');
|
||||
return (text.length - index - 1);
|
||||
return text.length - index - 1;
|
||||
};
|
||||
|
||||
function handleCustomPriceChange(event: SyntheticInputEvent<*>) {
|
||||
|
@ -387,7 +386,9 @@ function WalletSendTip(props: Props) {
|
|||
const displayAmount = !isNan(tipAmount) ? amountToShow : '';
|
||||
|
||||
if (activeTab === TAB_BOOST) {
|
||||
return (claimIsMine ? __('Boost Your %claimTypeText%', {claimTypeText}) : __('Boost This %claimTypeText%', {claimTypeText}));
|
||||
return claimIsMine
|
||||
? __('Boost Your %claimTypeText%', { claimTypeText })
|
||||
: __('Boost This %claimTypeText%', { claimTypeText });
|
||||
} else if (activeTab === TAB_FIAT) {
|
||||
return __('Send a $%displayAmount% Tip', { displayAmount });
|
||||
} else if (activeTab === TAB_LBC) {
|
||||
|
@ -416,7 +417,16 @@ function WalletSendTip(props: Props) {
|
|||
{/* if there is no LBC balance, show user frontend to get credits */}
|
||||
{/* if there is lbc, the main tip/boost gui with the 3 tabs at the top */}
|
||||
<Card
|
||||
title={<LbcSymbol postfix={claimIsMine ? __('Boost Your %claimTypeText%', {claimTypeText}) : __('Support This %claimTypeText%', {claimTypeText})} size={22} />}
|
||||
title={
|
||||
<LbcSymbol
|
||||
postfix={
|
||||
claimIsMine
|
||||
? __('Boost Your %claimTypeText%', { claimTypeText })
|
||||
: __('Support This %claimTypeText%', { claimTypeText })
|
||||
}
|
||||
size={22}
|
||||
/>
|
||||
}
|
||||
subtitle={
|
||||
<React.Fragment>
|
||||
{!claimIsMine && (
|
||||
|
@ -429,7 +439,9 @@ function WalletSendTip(props: Props) {
|
|||
button="alt"
|
||||
onClick={() => {
|
||||
const tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (tipInputElement) {
|
||||
tipInputElement.focus();
|
||||
}
|
||||
if (!isConfirming) {
|
||||
setActiveTab(TAB_LBC);
|
||||
}
|
||||
|
@ -438,6 +450,7 @@ function WalletSendTip(props: Props) {
|
|||
/>
|
||||
{/* tip fiat tab button */}
|
||||
{/* @if TARGET='web' */}
|
||||
{stripeEnvironment && (
|
||||
<Button
|
||||
key="tip-fiat"
|
||||
icon={ICONS.FINANCE}
|
||||
|
@ -445,13 +458,16 @@ function WalletSendTip(props: Props) {
|
|||
button="alt"
|
||||
onClick={() => {
|
||||
const tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (tipInputElement) {
|
||||
tipInputElement.focus();
|
||||
}
|
||||
if (!isConfirming) {
|
||||
setActiveTab(TAB_FIAT);
|
||||
}
|
||||
}}
|
||||
className={classnames('button-toggle', { 'button-toggle--active': activeTab === TAB_FIAT })}
|
||||
/>
|
||||
)}
|
||||
{/* @endif */}
|
||||
{/* tip LBC tab button */}
|
||||
<Button
|
||||
|
@ -461,7 +477,9 @@ function WalletSendTip(props: Props) {
|
|||
button="alt"
|
||||
onClick={() => {
|
||||
const tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (tipInputElement) {
|
||||
tipInputElement.focus();
|
||||
}
|
||||
if (!isConfirming) {
|
||||
setActiveTab(TAB_BOOST);
|
||||
}
|
||||
|
@ -493,33 +511,29 @@ function WalletSendTip(props: Props) {
|
|||
</div>
|
||||
<div className="confirm__label">{setConfirmLabel()}</div>
|
||||
<div className="confirm__value">
|
||||
{activeTab === TAB_FIAT ? <p>$ {(Math.round(tipAmount * 100) / 100).toFixed(2)}</p> : <LbcSymbol postfix={tipAmount} size={22} />}
|
||||
{activeTab === TAB_FIAT ? (
|
||||
<p>$ {(Math.round(tipAmount * 100) / 100).toFixed(2)}</p>
|
||||
) : (
|
||||
<LbcSymbol postfix={tipAmount} size={22} />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="section__actions">
|
||||
<Button
|
||||
autoFocus
|
||||
onClick={handleSubmit}
|
||||
button="primary"
|
||||
disabled={isPending}
|
||||
label={__('Confirm')}
|
||||
/>
|
||||
<Button autoFocus onClick={handleSubmit} button="primary" disabled={isPending} label={__('Confirm')} />
|
||||
<Button button="link" label={__('Cancel')} onClick={() => setIsConfirming(false)} />
|
||||
</div>
|
||||
</>
|
||||
// only show the prompt to earn more if its lbc or boost tab and no balance
|
||||
// otherwise you can show the full prompt
|
||||
) : (!((activeTab === TAB_LBC || activeTab === TAB_BOOST) && noBalance)
|
||||
? <>
|
||||
) : !((activeTab === TAB_LBC || activeTab === TAB_BOOST) && noBalance) ? (
|
||||
<>
|
||||
<div className="section">
|
||||
<ChannelSelector />
|
||||
</div>
|
||||
|
||||
{activeTab === TAB_FIAT && !hasCardSaved && (
|
||||
<h3 className="add-card-prompt">
|
||||
<Button navigate={`/$/${PAGES.SETTINGS_STRIPE_CARD}`} label={__('Add a Card')} button="link" />
|
||||
{' '}{__('To Tip Creators')}
|
||||
<Button navigate={`/$/${PAGES.SETTINGS_STRIPE_CARD}`} label={__('Add a Card')} button="link" />{' '}
|
||||
{__('To Tip Creators')}
|
||||
</h3>
|
||||
)}
|
||||
|
||||
|
@ -625,13 +639,16 @@ function WalletSendTip(props: Props) {
|
|||
<div className="help">{__('The payment will be made from your saved card')}</div>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
// if it's LBC and there is no balance, you can prompt to purchase LBC
|
||||
: <Card
|
||||
title={<I18nMessage tokens={{ lbc: <LbcSymbol size={22} /> }}>Supporting content requires %lbc%</I18nMessage>}
|
||||
<Card
|
||||
title={
|
||||
<I18nMessage tokens={{ lbc: <LbcSymbol size={22} /> }}>Supporting content requires %lbc%</I18nMessage>
|
||||
}
|
||||
subtitle={
|
||||
<I18nMessage tokens={{ lbc: <LbcSymbol /> }}>
|
||||
With %lbc%, you can send tips to your favorite creators, or help boost their content for more people to
|
||||
see.
|
||||
With %lbc%, you can send tips to your favorite creators, or help boost their content for more people
|
||||
to see.
|
||||
</I18nMessage>
|
||||
}
|
||||
actions={
|
||||
|
@ -642,7 +659,12 @@ function WalletSendTip(props: Props) {
|
|||
label={__('Earn Rewards')}
|
||||
navigate={`/$/${PAGES.REWARDS}`}
|
||||
/>
|
||||
<Button icon={ICONS.BUY} button="secondary" label={__('Buy/Swap Credits')} navigate={`/$/${PAGES.BUY}`} />
|
||||
<Button
|
||||
icon={ICONS.BUY}
|
||||
button="secondary"
|
||||
label={__('Buy/Swap Credits')}
|
||||
navigate={`/$/${PAGES.BUY}`}
|
||||
/>
|
||||
<Button button="link" label={__('Nevermind')} onClick={closeModal} />
|
||||
</div>
|
||||
}
|
||||
|
|
|
@ -11,14 +11,8 @@ import classnames from 'classnames';
|
|||
import usePersistedState from 'effects/use-persisted-state';
|
||||
import WalletSpendableBalanceHelp from 'component/walletSpendableBalanceHelp';
|
||||
import { Lbryio } from 'lbryinc';
|
||||
import { STRIPE_PUBLIC_KEY } from 'config';
|
||||
|
||||
let stripeEnvironment = 'test';
|
||||
// if the key contains pk_live it's a live key
|
||||
// update the environment for the calls to the backend to indicate which environment to hit
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
stripeEnvironment = 'live';
|
||||
}
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
let stripeEnvironment = getStripeEnvironment();
|
||||
|
||||
const DEFAULT_TIP_AMOUNTS = [1, 5, 25, 100];
|
||||
|
||||
|
@ -76,6 +70,7 @@ function WalletTipAmountSelector(props: Props) {
|
|||
|
||||
// check if creator has a payment method saved
|
||||
React.useEffect(() => {
|
||||
if (stripeEnvironment) {
|
||||
Lbryio.call(
|
||||
'customer',
|
||||
'status',
|
||||
|
@ -92,10 +87,12 @@ function WalletTipAmountSelector(props: Props) {
|
|||
|
||||
setHasSavedCard(Boolean(defaultPaymentMethodId));
|
||||
});
|
||||
}, []);
|
||||
}
|
||||
}, [stripeEnvironment]);
|
||||
|
||||
//
|
||||
React.useEffect(() => {
|
||||
if (stripeEnvironment) {
|
||||
Lbryio.call(
|
||||
'account',
|
||||
'check',
|
||||
|
@ -114,7 +111,8 @@ function WalletTipAmountSelector(props: Props) {
|
|||
.catch(function (error) {
|
||||
// console.log(error);
|
||||
});
|
||||
}, []);
|
||||
}
|
||||
}, [stripeEnvironment]);
|
||||
|
||||
React.useEffect(() => {
|
||||
// setHasSavedCard(false);
|
||||
|
|
2
ui/constants/stripe.js
Normal file
2
ui/constants/stripe.js
Normal file
|
@ -0,0 +1,2 @@
|
|||
export const TEST = 'test';
|
||||
export const LIVE = 'live';
|
|
@ -5,43 +5,19 @@ import Card from 'component/common/card';
|
|||
import Button from 'component/button';
|
||||
import * as ICONS from 'constants/icons';
|
||||
import { Lbryio } from 'lbryinc';
|
||||
import { STRIPE_PUBLIC_KEY } from 'config';
|
||||
|
||||
let stripeEnvironment = 'test';
|
||||
// if the key contains pk_live it's a live key
|
||||
// update the environment for the calls to the backend to indicate which environment to hit
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
stripeEnvironment = 'live';
|
||||
}
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
let stripeEnvironment = getStripeEnvironment();
|
||||
|
||||
type Props = {
|
||||
closeModal: () => void,
|
||||
abandonTxo: (Txo, () => void) => void,
|
||||
abandonClaim: (string, number, ?() => void) => void,
|
||||
tx: Txo,
|
||||
claim: GenericClaim,
|
||||
cb: () => void,
|
||||
doResolveUri: (string) => void,
|
||||
uri: string,
|
||||
paymentMethodId: string,
|
||||
setAsConfirmingCard: () => void,
|
||||
setAsConfirmingCard: () => void, // ?
|
||||
};
|
||||
|
||||
export default function ModalRevokeClaim(props: Props) {
|
||||
var that = this;
|
||||
console.log(that);
|
||||
|
||||
console.log(props);
|
||||
|
||||
const { closeModal, uri, paymentMethodId, setAsConfirmingCard } = props;
|
||||
|
||||
console.log(uri);
|
||||
|
||||
console.log(setAsConfirmingCard);
|
||||
export default function ModalRemoveCard(props: Props) {
|
||||
const { closeModal, paymentMethodId } = props;
|
||||
|
||||
function removeCard() {
|
||||
console.log(paymentMethodId);
|
||||
|
||||
Lbryio.call(
|
||||
'customer',
|
||||
'detach',
|
||||
|
@ -51,11 +27,9 @@ export default function ModalRevokeClaim(props: Props) {
|
|||
},
|
||||
'post'
|
||||
).then((removeCardResponse) => {
|
||||
console.log(removeCardResponse);
|
||||
|
||||
// TODO: add toast here
|
||||
// closeModal();
|
||||
|
||||
// Is there a better way to handle this? Why reload?
|
||||
window.location.reload();
|
||||
});
|
||||
}
|
||||
|
@ -63,15 +37,14 @@ export default function ModalRevokeClaim(props: Props) {
|
|||
return (
|
||||
<Modal ariaHideApp={false} isOpen contentLabel={'hello'} type="card" onAborted={closeModal}>
|
||||
<Card
|
||||
title={'Confirm Remove Card'}
|
||||
// body={getMsgBody(type, isSupport, name)}
|
||||
title={__('Confirm Remove Card')}
|
||||
actions={
|
||||
<div className="section__actions">
|
||||
<Button
|
||||
className="stripe__confirm-remove-card"
|
||||
button="secondary"
|
||||
icon={ICONS.DELETE}
|
||||
label={'Remove Card'}
|
||||
label={__('Remove Card')}
|
||||
onClick={removeCard}
|
||||
/>
|
||||
<Button button="link" label={__('Cancel')} onClick={closeModal} />
|
||||
|
|
|
@ -12,7 +12,6 @@ import FileRenderDownload from 'component/fileRenderDownload';
|
|||
import RecommendedContent from 'component/recommendedContent';
|
||||
import CollectionContent from 'component/collectionContentSidebar';
|
||||
import CommentsList from 'component/commentsList';
|
||||
import { Redirect } from 'react-router';
|
||||
import Button from 'component/button';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
import Empty from 'component/common/empty';
|
||||
|
@ -145,10 +144,6 @@ function FilePage(props: Props) {
|
|||
);
|
||||
}
|
||||
|
||||
if (!claimIsMine && isLivestream) {
|
||||
return <Redirect to={`/$/${PAGES.LIVESTREAM}`} />;
|
||||
}
|
||||
|
||||
if (obscureNsfw && isMature) {
|
||||
return (
|
||||
<Page className="file-page" filePage isMarkdown={isMarkdown}>
|
||||
|
|
|
@ -20,6 +20,7 @@ import { SIMPLE_SITE } from 'config';
|
|||
import homepages from 'homepages';
|
||||
import { Lbryio } from 'lbryinc';
|
||||
import Yrbl from 'component/yrbl';
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
|
||||
type Price = {
|
||||
currency: string,
|
||||
|
@ -451,7 +452,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
{/* @endif */}
|
||||
|
||||
{/* @if TARGET='web' */}
|
||||
{user && (
|
||||
{user && getStripeEnvironment() && (
|
||||
<Card
|
||||
title={__('Bank Accounts')}
|
||||
subtitle={__('Connect a bank account to receive tips and compensation in your local currency')}
|
||||
|
@ -470,7 +471,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
{/* @endif */}
|
||||
|
||||
{/* @if TARGET='web' */}
|
||||
{isAuthenticated && (
|
||||
{isAuthenticated && getStripeEnvironment() && (
|
||||
<Card
|
||||
title={__('Payment Methods')}
|
||||
subtitle={__('Add a credit card to tip creators in their local currency')}
|
||||
|
|
|
@ -7,17 +7,12 @@ 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 { URL, WEBPACK_WEB_PORT } from 'config';
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
|
||||
const isDev = process.env.NODE_ENV !== 'production';
|
||||
|
||||
let stripeEnvironment = 'test';
|
||||
// if the key contains pk_live it's a live key
|
||||
// update the environment for the calls to the backend to indicate which environment to hit
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
stripeEnvironment = 'live';
|
||||
}
|
||||
|
||||
let stripeEnvironment = getStripeEnvironment();
|
||||
let successStripeRedirectUrl, failureStripeRedirectUrl;
|
||||
let successEndpoint = '/$/settings/tip_account';
|
||||
let failureEndpoint = '/$/settings/tip_account';
|
||||
|
@ -46,7 +41,7 @@ type State = {
|
|||
unpaidBalance: number,
|
||||
pageTitle: string,
|
||||
stillRequiringVerification: boolean,
|
||||
accountTransactions: any
|
||||
accountTransactions: any,
|
||||
};
|
||||
|
||||
class StripeAccountConnection extends React.Component<Props, State> {
|
||||
|
@ -144,7 +139,10 @@ class StripeAccountConnection extends React.Component<Props, State> {
|
|||
stillRequiringVerification: false,
|
||||
};
|
||||
|
||||
if ((eventuallyDueInformation && eventuallyDueInformation.length) || (currentlyDueInformation && currentlyDueInformation.length)) {
|
||||
if (
|
||||
(eventuallyDueInformation && eventuallyDueInformation.length) ||
|
||||
(currentlyDueInformation && currentlyDueInformation.length)
|
||||
) {
|
||||
objectToUpdateState.stillRequiringVerification = true;
|
||||
getAndSetAccountLink(false);
|
||||
}
|
||||
|
@ -233,8 +231,17 @@ class StripeAccountConnection extends React.Component<Props, State> {
|
|||
<div>
|
||||
<div>
|
||||
<h3>{__('Congratulations! Your account has been connected with Odysee.')}</h3>
|
||||
{stillRequiringVerification && <><h3 style={{marginTop: '10px'}}>Although your account is connected it still requires verification to begin receiving tips.</h3>
|
||||
<h3 style={{marginTop: '10px'}}>Please use the button below to complete your verification process and enable tipping for your account.</h3></> }
|
||||
{stillRequiringVerification && (
|
||||
<>
|
||||
<h3 style={{ marginTop: '10px' }}>
|
||||
Although your account is connected it still requires verification to begin receiving tips.
|
||||
</h3>
|
||||
<h3 style={{ marginTop: '10px' }}>
|
||||
Please use the button below to complete your verification process and enable tipping for
|
||||
your account.
|
||||
</h3>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -254,9 +261,7 @@ class StripeAccountConnection extends React.Component<Props, State> {
|
|||
<br />
|
||||
<div>
|
||||
<h3>
|
||||
{__(
|
||||
'Connect your bank account to be able to cash your pending balance out to your account.'
|
||||
)}
|
||||
{__('Connect your bank account to be able to cash your pending balance out to your account.')}
|
||||
</h3>
|
||||
</div>
|
||||
<div className="section__actions">
|
||||
|
@ -271,19 +276,23 @@ class StripeAccountConnection extends React.Component<Props, State> {
|
|||
</div>
|
||||
}
|
||||
actions={
|
||||
<>{ stillRequiringVerification && <Button
|
||||
<>
|
||||
{stillRequiringVerification && (
|
||||
<Button
|
||||
button="primary"
|
||||
label={__('Complete Verification')}
|
||||
icon={ICONS.SETTINGS}
|
||||
navigate={stripeConnectionUrl}
|
||||
className="stripe__complete-verification-button"
|
||||
/> }
|
||||
/>
|
||||
)}
|
||||
<Button
|
||||
button="secondary"
|
||||
label={__('View Transactions')}
|
||||
icon={ICONS.SETTINGS}
|
||||
navigate={`/$/${PAGES.WALLET}?tab=fiat-payment-history`}
|
||||
/></>
|
||||
/>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
<br />
|
||||
|
|
|
@ -5,19 +5,14 @@ import React from 'react';
|
|||
import Page from 'component/page';
|
||||
import Card from 'component/common/card';
|
||||
import { Lbryio } from 'lbryinc';
|
||||
import { STRIPE_PUBLIC_KEY } from 'config';
|
||||
import Plastic from 'react-plastic';
|
||||
import Button from 'component/button';
|
||||
import * as ICONS from 'constants/icons';
|
||||
import * as MODALS from 'constants/modal_types';
|
||||
import * as PAGES from 'constants/pages';
|
||||
|
||||
let stripeEnvironment = 'test';
|
||||
// if the key contains pk_live it's a live key
|
||||
// update the environment for the calls to the backend to indicate which environment to hit
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
stripeEnvironment = 'live';
|
||||
}
|
||||
import { STRIPE_PUBLIC_KEY } from 'config';
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
let stripeEnvironment = getStripeEnvironment();
|
||||
|
||||
const APIS_DOWN_ERROR_RESPONSE = __('There was an error from the server, please try again later');
|
||||
const CARD_SETUP_ERROR_RESPONSE = __('There was an error getting your card setup, please try again later');
|
||||
|
@ -79,6 +74,7 @@ class SettingsStripeCard extends React.Component<Props, State> {
|
|||
// TODO: fix this, should be a cleaner way
|
||||
setTimeout(function () {
|
||||
// check if customer has card setup already
|
||||
if (stripeEnvironment) {
|
||||
Lbryio.call(
|
||||
'customer',
|
||||
'status',
|
||||
|
@ -187,6 +183,7 @@ class SettingsStripeCard extends React.Component<Props, State> {
|
|||
doToast({ message: CARD_SETUP_ERROR_RESPONSE, isError: true });
|
||||
}
|
||||
});
|
||||
}
|
||||
}, 250);
|
||||
|
||||
function setupStripe() {
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
// @flow
|
||||
import { DOMAIN } from 'config';
|
||||
import { DOMAIN, ENABLE_NO_SOURCE_CLAIMS } from 'config';
|
||||
import * as PAGES from 'constants/pages';
|
||||
import React, { useEffect } from 'react';
|
||||
import { lazyImport } from 'util/lazyImport';
|
||||
|
@ -199,7 +199,7 @@ function ShowPage(props: Props) {
|
|||
/>
|
||||
</Page>
|
||||
);
|
||||
} else if (isLivestream) {
|
||||
} else if (isLivestream && ENABLE_NO_SOURCE_CLAIMS) {
|
||||
innerContent = <LivestreamPage uri={uri} />;
|
||||
} else {
|
||||
innerContent = <FilePage uri={uri} location={location} />;
|
||||
|
|
|
@ -12,8 +12,8 @@ import * as PAGES from 'constants/pages';
|
|||
import Spinner from 'component/spinner';
|
||||
import YrblWalletEmpty from 'component/yrblWalletEmpty';
|
||||
import { Lbryio } from 'lbryinc';
|
||||
import { STRIPE_PUBLIC_KEY } from 'config';
|
||||
import { Tabs, TabList, Tab, TabPanels, TabPanel } from 'component/common/tabs';
|
||||
import { getStripeEnvironment } from 'util/stripe';
|
||||
|
||||
const TAB_QUERY = 'tab';
|
||||
|
||||
|
@ -23,12 +23,7 @@ const TABS = {
|
|||
PAYMENT_HISTORY: 'fiat-payment-history',
|
||||
};
|
||||
|
||||
let stripeEnvironment = 'test';
|
||||
// if the key contains pk_live it's a live key
|
||||
// update the environment for the calls to the backend to indicate which environment to hit
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
stripeEnvironment = 'live';
|
||||
}
|
||||
let stripeEnvironment = getStripeEnvironment();
|
||||
|
||||
type Props = {
|
||||
history: { action: string, push: (string) => void, replace: (string) => void },
|
||||
|
@ -119,6 +114,9 @@ const WalletPage = (props: Props) => {
|
|||
React.useEffect(() => {
|
||||
(async function () {
|
||||
try {
|
||||
if (!stripeEnvironment) {
|
||||
return;
|
||||
}
|
||||
const response = await getAccountStatus();
|
||||
|
||||
setAccountStatusResponse(response);
|
||||
|
@ -131,23 +129,27 @@ const WalletPage = (props: Props) => {
|
|||
console.log(err);
|
||||
}
|
||||
})();
|
||||
}, []);
|
||||
}, [stripeEnvironment]);
|
||||
|
||||
// populate customer payment data
|
||||
React.useEffect(() => {
|
||||
(async function () {
|
||||
try {
|
||||
// get card payments customer has made
|
||||
if (!stripeEnvironment) {
|
||||
return;
|
||||
}
|
||||
let customerTransactionResponse = await getPaymentHistory();
|
||||
|
||||
if (customerTransactionResponse && customerTransactionResponse.length) {
|
||||
customerTransactionResponse.reverse();
|
||||
}
|
||||
|
||||
setCustomerTransactions(customerTransactionResponse);
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
}
|
||||
})();
|
||||
}, []);
|
||||
}, [stripeEnvironment]);
|
||||
|
||||
// @endif
|
||||
|
||||
|
@ -157,7 +159,7 @@ const WalletPage = (props: Props) => {
|
|||
|
||||
return (
|
||||
<>
|
||||
{/* @if TARGET='web' */}
|
||||
{stripeEnvironment && (
|
||||
<Page>
|
||||
<Tabs onChange={onTabChange} index={tabIndex}>
|
||||
<TabList className="tabs__list--collection-edit-page">
|
||||
|
@ -199,15 +201,18 @@ const WalletPage = (props: Props) => {
|
|||
</TabPanel>
|
||||
<TabPanel>
|
||||
<div className="section card-stack">
|
||||
<WalletFiatPaymentBalance transactions={customerTransactions} accountDetails={accountStatusResponse} />
|
||||
<WalletFiatPaymentBalance
|
||||
transactions={customerTransactions}
|
||||
accountDetails={accountStatusResponse}
|
||||
/>
|
||||
<WalletFiatPaymentHistory transactions={customerTransactions} />
|
||||
</div>
|
||||
</TabPanel>
|
||||
</TabPanels>
|
||||
</Tabs>
|
||||
</Page>
|
||||
{/* @endif */}
|
||||
{/* @if TARGET='app' */}
|
||||
)}
|
||||
{!stripeEnvironment && (
|
||||
<Page>
|
||||
{loading && (
|
||||
<div className="main--empty">
|
||||
|
@ -227,7 +232,7 @@ const WalletPage = (props: Props) => {
|
|||
</>
|
||||
)}
|
||||
</Page>
|
||||
{/* @endif */}
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
13
ui/util/stripe.js
Normal file
13
ui/util/stripe.js
Normal file
|
@ -0,0 +1,13 @@
|
|||
// @flow
|
||||
import { STRIPE_PUBLIC_KEY } from 'config';
|
||||
import * as STRIPE_CONSTS from 'constants/stripe';
|
||||
export function getStripeEnvironment() {
|
||||
if (STRIPE_PUBLIC_KEY) {
|
||||
if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
|
||||
return STRIPE_CONSTS.LIVE;
|
||||
} else {
|
||||
return STRIPE_CONSTS.TEST;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
Loading…
Reference in a new issue