import { beforeEach, describe, expect, it, vi } from 'vitest';
import { mount } from '@vue/test-utils';
import UiTenantSwitcher from '@/components/navigation/UiTenantSwitcher.vue';
import { field } from '@/plugins/field';

const intersectionObserverMock = () => ({
  observe: () => null,
});

const UiTenantSwitcherFactory = (props: any) => {
  const wrapper = mount(UiTenantSwitcher, {
    global: {
      plugins: [field],
      stubs: {
        Teleport: true,
      },
    },
    props: {
      ...props,
      to: 'div#App',
    },
  });

  return {
    wrapper,
  };
};

describe('UiTenantSwitcherFactory', () => {
  beforeEach(() => {
    vi.resetAllMocks();
    window.IntersectionObserver = vi
      .fn()
      .mockImplementation(intersectionObserverMock);
  });

  describe('filteredTenants', () => {
    it('should retrieve tenants based on tenant id', () => {
      const { wrapper } = UiTenantSwitcherFactory({
        visible: true,
        tenants: [
          {
            information: 'blue team',
            label: 'First tenant',
          },
          {
            information: 'red team',
            label: 'Second tenant',
          },
        ],
      });
      (wrapper.vm as any).search = 'blue';
      expect((wrapper.vm as any).filteredTenants).toEqual([
        {
          information: 'blue team',
          label: 'First tenant',
        },
      ]);
    });
    it('should retrieve tenants based on tenant label', () => {
      const { wrapper } = UiTenantSwitcherFactory({
        visible: true,
        tenants: [
          {
            information: 'blue team',
            label: 'First tenant',
          },
          {
            information: 'red team',
            label: 'Second tenant',
          },
        ],
      });
      (wrapper.vm as any).search = 'Sec';
      expect((wrapper.vm as any).filteredTenants).toEqual([
        {
          information: 'red team',
          label: 'Second tenant',
        },
      ]);
    });
  });

  describe('remove favourite tenant', () => {
    it('should emit remove event when click on close icon', () => {
      const { wrapper } = UiTenantSwitcherFactory({
        visible: true,
        tenants: [
          {
            information: 'blue team',
            label: 'First tenant',
            isFavorite: true,
          },
          {
            information: 'red team',
            label: 'Second tenant',
          },
        ],
      });
      const items = wrapper.findAll('.tenantsMenu-tenants-item');
      items[0].find('.remove-tenant-button').trigger('click');
      expect((wrapper as any).emitted()['removeFavoriteTenant'][0][0]).toEqual({
        information: 'blue team',
        label: 'First tenant',
        isFavorite: true,
      });
      expect(wrapper.emitted()['changeTenant']).toEqual(undefined);
    });
  });

  describe('change tenant', () => {
    it('should emit changeTenant event when click on tenant', () => {
      const { wrapper } = UiTenantSwitcherFactory({
        visible: true,
        tenants: [
          {
            information: 'blue team',
            label: 'First tenant',
            isFavorite: true,
          },
          {
            information: 'red team',
            label: 'Second tenant',
          },
        ],
      });
      const items = wrapper.findAll('.tenantsMenu-tenants-item');
      items[1].trigger('click');
      expect(wrapper.emitted()['removeFavoriTetenant']).toEqual(undefined);
      expect((wrapper as any).emitted()['changeTenant'][0][0]).toEqual({
        information: 'red team',
        label: 'Second tenant',
      });
    });
  });

  describe('keypress', () => {
    it('should select first entry when pressing enter', () => {
      const { wrapper } = UiTenantSwitcherFactory({
        visible: true,
        tenants: [
          {
            information: 'blue team',
            label: 'First tenant',
          },
          {
            information: 'red team',
            label: 'Second tenant',
          },
        ],
      });
      (wrapper.vm as any).onEnterKeyPress();
      expect((wrapper as any).emitted()['changeTenant'][0][0]).toEqual({
        information: 'blue team',
        label: 'First tenant',
      });
    });
    it('should not do anything when pressing enter if no tenants', () => {
      const { wrapper } = UiTenantSwitcherFactory({
        visible: true,
        tenants: [],
      });
      (wrapper.vm as any).onEnterKeyPress();
      expect(wrapper.emitted()['changeTenant']).toBeFalsy();
    });
  });
});
