I am making Next Js web application and browesr is showing type error in 7th line in first block of code .The error is under Product.find()
TypeError: models_Products__WEBPACK_IMPORTED_MODULE_1_.default.find is not a function

   6 | const handler = async (req, res) => {
>  7 |   let products = await Product.find();
     |                       ^
   8 |  
   9 |   res.status(200).json({ products });
  10 | };

**This is my database of mongodb **

import mongoose from "mongoose";

const connectDb = (handler) => async (req, res) => {
  if (mongoose.connections[0].readyState) {
    return handler(req, res);
  }
  await mongoose.connect(process.env.MONGO_URI);
  return handler(req, res);
};
export default connectDb;

`

This is connection of my database to next js app in api folder

import connectDb from "../../database";
import Product from "../../models/Products";

const handler = async (req, res) => {
  let products = await Product.find();

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

export default connectDb(handler);

*This is my product schema

const mongoose=require("mongoose")

const productSchema=new mongoose.Schema({

    title:{
        type:String,
        required:true
    },
    slug:{
        type:String, required:true
    },
    desc:{type:String,required:true},
    img:{type:String,reuired:true},
    category:{type:String,reuired:true},
    size:{type:String},
    color:{type:String},
    price:{type:Number},
    availableQty:{type:String,required:true}
   

},{timestamps:true});

mongoose.models={}

export default mongoose.model=('Product',productSchema)