"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.SideNav = void 0;

var _react = _interopRequireWildcard(require("react"));

var _reactRouterDom = require("react-router-dom");

var _components = require("@looker/components");

var _sdkCodegen = require("@looker/sdk-codegen");

var _reactRedux = require("react-redux");

var _utils = require("../../utils");

var _Header = require("../Header");

var _state = require("../../state");

var _SideNavMethodTags = require("./SideNavMethodTags");

var _SideNavTypeTags = require("./SideNavTypeTags");

var _searchUtils = require("./searchUtils");

var _SearchMessage = require("./SearchMessage");

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

var SideNav = _ref => {
  var {
    headless = false,
    spec
  } = _ref;
  var history = (0, _reactRouterDom.useHistory)();
  var location = (0, _reactRouterDom.useLocation)();
  var specKey = spec.key;
  var tabNames = ['methods', 'types'];
  var pathParts = location.pathname.split('/');
  var sideNavTab = pathParts[1] === 'diff' ? pathParts[3] : pathParts[2];
  var defaultIndex = tabNames.indexOf(sideNavTab);

  if (defaultIndex < 0) {
    defaultIndex = tabNames.indexOf('methods');
  }

  var onTabChange = index => {
    var parts = location.pathname.split('/');

    if (parts[1] === 'diff') {
      if (parts[3] !== tabNames[index]) {
        parts[3] = tabNames[index];
        history.push(parts.join('/'));
      }
    } else {
      if (parts[2] !== tabNames[index]) {
        parts[2] = tabNames[index];
        history.push(parts.join('/'));
      }
    }
  };

  var tabs = (0, _components.useTabs)({
    defaultIndex,
    onChange: onTabChange
  });
  var searchCriteria = (0, _reactRedux.useSelector)(_state.selectSearchCriteria);
  var {
    setSearchPatternAction
  } = (0, _state.useSettingActions)();
  var [pattern, setSearchPattern] = (0, _react.useState)('');
  var debouncedPattern = (0, _searchUtils.useDebounce)(pattern, 250);
  var [sideNavState, setSideNavState] = (0, _react.useState)(() => {
    var _spec$api, _spec$api2, _spec$api3, _spec$api4;

    return {
      tags: (spec === null || spec === void 0 ? void 0 : (_spec$api = spec.api) === null || _spec$api === void 0 ? void 0 : _spec$api.tags) || {},
      typeTags: (spec === null || spec === void 0 ? void 0 : (_spec$api2 = spec.api) === null || _spec$api2 === void 0 ? void 0 : _spec$api2.typeTags) || {},
      methodCount: (0, _searchUtils.countMethods)((spec === null || spec === void 0 ? void 0 : (_spec$api3 = spec.api) === null || _spec$api3 === void 0 ? void 0 : _spec$api3.tags) || {}),
      typeCount: (0, _searchUtils.countTypes)((spec === null || spec === void 0 ? void 0 : (_spec$api4 = spec.api) === null || _spec$api4 === void 0 ? void 0 : _spec$api4.types) || {}),
      searchResults: undefined
    };
  });
  var {
    tags,
    typeTags,
    methodCount,
    typeCount,
    searchResults
  } = sideNavState;

  var handleInputChange = value => {
    setSearchPattern(value);
  };

  (0, _react.useEffect)(() => {
    var results;
    var newTags;
    var newTypes;
    var newTypeTags;
    var api = spec.api || {};

    if (debouncedPattern && api.search) {
      results = api.search(pattern, (0, _sdkCodegen.criteriaToSet)(searchCriteria));
      newTags = results.tags;
      newTypes = results.types;
      newTypeTags = (0, _sdkCodegen.tagTypes)(api, results.types);
    } else {
      newTags = api.tags || {};
      newTypes = api.types || {};
      newTypeTags = api.typeTags || {};
    }

    setSideNavState({
      tags: newTags,
      typeTags: newTypeTags,
      typeCount: (0, _searchUtils.countTypes)(newTypes),
      methodCount: (0, _searchUtils.countMethods)(newTags),
      searchResults: results
    });
    setSearchPatternAction({
      searchPattern: debouncedPattern
    });
  }, [debouncedPattern, specKey, spec, setSearchPatternAction, pattern, searchCriteria]);
  (0, _react.useEffect)(() => {
    var {
      selectedIndex,
      onSelectTab
    } = tabs;

    if (defaultIndex !== selectedIndex) {
      onSelectTab(defaultIndex);
    }
  }, [defaultIndex, tabs]);
  var size = (0, _utils.useWindowSize)();
  var headlessOffset = headless ? 200 : 120;
  var menuH = size.height - 16 * _Header.HEADER_REM - headlessOffset;
  return _react.default.createElement("nav", null, _react.default.createElement(_components.InputSearch, {
    pl: "large",
    pr: "large",
    pb: "large",
    pt: headless ? 'u3' : 'large',
    "aria-label": "Search",
    onChange: handleInputChange,
    placeholder: "Search",
    value: pattern,
    isClearable: true
  }), _react.default.createElement(_SearchMessage.SearchMessage, {
    search: searchResults
  }), _react.default.createElement(_components.TabList, _extends({}, tabs, {
    distribute: true
  }), _react.default.createElement(_components.Tab, null, "Methods (", methodCount, ")"), _react.default.createElement(_components.Tab, null, "Types (", typeCount, ")")), _react.default.createElement(_components.TabPanels, _extends({}, tabs, {
    pt: "xsmall",
    height: "".concat(menuH, "px"),
    overflow: "auto"
  }), _react.default.createElement(_components.TabPanel, null, _react.default.createElement(_SideNavMethodTags.SideNavMethodTags, {
    tags: tags,
    specKey: specKey,
    defaultOpen: !!searchResults
  })), _react.default.createElement(_components.TabPanel, null, _react.default.createElement(_SideNavTypeTags.SideNavTypeTags, {
    tags: typeTags,
    specKey: specKey,
    defaultOpen: !!searchResults
  }))));
};

exports.SideNav = SideNav;
//# sourceMappingURL=SideNav.js.map