POST 500 - Internal Server error. Server Error - Error: The `line_items` parameter is required in payment mode

Question

I am building an e-commerce application where the payment gateway integration has been throwing problems. Here's the code -

Checkout session page -

import type { NextApiRequest, NextApiResponse } from "next";
import{ useContext } from "react";
import {Context}  from "../../context/index"
const stripe = require('stripe')('-->stripe key<--');


export default async function handler(
    req: NextApiRequest,
    res: NextApiResponse
) {
    const {cart} = req.body;
  
    const lineItems = [];
    for (const key in cart){
        lineItems.push({
            price_data: {
               currency: 'usd',
               unit_amount: cart[key].price * 100,
               product_data: {
                
                name: cart[key].name,
                description: 'Comfortable cotton t-shirt',
                images: ['https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRxYCLeYPXfLyphoYaUXGiJr3lkMy_YRUl01V-Vwxe2KdUcAa0Df0GzuccAzK1JBdmXsYE&usqp=CAU'],
               },
               
            },
            quantity: cart[key].qty,
        });
    }

    const session = await stripe.checkout.sessions.create({
        
        mode: 'payment',
        success_url: 'http://localhost:3000/success',
        cancel_url: 'http://localhost:3000/cancel',
        line_items: [...lineItems],
    });
    console.log(session);

    res.status(200).json({session});
}

Context API -

import { useReducer, createContext } from "react";

//initial state

const initialState = {
    cart: {},
};

const Context = createContext({});
// @ts-ignore
function cartReducer(state, action){
    switch(action.type){
        case "ADD_TO_CART":
            const item = state.cart[action.payload._id];
            return{
                ...state,
                cart: {
                    ...state.cart,
                    [action.payload._id] : item ? {
                        ...item,
                        qty: item.qty + 1,
                    } : {
                        ...action.payload,
                        qty: 1,
                    }
                }
            }
        case "REMOVE_FROM_CART":
            let newCart = {...state.cart};
            delete newCart[action.payload._id];
            return {
                ...state,
                cart: newCart,
            }
            default:
                return state;

    }
}

//context provider
// @ts-ignore
const Provider = ({children}) => {
    const [state, dispatch] = useReducer(cartReducer, initialState);
    return(
        <Context.Provider value={{state, dispatch}}>
            {children}
        </Context.Provider>
    );
}

export {Context, Provider};

Error - enter image description here Using Next.js, Stripe Gateway, FaunaDB for this application

I tried removing JSON.parse from const {cart} = JSON.parse(res.body), but it said 'end of input'