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

describe('StatusBadge', () => {
    it('renders "Success" for status="success"', () => {
        render(<StatusBadge status="success" />);
        expect(screen.getByText('Success')).toBeInTheDocument();
    });

    it('renders "Failed" for status="failed"', () => {
        render(<StatusBadge status="failed" />);
        expect(screen.getByText('Failed')).toBeInTheDocument();
    });

    it('renders "Denied" for status="denied"', () => {
        render(<StatusBadge status="denied" />);
        expect(screen.getByText('Denied')).toBeInTheDocument();
    });

    it('applies green colour class for success', () => {
        const { container } = render(<StatusBadge status="success" />);
        expect((container.firstChild as HTMLElement).className).toContain(
            'bg-green-500/10',
        );
    });

    it('applies red colour class for failed', () => {
        const { container } = render(<StatusBadge status="failed" />);
        expect((container.firstChild as HTMLElement).className).toContain(
            'bg-red-500/10',
        );
    });

    it('applies orange colour class for denied', () => {
        const { container } = render(<StatusBadge status="denied" />);
        expect((container.firstChild as HTMLElement).className).toContain(
            'bg-orange-500/10',
        );
    });

    it('falls back to muted style for an unknown status and renders the raw value', () => {
        const { container } = render(<StatusBadge status="unknown_status" />);
        expect(screen.getByText('unknown_status')).toBeInTheDocument();
        expect((container.firstChild as HTMLElement).className).toContain(
            'bg-muted',
        );
    });

    it('accepts and applies an extra className', () => {
        const { container } = render(
            <StatusBadge status="success" className="my-custom-class" />,
        );
        expect((container.firstChild as HTMLElement).className).toContain(
            'my-custom-class',
        );
    });
});

describe('ReviewBadge', () => {
    it('renders "Unreviewed" when status is null', () => {
        render(<ReviewBadge status={null} />);
        expect(screen.getByText('Unreviewed')).toBeInTheDocument();
    });

    it('renders "Reviewed" for status="reviewed"', () => {
        render(<ReviewBadge status="reviewed" />);
        expect(screen.getByText('Reviewed')).toBeInTheDocument();
    });

    it('renders "Escalated" for status="escalated"', () => {
        render(<ReviewBadge status="escalated" />);
        expect(screen.getByText('Escalated')).toBeInTheDocument();
    });

    it('renders "Resolved" for status="resolved"', () => {
        render(<ReviewBadge status="resolved" />);
        expect(screen.getByText('Resolved')).toBeInTheDocument();
    });

    it('renders "False Positive" for status="false_positive"', () => {
        render(<ReviewBadge status="false_positive" />);
        expect(screen.getByText('False Positive')).toBeInTheDocument();
    });

    it('applies green colour class for reviewed', () => {
        const { container } = render(<ReviewBadge status="reviewed" />);
        expect((container.firstChild as HTMLElement).className).toContain(
            'bg-green-500/10',
        );
    });

    it('applies red colour class for escalated', () => {
        const { container } = render(<ReviewBadge status="escalated" />);
        expect((container.firstChild as HTMLElement).className).toContain(
            'bg-red-500/10',
        );
    });

    it('applies blue colour class for resolved', () => {
        const { container } = render(<ReviewBadge status="resolved" />);
        expect((container.firstChild as HTMLElement).className).toContain(
            'bg-blue-500/10',
        );
    });
});