@attivio/suit/es/components/HierarchicalFacetContents.js

Attivio SUIT, the Search UI Toolkit, is a library for creating search clients for searching the Attivio platform.

var _class, _temp;

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

import React from 'react';

import HierarchicalList, { HierarchicalNode } from './HierarchicalList';
import SearchFacetBucket from '../api/SearchFacetBucket';
import ObjectUtils from '../util/ObjectUtils';

var HierarchicalFacetContents = (_temp = _class = function (_React$Component) {
  _inherits(HierarchicalFacetContents, _React$Component);

  function HierarchicalFacetContents(props) {
    _classCallCheck(this, HierarchicalFacetContents);

    var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));

    _this.linkRefs = new Map();


    _this.state = _this.getStateForBuckets(_this.props.buckets);

    _this.toggleNode = _this.toggleNode.bind(_this);
    _this.handleMore = _this.handleMore.bind(_this);
    _this.handleClick = _this.handleClick.bind(_this);
    return _this;
  } // eslint-disable-line max-len


  HierarchicalFacetContents.prototype.componentWillReceiveProps = function componentWillReceiveProps(newProps) {
    if (!ObjectUtils.deepEquals(this.props.buckets, newProps.buckets)) {
      this.setState(this.getStateForBuckets(newProps.buckets));
    }
  };

  HierarchicalFacetContents.prototype.shouldComponentUpdate = function shouldComponentUpdate(nextProps, nextState) {
    var shouldDoIt = !ObjectUtils.deepEquals(this.props, nextProps) || !ObjectUtils.deepEquals(this.state, nextState);
    return shouldDoIt;
  };

  HierarchicalFacetContents.prototype.getStateForBuckets = function getStateForBuckets(buckets) {
    var _this2 = this;

    var topLevelNodes = buckets.map(function (bucket) {
      return _this2.createNodesFromBucket(bucket);
    });
    var root = new HierarchicalNode('', '', topLevelNodes);
    var bucketMap = new Map();
    this.addNodesToMap(buckets, bucketMap);

    var newOpenness = new Map();
    if (this.state && this.state.openness) {
      // Won't be set when called from the constructor
      this.state.openness.forEach(function (value, key) {
        // If the key is in the new bucket map, copy it to the new openness map
        // so open nodes stay open
        var bucketForKey = bucketMap.get(key);
        if (bucketForKey) {
          newOpenness.set(key, value);
        }
      });
    }
    return {
      openness: newOpenness,
      root: root,
      bucketMap: bucketMap
    };
  };

  HierarchicalFacetContents.prototype.getBucketParent = function getBucketParent(bucket) {
    var allBuckets = Array.from(this.state.bucketMap.values());
    var parent = allBuckets.find(function (potentialParent) {
      if (potentialParent.children) {
        var matchingChild = potentialParent.children.find(function (sameChild) {
          return sameChild.filter === bucket.filter;
        });
        if (matchingChild) {
          // we found "bucket" as a child of potential parent, so call Jerry Springer...
          return true;
        }
      }
      return false;
    });
    return parent;
  };

  HierarchicalFacetContents.prototype.getHierarchicalBucketLabel = function getHierarchicalBucketLabel(bucket) {
    var bucketLabel = bucket.displayLabel();
    var parent = this.getBucketParent(bucket);
    if (parent) {
      var parentLabel = this.getHierarchicalBucketLabel(parent);
      return parentLabel + ' >>> ' + bucketLabel;
    }
    return bucketLabel;
  };

  HierarchicalFacetContents.prototype.toggleNode = function toggleNode(key, open) {
    var newOpenness = new Map(this.state.openness);
    var newOpenState = open ? 'open' : 'closed';
    newOpenness.set(key, newOpenState);
    this.setState({
      openness: newOpenness
    });
  };

  HierarchicalFacetContents.prototype.handleClick = function handleClick(key) {
    var element = this.linkRefs.get(key);
    if (element) {
      element.blur();
    }
    var bucket = this.state.bucketMap.get(key);
    if (bucket) {
      var bucketLabel = this.getHierarchicalBucketLabel(bucket);
      this.props.addFacetFilter(bucket, bucketLabel);
    }
  };

  HierarchicalFacetContents.prototype.addNodesToMap = function addNodesToMap(buckets, map) {
    var _this3 = this;

    if (buckets && buckets.length > 0) {
      buckets.forEach(function (bucket) {
        map.set(bucket.bucketKey(), bucket);
        if (bucket.children && bucket.children.length > 0) {
          _this3.addNodesToMap(bucket.children, map);
        }
      });
    }
  };

  HierarchicalFacetContents.prototype.handleMore = function handleMore(key) {
    // Note that the key here is for the parent bucket...
    var newOpenness = new Map(this.state.openness);
    newOpenness.set(key, 'full');
    this.setState({
      openness: newOpenness
    });
  };

  HierarchicalFacetContents.prototype.createNodeContents = function createNodeContents(bucket) {
    var _this4 = this;

    var key = bucket.bucketKey();
    return React.createElement(
      'div',
      { style: { display: 'inline-block' } },
      React.createElement(
        'a',
        {
          onClick: function onClick() {
            _this4.handleClick(key);
          },
          role: 'button',
          tabIndex: 0,
          ref: function ref(a) {
            _this4.linkRefs.set(key, a);
          }
        },
        bucket.displayLabel()
      ),
      ' ',
      React.createElement(
        'span',
        null,
        '(',
        bucket.count,
        ')'
      )
    );
  };

  HierarchicalFacetContents.prototype.createNodesFromBucket = function createNodesFromBucket(bucket) {
    var _this5 = this;

    var childNodes = void 0;
    if (bucket.children && bucket.children.length > 0) {
      childNodes = bucket.children.map(function (childBucket) {
        return _this5.createNodesFromBucket(childBucket);
      });
    } else {
      childNodes = [];
    }
    var contents = this.createNodeContents(bucket);
    return new HierarchicalNode(contents, bucket.bucketKey(), childNodes);
  };

  HierarchicalFacetContents.prototype.render = function render() {
    var openNodes = Array.from(this.state.openness.keys());
    return React.createElement(HierarchicalList, {
      root: this.state.root,
      openNodes: openNodes,
      onToggle: this.toggleNode
    });
  };

  return HierarchicalFacetContents;
}(React.Component), _class.displayName = 'HierarchicalFacetContents', _temp);
export { HierarchicalFacetContents as default };