import {
  CheckboxUniDriver,
  CustomModalLayoutUniDriver,
  DropdownUniDriver,
  EmptyStateUniDriver,
  SearchUniDriver,
  TextButtonUniDriver,
  TextUniDriver,
  TooltipUniDriver,
} from '@wix/design-system/dist/testkit/unidriver';
import { baseUniDriverFactory } from '../../unidriver';
import { UniDriver, waitFor } from '@wix/wix-ui-test-utils/unidriver';

export function PickerModalLayoutUniDriver(base: UniDriver, body: UniDriver) {
  const modal = CustomModalLayoutUniDriver(base, body);

  const getInitialLoader = () => base.$('[data-hook="splash-loader"]');

  const getSearch = () =>
    SearchUniDriver(base.$('[data-hook="collection-search"]'), body);

  const customNotificationExists = () => {
    return base.$('[data-hook="custom-notification"]').exists();
  };

  const getCustomContentButton = () =>
    TextButtonUniDriver(base.$('[data-hook="custom-content-button"]'), body);

  const getBackButton = () =>
    TextButtonUniDriver(base.$('[data-hook="back-button"]'), body);

  const getMaxSelectionLabel = () =>
    base.$('[data-hook="selection-max-label"]');

  const getFilterDropdown = (filterName: string) =>
    DropdownUniDriver(
      base.$(`[data-hook="collection-filter-${filterName}"]`),
      body,
    );

  return {
    ...baseUniDriverFactory(base),
    waitInitialLoader: (timeout?: number) => getInitialLoader().wait(timeout),
    waitInitialLoaderRemoved: (timeout?: number) =>
      waitFor(async () => !(await getInitialLoader().exists()), timeout),
    ctaButtonExists: async () =>
      (await modal.getPrimaryButtonDriver()).exists(),
    clickCTAButton: async () => (await modal.getPrimaryButtonDriver()).click(),
    clickBackButton: async () => getBackButton().click(),
    backButtonExists: () => getBackButton().exists(),
    clickCancelButton: async () =>
      (await modal.getSecondaryButtonDriver()).click(),
    getCancelButtonText: async () =>
      (await modal.getSecondaryButtonDriver()).getButtonTextContent(),
    cancelButtonExists: async () =>
      (await modal.getSecondaryButtonDriver()).exists(),
    clickCloseButton: () => modal.clickCloseButton(),
    customContentButtonExists: () => getCustomContentButton().exists(),
    getCustomContentButtonText: () =>
      getCustomContentButton().getButtonTextContent(),
    isCustomContentButtonDisabled: () =>
      getCustomContentButton().isButtonDisabled(),
    getCustomContentButtonTooltipText: () =>
      TooltipUniDriver(
        base.$('[data-hook="custom-content-button-tooltip"]'),
        body,
      ).getTooltipText(),
    customContentButtonTooltipExists: () =>
      TooltipUniDriver(
        base.$('[data-hook="custom-content-button-tooltip"]'),
        body,
      ).exists(),
    clickCustomContentButton: () => getCustomContentButton().click(),
    getMaxSelectionLabelText: () => getMaxSelectionLabel().text(),
    getCTAButtonText: async () =>
      (await modal.getPrimaryButtonDriver()).getButtonTextContent(),
    isCTAButtonDisabled: async () =>
      (await modal.getPrimaryButtonDriver()).isButtonDisabled(),
    getTitleText: () => modal.getTitleText(),
    getSubtitleText: () => modal.getSubtitleText(),
    enterSearchTerm: (value: string) =>
      getSearch().inputDriver.enterText(value),
    clearSearchTerm: () => getSearch().inputDriver.clearText(),
    getSearchTerm: () => getSearch().inputDriver.getText(),
    getSearchPlaceholder: () => getSearch().inputDriver.getPlaceholder(),
    searchExists: () => getSearch().inputDriver.exists(),
    initialLoaderExists: () => getInitialLoader().exists(),
    customNotificationExists,
    getErrorStateByDataHook: (dataHook: string) =>
      EmptyStateUniDriver(
        base
          .$('[data-hook="splash-error-container"]')
          .$(`[data-hook="${dataHook}"]`),
        body,
      ),
    getSelectAllCheckbox: () =>
      CheckboxUniDriver(
        base.$('[data-hook="picker-select-all-checkbox"]'),
        body,
      ),
    getSelectedItemsCountText: () =>
      TextUniDriver(base.$('[data-hook="cairo-selected-items-count"]'), body),

    getFilterDropdown,
    filterDropdownExists: async (filterName: string) =>
      getFilterDropdown(filterName).exists(),
    getSelectedFilterName: async (filterName: string) =>
      getFilterDropdown(filterName).inputDriver.getText(),
    selectFilterItem: async (filterName: string, index: number) =>
      getFilterDropdown(filterName).dropdownLayoutDriver.clickAtOption(index),
    selectFilterItems: async (filterName: string, ids: string[]) => {
      for (const id of ids) {
        await getFilterDropdown(
          filterName,
        ).dropdownLayoutDriver.clickAtOptionByDataHook(`dropdown-item-${id}`);
      }
    },
  };
}