diff --git a/client/src/components/Donation/components/DonateText.js b/client/src/components/Donation/components/DonateText.js index 7e4aa8211f..9b6543b0a5 100644 --- a/client/src/components/Donation/components/DonateText.js +++ b/client/src/components/Donation/components/DonateText.js @@ -1,30 +1,62 @@ import React from 'react'; -import { Row, Col } from '@freecodecamp/react-bootstrap'; + +import { Spacer, Link } from '../../../components/helpers'; const DonateText = () => { return ( - - -

freeCodeCamp is a highly efficient education nonprofit.

-

- In 2019 alone, we provided 18 million hours of free education to - people around the world. -

-

- Since freeCodeCamp's total budget is only $373,000, that means every - dollar you donate to freeCodeCamp translates into 50 hours worth of - technology education. -

-

- When you donate to freeCodeCamp, you help people learn new skills and - provide for their families. -

-

- You also help us create new resources for you to use to expand your - own technology skills. -

- -
+
+ +

How to donate to freeCodeCamp.org

+ +

freeCodeCamp is a tax-exempt 501(c)(3) public charity.

+ +

+ We get almost all of our budget from our supporters, who donate $5 per + month to our nonprofit. +

+ +

+ To become a supporter, just{' '} + start going through the curriculum and you will + see a prompt to donate. +

+ +

+ If you want to make a larger one-time donation, set up employer + matching, or support us in other ways, email team@freecodecamp.org and + we can help make that happen. +

+ + +

How does freeCodeCamp use these donations?

+ +

+ 100% of donations go to pay for servers, and to pay teachers and + developers who help build our learning resources. +

+ +

+ We earned the 2019 Platinum Seal of Transparency from Guidestar.org. You + can view all our nonprofit's details and download our accounting + documents [there](https://www.guidestar.org/profile/82-0779546). +

+ + +

How do I stop my monthly recurring donation.

+ +

+ Easy. Just forward a donation receipt to team@freecodecamp.org and we'll + stop it. +

+ + +

How do I restart my monthly recurring donation?

+ +

+ Email one of your old donation receipts to team@freecodecamp.org and + we'll restart it for you. +

+
); }; diff --git a/client/src/pages/donate.js b/client/src/pages/donate.js index 6992d5180e..8d9bfac705 100644 --- a/client/src/pages/donate.js +++ b/client/src/pages/donate.js @@ -1,105 +1,29 @@ -import React, { Component, Fragment } from 'react'; +import React, { Fragment } from 'react'; import Helmet from 'react-helmet'; -import PropTypes from 'prop-types'; -import { connect } from 'react-redux'; -import { createSelector } from 'reselect'; -import { Grid, Row, Col } from '@freecodecamp/react-bootstrap'; +import { Grid } from '@freecodecamp/react-bootstrap'; -import { stripePublicKey } from '../../config/env.json'; -import { Spacer, Loader, FullWidthRow } from '../components/helpers'; -import DonateForm from '../components/Donation/components/DonateForm'; +import { Spacer, FullWidthRow } from '../components/helpers'; import DonateText from '../components/Donation/components/DonateText'; -import { signInLoadingSelector, userSelector } from '../redux'; -import { stripeScriptLoader } from '../utils/scriptLoaders'; -const propTypes = { - isDonating: PropTypes.bool, - showLoading: PropTypes.bool.isRequired -}; - -const mapStateToProps = createSelector( - userSelector, - signInLoadingSelector, - ({ isDonating }, showLoading) => ({ - isDonating, - showLoading - }) -); - -export class DonatePage extends Component { - constructor(...props) { - super(...props); - this.state = { - stripe: null - }; - - this.handleStripeLoad = this.handleStripeLoad.bind(this); - } - - componentDidMount() { - if (window.Stripe) { - this.handleStripeLoad(); - } else if (document.querySelector('#stripe-js')) { - document - .querySelector('#stripe-js') - .addEventListener('load', this.handleStripeLoad); - } else { - stripeScriptLoader(this.handleStripeLoad); - } - } - - componentWillUnmount() { - const stripeMountPoint = document.querySelector('#stripe-js'); - if (stripeMountPoint) { - stripeMountPoint.removeEventListener('load', this.handleStripeLoad); - } - } - - handleStripeLoad() { - // Create Stripe instance once Stripe.js loads - if (stripePublicKey) { - this.setState(state => ({ - ...state, - stripe: window.Stripe(stripePublicKey) - })); - } - } - - render() { - const { stripe } = this.state; - const { showLoading } = this.props; - - if (showLoading) { - return ; - } - - return ( - - - -
- - -

Become a Supporter

-
- - - - - - - - - - -
-
-
- ); - } +function DonatePage() { + return ( + + + +
+ + +

Become a Supporter

+ +
+ + +
+
+
+ ); } DonatePage.displayName = 'DonatePage'; -DonatePage.propTypes = propTypes; -export default connect(mapStateToProps)(DonatePage); +export default DonatePage;