import { ComponentFixture, TestBed } from '@angular/core/testing';

import { ChainEdit } from './chain-edit';
import { ActivatedRoute } from '@angular/router';
import { BehaviorSubject } from 'rxjs';
import { Chain } from '../../models/Chain';
import { provideTranslateService } from '@ngx-translate/core';
import { By } from '@angular/platform-browser';
import { ImageStorage } from '../../services/image-storage';
import { ChainSettings } from '../../services/chain-settings';

const CHAIN_MOCK = new Chain('Mock', '', 1);
describe('ChainEdit', () => {
  let component: ChainEdit;
  let fixture: ComponentFixture<ChainEdit>;

  let activatedRoute: Partial<ActivatedRoute>;
  let chainSettings: Partial<ChainSettings>;
  let imageStorage: Partial<ImageStorage>;

  const dataSubject = new BehaviorSubject({ chain: CHAIN_MOCK });
  beforeEach(async () => {
    activatedRoute = {
      data: dataSubject,
    };
    chainSettings = {
      update: vi.fn(),
    };
    imageStorage = {
      getImage: vi.fn(),
      saveImage: vi.fn(),
      deleteImage: vi.fn(),
    };

    await TestBed.configureTestingModule({
      imports: [ChainEdit],
      providers: [
        provideTranslateService(),
        { provide: ActivatedRoute, useValue: activatedRoute },
        { provide: ChainSettings, useValue: chainSettings },
        { provide: ImageStorage, useValue: imageStorage },
      ],
    }).compileComponents();

    fixture = TestBed.createComponent(ChainEdit);
    component = fixture.componentInstance;
  });

  it('should create', async () => {
    await fixture.whenStable();
    expect(component).toBeTruthy();
  });

  it('should call chainSettings update on chain update', async () => {
    const CHAIN_NAME_UPDATE_MOCK = 'name update mock';
    await fixture.whenStable();
    //User updates name input field
    component.form.controls.name.patchValue(CHAIN_NAME_UPDATE_MOCK)
    fixture.whenStable();
    const actionBtn = fixture.debugElement.query(By.css('app-action-btn'));
    actionBtn.triggerEventHandler('click');
    await fixture.whenStable();
    expect(chainSettings.update).toHaveBeenCalledExactlyOnceWith(
      CHAIN_MOCK,
      new Chain(CHAIN_NAME_UPDATE_MOCK, component['chain']!.image, component['chain']!.id),
      component.form.controls.image.value,
    );
  });

  it('should patch form with chain data', async () => {
    const IMAGE_FILE_MOCK = new Blob([], { type: 'image/png' });
    imageStorage.getImage = vi.fn().mockResolvedValue(IMAGE_FILE_MOCK);
    const CHAIN_MOCK = new Chain('name', 'image.png', 1);
    dataSubject.next({ chain: CHAIN_MOCK });
    await fixture.whenStable();
    expect(component.form.controls.name.value).toEqual(CHAIN_MOCK.name);
    expect(component.form.controls.image.value?.type).toEqual(IMAGE_FILE_MOCK.type);
  });
});