I am using NextJs 15 and making a social media app. I used getAllPost from server actions to get all the posts:

export async function getAllPost({ userId }: { userId: string }) {
    try {
        await connectToDatabase();
        const posts = await Post.find({ author: userId })
            .sort({ createdAt: -1 })
            .populate("author", "name username picture");

        return { posts };
    } catch (error) {
        console.log(error);
        throw error;
    }
}

the problem comes when importing the data server side component:

import UserInfo from "@/components/userProfile/UserInfo";
import UserPost from "@/components/userProfile/UserPost";
import { getAllPost } from "@/lib/actions/post.action";
import { getUserByUserName } from "@/lib/actions/user.action";
import { redirect } from "next/navigation";

const Page = async ({ params }: { params: Promise<{ username: string }> }) => {
    const { username } = await params;
    const user = await getUserByUserName(username);
    const result = await getAllPost({ userId: user._id });
    console.log(result);
    console.log(result.posts[0].author);
    if (!user) {
        redirect("/sign-in");
    }

    return (
        <>
            <div className="mb-4">
                <UserInfo />
            </div>
            <div className="grid gap-4">
                {result.posts.map((post) => (
                    <UserPost
                        key={post._id}
                        author={post.author}
                        postText={post.text}
                        postImg={post.image}
                        postedAt={post.createdAt}
                        likesCount={post.likes.length}
                        repliesCount={post.replies.length}
                    />
                ))}
            </div>
        </>
    );
};

export default Page;

It gives the error as mentioned in the title.

When I changed the author prop in UserPost to:

author={JSON.parse(JSON.stringify(post.author))} ,

the error goes away. I am confused why that caused the respective error. Here are the outputs of the console.log statements if that will help:

{
  posts: [
    {
      _id: new ObjectId('67d82ef7da6e7a6e353a342e'),
      text: 'long form',
      image: '.jpg',
      author: [Object],
      likes: [],
      replies: [],
      createdAt: 2025-03-17T14:17:27.924Z,
      __v: 0
    },
    {
      _id: new ObjectId('67d82ed9da6e7a6e353a3427'),
      text: 'friends!',
      image: '.jpg',
      author: [Object],
      likes: [],
      replies: [],
      createdAt: 2025-03-17T14:16:57.974Z,
      __v: 0
    },
    {
      _id: new ObjectId('67d82e9eda6e7a6e353a3420'),
      text: 'Bicycling',
      image: '.jpg',
      author: [Object],
      likes: [],
      replies: [],
      createdAt: 2025-03-17T14:15:58.333Z,
      __v: 0
    },
    {
      _id: new ObjectId('67d819149eefa3a97ae65878'),
      text: 'cool',
      image: '.png',
      author: [Object],
      likes: [],
      replies: [],
      createdAt: 2025-03-17T12:44:04.402Z,
      __v: 0
    }
  ]
}
{
  _id: new ObjectId('67cc2e544bd594aa958aefc4'),
  name: 'Sambal Shrestha',
  username: 'sam900',
  picture: ''
}

Here is the code for UserPost: