From fa3ec3299b3fa33e5a699683beb96cfa4e6dd51d Mon Sep 17 00:00:00 2001
From: Wes Bos <wesbos@gmail.com>
Date: Tue, 13 Feb 2018 13:19:23 -0500
Subject: getting there

---
 frontend/components/TakeMyMoney.js | 46 ++++++++++++++++++++++++--------------
 1 file changed, 29 insertions(+), 17 deletions(-)

(limited to 'frontend/components/TakeMyMoney.js')

diff --git a/frontend/components/TakeMyMoney.js b/frontend/components/TakeMyMoney.js
index 042e9c8..30a19dc 100644
--- a/frontend/components/TakeMyMoney.js
+++ b/frontend/components/TakeMyMoney.js
@@ -2,35 +2,47 @@ import { Component } from 'react';
 import StripeCheckout from 'react-stripe-checkout';
 import { graphql, compose } from 'react-apollo';
 import { CREATE_ORDER_MUTATION, CURRENT_USER_QUERY } from '../queries';
+import formatMoney from '../lib/formatMoney';
 
 class TakeMyMoney extends Component {
   onToken = async res => {
     console.log('We got a toooken!');
-    const token = res.id;
-    const userId = this.props.currentUserQuery.user.id;
-    const itemId = this.props.id;
-    console.log(`Going to make a purchase with ${token}`);
-    console.log(`THe person that bought this was ${userId}`);
-    console.log(`The item id is ${itemId}`);
-    const charge = await this.props.createOrder({ variables: { token, userId, itemId } });
-    alert(`Back from the charge! ${charge.id}`);
-    console.log(charge);
+    console.log(res);
+    const order = await this.props.createOrder({
+      variables: {
+        token: res.id,
+      },
+    });
+    console.log(order);
+    // const token = res.id;
+    // const userId = this.props.currentUserQuery.user.id;
+    // const itemId = this.props.id;
+    // console.log(`Going to make a purchase with ${token}`);
+    // console.log(`THe person that bought this was ${userId}`);
+    // console.log(`The item id is ${itemId}`);
+    // const charge = await this.props.createOrder({ variables: { token, userId, itemId } });
+    // alert(`Back from the charge! ${charge.id}`);
+    // console.log(charge);
   };
+
   render() {
-    // const user = this.props.currentUserQuery.user || {};
-    // const email = user.email || '';
-    const email = 'wesbos@gmail.com';
+    const { me } = this.props.currentUserQuery;
+    if (!me.cart.length) return null;
+    const total = me.cart.reduce((tally, cartItem) => tally + cartItem.item.price * cartItem.quantity, 0);
+    const totalItems = me.cart.reduce((tally, cartItem) => tally + cartItem.quantity, 0);
     return (
       <div>
         <StripeCheckout
-          amount={this.props.amount}
-          name={this.props.name}
-          description={this.props.description}
+          amount={total}
+          name="Sick Fits Haul"
+          description={`Order of ${totalItems} Items From Sick Fits`}
+          image={me.cart[0].item.image}
           token={this.onToken}
           stripeKey="pk_lclTtThFp8CnO3QtEZSd8HA9mFUps"
           currency="USD"
-          email={email}
+          email={me.email}
         >
+          {formatMoney(total)}
           {this.props.children}
         </StripeCheckout>
       </div>
@@ -40,4 +52,4 @@ class TakeMyMoney extends Component {
 
 const userEnhancer = graphql(CURRENT_USER_QUERY, { name: 'currentUserQuery' });
 const createOrderEnhancer = graphql(CREATE_ORDER_MUTATION, { name: 'createOrder' });
-export default compose(createOrderEnhancer)(TakeMyMoney);
+export default compose(userEnhancer, createOrderEnhancer)(TakeMyMoney);
-- 
cgit v1.3