So everything was working fine until I decided to add a header component to my messenger clone.This specific problem has returned null and crashed my application like 5-6 times. Can anyone help why this is not compatible?

———————ERROR:

Argument of type ‘{ id: string; createdAt: Date; lastMessageAt: Date; name: string | null; isGroup: boolean | null; messagesIds: string[]; userIds: string[]; } & { user: { id: string; name: string | null; … 7 more …; seenMessageIds: string[]; }[]; }’ is not assignable to parameter of type ‘FullConversationType | { users: { id: string; name: string | null; email: string | null; emailVerified: Date | null; image: string | null; hashedPassword: string | null; createdAt: Date; updatedAt: Date; conversationIds: string[]; seenMessageIds: string[]; }[]; }’.
Type ‘{ id: string; createdAt: Date; lastMessageAt: Date; name: string | null; isGroup: boolean | null; messagesIds: string[]; userIds: string[]; } & { user: { id: string; name: string | null; … 7 more …; seenMessageIds: string[]; }[]; }’ is not assignable to type ‘FullConversationType’.
Type ‘{ id: string; createdAt: Date; lastMessageAt: Date; name: string | null; isGroup: boolean | null; messagesIds: string[]; userIds: string[]; } & { user: { id: string; name: string | null; … 7 more …; seenMessageIds: string[]; }[]; }’ is missing the following properties from type ‘{ users: { id: string; name: string | null; email: string | null; emailVerified: Date | null; image: string | null; hashedPassword: string | null; createdAt: Date; updatedAt: Date; conversationIds: string[]; seenMessageIds: string[]; }[]; messages: FullMessageType[]; }’: users, messagests(2345)
(parameter) conversation: {
id: string;
createdAt: Date;
lastMessageAt: Date;
name: string | null;
isGroup: boolean | null;
messagesIds: string[];
userIds: string[];
} & {
user: User[];
}

“use client”;

import useOtherUser from “@/app/hooks/useOtherUser”;
import { Conversation, User } from “@prisma/client”;

interface HeaderProps {
conversation: Conversation & {
user: User[];
};
}
const Header: React.FC<HeaderProps> = ({ conversation }) => {
const otherUser=useOtherUser(conversation);
return <div>Header</div>;
};
export default Header;

——————–UseOtherUser function:

import { useSession } from “next-auth/react”;
import { useMemo } from “react”;
import { FullConversationType } from “../types”;
import { User } from “@prisma/client”;

const useOtherUser = (
conversation:
| FullConversationType
| {
users: User[];
}
) => {
const session = useSession();

const otherUser = useMemo(() => {
const currentUserEmail = session?.data?.user?.email;

const otherUser = conversation.users.filter( (user) => user.email !== currentUserEmail ); return otherUser[0];

}, [session?.data?.user?.email, conversation.users]);

return otherUser;
};

export default useOtherUser;

————————Type definition:

import { Conversation, Message, User } from “@prisma/client”;

export type FullMessageType = Message & {
sender: User;
seen: User[];
};
export type FullConversationType = Conversation & {
users: User[];
messages: FullMessageType[];
};

————————Prisma schema

model Conversation{
id String @id @default(auto()) @map(“_id”) @db.ObjectId
createdAt DateTime @default(now())
lastMessageAt DateTime @default(now())
name String?
isGroup Boolean?
messagesIds String[] @db.ObjectId
messages Message[]

userIds String[]@db.ObjectId
users User[] @relation(fields: [userIds],references: [id])

}