I'm using Sanity studio API to send information back and forth to my next.js app. When I hit the url API endpoint in the browser it gives me this:

{"message":"Couldn't submit comment","err":{"response":{"body":{"error":{"description":"the mutation(s) failed: Invalid value: Document type is missing in document \"pORXPiOwSI61R3J9TeKimb\". Value was (<nil>): <nil>","items":[{"error":{"description":"Document type is missing in document \"pORXPiOwSI61R3J9TeKimb\"","type":"validationError","value":{"Kind":{"NullValue":0}}},"index":0}],"type":"mutationError"}},"url":"https://2w2youqk.api.sanity.io/v1/data/mutate/production?returnIds=true&returnDocuments=true&visibility=sync","method":"POST","headers":{"content-type":"application/json; charset=utf-8","content-length":"370","x-ratelimit-remaining-second":"49","x-ratelimit-limit-second":"50","ratelimit-limit":"50","ratelimit-remaining":"49","ratelimit-reset":"1","x-sanity-shard":"gcp-eu-w1-01-prod-1024","x-served-by":"gradient-web-579bd68bbf-dnpdb","date":"Mon, 04 Apr 2022 15:16:01 GMT","vary":"Origin","xkey":"project-2w2youqk, project-2w2youqk-production","via":"1.1 google","alt-svc":"h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000","connection":"close"},"statusCode":400,"statusMessage":"Bad Request"},"statusCode":400,"responseBody":"{\n  \"error\": {\n    \"description\": \"the mutation(s) failed: Invalid value: Document type is missing in document \\\"pORXPiOwSI61R3J9TeKimb\\\". Value was (<nil>): <nil>\",\n    \"items\": [\n      {\n        \"error\": {\n          \"description\": \"Document type is missing in document \\\"pORXPiOwSI61R3J9TeKimb\\\"\",\n          \"type\": \"validationError\",\n          \"value\": {\n            \"Kind\": {\n              \"NullValue\": 0\n            }\n          }\n        },\n        \"index\": 0\n      }\n    ],\n    \"type\": \"mutationError\"\n  }\n}","details":{"description":"the mutation(s) failed: Invalid value: Document type is missing in document \"pORXPiOwSI61R3J9TeKimb\". Value was (<nil>): <nil>","items":[{"error":{"description":"Document type is missing in document \"pORXPiOwSI61R3J9TeKimb\"","type":"validationError","value":{"Kind":{"NullValue":0}}},"index":0}],"type":"mutationError"}}}

So I looked into the error and something like this would be indicative of bad markup. The thing is I don't have any markup or css in the endpoint. It's just javascript. The createComment endpoint appears as such:

import type { NextApiRequest, NextApiResponse } from 'next'
import   sanityClient   from '@sanity/client'

const config = {
  dataset: process.env.NEXT_PUBLIC_SANITY_DATASET,
  projectId: process.env.NEXT_PUBLIC_SANITY_PROJECT_ID,
  useCdn: process.env.NODE_ENV === "production",
  token: process.env.SANITY_API_TOKEN,
};

const client = sanityClient(config);



export default async function createComment(
  req: NextApiRequest,
  res: NextApiResponse
) {
const { _id, name, email, comment } = req.body;



    await client.create({
        _type: comment,
        post: {
            _type: 'reference',
            _ref: _id
        },
        name,
        email,
        comment
    }).then(res => { 
        console.log(req.body, res);
    }).catch((err) => {
        return res.json({ message: "Couldn't submit comment", err})
})


}

Here's where I access the endpoint in slug.tsx:

const onSubmit: SubmitHandler<IFormInput> = async (data) => {
  

  
       await fetch('/api/createComment', {
           method: 'POST',
           body: JSON.stringify(data)
       }).then(() => {
      console.log(data);
       }).catch(err => {
          console.log(err);
      })
  
  }

When I actually hit the submit button on the webpage it doesn't throw any error in the browser console. It's solely when I go to the localhost3000.com/api/createComment endpoint does this error show up in JSON. This is hindering me from sending blog comments to Sanity Studio. Any idea why this is happening? I'd appreciate any and all feedback. Thanks.