Whenever I try to run npm run build for my project I get the error: Cannot read properties of undefined (reading ’email’). I understand it means that the email cannot be undefined, but I am unsure where it means, the code for the page it is reffering to is pasted below:

import { auth } from "@/firebase";
import { signOut, User } from "firebase/auth";
import { PrettyChatWindow } from "react-chat-engine-pretty";

interface ChatProps {
  user: User;
}

export default function Page(props: ChatProps) {
  return (
    <div style={{ height: "100vh" }}>
      <button
        style={{ position: "absolute", top: "0px", left: "0px" }}
        onClick={() => signOut(auth)}
      >
        Sign Out
      </button>
      <PrettyChatWindow
        projectId="This is the ID I use for chatengine"
        username={props.user.email || "[email protected]"}
        secret={props.user.uid}
        style={{ height: "100%" }}
      />
    </div>
  );
}

I have tried searching online for a fix, but have not found any fix yet, any help would be appreciated.