Liferay.Loader.define("change-tracking-web@1.0.19/change_lists/js/ChangeTrackingChangesView", ['module', 'exports', 'require', '@frontend-taglib-clay$clayui/alert', '@frontend-taglib-clay$clayui/breadcrumb', '@frontend-taglib-clay$clayui/button', '@frontend-taglib-clay$clayui/drop-down', '@frontend-taglib-clay$clayui/form', '@frontend-taglib-clay$clayui/icon', '@frontend-taglib-clay$clayui/management-toolbar', '@frontend-taglib-clay$clayui/pagination-bar', '@frontend-taglib-clay$clayui/table', 'frontend-js-web', 'frontend-js-react-web$react'], function (module, exports, require) {
  var define = undefined;
  var global = window;
  {
    Object.defineProperty(exports, "__esModule", {
      value: true
    });
    exports["default"] = _default;

    var _alert = _interopRequireDefault(require("@frontend-taglib-clay$clayui/alert"));

    var _breadcrumb = _interopRequireDefault(require("@frontend-taglib-clay$clayui/breadcrumb"));

    var _button = _interopRequireWildcard(require("@frontend-taglib-clay$clayui/button"));

    var _dropDown = require("@frontend-taglib-clay$clayui/drop-down");

    var _form = require("@frontend-taglib-clay$clayui/form");

    var _icon = _interopRequireDefault(require("@frontend-taglib-clay$clayui/icon"));

    var _managementToolbar = _interopRequireDefault(require("@frontend-taglib-clay$clayui/management-toolbar"));

    var _paginationBar = require("@frontend-taglib-clay$clayui/pagination-bar");

    var _table = _interopRequireDefault(require("@frontend-taglib-clay$clayui/table"));

    var _frontendJsWeb = require("frontend-js-web");

    var _react = _interopRequireDefault(require("frontend-js-react-web$react"));

    function _getRequireWildcardCache() {
      if (typeof WeakMap !== "function") return null;var cache = new WeakMap();_getRequireWildcardCache = function _getRequireWildcardCache() {
        return cache;
      };return cache;
    }

    function _interopRequireWildcard(obj) {
      if (obj && obj.__esModule) {
        return obj;
      }if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") {
        return { "default": obj };
      }var cache = _getRequireWildcardCache();if (cache && cache.has(obj)) {
        return cache.get(obj);
      }var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {
        if (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 _interopRequireDefault(obj) {
      return obj && obj.__esModule ? obj : { "default": obj };
    }

    function _typeof(obj) {
      "@babel/helpers - typeof";
      if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
        _typeof = function _typeof(obj) {
          return typeof obj;
        };
      } else {
        _typeof = function _typeof(obj) {
          return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
        };
      }return _typeof(obj);
    }

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

    function _defineProperties(target, props) {
      for (var i = 0; i < props.length; i++) {
        var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor);
      }
    }

    function _createClass(Constructor, protoProps, staticProps) {
      if (protoProps) _defineProperties(Constructor.prototype, protoProps);if (staticProps) _defineProperties(Constructor, staticProps);return Constructor;
    }

    function _possibleConstructorReturn(self, call) {
      if (call && (_typeof(call) === "object" || typeof call === "function")) {
        return call;
      }return _assertThisInitialized(self);
    }

    function _assertThisInitialized(self) {
      if (self === void 0) {
        throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
      }return self;
    }

    function _getPrototypeOf(o) {
      _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
        return o.__proto__ || Object.getPrototypeOf(o);
      };return _getPrototypeOf(o);
    }

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

    function _setPrototypeOf(o, p) {
      _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
        o.__proto__ = p;return o;
      };return _setPrototypeOf(o, p);
    }

    var ChangeTrackingChangesView = /*#__PURE__*/function (_React$Component) {
      _inherits(ChangeTrackingChangesView, _React$Component);

      function ChangeTrackingChangesView(props) {
        var _this;

        _classCallCheck(this, ChangeTrackingChangesView);

        _this = _possibleConstructorReturn(this, _getPrototypeOf(ChangeTrackingChangesView).call(this, props));
        var activeCTCollection = props.activeCTCollection,
            changes = props.changes,
            contextView = props.contextView,
            ctCollectionId = props.ctCollectionId,
            discardURL = props.discardURL,
            models = props.models,
            renderCTEntryURL = props.renderCTEntryURL,
            renderDiffURL = props.renderDiffURL,
            rootDisplayClasses = props.rootDisplayClasses,
            saveSessionStateURL = props.saveSessionStateURL,
            sessionState = props.sessionState,
            siteNames = props.siteNames,
            spritemap = props.spritemap,
            typeNames = props.typeNames,
            userInfo = props.userInfo;
        _this.activeCTCollection = activeCTCollection;
        _this.changes = changes;
        _this.contextView = contextView;
        _this.ctCollectionId = ctCollectionId;
        _this.discardURL = discardURL;
        _this.models = models;
        _this.renderCTEntryURL = renderCTEntryURL;
        _this.renderDiffURL = renderDiffURL;
        _this.rootDisplayClasses = rootDisplayClasses;
        _this.saveSessionStateURL = saveSessionStateURL;
        _this.sessionState = sessionState;
        _this.siteNames = siteNames;
        _this.spritemap = spritemap;
        _this.typeNames = typeNames;
        _this.userInfo = userInfo;
        _this.globalSiteName = Liferay.Language.get('global');
        var keys = Object.keys(_this.models);

        for (var i = 0; i < keys.length; i++) {
          var model = _this.models[keys[i]];

          if (model.groupId) {
            model.siteName = _this.siteNames[model.groupId.toString()];
          } else {
            model.siteName = _this.globalSiteName;
          }

          model.typeName = _this.typeNames[model.modelClassNameId.toString()];

          if (model.ctEntryId) {
            model.changeTypeLabel = Liferay.Language.get('modified');

            if (model.changeType === 'added') {
              model.changeTypeLabel = Liferay.Language.get('added');
            } else if (model.changeType === 'deleted') {
              model.changeTypeLabel = Liferay.Language.get('deleted');
            }

            model.userName = _this.userInfo[model.userId.toString()].userName;

            if (model.siteName === _this.globalSiteName) {
              var key = Liferay.Language.get('x-modified-a-x-x-ago');

              if (model.changeType === 'added') {
                key = Liferay.Language.get('x-added-a-x-x-ago');
              } else if (model.changeType === 'deleted') {
                key = Liferay.Language.get('x-deleted-a-x-x-ago');
              }

              model.description = _this._format(key, [model.userName, model.typeName, model.timeDescription]);
            } else {
              var _key = Liferay.Language.get('x-modified-a-x-in-x-x-ago');

              if (model.changeType === 'added') {
                _key = Liferay.Language.get('x-added-a-x-in-x-x-ago');
              } else if (model.changeType === 'deleted') {
                _key = Liferay.Language.get('x-deleted-a-x-in-x-x-ago');
              }

              model.description = _this._format(_key, [model.userName, model.typeName, model.siteName, model.timeDescription]);
            }
          }
        }

        for (var _i = 0; _i < _this.rootDisplayClasses.length; _i++) {
          var rootDisplayClassInfo = _this.contextView[_this.rootDisplayClasses[_i]];
          var hideable = true;

          for (var _i2 = 0; _i2 < rootDisplayClassInfo.children.length; _i2++) {
            var _model = _this.models[rootDisplayClassInfo.children[_i2].modelKey.toString()];

            if (!_model.hideable) {
              hideable = false;
            }
          }

          rootDisplayClassInfo.hideable = hideable;
        }

        var filterClass = 'everything';
        var nodeId = 0;
        var showHideable = false;
        var viewType = 'changes';

        if (_this.activeCTCollection && _this.sessionState && _this.sessionState.ctCollectionId && _this.sessionState.ctCollectionId === _this.ctCollectionId) {
          filterClass = _this.sessionState.filterClass;
          showHideable = _this.sessionState.showHideable;
          viewType = _this.sessionState.viewType;

          if (filterClass !== 'everything' && !_this.contextView[filterClass]) {
            filterClass = 'everything';
          } else if (viewType === 'changes' && _this.sessionState.path.length > 0) {
            var modelClassNameId = _this.sessionState.path[0].modelClassNameId;
            var modelClassPK = _this.sessionState.path[0].modelClassPK;

            for (var _i3 = 0; _i3 < _this.changes.length; _i3++) {
              var modelKey = _this.changes[_i3];

              var _model2 = _this.models[modelKey.toString()];

              if (modelClassNameId === _model2.modelClassNameId && modelClassPK === _model2.modelClassPK) {
                nodeId = modelKey;
              }
            }
          } else if (viewType === 'context') {
            var contextNode = _this.contextView.everything;

            if (filterClass !== 'everything') {
              contextNode = _this.contextView[filterClass];
            }

            for (var _i4 = 0; _i4 < _this.sessionState.path.length; _i4++) {
              if (!contextNode.children) {
                break;
              }

              var sessionNode = _this.sessionState.path[_i4];

              for (var j = 0; j < contextNode.children.length; j++) {
                var child = contextNode.children[j];

                var _model3 = _this.models[child.modelKey.toString()];

                if (_model3.modelClassNameId === sessionNode.modelClassNameId && _model3.modelClassPK === sessionNode.modelClassPK) {
                  if (filterClass !== 'everything' && _i4 === 0) {
                    var stack = [_this.contextView.everything];

                    while (stack.length > 0) {
                      var element = stack.pop();

                      if (element.nodeId === child.nodeId) {
                        contextNode = element;
                        break;
                      } else if (!element.children) {
                        continue;
                      }

                      for (var _i5 = 0; _i5 < element.children.length; _i5++) {
                        stack.push(element.children[_i5]);
                      }
                    }
                  } else {
                    contextNode = child;
                  }

                  nodeId = contextNode.nodeId;
                  break;
                }
              }
            }
          }
        }

        var node = _this._getNode(filterClass, nodeId, viewType);

        var breadcrumbItems = _this._getBreadcrumbItems(node, filterClass, nodeId, viewType);

        _this.state = {
          ascending: true,
          breadcrumbItems: breadcrumbItems,
          children: _this._filterHideableNodes(node.children, showHideable),
          column: 'title',
          delta: 20,
          dropdown: '',
          filterClass: filterClass,
          node: node,
          page: 1,
          renderInnerHTML: null,
          showHideable: showHideable,
          sortDirectionClass: 'order-arrow-down-active',
          viewType: viewType
        };

        _this._updateRenderContent(node);

        _this._updateSessionState(breadcrumbItems, filterClass, showHideable, viewType);

        _this._saveSessionState();

        return _this;
      }

      _createClass(ChangeTrackingChangesView, [{
        key: "_clone",
        value: function _clone(json) {
          var clone = {};
          var keys = Object.keys(json);

          for (var i = 0; i < keys.length; i++) {
            clone[keys[i]] = json[keys[i]];
          }

          return clone;
        }
      }, {
        key: "_filterDisplayNodes",
        value: function _filterDisplayNodes(nodes) {
          var _this2 = this;

          var ascending = this.state.ascending;

          if (this._getColumn() === 'changeType') {
            nodes.sort(function (a, b) {
              if (a.changeType < b.changeType) {
                if (ascending) {
                  return -1;
                }

                return 1;
              }

              if (a.changeType > b.changeType) {
                if (ascending) {
                  return 1;
                }

                return -1;
              }

              var typeNameA = a.typeName.toUpperCase();
              var typeNameB = b.typeName.toUpperCase();

              if (typeNameA < typeNameB) {
                return -1;
              }

              if (typeNameA > typeNameB) {
                return 1;
              }

              if (a.title < b.title) {
                return -1;
              }

              if (a.title > b.title) {
                return 1;
              }

              return 0;
            });
          } else if (this._getColumn() === 'site') {
            nodes.sort(function (a, b) {
              if (a.siteName < b.siteName || a.siteName === _this2.globalSiteName && b.siteName !== _this2.globalSiteName) {
                if (ascending) {
                  return -1;
                }

                return 1;
              }

              if (a.siteName > b.siteName || a.siteName !== _this2.globalSiteName && b.siteName === _this2.globalSiteName) {
                if (ascending) {
                  return 1;
                }

                return -1;
              }

              var typeNameA = a.typeName.toUpperCase();
              var typeNameB = b.typeName.toUpperCase();

              if (typeNameA < typeNameB) {
                return -1;
              }

              if (typeNameA > typeNameB) {
                return 1;
              }

              if (a.title < b.title) {
                return -1;
              }

              if (a.title > b.title) {
                return 1;
              }

              return 0;
            });
          } else if (this._getColumn() === 'title') {
            nodes.sort(function (a, b) {
              var typeNameA = a.typeName.toUpperCase();
              var typeNameB = b.typeName.toUpperCase();

              if (typeNameA < typeNameB) {
                return -1;
              }

              if (typeNameA > typeNameB) {
                return 1;
              }

              if (a.title < b.title) {
                if (ascending) {
                  return -1;
                }

                return 1;
              }

              if (a.title > b.title) {
                if (ascending) {
                  return 1;
                }

                return -1;
              }

              return 0;
            });
          } else if (this._getColumn() === 'user') {
            nodes.sort(function (a, b) {
              if (a.userName < b.userName) {
                if (ascending) {
                  return -1;
                }

                return 1;
              }

              if (a.userName > b.userName) {
                if (ascending) {
                  return 1;
                }

                return -1;
              }

              var typeNameA = a.typeName.toUpperCase();
              var typeNameB = b.typeName.toUpperCase();

              if (typeNameA < typeNameB) {
                return -1;
              }

              if (typeNameA > typeNameB) {
                return 1;
              }

              if (a.title < b.title) {
                return -1;
              }

              if (a.title > b.title) {
                return 1;
              }

              return 0;
            });
          } else {
            nodes.sort(function (a, b) {
              if (a.modifiedTime < b.modifiedTime) {
                if (ascending) {
                  return -1;
                }

                return 1;
              }

              if (a.modifiedTime > b.modifiedTime) {
                if (ascending) {
                  return 1;
                }

                return -1;
              }

              return 0;
            });
          }

          if (nodes.length > 5) {
            nodes = nodes.slice(this.state.delta * (this.state.page - 1), this.state.delta * this.state.page);
          }

          if (this._getColumn() === 'modifiedDate') {
            nodes.sort(function (a, b) {
              var typeNameA = a.typeName.toUpperCase();
              var typeNameB = b.typeName.toUpperCase();

              if (typeNameA < typeNameB) {
                return -1;
              }

              if (typeNameA > typeNameB) {
                return 1;
              }

              if (a.modifiedTime < b.modifiedTime) {
                if (ascending) {
                  return -1;
                }

                return 1;
              }

              if (a.modifiedTime > b.modifiedTime) {
                if (ascending) {
                  return 1;
                }

                return -1;
              }

              return 0;
            });
          }

          return nodes;
        }
      }, {
        key: "_filterHideableNodes",
        value: function _filterHideableNodes(nodes, showHideable) {
          if (!nodes || showHideable) {
            return nodes;
          }

          var filterNodes = [];

          for (var i = 0; i < nodes.length; i++) {
            var node = nodes[i];

            if (!node.hideable) {
              filterNodes.push(node);
            }
          }

          return filterNodes;
        }
      }, {
        key: "_format",
        value: function _format(key, args) {
          var SPLIT_REGEX = /({\d+})/g;
          var keyArray = key.split(SPLIT_REGEX).filter(function (val) {
            return val.length !== 0;
          });

          for (var i = 0; i < args.length; i++) {
            var arg = args[i];
            var indexKey = "{".concat(i, "}");
            var argIndex = keyArray.indexOf(indexKey);

            while (argIndex >= 0) {
              keyArray.splice(argIndex, 1, arg);
              argIndex = keyArray.indexOf(indexKey);
            }
          }

          return keyArray.join('');
        }
      }, {
        key: "_getBreadcrumbItems",
        value: function _getBreadcrumbItems(node, filterClass, nodeId, viewType) {
          var _this3 = this;

          if (viewType === 'changes') {
            if (nodeId === 0) {
              return [{
                active: true,
                label: Liferay.Language.get('home')
              }];
            }

            return [{
              label: Liferay.Language.get('home'),
              onClick: function onClick() {
                return _this3._handleNavigationUpdate({
                  nodeId: 0
                });
              }
            }, {
              active: true,
              label: node.title,
              modelClassNameId: node.modelClassNameId,
              modelClassPK: node.modelClassPK
            }];
          }

          var breadcrumbItems = [];
          var homeBreadcrumbItem = {
            label: Liferay.Language.get('home')
          };

          if (filterClass === 'everything' && nodeId === 0) {
            homeBreadcrumbItem.active = true;
            breadcrumbItems.push(homeBreadcrumbItem);
            return breadcrumbItems;
          }

          homeBreadcrumbItem.onClick = function () {
            return _this3._handleNavigationUpdate({
              filterClass: 'everything',
              nodeId: 0
            });
          };

          breadcrumbItems.push(homeBreadcrumbItem);
          var showParent = false;

          if (filterClass === 'everything') {
            showParent = true;
          } else {
            var label = filterClass;

            if (label.includes('.')) {
              label = label.substring(label.lastIndexOf('.') + 1, label.length);
            }

            var rootDisplayClassBreadcrumb = {
              label: label
            };

            if (nodeId === 0) {
              rootDisplayClassBreadcrumb.active = true;
              breadcrumbItems.push(rootDisplayClassBreadcrumb);
              return breadcrumbItems;
            }

            rootDisplayClassBreadcrumb.onClick = function () {
              return _this3._handleNavigationUpdate({
                filterClass: filterClass,
                nodeId: 0
              });
            };

            breadcrumbItems.push(rootDisplayClassBreadcrumb);
          }

          if (!node.parents) {
            return null;
          }

          var _loop = function _loop(i) {
            var parent = node.parents[i];

            if (parent.typeName === filterClass) {
              showParent = true;
            }

            if (!showParent) {
              return "continue";
            }

            breadcrumbItems.push({
              label: parent.title,
              modelClassNameId: parent.modelClassNameId,
              modelClassPK: parent.modelClassPK,
              onClick: function onClick() {
                return _this3._handleNavigationUpdate({
                  filterClass: filterClass,
                  nodeId: parent.nodeId
                });
              }
            });
          };

          for (var i = 0; i < node.parents.length; i++) {
            var _ret = _loop(i);

            if (_ret === "continue") continue;
          }

          breadcrumbItems.push({
            active: true,
            label: node.title,
            modelClassNameId: node.modelClassNameId,
            modelClassPK: node.modelClassPK
          });
          return breadcrumbItems;
        }
      }, {
        key: "_getColumn",
        value: function _getColumn() {
          if (this.state.viewType === 'context') {
            return 'title';
          }

          return this.state.column;
        }
      }, {
        key: "_getDiscardURL",
        value: function _getDiscardURL(node) {
          var portletURL = Liferay.PortletURL.createURL(this.discardURL);
          portletURL.setParameter('modelClassNameId', node.modelClassNameId);
          portletURL.setParameter('modelClassPK', node.modelClassPK);
          return portletURL.toString();
        }
      }, {
        key: "_getDropdown",
        value: function _getDropdown(node) {
          var dropdownItems = node.dropdownItems;

          if (!dropdownItems) {
            dropdownItems = [];
          } else {
            dropdownItems = dropdownItems.slice(0);
          }

          if (this.activeCTCollection) {
            dropdownItems.push({
              href: this._getDiscardURL(node),
              label: Liferay.Language.get('discard')
            });
          }

          if (dropdownItems.length === 0) {
            return;
          }

          return _react["default"].createElement("div", {
            className: "autofit-col"
          }, _react["default"].createElement(_dropDown.ClayDropDownWithItems, {
            alignmentPosition: _dropDown.Align.BottomLeft,
            items: dropdownItems,
            spritemap: this.spritemap,
            trigger: _react["default"].createElement(_button.ClayButtonWithIcon, {
              displayType: "unstyled",
              small: true,
              spritemap: this.spritemap,
              symbol: "ellipsis-v"
            })
          }));
        }
      }, {
        key: "_getModels",
        value: function _getModels(nodes) {
          if (!nodes) {
            return [];
          }

          var models = [];

          for (var i = 0; i < nodes.length; i++) {
            var node = nodes[i];
            var modelKey = node;
            var nodeId = node;

            if (_typeof(node) === 'object') {
              modelKey = node.modelKey;
              nodeId = node.nodeId;
            }

            var model = this._clone(this.models[modelKey.toString()]);

            model.nodeId = nodeId;
            models.push(model);
          }

          return models;
        }
      }, {
        key: "_getNode",
        value: function _getNode(filterClass, nodeId, viewType) {
          if (viewType === 'changes') {
            if (nodeId === 0) {
              return {
                children: this._getModels(this.changes)
              };
            }

            return this._clone(this.models[nodeId.toString()]);
          } else if (filterClass !== 'everything' && nodeId === 0) {
            return {
              children: this._getModels(this.contextView[filterClass].children)
            };
          }

          var rootNode = this.contextView.everything;

          if (nodeId === 0) {
            return {
              children: this._getModels(rootNode.children)
            };
          }

          if (!rootNode.parents) {
            rootNode.parents = [];

            for (var i = 0; i < rootNode.children.length; i++) {
              rootNode.children[i].parents = [];
            }
          }

          var stack = [rootNode];

          while (stack.length > 0) {
            var element = stack.pop();

            if (element.nodeId === nodeId) {
              var entry = this._clone(this.models[element.modelKey.toString()]);

              entry.children = this._getModels(element.children);
              entry.nodeId = nodeId;
              entry.parents = element.parents;
              return entry;
            } else if (!element.children) {
              continue;
            }

            for (var _i6 = 0; _i6 < element.children.length; _i6++) {
              var child = element.children[_i6];

              if (!child.parents) {
                var parents = element.parents.slice(0);
                var model = this.models[element.modelKey.toString()];
                parents.push({
                  modelClassNameId: model.modelClassNameId,
                  modelClassPK: model.modelClassPK,
                  nodeId: element.nodeId,
                  title: model.title,
                  typeName: model.typeName
                });
                child.parents = parents;
              }

              stack.push(child);
            }
          }

          return null;
        }
      }, {
        key: "_getPortraitURL",
        value: function _getPortraitURL(node) {
          return this.userInfo[node.userId.toString()].portraitURL;
        }
      }, {
        key: "_getRenderURL",
        value: function _getRenderURL(node) {
          if (node.ctEntryId) {
            var _portletURL = Liferay.PortletURL.createURL(this.renderDiffURL);

            _portletURL.setParameter('ctEntryId', node.ctEntryId);

            return _portletURL.toString();
          }

          var portletURL = Liferay.PortletURL.createURL(this.renderCTEntryURL);
          portletURL.setParameter('modelClassNameId', node.modelClassNameId);
          portletURL.setParameter('modelClassPK', node.modelClassPK);
          return portletURL.toString();
        }
      }, {
        key: "_getRootDisplayOptions",
        value: function _getRootDisplayOptions() {
          var rootDisplayOptions = [];
          rootDisplayOptions.push(_react["default"].createElement(_form.ClayRadio, {
            label: Liferay.Language.get('everything'),
            value: "everything"
          }));

          for (var i = 0; i < this.rootDisplayClasses.length; i++) {
            var className = this.rootDisplayClasses[i];

            if (!this.state.showHideable && this.contextView[className].hideable) {
              continue;
            }

            var label = className;

            if (label.includes('.')) {
              label = label.substring(label.lastIndexOf('.') + 1, label.length);
            }

            rootDisplayOptions.push(_react["default"].createElement(_form.ClayRadio, {
              label: label,
              value: className
            }));
          }

          return rootDisplayOptions;
        }
      }, {
        key: "_getTableHead",
        value: function _getTableHead() {
          if (this.state.viewType === 'context') {
            return '';
          }

          return _react["default"].createElement(_table["default"].Head, null, _react["default"].createElement(_table["default"].Row, null, _react["default"].createElement(_table["default"].Cell, {
            headingCell: true
          }, Liferay.Language.get('user')), _react["default"].createElement(_table["default"].Cell, {
            headingCell: true
          }, Liferay.Language.get('site')), _react["default"].createElement(_table["default"].Cell, {
            className: "table-cell-expand",
            headingCell: true
          }, Liferay.Language.get('title')), _react["default"].createElement(_table["default"].Cell, {
            className: "table-cell-expand-smallest",
            headingCell: true
          }, Liferay.Language.get('change-type')), _react["default"].createElement(_table["default"].Cell, {
            className: "table-cell-expand-smallest",
            headingCell: true
          }, Liferay.Language.get('last-modified'))));
        }
      }, {
        key: "_getTableRows",
        value: function _getTableRows(nodes) {
          var _this4 = this;

          var rows = [];

          if (!nodes) {
            return rows;
          }

          var currentTypeName = '';

          var _loop2 = function _loop2(i) {
            var node = nodes[i];

            if (node.typeName !== currentTypeName) {
              currentTypeName = node.typeName;
              rows.push(_react["default"].createElement(_table["default"].Row, {
                divider: true
              }, _react["default"].createElement(_table["default"].Cell, {
                colSpan: _this4.state.viewType === 'changes' ? 5 : 1
              }, node.typeName)));
            }

            var cells = [];

            if (_this4.state.viewType === 'context') {
              var descriptionMarkup = '';

              if (node.description) {
                descriptionMarkup = _react["default"].createElement("div", {
                  className: "change-list-description"
                }, node.description);
              }

              cells.push(_react["default"].createElement(_table["default"].Cell, null, _react["default"].createElement("div", {
                className: "change-list-name"
              }, node.title), descriptionMarkup));
            } else {
              var portraitURL = _this4._getPortraitURL(node);

              if (portraitURL) {
                cells.push(_react["default"].createElement(_table["default"].Cell, null, _react["default"].createElement("span", {
                  className: "lfr-portal-tooltip",
                  title: node.userName
                }, _react["default"].createElement("span", {
                  className: "rounded-circle sticker sticker-primary"
                }, _react["default"].createElement("span", {
                  className: "sticker-overlay"
                }, _react["default"].createElement("img", {
                  alt: "thumbnail",
                  className: "img-fluid",
                  src: portraitURL
                }))))));
              } else {
                var userPortraitCss = 'sticker sticker-circle sticker-light user-icon-color-';
                userPortraitCss += node.userId % 10;
                cells.push(_react["default"].createElement(_table["default"].Cell, null, _react["default"].createElement("span", {
                  className: "lfr-portal-tooltip",
                  title: node.userName
                }, _react["default"].createElement("span", {
                  className: userPortraitCss
                }, _react["default"].createElement("span", {
                  className: "inline-item"
                }, _react["default"].createElement("svg", {
                  className: "lexicon-icon"
                }, _react["default"].createElement("use", {
                  href: _this4.spritemap + '#user'
                })))))));
              }

              cells.push(_react["default"].createElement(_table["default"].Cell, null, node.siteName));
              cells.push(_react["default"].createElement(_table["default"].Cell, {
                className: "change-list-name table-cell-expand"
              }, node.title));
              cells.push(_react["default"].createElement(_table["default"].Cell, {
                className: "table-cell-expand-smallest"
              }, node.changeTypeLabel));
              cells.push(_react["default"].createElement(_table["default"].Cell, {
                className: "table-cell-expand-smallest"
              }, _this4._format(Liferay.Language.get('x-ago'), [node.timeDescription])));
            }

            rows.push(_react["default"].createElement(_table["default"].Row, {
              className: "cursor-pointer",
              onClick: function onClick() {
                return _this4._handleNavigationUpdate({
                  nodeId: node.nodeId
                });
              }
            }, cells));
          };

          for (var i = 0; i < nodes.length; i++) {
            _loop2(i);
          }

          return rows;
        }
      }, {
        key: "_getViewTypes",
        value: function _getViewTypes() {
          var _this5 = this;

          if (!this.contextView) {
            return '';
          }

          var items = [{
            active: this.state.viewType === 'changes',
            label: Liferay.Language.get('changes'),
            onClick: function onClick() {
              return _this5._handleNavigationUpdate({
                filterClass: 'everything',
                nodeId: 0,
                viewType: 'changes'
              });
            },
            symbolLeft: 'list'
          }, {
            active: this.state.viewType === 'context',
            label: Liferay.Language.get('context'),
            onClick: function onClick() {
              return _this5._handleNavigationUpdate({
                filterClass: 'everything',
                nodeId: 0,
                viewType: 'context'
              });
            },
            symbolLeft: 'pages-tree'
          }];
          return _react["default"].createElement(_managementToolbar["default"].Item, {
            className: "lfr-portal-tooltip",
            title: Liferay.Language.get('display-style')
          }, _react["default"].createElement(_dropDown.ClayDropDownWithItems, {
            alignmentPosition: _dropDown.Align.BottomLeft,
            items: items,
            spritemap: this.spritemap,
            trigger: _react["default"].createElement(_button["default"], {
              className: "nav-link nav-link-monospaced",
              displayType: "unstyled"
            }, _react["default"].createElement(_icon["default"], {
              spritemap: this.spritemap,
              symbol: this.state.viewType === 'changes' ? 'list' : 'pages-tree'
            }))
          }));
        }
      }, {
        key: "_handleDeltaChange",
        value: function _handleDeltaChange(delta) {
          this.setState({
            delta: delta,
            page: 1
          });
        }
      }, {
        key: "_handleNavigationUpdate",
        value: function _handleNavigationUpdate(json) {
          var filterClass = json.filterClass;

          if (!filterClass) {
            filterClass = this.state.filterClass;
          }

          var nodeId = json.nodeId;
          var showHideable = this.state.showHideable;

          if (Object.prototype.hasOwnProperty.call(json, 'showHideable')) {
            showHideable = json.showHideable;
          }

          var viewType = json.viewType;

          if (!viewType) {
            viewType = this.state.viewType;
          }

          if (viewType === 'context' && this.contextView.errorMessage) {
            this.setState({
              renderInnerHTML: null,
              viewType: viewType
            });
            return;
          }

          var node = this._getNode(filterClass, nodeId, viewType);

          var breadcrumbItems = this._getBreadcrumbItems(node, filterClass, nodeId, viewType);

          this.setState({
            breadcrumbItems: breadcrumbItems,
            children: this._filterHideableNodes(node.children, showHideable),
            dropdown: '',
            filterClass: filterClass,
            node: node,
            page: 1,
            renderInnerHTML: null,
            showHideable: showHideable,
            viewType: viewType
          });

          this._updateRenderContent(node);

          this._updateSessionState(breadcrumbItems, filterClass, showHideable, viewType);

          this._saveSessionState();
        }
      }, {
        key: "_handlePageChange",
        value: function _handlePageChange(page) {
          this.setState({
            page: page
          });
        }
      }, {
        key: "_handleShowHideableToggle",
        value: function _handleShowHideableToggle(showHideable) {
          if (this.sessionState) {
            this.sessionState.showHideable = showHideable;

            this._saveSessionState();
          }

          if (!showHideable) {
            if (this.state.viewType === 'context' && this.contextView[this.state.filterClass].hideable) {
              this._handleNavigationUpdate({
                filterClass: 'everything',
                nodeId: 0,
                showHideable: showHideable
              });

              return;
            } else if (this.state.node.hideable) {
              this._handleNavigationUpdate({
                nodeId: 0,
                showHideable: showHideable
              });

              return;
            }
          }

          this.setState({
            children: this._filterHideableNodes(this.state.node.children, showHideable),
            showHideable: showHideable
          });
        }
      }, {
        key: "_handleSortColumnChange",
        value: function _handleSortColumnChange(column) {
          this.setState({
            column: column
          });
        }
      }, {
        key: "_handleSortDirectionChange",
        value: function _handleSortDirectionChange() {
          if (this.state.ascending) {
            this.setState({
              ascending: false,
              sortDirectionClass: 'order-arrow-up-active'
            });
            return;
          }

          this.setState({
            ascending: true,
            sortDirectionClass: 'order-arrow-down-active'
          });
        }
      }, {
        key: "_renderEntry",
        value: function _renderEntry() {
          if (this.state.renderInnerHTML === null) {
            return '';
          }

          return _react["default"].createElement("div", {
            className: "sheet"
          }, _react["default"].createElement("h2", {
            className: "autofit-row sheet-title"
          }, _react["default"].createElement("div", {
            className: "autofit-col autofit-col-expand"
          }, _react["default"].createElement("span", {
            className: "heading-text"
          }, this.state.node.description ? this.state.node.description : this.state.node.title)), this.state.dropdown), _react["default"].createElement("div", {
            className: "sheet-section",
            dangerouslySetInnerHTML: this.state.renderInnerHTML
          }));
        }
      }, {
        key: "_renderManagementToolbar",
        value: function _renderManagementToolbar() {
          var _this6 = this;

          var items = [];

          if (this.state.viewType === 'changes') {
            items = [{
              active: this._getColumn() === 'changeType',
              label: Liferay.Language.get('change-type'),
              onClick: function onClick() {
                return _this6._handleSortColumnChange('changeType');
              }
            }, {
              active: this._getColumn() === 'modifiedDate',
              label: Liferay.Language.get('modified-date'),
              onClick: function onClick() {
                return _this6._handleSortColumnChange('modifiedDate');
              }
            }, {
              active: this._getColumn() === 'site',
              label: Liferay.Language.get('site'),
              onClick: function onClick() {
                return _this6._handleSortColumnChange('site');
              }
            }, {
              active: this._getColumn() === 'user',
              label: Liferay.Language.get('user'),
              onClick: function onClick() {
                return _this6._handleSortColumnChange('user');
              }
            }];
          }

          items.push({
            active: this._getColumn() === 'title',
            label: Liferay.Language.get('title'),
            onClick: function onClick() {
              return _this6._handleSortColumnChange('title');
            }
          });
          items.sort(function (a, b) {
            if (a.label < b.label) {
              return -1;
            }

            return 1;
          });
          var dropdownItems = [{
            items: items,
            label: Liferay.Language.get('order-by'),
            type: 'group'
          }];
          return _react["default"].createElement(_managementToolbar["default"], null, _react["default"].createElement(_managementToolbar["default"].ItemList, null, _react["default"].createElement(_managementToolbar["default"].Item, null, _react["default"].createElement(_dropDown.ClayDropDownWithItems, {
            items: dropdownItems,
            spritemap: this.spritemap,
            trigger: _react["default"].createElement(_button["default"], {
              className: "nav-link",
              displayType: "unstyled"
            }, _react["default"].createElement("span", {
              className: "navbar-breakpoint-down-d-none"
            }, _react["default"].createElement("span", {
              className: "navbar-text-truncate"
            }, Liferay.Language.get('filter-and-order')), _react["default"].createElement(_icon["default"], {
              className: "inline-item inline-item-after",
              spritemap: this.spritemap,
              symbol: "caret-bottom"
            })), _react["default"].createElement("span", {
              className: "navbar-breakpoint-d-none"
            }, _react["default"].createElement(_icon["default"], {
              spritemap: this.spritemap,
              symbol: "filter"
            })))
          })), _react["default"].createElement(_managementToolbar["default"].Item, {
            className: "lfr-portal-tooltip",
            title: Liferay.Language.get('reverse-sort-direction')
          }, _react["default"].createElement(_button["default"], {
            className: this.state.sortDirectionClass,
            displayType: "unstyled",
            onClick: function onClick() {
              return _this6._handleSortDirectionChange();
            }
          }, _react["default"].createElement(_icon["default"], {
            spritemap: this.spritemap,
            symbol: "order-arrow"
          }))), _react["default"].createElement(_managementToolbar["default"].Item, {
            className: "nav-item-expand"
          }), _react["default"].createElement(_managementToolbar["default"].Item, {
            className: "simple-toggle-switch-reverse"
          }, _react["default"].createElement(_form.ClayToggle, {
            label: Liferay.Language.get('show-all-items'),
            onToggle: function onToggle(showHideable) {
              return _this6._handleShowHideableToggle(showHideable);
            },
            toggled: this.state.showHideable
          })), this._getViewTypes()));
        }
      }, {
        key: "_renderPagination",
        value: function _renderPagination() {
          var _this7 = this;

          if (this.state.children.length <= 5) {
            return '';
          }

          return _react["default"].createElement(_paginationBar.ClayPaginationBarWithBasicItems, {
            activeDelta: this.state.delta,
            activePage: this.state.page,
            deltas: [4, 8, 20, 40, 60].map(function (size) {
              return {
                label: size
              };
            }),
            ellipsisBuffer: 3,
            onDeltaChange: function onDeltaChange(delta) {
              return _this7._handleDeltaChange(delta);
            },
            onPageChange: function onPageChange(page) {
              return _this7._handlePageChange(page);
            },
            totalItems: this.state.children.length
          });
        }
      }, {
        key: "_renderPanel",
        value: function _renderPanel() {
          var _this8 = this;

          if (this.state.viewType === 'changes') {
            return '';
          }

          return _react["default"].createElement("div", {
            className: "col-md-3"
          }, _react["default"].createElement("div", {
            className: "panel panel-secondary"
          }, _react["default"].createElement("div", {
            className: "panel-body"
          }, _react["default"].createElement(_form.ClayRadioGroup, {
            onSelectedValueChange: function onSelectedValueChange(filterClass) {
              return _this8._handleNavigationUpdate({
                filterClass: filterClass,
                nodeId: 0
              });
            },
            selectedValue: this.state.filterClass
          }, this._getRootDisplayOptions()))));
        }
      }, {
        key: "_renderTable",
        value: function _renderTable() {
          if (!this.state.children || this.state.children.length === 0) {
            if (this.state.node.children && this.state.node.children.length > 0 && this.state.viewType === 'changes') {
              return _react["default"].createElement("div", {
                className: "sheet taglib-empty-result-message"
              }, _react["default"].createElement("div", {
                className: "taglib-empty-result-message-header"
              }), _react["default"].createElement("div", {
                className: "sheet-text text-center"
              }, Liferay.Language.get('there-are-no-changes-to-display-in-this-view')));
            }

            return '';
          }

          return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_table["default"], {
            className: "change-lists-table",
            headingNoWrap: true,
            hover: true,
            noWrap: true
          }, this._getTableHead(), _react["default"].createElement(_table["default"].Body, null, this._getTableRows(this._filterDisplayNodes(this.state.children)))), this._renderPagination());
        }
      }, {
        key: "_saveSessionState",
        value: function _saveSessionState() {
          if (!this.activeCTCollection) {
            return;
          }

          (0, _frontendJsWeb.fetch)(this.saveSessionStateURL, {
            body: JSON.stringify(this.sessionState),
            headers: {
              'Content-Type': 'application/json'
            },
            method: 'POST'
          });
        }
      }, {
        key: "_updateRenderContent",
        value: function _updateRenderContent(node) {
          var _this9 = this;

          if (!node.modelClassNameId) {
            return;
          }

          AUI().use('liferay-portlet-url', function () {
            (0, _frontendJsWeb.fetch)(_this9._getRenderURL(node)).then(function (response) {
              return response.text();
            }).then(function (text) {
              _this9.setState({
                dropdown: _this9._getDropdown(node),
                renderInnerHTML: {
                  __html: text
                }
              });
            });
          });
        }
      }, {
        key: "_updateSessionState",
        value: function _updateSessionState(breadcrumbItems, filterClass, showHideable, viewType) {
          if (!this.activeCTCollection) {
            return;
          }

          var path = [];

          if (breadcrumbItems) {
            for (var i = 0; i < breadcrumbItems.length; i++) {
              var breadcrumbItem = breadcrumbItems[i];

              if (breadcrumbItem.modelClassNameId) {
                path.push({
                  modelClassNameId: breadcrumbItem.modelClassNameId,
                  modelClassPK: breadcrumbItem.modelClassPK
                });
              }
            }
          }

          this.sessionState = {
            ctCollectionId: this.ctCollectionId,
            filterClass: filterClass,
            path: path,
            showHideable: showHideable,
            viewType: viewType
          };
        }
      }, {
        key: "render",
        value: function render() {
          var content;

          if (this.state.viewType === 'context' && this.contextView.errorMessage) {
            content = _react["default"].createElement(_alert["default"], {
              displayType: "danger"
            }, this.contextView.errorMessage);
          } else {
            content = _react["default"].createElement("div", {
              className: "container-fluid container-fluid-max-xl"
            }, _react["default"].createElement(_breadcrumb["default"], {
              ellipsisBuffer: 1,
              items: this.state.breadcrumbItems,
              spritemap: this.spritemap
            }), _react["default"].createElement("div", {
              className: "change-lists-changes-content row"
            }, this._renderPanel(), _react["default"].createElement("div", {
              className: this.state.viewType === 'changes' ? 'col-md-12' : 'col-md-9'
            }, this._renderEntry(), this._renderTable())));
          }

          return _react["default"].createElement(_react["default"].Fragment, null, this._renderManagementToolbar(), content);
        }
      }]);

      return ChangeTrackingChangesView;
    }(_react["default"].Component);

    function _default(props) {
      return _react["default"].createElement(ChangeTrackingChangesView, props);
    }
    //# sourceMappingURL=ChangeTrackingChangesView.js.map
  }
});
//# sourceMappingURL=ChangeTrackingChangesView.js.map