fixed user create, login and logout.

backend/schema.graphql

@@ -6,6 +6,8 @@ type Query {
 
 type Mutation {
   createUser(name: String!, email: String!, abbreviation: String!, password: String!): User!
+  userLogin(email: String!, password: String!): User!
+  userLogout: String!
 }
 
 type User {

backend/src/resolvers.js

@@ -13,10 +13,11 @@ const Query = {
   }
 }
 
-const Mutations = {
+const Mutation = {
   createUser: async (parent, args, context, info) => {
     const email = args.email.toLowerCase()
     const password = await bcrypt.hash(args.password, 10)
+    console.log(email, password)
     const user = await context.db.mutation.createUser({
       data: {
         ...args,
@@ -26,7 +27,9 @@ const Mutations = {
     },
       info
     )
+    console.log(user)
     const token = jwt.sign({ userId: user.id }, process.env.APP_SECRET)
+    console.log(token)
     context.response.cookie('token', token, {
       httpOnly: true,
       maxAge: 7 * 24 * 3600 * 1000
@@ -45,11 +48,16 @@ const Mutations = {
       maxAge: 7 * 24 * 3600 * 1000
     })
     return user
+  },
+  userLogout: async (parent, args, context, info) => {
+    context.response.clearCookie('token')
+    return "Logged out."
   }
 }
 
 const resolvers = {
-  Query
+  Query,
+  Mutation
 }
 
 module.exports = { resolvers }

frontend/components/UserCreate.js

@@ -27,32 +27,48 @@ class UserCreate extends React.Component {
   }
 
   render() {
-    <Mutation
-      mutation={USER_CREATE}
-      variables={this.state}
-      refetchQueries={[{ query: CURRENT_USER }]}
-    >
-      {(userCreate, { error, loading }) => (
-        <form
-          method="POST"
-          onSubmit={async event => {
-            event.preventDefault()
-            await userCreate()
-            this.setState({ name: '', email: '', abbreviation: '', password: '' })
-          }}
-        >
-          <input type="text" name="name" id="name" value={this.state.name} onChange={this.handleInput} />
-          <label htmlFor="name"></label>
-          <input type="text" name="abbreviation" id="abbreviation" value={this.state.abbreviation} onChange={this.handleInput} />
-          <label htmlFor="abbreviation"></label>
-          <input type="text" name="email" id="email" value={this.state.email} onChange={this.handleInput} />
-          <label htmlFor="email"></label>
-          <input type="password" name="password" id="password" value={this.state.password} onChange={this.handleInput} />
-          <label htmlFor="password"></label>
-          <button type="submit">Create</button>
-        </form>
-      )}
-    </Mutation>
+    return (
+      <Mutation
+        mutation={USER_CREATE}
+        variables={this.state}
+        refetchQueries={[{ query: CURRENT_USER }]}
+      >
+        {(userCreate, { error, loading }) => (
+          <form
+            method="POST"
+            onSubmit={async event => {
+              event.preventDefault()
+              await userCreate()
+              this.setState({ name: '', email: '', abbreviation: '', password: '' })
+            }}
+          >
+            <fieldset>
+              <label htmlFor="name">User name</label>
+              <input type="text" name="name" id="name"
+                placeholder="User name"
+                value={this.state.name}
+                onChange={this.handleInput} />
+              <label htmlFor="abbreviation">Abbreviation</label>
+              <input type="text" name="abbreviation" id="abbreviation"
+                placeholder="Abbreviation"
+                value={this.state.abbreviation}
+                onChange={this.handleInput} />
+              <label htmlFor="email">Email</label>
+              <input type="email" name="email" id="email"
+                placeholder="Email"
+                value={this.state.email}
+                onChange={this.handleInput} />
+              <label htmlFor="password">Password</label>
+              <input type="password" name="password" id="password"
+                placeholder="Password"
+                value={this.state.password}
+                onChange={this.handleInput} />
+              <button type="submit">Create</button>
+            </fieldset>
+          </form>
+        )}
+      </Mutation>
+    )
   }
 }
 

frontend/components/UserLogin.js

@@ -14,14 +14,6 @@ const USER_LOGIN = gql`
   }
 `
 
-const CURRENT_USER = gql`
-  query CURRENT_USER() {
-    currentUser() {
-      
-    }
-  }
-`
-
 class UserLogin extends React.Component {
   state = {
     email: '',
@@ -42,7 +34,7 @@ class UserLogin extends React.Component {
         {(userLogin, { error, loading }) => (
           <form
             method="POST"
-            onSubmit={event => {
+            onSubmit={async event => {
               event.preventDefault()
               await userLogin()
               this.setState({ email: '', password: '' })
@@ -50,9 +42,15 @@ class UserLogin extends React.Component {
           >
             <fieldset disabled={loading}>
               <h2>Log in</h2>
-              <input type="email" name="email" id="email" placeholder="" value={this.state.email} onChange={this.handleInput} />
+              <input type="email" name="email" id="email"
+                placeholder="email"
+                value={this.state.email}
+                onChange={this.handleInput} />
               <label htmlFor="email"></label>
-              <input type="password" name="password" id="password" placeholder="" value={this.state.email} onChange={this.handleInput} />
+              <input type="password" name="password" id="password"
+                placeholder="Password"
+                value={this.state.password}
+                onChange={this.handleInput} />
               <label htmlFor="password"></label>
               <button type="submit">Log in</button>
             </fieldset>
@@ -61,4 +59,6 @@ class UserLogin extends React.Component {
       </Mutation>
     )
   }
-}
+}
+
+export default UserLogin

frontend/pages/user.js

@@ -1,10 +1,14 @@
 import React from 'react'
-import User from '../components/User'
+import UserCreate from '../components/UserCreate'
+import UserLogin from '../components/UserLogin'
+import UserLogout from '../components/UserLogout'
 
 const UserPage = props => (
-  <User>
-    <div>Secret content!!!</div>
-  </User>
+  <>
+    <UserCreate />
+    <UserLogin />
+    <UserLogout />
+  </>
 )
 
 export default UserPage