import { Page } from 'playwright';
import { AbstractLocator, AbstractWidget } from './AbstractWidget';
import { WidgetFindOptions } from './types';
import { widgetStep } from '../utils';

export type IconFindOptions = WidgetFindOptions & {
  icon?: string;
};

export class IconWidget extends AbstractWidget {
  readonly type = 'icon';

  constructor(
    protected findOptions: IconFindOptions,
    protected readonly page: Page,
    protected readonly parent?: AbstractWidget,
    protected readonly parentLocator?: AbstractLocator
  ) {
    super(findOptions, page, parent, parentLocator);
  }

  find() {
    const { icon } = this.findOptions;
    return this.makeLocator([], {
      has: icon ? this.page.locator(`svg[data-icon="${icon}"]`) : undefined,
    });
  }

  @widgetStep
  async click() {
    try {
      await this.l.waitFor({ state: 'visible' });
      await this.l.click();
    } catch (e) {
      throw new Error(
        `${this.type} click failed for options ${JSON.stringify(this.findOptions)}.\nOriginal error: ${e}`
      );
    }
    return this;
  }
}
