import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { of } from 'rxjs';
import { SimpleToolbarComponent } from './simple-toolbar.component';
// import { ToolbarService } from '../../../../df/src/app/services/toolbar/toolbar.service';
import { ActivatedRoute, Params } from '@angular/router';
import { ANONYMOUS_RULES, USER } from 'projects/esp-common/mockup';

import { GraphQLService } from 'projects/esp-common/utils/graphql.service';
import { BsModalService, ModalModule } from 'ngx-bootstrap';
import { RouterTestingModule } from '@angular/router/testing';

const graphQLMockService = { query: () => of(USER) };
describe('SimpleToolbarComponent', () => {
	let component: SimpleToolbarComponent;
	let fixture: ComponentFixture<SimpleToolbarComponent>;
	// let toolbar: ToolbarService;
	let bsModalService: BsModalService;
	let graphQL;
	beforeAll(() => {
		// localStorage.setItem('aeapUser', JSON.stringify(USER));
		localStorage.setItem('anonymous-rule', JSON.stringify(ANONYMOUS_RULES));
		// component.ngOnInit();
	});

	beforeEach(async(() => {
		TestBed.configureTestingModule({
			imports: [[ModalModule.forRoot()], RouterTestingModule],
			declarations: [SimpleToolbarComponent],
			providers: [
				BsModalService,
				{
					provide: ActivatedRoute,
					useValue: {
						params: {
							subscribe: (fn: (value: Params) => void) =>
								fn({
									id: 0,
								}),
						},
					},
				},
				{ provide: GraphQLService, useValue: graphQLMockService },
			],
		}).compileComponents();
		graphQL = TestBed.inject(GraphQLService);
	}));

	beforeEach(() => {
		fixture = TestBed.createComponent(SimpleToolbarComponent);
		bsModalService = TestBed.inject(BsModalService);
		component = fixture.componentInstance;
		component.src = 'alerts';
		fixture.detectChanges();
	});

	it('should create', () => {
		component.ngOnInit();
		expect(component).toBeTruthy();
	});

	it('should load toolbarData onInit', () => {
		expect(component.toolbarData).toBeTruthy();
	});

	it('should call toolbarService', () => {
		const sampleName = 'undo';
		const sampleType = 'navigate';
		const samplePage = 'alerts';
		const toolbarData = { groups: [], toolbarType: '' };
		// toolbar.editToolBar = jest.fn();

		component.toolbarClicked(sampleName, sampleType);
		// expect(toolbar.editToolBar).toHaveBeenCalledWith(sampleName, sampleType, samplePage, toolbarData);
	});

	it('should return a title', () => {
		component.i18n = { 'last-run-by': 'Last Run By' };
		const titleArray = ['last-run-by', 'TitleTwo', 'TitleThree'];
		expect(component.getAlertTitle(titleArray)).toEqual('Last Run By');
	});
});