Passing the result of a DB find() with props, to a react component

After reading data from a MongoDB Atlas database (in a Next.js app), using a server component. I want to pass the result (as props) to a client component (to provide some interactivity in the user interface); but this is the point where things go wrong.

Here is the (relevant) code for my Next.js server component:(with some comments included)

import connectDB from "../../configDB";import mongoose from "mongoose";export default async function GetShops() {  await connectDB()  const {Schema} = mongoose;  const restoSchema = new Schema({    name: String,    ...    zipCode: String  });  const MyModel = mongoose.model('mycollection', restoSchema);  const results = await MyModel.find({})  console.log("find-result : "+results.length)  console.log("find-result : "+results[0].name)  console.log("find-result : "+results[1].name)  // The console.log above are working as expected.  // Up to here all is GOOD !  return (<ShowShops shops={results} /> // This is not working !!  )} /* End of GetShops */

Here is the relevant code for the client component:

'use client';import mongoose from "mongoose";.....const {Schema} = mongoose;const restoSchema = new Schema({  name: String,  ...  zipCode: String});export default function ShowShops({shops}:{shops:(typeof restoSchema)[]}) {  .....  .....  return (<>    .....</>  )} /* End of ShowShops */

The parameter-passing through props is obviously using a wrong syntax.Searching the net I have tried a few variations on the code, but for the time being it all fails.

I hope someone can put me on the proper track by providing some relevant hints.