"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

exports.__esModule = true;
exports.CitySelector = void 0;

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

var _Autosuggest = require("../Autosuggest");

var _stores = require("../../stores.context");

var _lib = require("@sentecacommerce-theme/lib");

var CitySelector = function CitySelector() {
  var _useStoresContext = (0, _stores.useStoresContext)(),
      selectedCity = _useStoresContext.selectedCity,
      cities = _useStoresContext.cities,
      reset = _useStoresContext.reset,
      filterByCity = _useStoresContext.filterByCity,
      allStores = _useStoresContext.allStores;

  var _useState = (0, _react.useState)(cities),
      citiesToShow = _useState[0],
      setCitiesToShow = _useState[1];

  var filterCities = (0, _react.useCallback)(function (query) {
    setCitiesToShow(!query ? cities : cities.filter(function (city) {
      return city.includes(query);
    }));
  }, [cities]);

  var getStoreCountForCity = function getStoreCountForCity(city) {
    return allStores.filter(function (store) {
      return store.city === city;
    }).length;
  };

  var labels = (0, _lib.useStrings)('stores');
  return /*#__PURE__*/_react["default"].createElement(_Autosuggest.Autosuggest, {
    label: labels.citySelectLabel,
    options: citiesToShow,
    selectedOption: selectedCity || undefined,
    getValue: function getValue(city) {
      return city;
    },
    getLabel: function getLabel(city) {
      return city + (" (" + getStoreCountForCity(city) + ")");
    },
    onOptionSelect: filterByCity,
    onRemove: reset,
    minLength: 0,
    debounceDelay: 0,
    updateOptions: filterCities,
    isFetching: false
  });
};

exports.CitySelector = CitySelector;
//# sourceMappingURL=index.js.map