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

import type { AdminBillingShowProps } from '@/types/admin';

vi.mock('@inertiajs/react', async () => {
  const actual = await vi.importActual('@inertiajs/react');
  return {
    ...actual,
    Head: ({ title }: { title: string }) => <title>{title}</title>,
    usePage: vi.fn(() => ({
      url: '/admin/billing/subscriptions/1',
      props: {
        auth: { user: { name: 'Admin', email: 'admin@test.com', is_admin: true } },
        features: {
          billing: true,
          socialAuth: false,
          emailVerification: true,
          apiTokens: true,
          userSettings: true,
          notifications: false,
          admin: true,
        },
      },
    })),
    Link: ({
      children,
      href,
      ...rest
    }: {
      children: React.ReactNode;
      href: string;
      className?: string;
    }) => (
      <a href={href} {...rest}>
        {children}
      </a>
    ),
    useForm: vi.fn(() => ({
      data: {},
      setData: vi.fn(),
      post: vi.fn(),
      processing: false,
      errors: {},
    })),
    router: {
      patch: vi.fn(),
      delete: vi.fn(),
      post: vi.fn(),
      get: vi.fn(),
      on: vi.fn(() => vi.fn()),
    },
  };
});

vi.mock('@/Components/theme/use-theme', () => ({
  useTheme: vi.fn(() => ({ theme: 'system', setTheme: vi.fn(), resolvedTheme: 'light' })),
}));

import BillingShow from './Show';

const defaultProps: AdminBillingShowProps = {
  subscription: {
    id: 1,
    user_name: 'Alice Example',
    user_email: 'alice@example.com',
    user_id: 5,
    stripe_id: 'sub_test_123',
    stripe_status: 'active',
    tier: 'pro',
    quantity: 1,
    trial_ends_at: null,
    ends_at: null,
    created_at: '2026-01-01T00:00:00Z',
  },
  items: [
    {
      id: 1,
      stripe_price: 'price_pro_monthly',
      stripe_product: 'prod_pro',
      quantity: 1,
      tier: 'pro',
    },
  ],
  audit_logs: [
    {
      id: 10,
      event: 'billing.subscription_created',
      ip: '1.2.3.4',
      created_at: '2026-01-01T00:00:00Z',
      metadata: { tier: 'pro' },
    },
  ],
  available_plans: [
    { label: 'Pro Monthly', value: 'price_pro_monthly', tier: 'pro' },
    { label: 'Team Monthly', value: 'price_team_monthly', tier: 'team' },
  ],
};

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

  it('renders the subscription ID in heading', () => {
    render(<BillingShow {...defaultProps} />);
    expect(screen.getByRole('heading', { level: 1, name: /Subscription #1/i })).toBeInTheDocument();
  });

  it('renders subscriber name and email', () => {
    render(<BillingShow {...defaultProps} />);
    expect(screen.getByText('Alice Example')).toBeInTheDocument();
    expect(screen.getByText('alice@example.com')).toBeInTheDocument();
  });

  it('renders Stripe subscription ID', () => {
    render(<BillingShow {...defaultProps} />);
    expect(screen.getByText('sub_test_123')).toBeInTheDocument();
  });

  it('renders subscription status badge', () => {
    render(<BillingShow {...defaultProps} />);
    expect(screen.getByText('active')).toBeInTheDocument();
  });

  it('renders audit log event', () => {
    render(<BillingShow {...defaultProps} />);
    expect(screen.getByText('billing.subscription_created')).toBeInTheDocument();
  });

  it('shows empty audit log state when no events', () => {
    render(<BillingShow {...defaultProps} audit_logs={[]} />);
    expect(screen.getByText('No billing events')).toBeInTheDocument();
  });

  it('renders subscription items section', () => {
    render(<BillingShow {...defaultProps} />);
    expect(screen.getByText('price_pro_monthly')).toBeInTheDocument();
  });
});