import Chainable = Cypress.Chainable;
import { isNumber, isString } from './utils';

const GROUP_SELECTOR = 'dato-accordion-group';

export class Accordion {
  constructor(private selector?: string) {}

  /**
   * Toggle the provided index group
   */
  toggle(index: number): Chainable {
    return this.get('header', index).click();
  }

  toggleAll(): Promise<any> {
    return new Cypress.Promise(resolve => {
      this.get()
        .get('dato-accordion-header')
        .each(element => element.click())
        .then(() => resolve());
    });
  }

  /**
   * Get the given accordion element or a specific group by index
   */
  get(target: 'group' | 'header' | 'content' | null = null, index?: number): Chainable {
    const subject = this.getElem('dato-accordion', this.selector);
    if (target && isNumber(index)) {
      const group = subject.find(GROUP_SELECTOR).eq(index as number);
      return target === 'group' ? group : group.find(`dato-accordion-${target}`);
    }

    return subject;
  }

  /**
   * Get accordion groups
   */
  getGroups(): Chainable {
    return this.get().find(GROUP_SELECTOR);
  }

  private getElem(defaultSelector: string, selectorOrElement?: string): Chainable<JQuery> {
    if (selectorOrElement && isString(selectorOrElement)) {
      return cy.get(selectorOrElement as string);
    }

    return cy.get(defaultSelector).eq(0);
  }
}