Rename components & remove unused code

webkom · Sep 18, 2019 · 11b6698 · 11b6698
1 parent b2b34aa
commit 11b6698
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 55 deletions.
diff --git a/app/reducers/registrations.js b/app/reducers/registrations.js
@@ -1,6 +1,6 @@
 // @flow
 
-import { union, get } from 'lodash';
+import { union } from 'lodash';
 import { Event } from '../actions/ActionTypes';
 import createEntityReducer from 'app/utils/createEntityReducer';
 import { normalize } from 'normalizr';
@@ -34,21 +34,13 @@ export default createEntityReducer({
         if (!registration) {
           return state;
         }
-        let paymentErrorData = {};
-        if (action.type === Event.SOCKET_PAYMENT.FAILURE) {
-          paymentErrorData.paymentError = get(action, 'meta.errorMessage');
-        }
         return {
           ...state,
           byId: {
             ...state.byId,
             [registration.id]: {
-              ...omit(state.byId[registration.id], [
-                'unregistrationDate',
-                'paymentError'
-              ]),
-              ...registration,
-              ...paymentErrorData
+              ...omit(state.byId[registration.id], 'unregistrationDate'),
+              ...registration
             }
           },
           items: union(state.items, [registration.id])

diff --git a/app/routes/events/components/StripeElement.js b/app/routes/events/components/StripeElement.js
@@ -27,27 +27,36 @@ type Props = {
   chargeStatus: EventRegistrationChargeStatus
 };
 
+/*
+ * Taken from https://stripe.com/docs/api/errors
+ */
 type StripeError = {
   type: string,
+  charge: string,
   code: string,
+  decline_code: string,
   message: string,
-  doc_url: string
+  param: string,
+  doc_url: string,
+  payment_intent: Object,
+  setup_intent: Object,
+  source: Object
 };
 
 type FormProps = Props & {
   fontSize?: number
 };
 
-type _SplitFormProps = FormProps & {
+type CardFormProps = FormProps & {
   ledgend: string,
-  setError: Object => void,
+  setError: StripeError => void,
   setSuccess: () => void,
   setLoading: boolean => void,
   stripe: Stripe
 };
 
-type _PaymentRequestFormProps = FormProps & {
-  setError: Object => void,
+type PaymentRequestFormProps = FormProps & {
+  setError: StripeError => void,
   setSuccess: () => void,
   setLoading: boolean => void,
   setPaymentRequest: boolean => void,
@@ -65,26 +74,24 @@ type State = {
   paymentRequest?: Object,
   canMakePayment?: boolean
 };
-const createOptions = (fontSize, padding) => {
-  return {
-    style: {
-      base: {
-        fontSize,
-        color: '#424770',
-        letterSpacing: '0.025em',
-        fontFamily: 'Source Code Pro, monospace',
-        '::placeholder': {
-          color: '#aab7c4'
-        },
-        padding
-      },
-      invalid: {
-        color: '#9e2146'
+
+const createOptions = {
+  style: {
+    base: {
+      color: '#424770',
+      letterSpacing: '0.025em',
+      fontFamily: 'Source Code Pro, monospace',
+      '::placeholder': {
+        color: '#aab7c4'
       }
+    },
+    invalid: {
+      color: '#9e2146'
     }
-  };
+  }
 };
-class _SplitForm extends React.Component<_SplitFormProps, FormState> {
+
+class CardForm extends React.Component<CardFormProps, FormState> {
   handleSubmit = async ev => {
     ev.preventDefault();
     const { stripe, createPaymentIntent } = this.props;
@@ -111,22 +118,22 @@ class _SplitForm extends React.Component<_SplitFormProps, FormState> {
             Kortnummer
             <CardNumberElement
               className={stripeStyles.StripeElement}
-              {...createOptions(this.props.fontSize)}
+              {...createOptions}
             />
           </label>
           <label className={stripeStyles.StripeLabel}>
             Utløpsdato
             <CardExpiryElement
               className={stripeStyles.StripeElement}
-              {...createOptions(this.props.fontSize)}
+              {...createOptions}
             />
           </label>
           <label className={stripeStyles.StripeLabel}>
             CVC
             <CardCVCElement
               className={stripeStyles.StripeElement}
               onReady={() => this.setState({})}
-              {...createOptions(this.props.fontSize)}
+              {...createOptions}
             />
           </label>
           <button className={stripeStyles.StripeButton}>Betal</button>
@@ -136,8 +143,8 @@ class _SplitForm extends React.Component<_SplitFormProps, FormState> {
   }
 }
 
-class _PaymentRequestForm extends React.Component<
-  _PaymentRequestFormProps,
+class PaymentRequestForm extends React.Component<
+  PaymentRequestFormProps,
   State
 > {
   constructor(props) {
@@ -211,8 +218,8 @@ class _PaymentRequestForm extends React.Component<
   }
 }
 
-const PaymentRequestForm = injectStripe(_PaymentRequestForm);
-const SplitForm = injectStripe(_SplitForm);
+const InjectedPaymentRequestForm = injectStripe(PaymentRequestForm);
+const InjectedCardForm = injectStripe(CardForm);
 
 class PaymentForm extends React.Component<FormProps, FormState> {
   state = {
@@ -235,13 +242,19 @@ class PaymentForm extends React.Component<FormProps, FormState> {
 
   render() {
     const { success, error, loading } = this.state;
-    return !success ? (
+    return success ? (
+      <div className={stripeStyles.success}>
+        {`Din betaling på ${
+          this.props.event.price ? this.props.event.price / 100 : ''
+        } kr ble godkjent.`}
+      </div>
+    ) : (
       <>
         {loading && <LoadingIndicator loading />}
         {error && <div className={stripeStyles.error}>{error.message}</div>}
         <div style={{ display: loading ? 'none' : 'block' }}>
           <Elements locale="no">
-            <PaymentRequestForm
+            <InjectedPaymentRequestForm
               {...this.props}
               setSuccess={() => this.setSuccess()}
               setError={error => this.setError(error)}
@@ -252,7 +265,7 @@ class PaymentForm extends React.Component<FormProps, FormState> {
             />
           </Elements>
           <Elements locale="no">
-            <SplitForm
+            <InjectedCardForm
               {...this.props}
               fontSize={'18px'}
               setSuccess={() => this.setSuccess()}
@@ -267,12 +280,6 @@ class PaymentForm extends React.Component<FormProps, FormState> {
           </Elements>
         </div>
       </>
-    ) : (
-      <div className={stripeStyles.success}>
-        {`Din betaling på ${
-          this.props.event.price ? this.props.event.price / 100 : ''
-        } kr ble godkjent.`}
-      </div>
     );
   }
 }

diff --git a/package.json b/package.json
@@ -81,7 +81,6 @@
     "react-select": "^1.0.0-rc.3",
     "react-soundplayer": "^1.0.4",
     "react-stickynode": "^2.1.1",
-    "react-stripe-checkout": "^2.4.0",
     "react-stripe-elements": "^5.0.0",
     "react-swipeable": "5.0.0",
     "react-tagcloud": "^1.2.0",

diff --git a/yarn.lock b/yarn.lock
@@ -10855,11 +10855,6 @@ react-stickynode@^2.1.1:
     shallowequal "^1.0.0"
     subscribe-ui-event "^2.0.0"
 
-react-stripe-checkout@^2.4.0:
-  version "2.6.3"
-  resolved "https://registry.yarnpkg.com/react-stripe-checkout/-/react-stripe-checkout-2.6.3.tgz#3173a870b04e5a3c321a06d24cd53c6030111c45"
-  integrity sha1-MXOocLBOWjwyGgbSTNU8YDARHEU=
-
 react-stripe-elements@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/react-stripe-elements/-/react-stripe-elements-5.0.0.tgz#3a67717ddc9580c4dad9d45b672a9cf6c8a6dda4"