some desktop cleanup

This commit is contained in:
zeppi 2021-08-17 13:36:43 -04:00
parent 6e6fd61e90
commit 98c85fbc8e
11 changed files with 286 additions and 249 deletions

View file

@ -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/

View file

@ -2090,5 +2090,12 @@
"Expand Comments": "Expand Comments",
"Expand": "Expand",
"Load More": "Load More",
"You followed @Danheim!": "You followed @Danheim!",
"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.",
"Show this channel your appreciation by sending a donation of Credits. ": "Show this channel your appreciation by sending a donation of Credits. ",
"Review": "Review",
"Add a Card ": "Add a Card ",
" Tip Creators": " Tip Creators",
"--end--": "--end--"
}

View file

@ -24,7 +24,7 @@ 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) {
if (STRIPE_PUBLIC_KEY && STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
stripeEnvironment = 'live';
}
@ -245,10 +245,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 +268,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 +391,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,6 +533,7 @@ export function CommentCreate(props: Props) {
}}
/>
)}
{/* @if TARGET='web' */}
{!claimIsMine && (
<Button
disabled={disabled}
@ -546,6 +546,7 @@ export function CommentCreate(props: Props) {
}}
/>
)}
{/* @endif */}
{isReply && !minTip && (
<Button
button="link"

View file

@ -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,7 +145,7 @@ function WalletSendTip(props: Props) {
// console.log(error);
});
}
}, [channelClaimId]);
}, [channelClaimId, stripeEnvironment]);
const noBalance = balance === 0;
const tipAmount = useCustomTip ? customTipAmount : presetTipAmount;
@ -175,7 +171,9 @@ function WalletSendTip(props: Props) {
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>
}

View file

@ -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
View file

@ -0,0 +1,2 @@
export const TEST = 'test';
export const LIVE = 'live';

View file

@ -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}>

View file

@ -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() {

View file

@ -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} />;

View file

@ -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

13
ui/util/stripe.js Normal file
View 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;
}