import React from 'react';
import classNames from 'classnames';
import { Tooltip, TOOLTIP_PLACEMENT_TYPES } from '../tooltip';
import { jsx as _jsx } from "react/jsx-runtime";
const areThereEnabledSubOptions = subOptions => subOptions.some(subOption => subOption.isShown !== false && !subOption.isDisabled);
const areThereShownSubOptions = subOptions => subOptions.some(subOption => subOption.isShown !== false);
const getAccordionItem = (tab, i, selectedTabKey, onClick, NavLink, className = 'accordion-tab small-header') => {
  if (tab.route && NavLink) {
    return /*#__PURE__*/_jsx(NavLink, {
      route: tab.route,
      altRoute: tab.altRoute,
      routeParams: tab.routeParams,
      testId: tab.testId,
      tourId: tab.tourId,
      onClick: () => onClick(tab, i),
      isDisabled: tab.isDisabled,
      className: className,
      ...(selectedTabKey && {
        isActive: tab.key === selectedTabKey
      }),
      onRedirect: tab.onRedirect,
      children: tab.value
    }, tab.key);
  }
  return /*#__PURE__*/_jsx("button", {
    "test-id": tab.testId,
    "tour-id": tab.tourId,
    onClick: () => onClick(tab, i),
    className: classNames(className, {
      active: tab.key === selectedTabKey,
      disabled: tab.isDisabled
    }),
    children: tab.value
  }, tab.key);
};
const getAccordionTabSubOptionsTooltipContent = (
// eslint-disable-next-line @typescript-eslint/default-param-last
subOptions = [], selectedTabKey, onClick, NavLink) => {
  return /*#__PURE__*/_jsx("div", {
    className: "accordion-tab-suboptions",
    "test-id": "accordion-tab-suboptions",
    children: subOptions.map((option, i) => {
      if (option.isShown === false) {
        return null;
      }
      return getAccordionItem(option, i, selectedTabKey, onClick, NavLink, 'accordion-tab-suboption');
    })
  });
};
const onClickHandler = (selectedTab, i, selectedTabKey, callback) => {
  if (selectedTab.isDisabled || selectedTab.key === selectedTabKey) {
    return;
  }
  return callback(selectedTab, i);
};
export const AccordionTab = ({
  tab,
  index,
  selectedTabKey = '',
  onSelect = () => {},
  onSelectSubOptions = () => {},
  NavLink
}) => {
  let tabContent;
  let tooltipContent;
  let isShown;
  const hasInteractiveTooltip = Boolean(tab.subOptions);
  if (hasInteractiveTooltip) {
    isShown = tab.isShown !== undefined ? tab.isShown : areThereShownSubOptions(tab.subOptions);
    const isDisabled = !!tab.isDisabled || !areThereEnabledSubOptions(tab.subOptions);
    tabContent = getAccordionItem({
      ...tab,
      isDisabled,
      isShown
    }, index, selectedTabKey, (selectedTab, i) => onClickHandler(selectedTab, i, selectedTabKey, onSelect), NavLink);
    tooltipContent = !isDisabled ? getAccordionTabSubOptionsTooltipContent(tab.subOptions, selectedTabKey, (selectedTab, i) => onClickHandler(selectedTab, i, selectedTabKey, onSelectSubOptions), NavLink) : tab.tooltip;
  } else {
    isShown = tab.isShown;
    tooltipContent = tab.tooltip;
    tabContent = getAccordionItem(tab, index, selectedTabKey, (selectedTab, i) => onClickHandler(selectedTab, i, selectedTabKey, onSelect), NavLink);
  }
  if (isShown === false) {
    return null;
  }
  return /*#__PURE__*/_jsx(Tooltip, {
    placement: TOOLTIP_PLACEMENT_TYPES.BOTTOM,
    docsLink: tab.docsLink,
    content: tooltipContent,
    interactiveCloseOnClick: hasInteractiveTooltip,
    children: tabContent
  }, tab.key);
};