5.GraphQL Mutation.md

--> [ Mutation ]

• Mutation Basically Differs From The Query Because It Use Is To Mutate The Data, Change The Data.
• So If We Use Http Method A Query Would Be Like GET Request And Mutation Would Be Like POST UPDATE DELETE Request. Mutation Is Used To Create,Update And Delete Data.
• Similiar To If We Want To Get Data We Have type Query{} Like That If We Want To Mutate Data We Need To Have type Mutation{}.

//type-defs.js

    type Query{

    }

    type Mutation{

    }

• I Wanna Have A Field Which Create A User And We Have Write The Name Of The Field (createUser) That Going To Mutate The Stuffs. And And Whenever We Are Running A Mutation We Gonna Return Its Updated Values(User).

• 'createUser' Will Allow Us To Create New User Into Our FakeData.js

//type-defs.js

    type User {
        id:ID!
        name:String!
        email:String!
        age:Int!
    }

    type Query{
        users:[User!]!
        user(id:ID!):User
    }

    type Mutation{
        createUser:User!
    }

• Now How We Gonna Know What Data We Sending. One Thing We Can Do Similiar To Query In Our Mutation We Can Pass Argument Which Is Required On 'User' Type (name,email,age).

    type Mutation{
        createUser(name:String!,email:String!,age:Int!):User!
    }

• But When We Have So Many Fields It Become Cumbersome To Pass Every Argument Like This. So There Is Another Way To Pass Argument. Below We Passed 'User' Type Directly Into Argument. It Basically Telling That Argument We Gonna Recieve Will Be Like As Type 'User'.

    type Mutation{
        createUser(user:User!):User!
    }

• But For The Best Practices We Use Something Called 'input' In GraphQL. We Are Not Passing ID Because Its Auto Generated. To Create Input We First Define Keyword input Then Following With Name Of The Input. And Inside That We Add Field Of Data Which We Want To Recieve From Requester.

• We Can Use 'input' For More Stuffs To One Of Them Is Passing Defaults. Suppose Requester Doesnt Pass Age Value While Creating User Since Its Not Required. But I Can Set Default Value Of Age (age:Int = 18) If Its Not Passed By Requester. Which Cant Be Done Inside The Type Because Type Is Just The Structure Of The User.

    input createUserInput{
        name:String!
        email:String!
        age:Int = 18
    }

    type Mutation{
        createUser(user:createUserInput!):User!
    }

• One More Thing To Account While Creating And Using Input Is That If We Have A Type Inside A Type Which Is Not Of GraphQL Type And Its Like List Of Arrays It Should Not Be Passed Directly Inside The input If We Mutating The Data. To Understand It Carefully In Last Chapter We Can See That We Had A Field Called favoriteMovies inside The Type User . So When We Creating Input We Cant Include That Field Basically Because We Are Telling That If U Want To Create A User You Also Have To Pass 'favoriteMovies' Which Doesnt Make Sense. We Have To Do That Seperately.

    input createUserInput{
        name:String!
        email:String!
        age:Int = 18
        favoriteMovies:[Movie]   #Cant Pass Like This.
    }

    type Mutation{
        createUser(input:createUserInput!):User!
    }

• We Created The Mutation But To Create User We Havent Write Anything About Resolver Which Gonna Do Stuff To It. Which Gets The Input And Create New User.

• First We Imported UsersList From FakeData.js

• Inside The resolvers Variable Similiar To Query We Access The Mutation Field.

• Inside That We Add Our Mutation Type createUser Which Have 2 Argument (parent,args). args Have Access To Input Or Data Which Was Passed By The Requester.

• Then We Found Last Id (UsersList[UsersList.length - 1].id) Which Exist Inside The FakeData.js UsersList Variable And Then Add +1 To It And Attached To user Object Which We Are Creating.

• Then We Pushed New user Inside UsersList.

• Then Also Returned The user.

• Remember This Wont Actually Mutate The Real File (FakeData.js) Since We Are Only Temporary Pushing The Data Inside The UsersList With Our New user And Returning It.

// resolvers.js

const {UsersList} = require('../FakeData.js')

const resolvers = {
    Mutation : {
        createUser:(parent,args) => {
            const user = args.input

            //Finding And Creating New ID
            user.id = UsersList[UsersList.length - 1].id + 1

            //Creating New User
            UsersList.push(user)

            //returning New user
            user;
        }
    }
}

• Now In Our GraphQL Playground. Similiar To query , For Mutation We User mutation Following With Name Of Our Choice (createNewUser).
• Inside The Mutation Field We Had To Access The Method (createUser) We Gonna Use. And Pass The Required Argument (input).
• Then Simply We Can See The Mutatated Field Via Returning It (id,name,email).

mutation createNewUser{
    createUser(input:{name:"Max",email:"[email protected]"}){
        id
        name
        email
    }
}