remove unused conditional
This commit is contained in:
parent
9d6bc66eae
commit
13f49cd169
1 changed files with 222 additions and 244 deletions
|
@ -405,266 +405,244 @@ function WalletSendTip(props: Props) {
|
|||
return (
|
||||
<Form onSubmit={handleSubmit}>
|
||||
{/* if there is no LBC balance, show user frontend to get credits */}
|
||||
{1 === 2 ? (
|
||||
<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.
|
||||
</I18nMessage>
|
||||
}
|
||||
actions={
|
||||
<div className="section__actions">
|
||||
<Button
|
||||
icon={ICONS.REWARDS}
|
||||
button="primary"
|
||||
label={__('Earn Rewards')}
|
||||
navigate={`/$/${PAGES.REWARDS}`}
|
||||
/>
|
||||
<Button icon={ICONS.BUY} button="secondary" label={__('Buy/Swap Credits')} navigate={`/$/${PAGES.BUY}`} />
|
||||
<Button button="link" label={__('Nevermind')} onClick={closeModal} />
|
||||
{/* 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} />}
|
||||
subtitle={
|
||||
<React.Fragment>
|
||||
{!claimIsMine && (
|
||||
<div className="section">
|
||||
{/* tip LBC tab button */}
|
||||
<Button
|
||||
key="tip"
|
||||
icon={ICONS.LBC}
|
||||
label={__('Tip')}
|
||||
button="alt"
|
||||
onClick={() => {
|
||||
var tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (!isConfirming) {
|
||||
setActiveTab(TAB_LBC);
|
||||
}
|
||||
}}
|
||||
className={classnames('button-toggle', { 'button-toggle--active': activeTab === TAB_LBC })}
|
||||
/>
|
||||
{/* tip fiat tab button */}
|
||||
{/* @if TARGET='web' */}
|
||||
<Button
|
||||
key="tip-fiat"
|
||||
icon={ICONS.FINANCE}
|
||||
label={__('Tip')}
|
||||
button="alt"
|
||||
onClick={() => {
|
||||
var tipInputElement = document.getElementById('tip-input');
|
||||
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
|
||||
key="boost"
|
||||
icon={ICONS.TRENDING}
|
||||
label={__('Boost')}
|
||||
button="alt"
|
||||
onClick={() => {
|
||||
var tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (!isConfirming) {
|
||||
setActiveTab(TAB_BOOST);
|
||||
}
|
||||
}}
|
||||
className={classnames('button-toggle', { 'button-toggle--active': activeTab === TAB_BOOST })}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* short explainer under the button */}
|
||||
<div className="section__subtitle">
|
||||
{explainerText + ' '}
|
||||
{/* {activeTab === TAB_FIAT && !hasCardSaved && <Button navigate={`/$/${PAGES.SETTINGS_STRIPE_CARD}`} label={__('Add A Card')} button="link" />} */}
|
||||
{<Button label={__('Learn more')} button="link" href="https://lbry.com/faq/tipping" />}
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
// 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} />}
|
||||
subtitle={
|
||||
<React.Fragment>
|
||||
{!claimIsMine && (
|
||||
</React.Fragment>
|
||||
}
|
||||
actions={
|
||||
// confirmation modal, allow user to confirm or cancel transaction
|
||||
isConfirming ? (
|
||||
<>
|
||||
<div className="section section--padded card--inline confirm__wrapper">
|
||||
<div className="section">
|
||||
{/* tip LBC tab button */}
|
||||
<div className="confirm__label">{__('To --[the tip recipient]--')}</div>
|
||||
<div className="confirm__value">{channelName || title}</div>
|
||||
<div className="confirm__label">{__('From --[the tip sender]--')}</div>
|
||||
<div className="confirm__value">
|
||||
{activeChannelClaim && !incognito ? activeChannelClaim.name : __('Anonymous')}
|
||||
</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} />}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="section__actions">
|
||||
<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)
|
||||
? <>
|
||||
<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')}
|
||||
</h3>
|
||||
)}
|
||||
|
||||
{/* section to pick tip/boost amount */}
|
||||
<div className="section">
|
||||
{DEFAULT_TIP_AMOUNTS.map((amount) => (
|
||||
<Button
|
||||
key="tip"
|
||||
icon={ICONS.LBC}
|
||||
label={__('Tip')}
|
||||
key={amount}
|
||||
disabled={shouldDisableAmountSelector(amount)}
|
||||
button="alt"
|
||||
className={classnames('button-toggle button-toggle--expandformobile', {
|
||||
'button-toggle--active': tipAmount === amount && !useCustomTip,
|
||||
'button-toggle--disabled': amount > balance,
|
||||
})}
|
||||
label={amount}
|
||||
icon={iconToUse}
|
||||
onClick={() => {
|
||||
var tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (!isConfirming) {
|
||||
setActiveTab(TAB_LBC);
|
||||
}
|
||||
setPresetTipAmount(amount);
|
||||
setUseCustomTip(false);
|
||||
}}
|
||||
className={classnames('button-toggle', { 'button-toggle--active': activeTab === TAB_LBC })}
|
||||
/>
|
||||
{/* tip fiat tab button */}
|
||||
{/* @if TARGET='web' */}
|
||||
))}
|
||||
|
||||
<Button
|
||||
button="alt"
|
||||
className={classnames('button-toggle button-toggle--expandformobile', {
|
||||
'button-toggle--active': useCustomTip, // set as active
|
||||
})}
|
||||
icon={iconToUse}
|
||||
label={__('Custom')}
|
||||
onClick={() => setUseCustomTip(true)}
|
||||
// disabled if it's receive fiat and there is no card or creator can't receive tips
|
||||
disabled={activeTab === TAB_FIAT && (!hasCardSaved || !canReceiveFiatTip)}
|
||||
/>
|
||||
|
||||
{DEFAULT_TIP_AMOUNTS.some((val) => val > balance) && activeTab !== TAB_FIAT && (
|
||||
<Button
|
||||
key="tip-fiat"
|
||||
icon={ICONS.FINANCE}
|
||||
label={__('Tip')}
|
||||
button="alt"
|
||||
onClick={() => {
|
||||
var tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (!isConfirming) {
|
||||
setActiveTab(TAB_FIAT);
|
||||
}
|
||||
}}
|
||||
className={classnames('button-toggle', { 'button-toggle--active': activeTab === TAB_FIAT })}
|
||||
button="secondary"
|
||||
className="button-toggle-group-action"
|
||||
icon={ICONS.BUY}
|
||||
title={__('Buy or swap more LBRY Credits')}
|
||||
navigate={`/$/${PAGES.BUY}`}
|
||||
/>
|
||||
{/* @endif */}
|
||||
{/* tip LBC tab button */}
|
||||
<Button
|
||||
key="boost"
|
||||
icon={ICONS.TRENDING}
|
||||
label={__('Boost')}
|
||||
button="alt"
|
||||
onClick={() => {
|
||||
var tipInputElement = document.getElementById('tip-input');
|
||||
if (tipInputElement) { tipInputElement.focus() }
|
||||
if (!isConfirming) {
|
||||
setActiveTab(TAB_BOOST);
|
||||
}
|
||||
)}
|
||||
</div>
|
||||
|
||||
{useCustomTip && (
|
||||
<div className="section">
|
||||
<FormField
|
||||
autoFocus
|
||||
name="tip-input"
|
||||
label={
|
||||
<React.Fragment>
|
||||
{__('Custom support amount')}{' '}
|
||||
{activeTab !== TAB_FIAT ? (
|
||||
<I18nMessage
|
||||
tokens={{ lbc_balance: <CreditAmount precision={4} amount={balance} showLBC={false} /> }}
|
||||
>
|
||||
(%lbc_balance% Credits available)
|
||||
</I18nMessage>
|
||||
) : (
|
||||
'in USD'
|
||||
)}
|
||||
</React.Fragment>
|
||||
}
|
||||
className="form-field--price-amount"
|
||||
error={tipError}
|
||||
min="0"
|
||||
step="any"
|
||||
type="number"
|
||||
style={{
|
||||
width: activeTab === TAB_FIAT ? '99px' : '160px',
|
||||
}}
|
||||
className={classnames('button-toggle', { 'button-toggle--active': activeTab === TAB_BOOST })}
|
||||
placeholder="1.23"
|
||||
value={customTipAmount}
|
||||
onChange={(event) => handleCustomPriceChange(event)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* short explainer under the button */}
|
||||
<div className="section__subtitle">
|
||||
{explainerText + ' '}
|
||||
{/* {activeTab === TAB_FIAT && !hasCardSaved && <Button navigate={`/$/${PAGES.SETTINGS_STRIPE_CARD}`} label={__('Add A Card')} button="link" />} */}
|
||||
{<Button label={__('Learn more')} button="link" href="https://lbry.com/faq/tipping" />}
|
||||
{/* send tip/boost button */}
|
||||
<div className="section__actions">
|
||||
<Button
|
||||
autoFocus
|
||||
icon={isSupport ? ICONS.TRENDING : ICONS.SUPPORT}
|
||||
button="primary"
|
||||
type="submit"
|
||||
disabled={
|
||||
fetchingChannels ||
|
||||
isPending ||
|
||||
tipError ||
|
||||
!tipAmount ||
|
||||
(activeTab === TAB_FIAT && (!hasCardSaved || !canReceiveFiatTip))
|
||||
}
|
||||
label={buildButtonText()}
|
||||
/>
|
||||
{fetchingChannels && <span className="help">{__('Loading your channels...')}</span>}
|
||||
</div>
|
||||
</React.Fragment>
|
||||
}
|
||||
actions={
|
||||
// confirmation modal, allow user to confirm or cancel transaction
|
||||
isConfirming ? (
|
||||
<>
|
||||
<div className="section section--padded card--inline confirm__wrapper">
|
||||
<div className="section">
|
||||
<div className="confirm__label">{__('To --[the tip recipient]--')}</div>
|
||||
<div className="confirm__value">{channelName || title}</div>
|
||||
<div className="confirm__label">{__('From --[the tip sender]--')}</div>
|
||||
<div className="confirm__value">
|
||||
{activeChannelClaim && !incognito ? activeChannelClaim.name : __('Anonymous')}
|
||||
{activeTab !== TAB_FIAT ? (
|
||||
<WalletSpendableBalanceHelp />
|
||||
) : !canReceiveFiatTip ? (
|
||||
<div className="help">{__('Only select creators can receive tips at this time')}</div>
|
||||
) : (
|
||||
<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>}
|
||||
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.
|
||||
</I18nMessage>
|
||||
}
|
||||
actions={
|
||||
<div className="section__actions">
|
||||
<Button
|
||||
icon={ICONS.REWARDS}
|
||||
button="primary"
|
||||
label={__('Earn Rewards')}
|
||||
navigate={`/$/${PAGES.REWARDS}`}
|
||||
/>
|
||||
<Button icon={ICONS.BUY} button="secondary" label={__('Buy/Swap Credits')} navigate={`/$/${PAGES.BUY}`} />
|
||||
<Button button="link" label={__('Nevermind')} onClick={closeModal} />
|
||||
</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} />}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="section__actions">
|
||||
<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)
|
||||
? <>
|
||||
<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')}
|
||||
</h3>
|
||||
)}
|
||||
|
||||
{/* section to pick tip/boost amount */}
|
||||
<div className="section">
|
||||
{DEFAULT_TIP_AMOUNTS.map((amount) => (
|
||||
<Button
|
||||
key={amount}
|
||||
disabled={shouldDisableAmountSelector(amount)}
|
||||
button="alt"
|
||||
className={classnames('button-toggle button-toggle--expandformobile', {
|
||||
'button-toggle--active': tipAmount === amount && !useCustomTip,
|
||||
'button-toggle--disabled': amount > balance,
|
||||
})}
|
||||
label={amount}
|
||||
icon={iconToUse}
|
||||
onClick={() => {
|
||||
setPresetTipAmount(amount);
|
||||
setUseCustomTip(false);
|
||||
}}
|
||||
/>
|
||||
))}
|
||||
|
||||
<Button
|
||||
button="alt"
|
||||
className={classnames('button-toggle button-toggle--expandformobile', {
|
||||
'button-toggle--active': useCustomTip, // set as active
|
||||
})}
|
||||
icon={iconToUse}
|
||||
label={__('Custom')}
|
||||
onClick={() => setUseCustomTip(true)}
|
||||
// disabled if it's receive fiat and there is no card or creator can't receive tips
|
||||
disabled={activeTab === TAB_FIAT && (!hasCardSaved || !canReceiveFiatTip)}
|
||||
/>
|
||||
|
||||
{DEFAULT_TIP_AMOUNTS.some((val) => val > balance) && activeTab !== TAB_FIAT && (
|
||||
<Button
|
||||
button="secondary"
|
||||
className="button-toggle-group-action"
|
||||
icon={ICONS.BUY}
|
||||
title={__('Buy or swap more LBRY Credits')}
|
||||
navigate={`/$/${PAGES.BUY}`}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{useCustomTip && (
|
||||
<div className="section">
|
||||
<FormField
|
||||
autoFocus
|
||||
name="tip-input"
|
||||
label={
|
||||
<React.Fragment>
|
||||
{__('Custom support amount')}{' '}
|
||||
{activeTab !== TAB_FIAT ? (
|
||||
<I18nMessage
|
||||
tokens={{ lbc_balance: <CreditAmount precision={4} amount={balance} showLBC={false} /> }}
|
||||
>
|
||||
(%lbc_balance% Credits available)
|
||||
</I18nMessage>
|
||||
) : (
|
||||
'in USD'
|
||||
)}
|
||||
</React.Fragment>
|
||||
}
|
||||
className="form-field--price-amount"
|
||||
error={tipError}
|
||||
min="0"
|
||||
step="any"
|
||||
type="number"
|
||||
style={{
|
||||
width: activeTab === TAB_FIAT ? '99px' : '160px',
|
||||
}}
|
||||
placeholder="1.23"
|
||||
value={customTipAmount}
|
||||
onChange={(event) => handleCustomPriceChange(event)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* send tip/boost button */}
|
||||
<div className="section__actions">
|
||||
<Button
|
||||
autoFocus
|
||||
icon={isSupport ? ICONS.TRENDING : ICONS.SUPPORT}
|
||||
button="primary"
|
||||
type="submit"
|
||||
disabled={
|
||||
fetchingChannels ||
|
||||
isPending ||
|
||||
tipError ||
|
||||
!tipAmount ||
|
||||
(activeTab === TAB_FIAT && (!hasCardSaved || !canReceiveFiatTip))
|
||||
}
|
||||
label={buildButtonText()}
|
||||
/>
|
||||
{fetchingChannels && <span className="help">{__('Loading your channels...')}</span>}
|
||||
</div>
|
||||
{activeTab !== TAB_FIAT ? (
|
||||
<WalletSpendableBalanceHelp />
|
||||
) : !canReceiveFiatTip ? (
|
||||
<div className="help">{__('Only select creators can receive tips at this time')}</div>
|
||||
) : (
|
||||
<div className="help">{__('The payment will be made from your saved card')}</div>
|
||||
)}
|
||||
</> : <>
|
||||
<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.
|
||||
</I18nMessage>
|
||||
}
|
||||
actions={
|
||||
<div className="section__actions">
|
||||
<Button
|
||||
icon={ICONS.REWARDS}
|
||||
button="primary"
|
||||
label={__('Earn Rewards')}
|
||||
navigate={`/$/${PAGES.REWARDS}`}
|
||||
/>
|
||||
<Button icon={ICONS.BUY} button="secondary" label={__('Buy/Swap Credits')} navigate={`/$/${PAGES.BUY}`} />
|
||||
<Button button="link" label={__('Nevermind')} onClick={closeModal} />
|
||||
</div>
|
||||
}
|
||||
/></>
|
||||
)
|
||||
}
|
||||
/>
|
||||
)}
|
||||
}
|
||||
/></>
|
||||
)
|
||||
}
|
||||
/>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue