import { render, screen } from '@testing-library/react';
import { ThemeProvider } from '../../theme';

// next-intl mocked to echo keys (+ params); locale = en so the money util groups with ASCII digits.
jest.mock('next-intl', () => ({
  useTranslations: () => (key: string, params?: Record<string, unknown>) =>
    params ? `${key}:${JSON.stringify(params)}` : key,
  useLocale: () => 'en',
}));

import InstallmentScheduleRow from './InstallmentScheduleRow';
import type { BnplInstallmentRow } from '@/services/bnpl/types';

const DOWN_PAYMENT: BnplInstallmentRow = {
  sequence: 0,
  kind: 'down_payment',
  dueDate: '2026-07-10',
  amountIrr: '4660000', // 466,000 Toman
};

const INSTALLMENT: BnplInstallmentRow = {
  sequence: 2,
  kind: 'installment',
  dueDate: '2026-09-01',
  amountIrr: '4040000', // 404,000 Toman
  status: 'paid',
};

function renderRow(props: React.ComponentProps<typeof InstallmentScheduleRow>) {
  return render(
    <ThemeProvider>
      <InstallmentScheduleRow {...props} />
    </ThemeProvider>,
  );
}

describe('<InstallmentScheduleRow/> component', () => {
  it('renders the down-payment row: label, «today» due, and served amount', () => {
    renderRow({ row: DOWN_PAYMENT });
    expect(screen.getByText('down_payment')).toBeInTheDocument();
    expect(screen.getByText('today')).toBeInTheDocument();
    expect(screen.getByText(/466,000/)).toBeInTheDocument();
    expect(screen.getByText('down_payment')).toBeInTheDocument();
  });

  it('renders an installment row with the numbered label and no status chip by default', () => {
    const { container } = renderRow({ row: INSTALLMENT });
    expect(screen.getByText('installment_n:{"n":2}')).toBeInTheDocument();
    expect(screen.getByText(/404,000/)).toBeInTheDocument();
    // showStatus defaults to false → no chip even when a status is present.
    expect(container.querySelector('[data-status]')).toBeNull();
  });

  it('renders the provider-reported status chip when showStatus is set', () => {
    const { container } = renderRow({ row: INSTALLMENT, showStatus: true });
    // status 'paid' → StatusChip kind 'verified' + label key 'status_paid'.
    expect(container.querySelector('[data-status="verified"]')).not.toBeNull();
    expect(screen.getByText('status_paid')).toBeInTheDocument();
  });

  it('exposes the row kind for automation', () => {
    const { container } = renderRow({ row: DOWN_PAYMENT });
    expect(container.querySelector('[data-row-kind="down_payment"]')).not.toBeNull();
  });
});
