LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

disable review button if no card saved also some cleanup #6535

Merged
mayeaux merged 2 commits from hotfix-to-disable-review-button into master 2021-07-19 03:49:21 +02:00
Conversation 0 Commits 2 Files changed 3 +21 -20
3 changed files with 21 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
ui/component/commentCreate/view.jsx
View file

@ -84,16 +84,14 @@ export function CommentCreate(props: Props) {
const [commentValue, setCommentValue] = React.useState('');
const [advancedEditor, setAdvancedEditor] = usePersistedState('comment-editor-mode', false);
const hasChannels = channels && channels.length;
const disabled = isSubmitting || !activeChannelClaim || !commentValue.length;
const charCount = commentValue.length;
const [activeTab, setActiveTab] = React.useState('');
const [tipError, setTipError] = React.useState();
// React.useEffect(() => {
// setTipError('yes');
// }, []);
const disabled = isSubmitting || !activeChannelClaim || !commentValue.length;
const [shouldDisableReviewButton, setShouldDisableReviewButton] = React.useState();
function handleCommentChange(event) {
let commentValue;
@ -373,10 +371,10 @@ export function CommentCreate(props: Props) {
autoFocus={isReply}
textAreaMaxLength={livestream ? FF_MAX_CHARS_IN_LIVESTREAM_COMMENT : FF_MAX_CHARS_IN_COMMENT}
/>
{/* TODO: the tip validation is done in selector */}
{isSupportComment && (
<WalletTipAmountSelector
onTipErrorChange={setTipError}
shouldDisableReviewButton={setShouldDisableReviewButton}
claim={claim}
activeTab={activeTab}
amount={tipAmount}
@ -387,8 +385,7 @@ export function CommentCreate(props: Props) {
{isSupportComment ? (
<>
<Button
// TODO: add better check here
disabled={disabled || tipError}
disabled={disabled || tipError || shouldDisableReviewButton}
type="button"
button="primary"
icon={activeTab === TAB_LBC ? ICONS.LBC : ICONS.FINANCE}

4
ui/component/walletSendTip/view.jsx
View file

@ -476,8 +476,8 @@ function WalletSendTip(props: Props) {
{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 navigates={`/$/${PAGES.SETTINGS_STRIPE_CARD}`} label={__('Add a Card')} button="link" />
{' '}{__('To Tip Creators')}
</h3>
)}

26
ui/component/walletTipAmountSelector/view.jsx
View file

@ -34,25 +34,32 @@ type Props = {
uri: string,
onTipErrorChange: (string) => void,
activeTab: string,
shouldDisableReviewButton: (boolean) => void
};
function WalletTipAmountSelector(props: Props) {
const { balance, amount, onChange, activeTab, claim, onTipErrorChange } = props;
const { balance, amount, onChange, activeTab, claim, onTipErrorChange, shouldDisableReviewButton } = props;
const [useCustomTip, setUseCustomTip] = usePersistedState('comment-support:useCustomTip', false);
const [tipError, setTipError] = React.useState();
const [canReceiveFiatTip, setCanReceiveFiatTip] = React.useState(); // dont persist because it needs to be calc'd per creator
const [hasCardSaved, setHasSavedCard] = usePersistedState('comment-support:hasCardSaved', false);
// if it's fiat but there's no card saved OR the creator can't receive fiat tips
const shouldDisableFiatSelectors = (activeTab === TAB_FIAT && (!hasCardSaved || !canReceiveFiatTip));
/**
* whether tip amount selection/review functionality should be disabled
* @param [amount] LBC amount (optional)
* @returns {boolean}
*/
function shouldDisableAmountSelector(amount) {
return (
(amount > balance && activeTab !== TAB_FIAT) || (activeTab === TAB_FIAT && (!hasCardSaved || !canReceiveFiatTip))
);
// if it's LBC but the balance isn't enough, or fiat conditions met
// $FlowFixMe
return (amount > balance && activeTab !== TAB_FIAT) || shouldDisableFiatSelectors;
}
console.log(activeTab);
console.log(claim);
shouldDisableReviewButton(shouldDisableFiatSelectors);
jessopb commented 2021-07-18 23:23:39 +02:00 (Migrated from github.com)
Review
Copy link

if you supply an inititial value to useState(false), flow wouldn't complain here.

if you supply an inititial value to useState(false), flow wouldn't complain here.
// setup variables for tip API
let channelClaimId, tipChannelName;
@ -83,9 +90,6 @@ function WalletTipAmountSelector(props: Props) {
customerStatusResponse.Customer.invoice_settings.default_payment_method &&
customerStatusResponse.Customer.invoice_settings.default_payment_method.id;
console.log('here');
console.log(defaultPaymentMethodId);
setHasSavedCard(Boolean(defaultPaymentMethodId));
});
}, []);
@ -230,6 +234,7 @@ function WalletTipAmountSelector(props: Props) {
<FormField
autoFocus
name="tip-input"
disabled={shouldDisableAmountSelector()}
label={
activeTab === TAB_LBC ? (
<React.Fragment>
@ -239,7 +244,6 @@ function WalletTipAmountSelector(props: Props) {
</I18nMessage>
</React.Fragment>
) : (
// TODO: add conditional based on hasSavedCard
<></>
)