'use client';

import { Image } from '@/ui/Image';
import { PlaceholderImage } from '@/ui/PlaceholderImage';
import { TeamCard as UITeamCard } from '@/ui/TeamCard';
import React, { ReactNode } from 'react';

interface TeamCardProps {
  name: string;
  description?: string;
  logo?: string;
  memberCount: number;
  isRecruiting?: boolean;
  performanceBadge?: ReactNode;
  specializationContent?: ReactNode;
  categoryBadge?: ReactNode;
  region?: string;
  languagesContent?: ReactNode;
  statsContent?: ReactNode;
  onClick?: () => void;
}

export function TeamCard({
  name,
  description,
  logo,
  memberCount,
  isRecruiting,
  performanceBadge,
  specializationContent,
  categoryBadge,
  region,
  languagesContent,
  onClick,
}: TeamCardProps) {
  return (
    <UITeamCard
      name={name}
      description={description}
      memberCount={memberCount}
      isRecruiting={isRecruiting}
      region={region}
      onClick={onClick}
      logo={
        logo ? (
          <Image
            src={logo}
            alt={name}
            width={64}
            height={64}
            objectFit="cover"
          />
        ) : (
          <PlaceholderImage size={64} />
        )
      }
      badges={
        <React.Fragment>
          {performanceBadge}
          {specializationContent}
          {categoryBadge}
          {languagesContent}
        </React.Fragment>
      }
    />
  );
}