import React from 'react';
import { Organization } from '@/types.ts';
import { useTranslation } from '@/hooks/useI18n.tsx';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/Card.tsx';
import DirectMatchesDisplay from '@/components/organization/DirectMatchesDisplay.tsx';

interface DirectSymbiosisProps {
  organization: Organization;
  onSelectOrg: (org: Organization) => void;
}

const DirectSymbiosis = ({ organization, onSelectOrg }: DirectSymbiosisProps) => {
  const { t } = useTranslation();

  return (
    <Card>
      <CardHeader>
        <CardTitle>{t('organizationPage.directSymbiosis.title')}</CardTitle>
      </CardHeader>
      <CardContent>
        <DirectMatchesDisplay organization={organization} onSelectOrg={onSelectOrg} />
      </CardContent>
    </Card>
  );
};

export default React.memo(DirectSymbiosis);