Add new user using NEXT JS mongodb

import Link from "next/link";
import Layout from "./layout";
import {
    FormControl,
    FormLabel,
    FormErrorMessage,
    FormHelperText,
    Input,
    Container
  } from '@chakra-ui/react'

  import { Button} from '@chakra-ui/react'
import { useState } from "react";
import { useMutation} from "react-query";
import { addUser } from "../../controllers/users";
const Register=()=>{



    const [form, setForm]=useState({
        name:"",
        email:"",
        password:"",
        cpassword:""
    });


    const mutation=useMutation(addUser,{
        onSuccess:()=>{   
            console.log("on success create")         
            setForm({
                ...form,
                name:"",
                email:"",
                password:"",
                cpassword:""
            });            
        }
    });

    

    const submitForm=async()=>{
        await mutation.mutate({
            name: form.name,
            email: form.email,
            password: form.password
        });
    }

    return(
        <>
        <Layout>
            <Container>
                <FormControl>
                    <FormLabel>Name</FormLabel>
                    <Input type='text' defaultValue={form.name} onChange={e=>setForm({...form, name:e.target.value})} />                    
                </FormControl>
                <FormControl>
                    <FormLabel>Email address</FormLabel>
                    <Input type='email' defaultValue={form.email} onChange={e=>setForm({...form, email:e.target.value})} />
                    <FormHelperText>We'll never share your email.</FormHelperText>
                </FormControl>

                <FormControl>
                    <FormLabel>Password</FormLabel>
                    <Input type='password' defaultValue={form.password} onChange={e=>setForm({...form, password:e.target.value})} />                    
                </FormControl>

                <FormControl>
                    <FormLabel>Confirm password</FormLabel>
                    <Input type='password' defaultValue={form.cpassword} onChange={e=>setForm({...form, cpassword:e.target.value})} />                    
                </FormControl>

                <Button 
                onClick={submitForm}
                colorScheme='blue' my={3}>Create account</Button>
            </Container>
        </Layout>
        </>
    )
}
export default Register;