fix(client): remove donate settings page

client/src/client-only-routes/ShowSettings.js

@@ -24,7 +24,6 @@ import Portfolio from '../components/settings/Portfolio';
 import Honesty from '../components/settings/Honesty';
 import Certification from '../components/settings/Certification';
 import DangerZone from '../components/settings/DangerZone';
-import SectionHeader from '../components/settings/SectionHeader.js';
 
 const propTypes = {
   createFlashMessage: PropTypes.func.isRequired,
@@ -55,7 +54,6 @@ const propTypes = {
     isApisMicroservicesCert: PropTypes.bool,
     isBackEndCert: PropTypes.bool,
     isDataVisCert: PropTypes.bool,
-    isDonating: PropTypes.bool,
     isEmailVerified: PropTypes.bool,
     isFrontEndCert: PropTypes.bool,
     isFrontEndLibsCert: PropTypes.bool,
@@ -124,7 +122,6 @@ export function ShowSettings(props) {
     user: {
       completedChallenges,
       email,
-      isDonating,
       is2018DataVisCert,
       isApisMicroservicesCert,
       isJsAlgoDataStructCert,
@@ -218,20 +215,6 @@ export function ShowSettings(props) {
             updateQuincyEmail={updateQuincyEmail}
           />
           <Spacer />
-          {isDonating ? (
-            <div>
-              <SectionHeader>Donation Settings</SectionHeader>
-              <FullWidthRow className='button-group'>
-                <Link
-                  className='btn-invert btn btn-lg btn-primary btn-block'
-                  to={`/donation/settings`}
-                >
-                  Manage your existing donations
-                </Link>
-              </FullWidthRow>
-              <Spacer />
-            </div>
-          ) : null}
           <Internet
             githubProfile={githubProfile}
             linkedin={linkedin}

client/src/components/Donation/components/DonateForm.js

@@ -36,7 +36,6 @@ const numToCommas = num =>
   num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,');
 
 const propTypes = {
-  enableDonationSettingsPage: PropTypes.func.isRequired,
   isDonating: PropTypes.bool,
   isSignedIn: PropTypes.bool,
   navigate: PropTypes.func.isRequired,
@@ -197,7 +196,7 @@ class DonateForm extends Component {
   }
 
   renderDonationOptions() {
-    const { stripe, enableDonationSettingsPage } = this.props;
+    const { stripe } = this.props;
     const { donationAmount, donationDuration, paymentType } = this.state;
     return (
       <div>
@@ -207,7 +206,6 @@ class DonateForm extends Component {
               <DonateFormChildViewForHOC
                 donationAmount={donationAmount}
                 donationDuration={donationDuration}
-                enableDonationSettingsPage={enableDonationSettingsPage}
                 getDonationButtonLabel={this.getDonationButtonLabel}
                 hideAmountOptionsCB={this.hideAmountOptionsCB}
               />

client/src/components/Donation/components/DonateFormChildViewForHOC.js

@@ -21,7 +21,6 @@ const propTypes = {
   donationAmount: PropTypes.number.isRequired,
   donationDuration: PropTypes.string.isRequired,
   email: PropTypes.string,
-  enableDonationSettingsPage: PropTypes.func.isRequired,
   getDonationButtonLabel: PropTypes.func.isRequired,
   hideAmountOptionsCB: PropTypes.func.isRequired,
   isSignedIn: PropTypes.bool,
@@ -120,7 +119,6 @@ class DonateFormChildViewForHOC extends Component {
   }
 
   postDonation(token) {
-    const { enableDonationSettingsPage } = this.props;
     const { donationAmount: amount, donationDuration: duration } = this.state;
     this.setState(state => ({
       ...state,
@@ -150,7 +148,6 @@ class DonateFormChildViewForHOC extends Component {
             error: data.error ? data.error : null
           }
         }));
-        enableDonationSettingsPage();
       })
       .catch(error => {
         const data =

client/src/components/Donation/components/DonateServicebotEmbed.js

@@ -1,71 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-
-import { servicebotId } from '../../../../config/env.json';
-import { servicebotScriptLoader } from '../../../utils/scriptLoaders';
-
-import '../Donation.css';
-
-const propTypes = {
-  email: PropTypes.string.isRequired,
-  hash: PropTypes.string.isRequired
-};
-
-export class DonationServicebotEmbed extends Component {
-  constructor(...props) {
-    super(...props);
-
-    this.state = {
-      email: this.props.email,
-      hash: this.props.hash
-    };
-
-    this.setServiceBotConfig = this.setServiceBotConfig.bind(this);
-  }
-
-  setServiceBotConfig() {
-    const { email, hash } = this.state;
-    /* eslint-disable camelcase */
-    window.servicebotSettings = {
-      type: 'portal',
-      servicebot_id: servicebotId,
-      service: 'freeCodeCamp.org',
-      email,
-      hash,
-      options: {
-        cancel_now: true,
-        disableCoupon: true,
-        forceCard: true,
-        hideTiers: [
-          'Monthly $3 Donation - Unavailable',
-          'Monthly $10 Donation - Unavailable'
-        ],
-        card: {
-          hideName: true,
-          hideAddress: true,
-          hideCountryPostal: true
-        },
-        messageOnCancel: `Thanks again for supporting our tiny nonprofit. We are helping millions of people around the world learn to code for free. Please confirm: are you certain you want to stop your donation?`
-      }
-    };
-    /* eslint-enable camelcase */
-  }
-
-  componentDidMount() {
-    servicebotScriptLoader();
-  }
-
-  render() {
-    this.setServiceBotConfig();
-    return (
-      <div className='fcc-servicebot-embed-portal'>
-        <div id='servicebot-subscription-portal'></div>
-      </div>
-    );
-  }
-}
-
-DonationServicebotEmbed.displayName = 'DonationServicebotEmbed';
-DonationServicebotEmbed.propTypes = propTypes;
-
-export default DonationServicebotEmbed;

client/src/pages/donate.js

@@ -6,7 +6,7 @@ import { createSelector } from 'reselect';
 import { Grid, Row, Col } from '@freecodecamp/react-bootstrap';
 
 import { stripePublicKey } from '../../config/env.json';
-import { Spacer, Loader, FullWidthRow, Link } from '../components/helpers';
+import { Spacer, Loader, FullWidthRow } from '../components/helpers';
 import DonateForm from '../components/Donation/components/DonateForm';
 import DonateText from '../components/Donation/components/DonateText';
 import { signInLoadingSelector, userSelector } from '../redux';
@@ -30,13 +30,9 @@ export class DonatePage extends Component {
   constructor(...props) {
     super(...props);
     this.state = {
-      stripe: null,
+      stripe: null
-      enableSettings: false
     };
 
-    this.enableDonationSettingsPage = this.enableDonationSettingsPage.bind(
-      this
-    );
     this.handleStripeLoad = this.handleStripeLoad.bind(this);
   }
 
@@ -69,14 +65,9 @@ export class DonatePage extends Component {
     }
   }
 
-  enableDonationSettingsPage(enableSettings = true) {
-    this.setState({ enableSettings });
-  }
-
   render() {
     const { stripe } = this.state;
-    const { showLoading, isDonating } = this.props;
+    const { showLoading } = this.props;
-    const { enableSettings } = this.state;
 
     if (showLoading) {
       return <Loader fullScreen={true} />;
@@ -94,33 +85,7 @@ export class DonatePage extends Component {
             <Spacer />
             <Row>
               <Col md={6}>
-                <DonateForm
+                <DonateForm stripe={stripe} />
-                  enableDonationSettingsPage={this.enableDonationSettingsPage}
-                  stripe={stripe}
-                />
-                <Row>
-                  <Col sm={10} smOffset={1} xs={12}>
-                    <Spacer size={2} />
-                    <h3 className='text-center'>
-                      Manage your existing donation
-                    </h3>
-                    <div className='button-group'>
-                      {[
-                        `Update your existing donation`,
-                        `Download donation receipts`
-                      ].map(donationSettingOps => (
-                        <Link
-                          className='btn btn-block'
-                          disabled={!isDonating && !enableSettings}
-                          key={donationSettingOps}
-                          to='/donation/settings'
-                        >
-                          {donationSettingOps}
-                        </Link>
-                      ))}
-                    </div>
-                  </Col>
-                </Row>
               </Col>
               <Col md={6}>
                 <DonateText />

client/src/pages/donation/settings.js

@@ -1,229 +0,0 @@
-import React, { Component, Fragment } from 'react';
-import Helmet from 'react-helmet';
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux';
-import { createSelector } from 'reselect';
-import { Grid, Button, Panel } from '@freecodecamp/react-bootstrap';
-import { uniq } from 'lodash';
-
-import { apiLocation } from '../../../config/env.json';
-import { postCreateHmacHash } from '../../utils/ajax';
-import {
-  signInLoadingSelector,
-  userSelector,
-  hardGoTo as navigate,
-  isSignedInSelector
-} from '../../redux';
-// eslint-disable-next-line max-len
-import DonateServicebotEmbed from '../../components/Donation/components/DonateServicebotEmbed';
-import { Loader, Spacer, Link, FullWidthRow } from '../../components/helpers';
-import SectionHeader from '../../components/settings/SectionHeader.js';
-
-const propTypes = {
-  donationEmails: PropTypes.array,
-  email: PropTypes.string,
-  isDonating: PropTypes.bool,
-  isSignedIn: PropTypes.bool,
-  navigate: PropTypes.func.isRequired,
-  showLoading: PropTypes.bool.isRequired
-};
-
-const mapStateToProps = createSelector(
-  isSignedInSelector,
-  userSelector,
-  signInLoadingSelector,
-  (isSignedIn, { email, isDonating, donationEmails }, showLoading) => ({
-    isSignedIn,
-    email,
-    isDonating,
-    donationEmails,
-    showLoading
-  })
-);
-
-const mapDispatchToProps = {
-  navigate
-};
-
-export class DonationSettingsPage extends Component {
-  constructor(...props) {
-    super(...props);
-
-    this.state = {
-      hash: null,
-      currentSettingsEmail: null
-    };
-
-    this.getEmailHmacHash = this.getEmailHmacHash.bind(this);
-    this.handleSelectDonationEmail = this.handleSelectDonationEmail.bind(this);
-  }
-
-  getEmailHmacHash(currentSettingsEmail) {
-    return postCreateHmacHash({
-      email: currentSettingsEmail
-    })
-      .then(response => {
-        const data = response && response.data;
-        this.setState({ hash: '' + data.hash, currentSettingsEmail });
-      })
-      .catch(error => {
-        const data =
-          error.response && error.response.data
-            ? error.response.data
-            : {
-                error:
-                  'Something is not right. Please contact team@freecodecamp.org'
-              };
-        console.error(data.error);
-      });
-  }
-
-  handleSelectDonationEmail(e) {
-    e.preventDefault();
-    this.setState({ hash: null, currentSettingsEmail: null });
-    this.getEmailHmacHash(e.currentTarget.value);
-  }
-
-  renderServicebotEmbed() {
-    const { donationEmails } = this.props;
-    if (!donationEmails || donationEmails.length === 0) {
-      return null;
-    }
-    const { currentSettingsEmail, hash } = this.state;
-    return (
-      <div className='servicebot-embed-panel'>
-        {!hash || !currentSettingsEmail ? (
-          <Panel>
-            <Spacer />
-            <p className='text-center'>
-              Select the email associated with your donations above.
-            </p>
-          </Panel>
-        ) : (
-          <Panel>
-            <Spacer />
-            <DonateServicebotEmbed email={currentSettingsEmail} hash={hash} />
-            <Spacer />
-          </Panel>
-        )}
-      </div>
-    );
-  }
-
-  renderDonationEmailsList() {
-    const { donationEmails } = this.props;
-    if (!donationEmails || donationEmails.length === 0) {
-      return (
-        <p>
-          Some of the data associated with your donation is unavailable. Please
-          contact team@freeCodeCamp.org to get your donation updated manually.
-        </p>
-      );
-    }
-    return uniq(donationEmails).map(email => (
-      <Button
-        bsStyle='primary'
-        className='btn btn-block'
-        key={email}
-        onClick={this.handleSelectDonationEmail}
-        value={email}
-      >
-        {`Show donations for your ${email} email address`}
-      </Button>
-    ));
-  }
-
-  render() {
-    const { showLoading, isSignedIn, isDonating, navigate } = this.props;
-
-    if (showLoading) {
-      return <Loader fullScreen={true} />;
-    }
-
-    if (!isSignedIn) {
-      navigate(`${apiLocation}/signin?returnTo=donation/settings`);
-      return <Loader fullScreen={true} />;
-    }
-
-    if (!isDonating) {
-      navigate(`/donate`);
-      return <Loader fullScreen={true} />;
-    }
-
-    return (
-      <Fragment>
-        <Helmet title='Manage your donation | freeCodeCamp.org' />
-        <Grid>
-          <main>
-            <Spacer size={2} />
-
-            <FullWidthRow className='button-group'>
-              <Link
-                className='btn-invert btn btn-lg btn-primary btn-block'
-                to={`/donate`}
-              >
-                Go to donate page
-              </Link>
-              <Link
-                className='btn-invert btn btn-lg btn-primary btn-block'
-                to={`/settings`}
-              >
-                Update my account settings
-              </Link>
-            </FullWidthRow>
-
-            <FullWidthRow>
-              <Spacer />
-              <h1 className='text-center'>Manage your donations</h1>
-            </FullWidthRow>
-
-            <Spacer />
-            <SectionHeader>
-              Donations made using a credit or debit card
-            </SectionHeader>
-            <FullWidthRow className='button-group'>
-              {this.renderDonationEmailsList()}
-            </FullWidthRow>
-            <Spacer />
-            <FullWidthRow>{this.renderServicebotEmbed()}</FullWidthRow>
-
-            <Spacer />
-            <SectionHeader>Donations made using PayPal</SectionHeader>
-            <FullWidthRow>
-              <p className='text-center'>
-                You can update your PayPal donation{' '}
-                <Link
-                  external={true}
-                  to='https://www.paypal.com/cgi-bin/webscr?cmd=_manage-paylist'
-                >
-                  directly on PayPal
-                </Link>
-                .
-              </p>
-            </FullWidthRow>
-
-            <Spacer />
-            <SectionHeader>Still need help?</SectionHeader>
-            <FullWidthRow>
-              <p>
-                If you can't see your donation here, forward a donation receipt
-                you have recieved in your email to team@freeCodeCamp.org and
-                tell us how we can help you with it.
-              </p>
-            </FullWidthRow>
-
-            <Spacer />
-          </main>
-        </Grid>
-      </Fragment>
-    );
-  }
-}
-
-DonationSettingsPage.displayName = 'DonationSettingsPage';
-DonationSettingsPage.propTypes = propTypes;
-
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(DonationSettingsPage);