{"version":3,"sources":["webpack:///./Scripts/Components/CategorySortingBar.js"],"names":["dispatch","useDispatch","productsWrapper","useSelector","state","productsView","facetedSearchState","facetedSearch","sortCriteria","pagination","getPreSelectedSortItem","useCallback","sortItems","find","i","selected","sortBy","setSortBy","useState","query","useEffect","className","totalCount","translate","onChange","e","target","value","onSortCriteriaChanged","map","item","idx","key","text"],"mappings":"4JAQA,MAwCA,EAxC2B,KACzB,MAAMA,GAAWC,WACX,gBAAEC,IAAoBC,SAAaC,GAAUA,EAAMC,eACnDC,GAAqBH,SAAaC,GAAUA,EAAMG,iBAClD,aAAEC,GAAiBF,GACnB,WAAEG,GAAeP,EAEjBQ,GAAyBC,kBAC7B,IAAMH,GAAcI,WAAWC,MAAMC,GAAMA,EAAEC,YAC7C,CAACP,KAGIQ,EAAQC,IAAaC,cAASR,KAA0BS,OAAS,KAExEC,gBAAU,KACRH,EAAUP,KAA0BS,MAApC,GACC,CAACX,EAAcE,IAQlB,OACE,gCACE,uBAAKW,UAAU,2DACZZ,EAAWa,WADd,KAC2BC,OAAU,oBAErC,0BAAQF,UAAU,cAAcG,SAXdC,IACpB,MAAMN,EAAQM,EAAEC,OAAOC,MACvBV,EAAUE,GACVnB,GAAS4B,QAAsBT,GAA/B,EAQ0DQ,MAAOX,GAC5DR,GAAcI,UAAUiB,KAAI,CAACC,EAAMC,IAClC,0BAAQC,IAAKF,EAAKG,KAAOH,EAAKH,MAAQI,EAAKJ,MAAOG,EAAKX,OACpDW,EAAKG,SARhB,C","file":"81.621e1983.js","sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\nimport { useDispatch, useSelector } from 'react-redux';\nimport {\n  onSortCriteriaChanged,\n  submitSearchFacet,\n} from '../Actions/FacetedSearch.action';\nimport { translate } from '../Services/translation';\n\nconst CategorySortingBar = () => {\n  const dispatch = useDispatch();\n  const { productsWrapper } = useSelector((state) => state.productsView);\n  const facetedSearchState = useSelector((state) => state.facetedSearch);\n  const { sortCriteria } = facetedSearchState;\n  const { pagination } = productsWrapper;\n\n  const getPreSelectedSortItem = useCallback(\n    () => sortCriteria?.sortItems?.find((i) => i.selected),\n    [sortCriteria]\n  );\n\n  const [sortBy, setSortBy] = useState(getPreSelectedSortItem()?.query ?? '');\n\n  useEffect(() => {\n    setSortBy(getPreSelectedSortItem()?.query);\n  }, [sortCriteria, getPreSelectedSortItem]);\n\n  const onSortChange = (e) => {\n    const query = e.target.value;\n    setSortBy(query);\n    dispatch(onSortCriteriaChanged(query));\n  };\n\n  return (\n    <>\n      <div className=\"[ text-medium ] [ category-sorting-bar__product-count ]\">\n        {pagination.totalCount} {translate('global.products')}\n      </div>\n      <select className=\"form__input\" onChange={onSortChange} value={sortBy}>\n        {sortCriteria?.sortItems.map((item, idx) => (\n          <option key={item.text + item.value + idx} value={item.query}>\n            {item.text}\n          </option>\n        ))}\n      </select>\n    </>\n  );\n};\n\nexport default CategorySortingBar;\n"],"sourceRoot":""}