I am trying to implement a custom api handler in Pages Directory, everything seems okay but im seeing this error.


api-helper.ts:

import { NextRequest, NextResponse } from "next/server";


async function apiHandler(func: (req: NextRequest, res: NextResponse) => any) {
  return async (req: NextRequest, res: NextResponse<any>) => {
    if (req.method !== "POST") {
      return res.status(405).end({
        message: "Invalid Request method!",
        url: req.url,
        payload: req.body
      });
    }
    
    const { body } = await req.json();
    if (!body?.source) {
      return res.status(500).end({
        message: "Invalid Payload!",
        url: req.url,
        payload: req.body
      });
    }  
  
    await func(req, res);
  }  
}

/api/search.ts:

import { apiHandler } from "@/helpers/apiHelper";
import { NextRequest, NextResponse } from "next/server";

async function handler(req: NextRequest, res: NextResponse) {
  const data = await req.json();
  console.log(data);
  return res.json(data);
}

export default apiHandler(handler);