moved from imported client, to Apollo Consumer context

1 files changed, 35 insertions, 32 deletions

diff --git a/frontend/components/Signin.js b/frontend/components/Signin.js
index f8a72e4..78da284 100644
--- a/frontend/components/Signin.js
+++ b/frontend/components/Signin.js
@@ -3,7 +3,6 @@ import { Mutation, Query, ApolloConsumer } from 'react-apollo';
 import { SIGNIN_MUTATION, CURRENT_USER_QUERY } from '../queries/queries';
 import Error from './ErrorMessage';
 import Form from './styles/Form';
-import { client } from '../lib/withData';
 
 class Signin extends Component {
   state = {
@@ -26,40 +25,44 @@ class Signin extends Component {
   render() {
     // TODO / ASK - do I really have to wrap this in a query just to access the refetch function
     return (
-      <Mutation mutation={SIGNIN_MUTATION} variables={this.state}>
-        {(signin, { data, loading, error }) => (
-          <Form onSubmit={e => this.loginUser(e, signin, client)}>
-            <Error error={error} />
-            <fieldset disabled={loading} aria-busy={loading}>
-              <label htmlFor="email">
-                Emailx
-                <input
-                  value={this.state.email}
-                  onChange={this.saveToState}
-                  name="email"
-                  type="text"
-                  placeholder="email"
-                />
-              </label>
+      <ApolloConsumer>
+        {client => (
+          <Mutation mutation={SIGNIN_MUTATION} variables={this.state}>
+            {(signin, { data, loading, error }) => (
+              <Form onSubmit={e => this.loginUser(e, signin, client)}>
+                <Error error={error} />
+                <fieldset disabled={loading} aria-busy={loading}>
+                  <label htmlFor="email">
+                    Email
+                    <input
+                      value={this.state.email}
+                      onChange={this.saveToState}
+                      name="email"
+                      type="text"
+                      placeholder="email"
+                    />
+                  </label>
 
-              <label htmlFor="password">
-                Password
-                <input
-                  type="password"
-                  name="password"
-                  id="password"
-                  className="password"
-                  placeholder="password"
-                  value={this.state.password}
-                  onChange={this.saveToState}
-                />
-              </label>
+                  <label htmlFor="password">
+                    Password
+                    <input
+                      type="password"
+                      name="password"
+                      id="password"
+                      className="password"
+                      placeholder="password"
+                      value={this.state.password}
+                      onChange={this.saveToState}
+                    />
+                  </label>
 
-              <button type="submit">Sign In!</button>
-            </fieldset>
-          </Form>
+                  <button type="submit">Sign In!</button>
+                </fieldset>
+              </Form>
+            )}
+          </Mutation>
         )}
-      </Mutation>
+      </ApolloConsumer>
     );
   }
 }