import { render, screen } from '@testing-library/react';
import { describe, it, expect } from 'vitest';
import { StatusBadge } from '../status-badge';

describe('StatusBadge', () => {
  describe('Member Status', () => {
    it('renders verified member status', () => {
      render(<StatusBadge type="member" status="verified" />);
      const badge = screen.getByText('Terverifikasi');
      expect(badge).toBeInTheDocument();
      expect(badge).toHaveClass('bg-green-100');
    });

    it('renders unverified member status', () => {
      render(<StatusBadge type="member" status="unverified" />);
      const badge = screen.getByText('Belum Terverifikasi');
      expect(badge).toBeInTheDocument();
      expect(badge).toHaveClass('bg-yellow-100');
    });
  });

  describe('Savings Status', () => {
    it('renders active savings status', () => {
      render(<StatusBadge type="savings" status="active" />);
      const badge = screen.getByText('Aktif');
      expect(badge).toBeInTheDocument();
    });

    it('renders dormant savings status', () => {
      render(<StatusBadge type="savings" status="inactive" />);
      const badge = screen.getByText('Tidak Aktif');
      expect(badge).toBeInTheDocument();
    });

    it('renders closed savings status', () => {
      render(<StatusBadge type="savings" status="closed" />);
      const badge = screen.getByText('Tutup');
      expect(badge).toBeInTheDocument();
    });

    it('renders frozen savings status', () => {
      render(<StatusBadge type="savings" status="frozen" />);
      const badge = screen.getByText('Dibekukan');
      expect(badge).toBeInTheDocument();
    });
  });

  describe('Financing Status', () => {
    it('renders proposed financing status', () => {
      render(<StatusBadge type="financing" status="proposed" />);
      const badge = screen.getByText('Diajukan');
      expect(badge).toBeInTheDocument();
    });

    it('renders approved financing status', () => {
      render(<StatusBadge type="financing" status="approved" />);
      const badge = screen.getByText('Disetujui');
      expect(badge).toBeInTheDocument();
    });

    it('renders active financing status', () => {
      render(<StatusBadge type="financing" status="active" />);
      const badge = screen.getByText('Aktif');
      expect(badge).toBeInTheDocument();
    });

    it('renders paid/lunas financing status', () => {
      render(<StatusBadge type="financing" status="paid_off" />);
      const badge = screen.getByText('Lunas');
      expect(badge).toBeInTheDocument();
    });

    it('renders rejected financing status', () => {
      render(<StatusBadge type="financing" status="rejected" />);
      const badge = screen.getByText('Ditolak');
      expect(badge).toBeInTheDocument();
    });
  });

  it('renders nothing for unknown status', () => {
    const { container } = render(<StatusBadge type="member" status="unknown" />);
    // StatusBadge returns null for unknown status
    expect(container.firstChild).toBeNull();
  });

  it('renders custom label when provided', () => {
    render(<StatusBadge type="member" status="verified" customLabel="Custom Verified" />);
    const badge = screen.getByText('Custom Verified');
    expect(badge).toBeInTheDocument();
  });
});