From 8db0f89634f7663b18c593ad36696bcd6176a96e Mon Sep 17 00:00:00 2001 From: Mrugesh Mohapatra Date: Wed, 18 Dec 2019 10:46:13 +0530 Subject: [PATCH] fix(donate): remove isDontating check from year-end --- api-server/server/boot/donate.js | 15 +-- .../Donation/components/DonateCompletion.js | 22 +++- .../components/DonateFormChildViewForHOC.js | 4 +- .../YearEndGift/YearEndDonationForm.js | 111 ++++-------------- client/src/components/YearEndGift/index.js | 24 ---- client/src/pages/year-end-gift-successful.js | 35 ++++++ client/src/pages/year-end-gift.js | 16 ++- 7 files changed, 95 insertions(+), 132 deletions(-) delete mode 100644 client/src/components/YearEndGift/index.js create mode 100644 client/src/pages/year-end-gift-successful.js diff --git a/api-server/server/boot/donate.js b/api-server/server/boot/donate.js index c5253af3f6..365fc716ab 100644 --- a/api-server/server/boot/donate.js +++ b/api-server/server/boot/donate.js @@ -273,16 +273,6 @@ export default function donateBoot(app, done) { }; return Promise.resolve(fccUser) - .then(nonDonatingUser => { - const { isDonating } = nonDonatingUser; - if (isDonating) { - throw { - message: `User already has active donation(s).`, - type: 'AlreadyDonatingError' - }; - } - return nonDonatingUser; - }) .then(createCustomer) .then(customer => { return createOneTimeCharge(customer).then(charge => { @@ -292,10 +282,7 @@ export default function donateBoot(app, done) { }) .then(createAsyncUserDonation) .catch(err => { - if ( - err.type === 'StripeCardError' || - err.type === 'AlreadyDonatingError' - ) { + if (err.type === 'StripeCardError') { return res.status(402).send({ error: err.message }); } return res diff --git a/client/src/components/Donation/components/DonateCompletion.js b/client/src/components/Donation/components/DonateCompletion.js index 93a1695a6d..7cfb3a4434 100644 --- a/client/src/components/Donation/components/DonateCompletion.js +++ b/client/src/components/Donation/components/DonateCompletion.js @@ -9,16 +9,25 @@ const propTypes = { error: PropTypes.string, processing: PropTypes.bool, reset: PropTypes.func.isRequired, - success: PropTypes.bool + success: PropTypes.bool, + yearEndGift: PropTypes.bool }; -function DonateCompletion({ processing, reset, success, error = null }) { +function DonateCompletion({ + processing, + reset, + success, + error = null, + yearEndGift = false +}) { /* eslint-disable no-nested-ternary */ const style = processing ? 'info' : success ? 'success' : 'danger'; const heading = processing ? 'We are processing your donation.' : success - ? 'Thank you for being a supporter.' + ? yearEndGift + ? 'Thank you for your donation.' + : 'Thank you for being a supporter.' : 'Something went wrong with your donation.'; return ( @@ -34,7 +43,7 @@ function DonateCompletion({ processing, reset, success, error = null }) { name='line-scale' /> )} - {success && ( + {success && !yearEndGift && (

Your donation will support free technology education for people @@ -42,6 +51,11 @@ function DonateCompletion({ processing, reset, success, error = null }) {

)} + {success && yearEndGift && ( +
+

You should receive a receipt in your email.

+
+ )} {error &&

{error}

}
diff --git a/client/src/components/Donation/components/DonateFormChildViewForHOC.js b/client/src/components/Donation/components/DonateFormChildViewForHOC.js index 17836b0a48..7e58e97dae 100644 --- a/client/src/components/Donation/components/DonateFormChildViewForHOC.js +++ b/client/src/components/Donation/components/DonateFormChildViewForHOC.js @@ -223,12 +223,14 @@ class DonateFormChildViewForHOC extends Component { const { donationState: { processing, success, error } } = this.state; + const { yearEndGift } = this.props; if (processing || success || error) { return this.renderCompletion({ processing, success, error, - reset: this.resetDonation + reset: this.resetDonation, + yearEndGift }); } return this.renderDonateForm(); diff --git a/client/src/components/YearEndGift/YearEndDonationForm.js b/client/src/components/YearEndGift/YearEndDonationForm.js index aaaad0c63c..09da340637 100644 --- a/client/src/components/YearEndGift/YearEndDonationForm.js +++ b/client/src/components/YearEndGift/YearEndDonationForm.js @@ -2,8 +2,6 @@ /* eslint-disable react/jsx-sort-props */ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { connect } from 'react-redux'; -import { createSelector } from 'reselect'; import { Row, Col, @@ -17,20 +15,12 @@ import { Spacer } from '../helpers'; // eslint-disable-next-line max-len import DonateFormChildViewForHOC from '../Donation/components/DonateFormChildViewForHOC'; -import { userSelector } from '../../redux'; import './YearEndGift.css'; import '../Donation/Donation.css'; -import DonateCompletion from '../Donation/components/DonateCompletion.js'; import { stripePublicKey } from '../../../../config/env.json'; import { stripeScriptLoader } from '../../utils/scriptLoaders'; -const defaultYearEndStateConfig = { - donationAmount: 25000, - donationDuration: 'onetime', - paymentType: 'Card' -}; - const numToCommas = num => num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,'); @@ -43,23 +33,14 @@ const propTypes = { }) }; -const mapStateToProps = createSelector( - userSelector, - ({ isDonating }) => ({ - isDonating - }) -); - class YearEndDonationForm extends Component { constructor(...args) { super(...args); this.state = { - ...defaultYearEndStateConfig, + donationAmount: 25000, showOtherAmounts: false, - isDonating: this.props.isDonating, stripe: null }; - this.handleSelectPaymentType = this.handleSelectPaymentType.bind(this); this.handleStripeLoad = this.handleStripeLoad.bind(this); this.getDonationButtonLabel = this.getDonationButtonLabel.bind(this); this.handleSelectAmount = this.handleSelectAmount.bind(this); @@ -96,61 +77,33 @@ class YearEndDonationForm extends Component { } } - handleSelectPaymentType(e) { - this.setState({ - paymentType: e.currentTarget.value - }); - } - - getFormatedAmountLabel(amount) { - return `$${numToCommas(amount / 100)}`; - } - getDonationButtonLabel() { - const { donationAmount, donationDuration } = this.state; + const { donationAmount } = this.state; let donationBtnLabel = `Confirm your donation`; - if (donationDuration === 'onetime') { - donationBtnLabel = `Confirm your one-time donation of ${this.getFormatedAmountLabel( - donationAmount - )}`; - } else { - donationBtnLabel = `Confirm your donation of ${this.getFormatedAmountLabel( - donationAmount - )} ${donationDuration === 'month' ? 'per month' : 'per year'}`; - } + donationBtnLabel = `Confirm your one-time donation of $${numToCommas( + donationAmount / 100 + )}`; return donationBtnLabel; } renderDonationOptions() { - const { - donationAmount, - donationDuration, - paymentType, - stripe - } = this.state; + const { donationAmount, stripe } = this.state; const { showCloseBtn, defaultTheme } = this.props; return (
- {paymentType === 'Card' ? ( - - - - - - ) : ( -

- PayPal is currently unavailable. Please use a Credit/Debit card - instead. -

- )} + + + + +
); } @@ -238,9 +191,9 @@ class YearEndDonationForm extends Component { type='submit' name='submit' className='btn btn-block' - title='PayPal - The safer, easier way to pay online!' - alt='Donate with PayPal button' - value='Make a PayPal donation' + title='Donate to freeCodeCamp.org using PayPal' + alt='Donate to freeCodeCamp.org using PayPal' + value='Donate using PayPal' /> ); @@ -285,25 +238,12 @@ class YearEndDonationForm extends Component { } render() { - const { isDonating } = this.props; - if (isDonating) { - return ( - - - - - - ); - } - - console.log(this.state.donationAmount); - return ( - Thank you again for supporting freeCodeCamp.org with a one-time year - end gift. Please enter your credit card information below. + Thank you again for supporting freeCodeCamp.org with a one-time + year-end gift. Please enter your credit card information below. @@ -342,7 +282,4 @@ class YearEndDonationForm extends Component { YearEndDonationForm.displayName = 'YearEndDonationForm'; YearEndDonationForm.propTypes = propTypes; -export default connect( - mapStateToProps, - null -)(YearEndDonationForm); +export default YearEndDonationForm; diff --git a/client/src/components/YearEndGift/index.js b/client/src/components/YearEndGift/index.js deleted file mode 100644 index 2b1ac011c6..0000000000 --- a/client/src/components/YearEndGift/index.js +++ /dev/null @@ -1,24 +0,0 @@ -import React from 'react'; -import { Grid } from '@freecodecamp/react-bootstrap'; -import { Spacer, FullWidthRow } from '../../components/helpers'; -import YearEndDonationForm from './YearEndDonationForm'; - -const DonateText = () => { - return ( - -
- - -

Become a Supporter

- - - - -
- - ); -}; - -DonateText.displayName = ''; - -export default DonateText; diff --git a/client/src/pages/year-end-gift-successful.js b/client/src/pages/year-end-gift-successful.js new file mode 100644 index 0000000000..922d57174a --- /dev/null +++ b/client/src/pages/year-end-gift-successful.js @@ -0,0 +1,35 @@ +import React from 'react'; +import Helmet from 'react-helmet'; +import { Grid, Alert } from '@freecodecamp/react-bootstrap'; + +import { Spacer, FullWidthRow } from '../components/helpers'; + +import '../components/Donation/Donation.css'; + +function YearEndGiftPage() { + return ( + <> + + +
+ + + +
+

+ Thank you for your donation. +

+

You should receive a receipt in your email.

+
+ + + +
+ + + ); +} + +YearEndGiftPage.displayName = 'YearEndGiftPage'; + +export default YearEndGiftPage; diff --git a/client/src/pages/year-end-gift.js b/client/src/pages/year-end-gift.js index 36bb584cd9..a218b9f4bb 100644 --- a/client/src/pages/year-end-gift.js +++ b/client/src/pages/year-end-gift.js @@ -1,12 +1,24 @@ import React from 'react'; import Helmet from 'react-helmet'; -import YearEndGift from '../components/YearEndGift'; +import { Grid } from '@freecodecamp/react-bootstrap'; + +import { Spacer, FullWidthRow } from '../components/helpers'; +import YearEndDonationForm from '../components/YearEndGift/YearEndDonationForm'; function YearEndGiftPage() { return ( <> - + +
+ + + + + + +
+ ); }