@findify/react-components/lib/components/search/StaticResults/index.js

Findify react UI components

/**
 * @module components/search/StaticResults
 */
import Grid from "../../common/Grid";
import Pagination from "../../Pagination";
import { useItems, usePromos } from '@findify/react-connect';
import MapArray from "../../common/MapArray";
import ProductCard from "../../Cards/Product";
import PromoCard from "../../Cards/Promo";
import useTranslations from "../../../helpers/useTranslations";
import { jsxs as _jsxs } from "react/jsx-runtime";
import { jsx as _jsx } from "react/jsx-runtime";
var styles = {
  "root": "findify-components-search--static-results",
  "column": "findify-components-search--static-results__column"
};
export default (function (_ref) {
  var _ref$theme = _ref.theme,
      theme = _ref$theme === void 0 ? styles : _ref$theme,
      itemConfig = _ref.itemConfig;

  var _useItems = useItems(),
      items = _useItems.items,
      config = _useItems.config;

  var _usePromos = usePromos(),
      promos = _usePromos.items;

  var promosIndexes = promos.map(function (promo) {
    return promo.get('position');
  }).toJS().sort();
  var productsIndexes = items.map(function (_, idx) {
    return idx + 1;
  }).toJS().filter(function (i) {
    return !promosIndexes.includes(i);
  });
  var lastProductIndex = productsIndexes.at(-1);
  promosIndexes.forEach(function (_, idx) {
    return productsIndexes.push(lastProductIndex + idx + 1);
  });
  var translate = useTranslations();
  return /*#__PURE__*/_jsxs("div", {
    className: theme.root,
    children: [/*#__PURE__*/_jsxs(Grid, {
      role: "list",
      wrapperComponent: "ul",
      columnComponent: "li",
      "aria-label": translate('search.title'),
      gutter: 12,
      columns: config.getIn(['breakpoints', 'grid']),
      children: [MapArray({
        array: promos,
        factory: PromoCard,
        config: config.get('promo'),
        order: function order(item) {
          return item.get('position');
        }
      }), MapArray({
        array: items,
        factory: ProductCard,
        config: itemConfig || config.get('product'),
        order: function order(_, index) {
          return productsIndexes[index];
        },
        isSearch: true
      })]
    }), /*#__PURE__*/_jsx(Pagination, {})]
  });
});