import type { EventInfo } from './types';
import { useCallback } from 'react';
import { toast } from 'sonner';
import { useJoinEvent } from '@/hooks/data/useJoinEvent';
import { Dialog } from '../ui/dialog';
import { EventJoinDialogView } from './event-join.dialog.view';

export function EventJoinContainer({ event, children }: { event: EventInfo; children: React.ReactNode }) {
  const { mutateAsync } = useJoinEvent();
  const join = useCallback(() => {
    mutateAsync({ body: { event_id: event.eventId } }).then(() => {
      toast('加入活动成功');
    }).catch((error) => {
      console.error(error);
      toast.error('加入活动失败');
    });
  }, [event.eventId, mutateAsync]);

  return (
    <Dialog>
      {children}
      <EventJoinDialogView event={event} onJoinEvent={join} />
    </Dialog>
  );
}