I feel like this error makes no sense cuz i already access field by FeedTypes key. But it still complaining about properties does not exist.

One thing i can do it’s a strict equal like (props.type === FeedTypes.CONVERSATION) but as i mentioned before it’s really doesn’t make sense cuz i already access field by props.type:

export type ChatHeaderProps =
| {
      name: string;
      isVerified?: boolean;
      type: FeedTypes.CONVERSATION;
      lastSeenAt: string;
  }
| {
      name: string;
      isVerified?: boolean;
      type: FeedTypes.GROUP;
      members: number;
  };

const ChatHeader = (props: ChatHeaderProps) => {
    // another code here...

    const titles: Record<Exclude<FeedTypes, 'user'>, string> = {
        conversation: `last seen ${getRelativeTimeString(new Date(props.lastSeenAt), 'en-US')}`,
        group: `${props.members} members`,
    }

    return (
       // another jsx here
      <Typography as='p' variant='secondary'>
        {titles[props.type]}
      </Typography>            
    );
};

export default ChatHeader;

Here is error:

Property ‘lastSeenAt’ does not exist on type ‘ChatHeaderProps’.
Property ‘lastSeenAt’ does not exist on type ‘{ name: string; isVerified?: boolean | undefined; type: FeedTypes.GROUP; members: number; }’.

Property ‘members’ does not exist on type ‘ChatHeaderProps’.
Property ‘members’ does not exist on type ‘{ name: string; isVerified?: boolean | undefined; type: FeedTypes.CONVERSATION; lastSeenAt: string; }’.