toggle cart mutesss

2 files changed, 8 insertions, 11 deletions

diff --git a/frontend/components/Nav.js b/frontend/components/Nav.js
index 826335f..b483376 100644
--- a/frontend/components/Nav.js
+++ b/frontend/components/Nav.js
@@ -1,6 +1,7 @@
 import React, { Fragment } from 'react';
 import Link from 'next/link';
-import { Query, ApolloConsumer } from 'react-apollo';
+import { Query, Mutation } from 'react-apollo';
+import { TOGGLE_CART_MUTATION } from './Cart';
 import User from './User';
 import CartCount from './CartCount';
 import Signout from './Signout';
@@ -35,9 +36,9 @@ class Nav extends React.Component {
                   <a>My Account</a>
                 </Link>
                 <Signout />
-                <ApolloConsumer>
-                  {cache => (
-                    <button onClick={() => cache.writeData({ data: { cartOpen: true } })}>
+                <Mutation mutation={TOGGLE_CART_MUTATION}>
+                  {toggleCart => (
+                    <button onClick={toggleCart}>
                       My Cart
                       <CartCount
                         className="cart-count"
@@ -45,7 +46,7 @@ class Nav extends React.Component {
                       />
                     </button>
                   )}
-                </ApolloConsumer>
+                </Mutation>
               </Fragment>
             )}
           </NavStyles>
diff --git a/frontend/lib/withData.js b/frontend/lib/withData.js
index 6fc0213..e47a9db 100644
--- a/frontend/lib/withData.js
+++ b/frontend/lib/withData.js
@@ -1,14 +1,10 @@
 import withApollo from 'next-with-apollo';
 import ApolloClient from 'apollo-boost';
-import { LOCAL_STATE_QUERY } from '../queries/queries.graphql';
-// can also be a function that accepts a `headers` object (SSR only) and returns a config
+import { LOCAL_STATE_QUERY } from '../components/Cart';
 
 function createClient({ headers }) {
   return new ApolloClient({
-    uri:
-      process.env.NODE_ENV === 'development'
-        ? 'http://localhost:4444'
-        : 'http://localhost:4444',
+    uri: process.env.NODE_ENV === 'development' ? 'http://localhost:4444' : 'http://localhost:4444',
     request: operation => {
       operation.setContext({
         fetchOptions: {