diff options
| author | Wes Bos <wesbos@gmail.com> | 2017-09-21 15:39:12 -0400 |
|---|---|---|
| committer | Wes Bos <wesbos@gmail.com> | 2017-09-21 15:39:12 -0400 |
| commit | 3b45dd7b593825721ec9ee9f6a49c732601b1ae0 (patch) | |
| tree | a2e8e73d6b6b6bc32eda2bb79af817397e4304f5 /components/CartList.js | |
| parent | 1450e579c67e3d969cb099dfe6c1cefd1e313fb5 (diff) | |
Cha Ching
Diffstat (limited to 'components/CartList.js')
| -rw-r--r-- | components/CartList.js | 54 |
1 files changed, 24 insertions, 30 deletions
diff --git a/components/CartList.js b/components/CartList.js index d0456aa..d485907 100644 --- a/components/CartList.js +++ b/components/CartList.js @@ -5,31 +5,30 @@ import Signup from '../components/Signup'; import LoginAuth0 from '../components/LoginAuth0'; import Page from '../components/Page'; import { USER_ORDERS_QUERY } from '../queries'; -import { graphql, compose } from 'react-apollo' +import { graphql, compose } from 'react-apollo'; import has from 'lodash.has'; import get from 'lodash.get'; import formatMoney from '../lib/formatMoney'; import makeImage from '../lib/image'; -import TakeMyMoney from './TakeMyMoney' - -import { CURRENT_USER_QUERY, REMOVE_FROM_CART_MUTATION } from '../queries'; +import TakeMyMoney from './TakeMyMoney'; +import { removeFromCartEnhancer } from '../enhancers'; +import { CURRENT_USER_QUERY } from '../queries'; class CartList extends Component { componentDidMount() { setTimeout(this.props.currentUserQuery.refetch, 1); } render() { - - if(this.props.loading) { - return <p>Loading...</p> + if (this.props.loading) { + return <p>Loading...</p>; } - if(this.props.error) { - return <p>Error...</p> + if (this.props.error) { + return <p>Error...</p>; } - if(!has(this.props, 'currentUserQuery.user.cart')) { - return <p>Don't have it yet!</p> + if (!has(this.props, 'currentUserQuery.user.cart')) { + return <p>Don't have it yet!</p>; } const cart = this.props.currentUserQuery.user.cart; @@ -43,32 +42,27 @@ class CartList extends Component { {cart.map(item => ( <li key={item.id}> {item.title} - <button onClick={() => this.props.removeFromCart({ variables: { - userId, - itemId: item.id - }})}>× Delete</button> + <button + onClick={() => + this.props.removeFromCart({ + variables: { + userId, + itemId: item.id, + }, + })} + > + × Delete + </button> </li> ))} </ul> - <TakeMyMoney - amount={total} - name="Testing 123" - description="Test test 123" - > + <TakeMyMoney amount={total} name="Testing 123" description="Test test 123"> <button>Buy for {formatMoney(total)}</button> </TakeMyMoney> </div> - ) + ); } } const userEnhancer = graphql(CURRENT_USER_QUERY, { name: 'currentUserQuery' }); -const removeItemEnhancer = graphql(REMOVE_FROM_CART_MUTATION, { name: 'removeFromCart', options: { - update: (proxy, payload) => { - const data = proxy.readQuery({ query: CURRENT_USER_QUERY }); - const cartItemId = payload.data.removeFromCartItems.cartItem.id; - data.user.cart = data.user.cart.filter(item => item.id !== cartItemId); - proxy.writeQuery({ query: CURRENT_USER_QUERY, data }); - }, - } }); -export default compose(userEnhancer, removeItemEnhancer)(CartList) +export default compose(userEnhancer, removeFromCartEnhancer)(CartList); |
