'use client';
import { useCreateTrialSubscriptionMutation } from '@/hooks/api/subscriptions';
import { Button } from '@repo/ui/components/ui/button';
import { Sparkles } from 'lucide-react';
import { useRouter } from 'next/navigation';
import { type ComponentProps } from 'react';

export function TryFreeButton({ className = '', size = 'lg' }: ComponentProps<typeof Button>) {
  const router = useRouter();
  const { isPending, mutateAsync: createTrialSubscription } = useCreateTrialSubscriptionMutation();

  const handleTryFree = async () => {
    await createTrialSubscription();
    router.refresh();
  };

  return (
    <Button
      className={`w-full bg-gradient-to-r from-purple-600 to-blue-600 px-8 py-3 text-base font-semibold text-white shadow-lg transition-all duration-200 hover:from-purple-700 hover:to-blue-700 hover:shadow-xl sm:w-auto ${className}`}
      disabled={isPending}
      onClick={handleTryFree}
      size={size}
    >
      <Sparkles className="mr-2 size-5" />
      {isPending ? 'Активация...' : 'Попробовать бесплатно'}
    </Button>
  );
}