diff --git a/client/src/components/UserReferrals.js b/client/src/components/UserReferrals.js
index 28c83a2e7..6e6fb8a1a 100644
--- a/client/src/components/UserReferrals.js
+++ b/client/src/components/UserReferrals.js
@@ -1,6 +1,6 @@
 import React, { Component } from 'react'
 import {graphql, compose} from 'react-apollo'
-import {getRolesQuery, updateUserMutation, getUsersQuery} from '../queries/queries'
+import {getRolesQuery, updateReferrerMutation, getUsersQuery} from '../queries/queries'
 
 // components
 
@@ -44,6 +44,8 @@ class UserReferrals extends Component {
     this.defaultValuesSet = false
 
     this.state = {
+      id: '',
+      referrerId: '',
       firstNameError: false,
       middleNameError: false,
       lastNameError: false,
@@ -51,41 +53,23 @@ class UserReferrals extends Component {
     }
   }
 
-  userSelected (user) {
+  userSelected (referrerUser) {
     console.log(user)
 
-    this.setState({referrer: user.id})
-  }
+    this.setState({referrer: referrerUser.id})
 
-  submitForm (e) {
-    e.preventDefault()
-    this.props.updateUserMutation({
+    this.props.updateReferrerMutation({
       variables: {
         id: this.state.id,
-        firstName: this.state.firstName,
-        middleName: this.state.middleName,
-        lastName: this.state.lastName,
-        bio: this.state.bio,
-        isDeveloper: this.state.isDeveloper,
-        isTrader: this.state.isTrader,
-        isDataAnalyst: this.state.isDataAnalyst,
-        roleId: this.state.roleId
-      },
-      refetchQueries: [{ query: getUsersQuery}] // This allow us to re run whatever queries are necesary after the mutation.
+        referrerId: referrerUser.id
+      }
     })
 
       /* Before we are done, we need to update the state of the local storage. */
 
     let user = JSON.parse(localStorage.getItem('loggedInUser'))
 
-    user.firstName = this.state.firstName
-    user.middleName = this.state.middleName
-    user.lastName = this.state.lastName
-    user.bio = this.state.bio
-    user.isDeveloper = this.state.isDeveloper
-    user.isTrader = this.state.isTrader
-    user.isDataAnalyst = this.state.isDataAnalyst
-    user.role.id = this.state.roleId
+    user.referrerId = referrerUser.id
 
     localStorage.setItem('loggedInUser', JSON.stringify(user))
   }
@@ -99,28 +83,11 @@ class UserReferrals extends Component {
           let user = JSON.parse(userData)
   	        this.defaultValuesSet = true
 
-          /* To avoid console warning, we need to take care of the fields that are null. */
-
-          if (user.firstName === null) { user.firstName = '' }
-          if (user.middleName === null) { user.middleName = '' }
-          if (user.lastName === null) { user.lastName = '' }
-          if (user.bio === null) { user.bio = '' }
-
           /* Now we are ready to set the initial state. */
 
           this.setState({
             id: user.id,
-            alias: user.alias,
-            email: user.email,
-            emailVerified: user.emailVerified,
-            firstName: user.firstName,
-            middleName: user.middleName,
-            lastName: user.lastName,
-            bio: user.bio,
-            isDeveloper: user.isDeveloper,
-            isTrader: user.isTrader,
-            isDataAnalyst: user.isDataAnalyst,
-            roleId: user.role.id
+            referrerId: user.referrerId
           })
     	    }
     	}
@@ -132,9 +99,8 @@ class UserReferrals extends Component {
         <Typography className={classes.typography} variant='headline' gutterBottom>
               Referral Program
         </Typography>
-        <form onSubmit={this.submitForm.bind(this)}>
 
-          <Typography className={classes.typography} variant='body1' gutterBottom align='left'>
+        <Typography className={classes.typography} variant='body1' gutterBottom align='left'>
         We know that a group often becomes more intelligent when the number of people in the group increases.
         To incentivize members of the community to invite more people to join we have developed this referral
         program in which you can specify who referred you to the project, and see the members who pointed at
@@ -142,9 +108,8 @@ class UserReferrals extends Component {
         overall reputation within the project.
         </Typography>
 
-          <UserSearch selectButton onSelect={this.userSelected.bind(this)} selectText="After that press the 'Select' button on the desired user to set it as your referrer. Bear in mind that this action can not be undone." />
+        <UserSearch selectButton onSelect={this.userSelected.bind(this)} selectText="After that press the 'Select' button on the desired user to set it as your referrer. Bear in mind that this action can not be undone." />
 
-        </form>
       </Paper>
 
     )
@@ -152,7 +117,6 @@ class UserReferrals extends Component {
 }
 
 export default compose(
-  graphql(getRolesQuery, {name: 'getRolesQuery'}),
-  graphql(updateUserMutation, {name: 'updateUserMutation'}),
+  graphql(updateReferrerMutation, {name: 'updateReferrerMutation'}),
   withStyles(styles)
 )(UserReferrals) // This technique binds more than one query to a single component.
diff --git a/client/src/queries/queries.js b/client/src/queries/queries.js
index ecd4feeb6..fe02e1ce4 100644
--- a/client/src/queries/queries.js
+++ b/client/src/queries/queries.js
@@ -16,7 +16,6 @@ const getUsersQuery = gql`
     }
 }
 `
-
 const getUserProfileQuery = gql`
 query($id: ID){
     user (id: $id){
@@ -34,11 +33,11 @@ query($id: ID){
     }
 }
 `
-
 const getUserByAuthIdQuery = gql`
 query($authId: String){
     userByAuthId (authId: $authId){
       id
+      referrerId
       alias
       firstName
       middleName
@@ -57,7 +56,6 @@ query($authId: String){
     }
 }
 `
-
 const getUsersBySearchFields = gql`
 query(
   $alias: String,
@@ -74,7 +72,6 @@ query(
     }
 }
 `
-
 const getRolesQuery = gql`
 {
     roles {
@@ -83,7 +80,6 @@ const getRolesQuery = gql`
     }
 }
 `
-
 const updateUserMutation = gql`
 mutation(
   $id: ID!,
@@ -114,7 +110,22 @@ mutation(
     }
 }
 `
-
+const updateReferrerMutation = gql`
+mutation(
+  $id: ID!,
+  $referrerId:String!
+)
+  {
+    updateUserReferrer (
+      id: $id,
+      referrerId:$referrerId
+    )
+    {
+      id
+      referrerId
+    }
+}
+`
 const updateUserImagesMutation = gql`
 mutation(
   $id: ID!,
@@ -140,5 +151,6 @@ export {
   getUserProfileQuery,
   getUsersBySearchFields,
   updateUserMutation,
+  updateReferrerMutation,
   updateUserImagesMutation
 }