import type React from 'react';
import type { ContactInfo, GroupInfo, FriendApplicationInfo, GroupApplicationInfo } from 'tuikit-atomicx-react/chat';
import { ContactItemType } from '../../../types/contact';
import { BlacklistItem } from './BlacklistItem/BlacklistItem';
import { FriendApplicationItem } from './FriendApplicationItem/FriendApplicationItem';
import { FriendItem } from './FriendItem/FriendItem';
import { GroupApplicationItem } from './GroupApplicationItem/GroupApplicationItem';
import { GroupItem } from './GroupItem/GroupItem';
import type {
  ContactListItemProps,
} from '../../../types/contact';

export const ContactListItem: React.FC<ContactListItemProps> = ({
  contactItem,
  activeContactItem,
  onClick,
  onFriendApplicationAction,
  onGroupApplicationAction,
  className,
  style,
}) => {
  const { type, data: item } = contactItem;
  const { type: activeType, data: activeItem } = activeContactItem || { type: null, data: null };
  switch (type) {
    case ContactItemType.FRIEND:
      return (
        <FriendItem
          friend={item as ContactInfo}
          isActive={activeType === ContactItemType.FRIEND && activeItem === item}
          {...(onClick && { onClick: (friend: ContactInfo) => onClick(ContactItemType.FRIEND, friend) })}
          {...(className && { className })}
          {...(style && { style })}
        />
      );

    case ContactItemType.GROUP:
      return (
        <GroupItem
          group={item as GroupInfo}
          isActive={activeType === ContactItemType.GROUP && activeItem === item}
          {...(onClick && {
            onClick: (group: GroupInfo) => onClick(ContactItemType.GROUP, group),
          })}
          {...(className && { className })}
          {...(style && { style })}
        />
      );

    case ContactItemType.BLACK:
      return (
        <BlacklistItem
          profile={item as ContactInfo}
          isActive={activeType === ContactItemType.BLACK && activeItem === item}
          {...(onClick && {
            onClick: (profile: ContactInfo) => onClick(ContactItemType.BLACK, profile),
          })}
          {...(className && { className })}
          {...(style && { style })}
        />
      );

    case ContactItemType.FRIEND_REQUEST:
      return (
        <FriendApplicationItem
          application={item as FriendApplicationInfo}
          isActive={activeType === ContactItemType.FRIEND_REQUEST && activeItem === item}
          {...(onClick && {
            onClick: (application: FriendApplicationInfo) =>
              onClick(ContactItemType.FRIEND_REQUEST, application),
          })}
          {...(onFriendApplicationAction && { onAction: onFriendApplicationAction })}
          {...(className && { className })}
          {...(style && { style })}
        />
      );

    case ContactItemType.GROUP_REQUEST:
      return (
        <GroupApplicationItem
          application={item as GroupApplicationInfo}
          isActive={activeType === ContactItemType.GROUP_REQUEST && activeItem === item}
          {...(onClick && {
            onClick: (application: GroupApplicationInfo) =>
              onClick(ContactItemType.GROUP_REQUEST, application),
          })}
          {...(onGroupApplicationAction && { onAction: onGroupApplicationAction })}
          {...(className && { className })}
          {...(style && { style })}
        />
      );

    default:
      console.warn(`Unknown contact type: ${type}`);
      return null;
  }
};

export default ContactListItem;