import { Component } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { <%= classify(name) %>, <%= classify(name) %>Beneficiary } from './<%= dasherize(name) %>';

@Component({
  imports: [<%= classify(name) %>],
  template: `
    <<%= selector %>
      title="Destinatários"
      [beneficiaries]="beneficiaries"
      [(selectedId)]="selectedId"
      (beneficiarySelect)="selected = $event"
    />
  `,
})
class HostComponent {
  selectedId: string | null = null;
  selected: <%= classify(name) %>Beneficiary | null = null;
  beneficiaries: <%= classify(name) %>Beneficiary[] = [
    {
      id: 'recipient-1',
      name: 'Camila Souza',
      institution: 'Banco Exemplo',
      accountLabel: 'Conta corrente **** 4098',
      status: 'Verificado',
    },
  ];
}

@Component({
  imports: [<%= classify(name) %>],
  template: `<<%= selector %> [beneficiaries]="[]" />`,
})
class EmptyHostComponent {}

describe('<%= classify(name) %>', () => {
  let fixture: ComponentFixture<HostComponent>;

  beforeEach(async () => {
    await TestBed.configureTestingModule({ imports: [HostComponent, EmptyHostComponent] }).compileComponents();
    fixture = TestBed.createComponent(HostComponent);
    fixture.detectChanges();
  });

  it('renders a labelled recipient list with account metadata', () => {
    const section = fixture.nativeElement.querySelector('section');
    const heading = fixture.nativeElement.querySelector('h2');
    const button = fixture.nativeElement.querySelector('button');

    expect(section.getAttribute('aria-labelledby')).toBe(heading.id);
    expect(heading.textContent).toContain('Destinatários');
    expect(button.textContent).toContain('Camila Souza');
    expect(button.textContent).toContain('Conta corrente **** 4098');
    expect(button.getAttribute('aria-pressed')).toBe('false');
  });

  it('selects a beneficiary through the native button', () => {
    const button = fixture.nativeElement.querySelector('button');
    button.click();
    fixture.detectChanges();

    expect(fixture.componentInstance.selectedId).toBe('recipient-1');
    expect(fixture.componentInstance.selected?.name).toBe('Camila Souza');
    expect(button.getAttribute('aria-pressed')).toBe('true');
  });

  it('renders an empty state when there are no beneficiaries', () => {
    const emptyFixture = TestBed.createComponent(EmptyHostComponent);
    emptyFixture.detectChanges();

    expect(emptyFixture.nativeElement.querySelector('[role="status"]').textContent).toContain('Nenhum destinatário salvo encontrado.');
  });
});