/* eslint-disable import-x/order */
import { render, screen } from '@testing-library/react';
import { beforeEach, describe, expect, it, vi } from 'vitest';

const mockPlans = [
  {
    id: 'plan-1',
    tier: 'FREE',
    name: 'Miễn phí',
    priceMonthlyVND: '0',
    priceYearlyVND: '0',
    maxListings: 3,
    maxSavedSearches: 5,
    features: {},
    isActive: true,
  },
  {
    id: 'plan-2',
    tier: 'AGENT_PRO',
    name: 'Agent Pro',
    priceMonthlyVND: '499000',
    priceYearlyVND: '4990000',
    maxListings: 50,
    maxSavedSearches: 30,
    features: {},
    isActive: true,
  },
];

const mockBilling = {
  subscription: null,
  payments: [],
};

vi.mock('next-intl', () => ({
  useTranslations: () => (key: string) => key,
  useLocale: () => 'vi',
  NextIntlClientProvider: ({ children }: { children: React.ReactNode }) => children,
}));

vi.mock('@/i18n/navigation', () => ({
  Link: ({ children, href, ...props }: { children: React.ReactNode; href: string; [key: string]: unknown }) => (
    <a href={href} {...props}>{children}</a>
  ),
  useRouter: () => ({ push: vi.fn(), replace: vi.fn() }),
  usePathname: () => '/dashboard/subscription',
  redirect: vi.fn(),
}));

vi.mock('lucide-react', () => ({
  AlertCircle: () => <span data-testid="icon-alert-circle" />,
  Check: () => <span data-testid="icon-check" />,
  CreditCard: () => <span data-testid="icon-credit-card" />,
  Loader2: () => <span data-testid="icon-loader2" />,
  Smartphone: () => <span data-testid="icon-smartphone" />,
  Wallet: () => <span data-testid="icon-wallet" />,
}));

vi.mock('@/lib/hooks/use-subscription', () => ({
  usePlans: vi.fn(() => ({ data: mockPlans, isLoading: false })),
  useBillingHistory: vi.fn(() => ({ data: mockBilling, isLoading: false })),
  useQuota: vi.fn(() => ({ data: null })),
  subscriptionKeys: { billing: () => ['billing'] },
}));

vi.mock('@/lib/subscription-api', () => ({
  subscriptionApi: {
    createSubscription: vi.fn(),
    upgradeSubscription: vi.fn(),
    createCheckout: vi.fn(),
  },
}));

vi.mock('@/lib/payment-api', () => ({
  createPayment: vi.fn(),
  getPaymentMethods: vi.fn(() => []),
}));

vi.mock('@/lib/auth-store', () => ({
  useAuthStore: vi.fn(() => ({ user: null, token: null })),
}));

vi.mock('@tanstack/react-query', async (importOriginal) => {
  const actual = (await importOriginal()) as Record<string, unknown>;
  return {
    ...actual,
    useQueryClient: () => ({
      invalidateQueries: vi.fn(),
    }),
  };
});

import SubscriptionPage from '../subscription/page';

describe('SubscriptionPage', () => {
  beforeEach(() => {
    vi.clearAllMocks();
  });

  it('renders subscription page heading', () => {
    render(<SubscriptionPage />);
    expect(screen.getByText('Gói dịch vụ')).toBeInTheDocument();
  });

  it('renders tab navigation', () => {
    render(<SubscriptionPage />);
    expect(screen.getByText('Gói hiện tại')).toBeInTheDocument();
    expect(screen.getByText('So sánh gói')).toBeInTheDocument();
    expect(screen.getByText('Lịch sử thanh toán')).toBeInTheDocument();
  });

  it('renders current plan info for free tier', () => {
    render(<SubscriptionPage />);
    expect(screen.getByText(/bạn đang sử dụng gói miễn phí/i)).toBeInTheDocument();
  });

  it('renders plan description text', () => {
    render(<SubscriptionPage />);
    expect(screen.getByText(/quản lý gói đăng ký/i)).toBeInTheDocument();
  });
});
