'use client';
import { useRouter } from 'next/navigation';
import { Button } from '@/components/ui/button';
import { useAsyncFn } from '@/hooks/tools';
import { useStreamChatStore } from '@/stores/stream-chat';

export default function ChatButton({ id }: { id: string }) {
  const router = useRouter();
  const createChannel = useStreamChatStore((s) => s.createChannel);

  const { loading, run: createChannelAndPush } = useAsyncFn(async () => {
    const channelId = await createChannel(id);
    if (!channelId) return;
    router.push(`/chat/${channelId}`);
  });

  return (
    <Button loading={loading} onClick={() => createChannelAndPush()} variant="primary">
      Chat
    </Button>
  );
}