Nextjs cannot destructure property 'user' of 'props' as it is undefined

Question

i'm getting this error when i run npm run build.

Error occurred prerendering page "/components/comments". Read more: https://nextjs.org/docs/messages/prerender-error TypeError: Cannot destructure property 'user' of 'props' as it is undefined.

This is how i'm passing it from parent to child

<CommentComponent 
props={{
            user,
            myComments,
            currentComments,
            value,
            setMsg,
            text,
            setText,
          }}
/>

And this is how i'm receiving it

interface CommentComp {
  props: {
    user: User;
    myComments: MyComments[];
    currentComments: (data: User) => void;
    value: Date;
    setMsg: (data: string) => void;
    text: string;
    setText: (data: string) => void;
  };
}

export default function CommentComponent({ props }: CommentComp): JSX.Element {

  const { user, myComments, currentComments, value, setMsg, text, setText } =
    props;

}

It works fine when running it locally.

I'm getting the props as

export const getServerSideProps: GetServerSideProps = async (context) => {
  const { email } = context.query as { email: string };

  const fetchData = await fetch(`http://localhost:3000/api/user/${email}`);

  const fetchResult = await fetchData.json();

  try {
    const userData = fetchResult as {
      currUser: User;
      notes: MyNotes[];
      tasks: MyTasks[];
      comments: MyComments[];
      reminders: MyReminder[];
    };

    return {
      props: {
        user: userData.currUser,
        notes: userData.notes,
        tasks: userData.tasks,
        comments: userData.comments,
        reminders: userData.reminders,
      },
    };
  } catch (error) {
    console.log(error);
  }
};

After the user signed in it redirects to the [email].tsx page