versacall-core-library-react 2.0.65 → 2.0.67

package/dist/components/CoreTagFilter/OldCoreTagFilter.js

@@ -1,452 +1,323 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _FormControlLabel = _interopRequireDefault(require("@material-ui/core/FormControlLabel"));
-
 var _reactIntl = require("react-intl");
-
 var _DeleteSweep = _interopRequireDefault(require("@material-ui/icons/DeleteSweep"));
-
 var _CardContent = _interopRequireDefault(require("@material-ui/core/CardContent"));
-
 var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
-
 var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
-
 var _NearMe = _interopRequireDefault(require("@material-ui/icons/NearMe"));
-
 var _LocalOffer = _interopRequireDefault(require("@material-ui/icons/LocalOffer"));
-
 var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
-
 var _Category = _interopRequireDefault(require("@material-ui/icons/Category"));
-
 var _Tooltip = _interopRequireDefault(require("@material-ui/core/Tooltip"));
-
 var _Avatar = _interopRequireDefault(require("@material-ui/core/Avatar"));
-
 var _Switch = _interopRequireDefault(require("@material-ui/core/Switch"));
-
 var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
-
 var _Add = _interopRequireDefault(require("@material-ui/icons/Add"));
-
 var _Card = _interopRequireDefault(require("@material-ui/core/Card"));
-
 var _Grid = _interopRequireDefault(require("@material-ui/core/Grid"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _OldTagFilterSelector = _interopRequireDefault(require("./OldTagFilterSelector"));
-
 var _OldTagChip = _interopRequireDefault(require("./OldTagChip"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return 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); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
-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 } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } 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 _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
-var sortTagOptions = function sortTagOptions(tagArray) {
-  var newArray = []; // build the newArray by getting rid of duplicates
-
-  tagArray.forEach(function (tag) {
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const sortTagOptions = tagArray => {
+  const newArray = [];
+  // build the newArray by getting rid of duplicates
+  tagArray.forEach(tag => {
     // if this tag is already in the array, add the counts together
-    if (newArray.includes(function (_tag) {
-      return _tag.tag === tag.tag;
-    })) {
-      var index = newArray.findIndex(function (_tag) {
-        return _tag.tag === tag.tag;
-      });
+    if (newArray.includes(_tag => _tag.tag === tag.tag)) {
+      const index = newArray.findIndex(_tag => _tag.tag === tag.tag);
       newArray[index].count += tag.count;
     } else {
       // otherwise add the tag
       newArray.push(tag);
     }
-  }); // sort the tags by count
-
-  newArray.sort(function (tagA, tagB) {
-    return tagB.count - tagA.count;
   });
+  // sort the tags by count
+  newArray.sort((tagA, tagB) => tagB.count - tagA.count);
   return newArray;
 };
-
-var OldCoreTagFilter = /*#__PURE__*/function (_Component) {
-  _inherits(OldCoreTagFilter, _Component);
-
-  var _super = _createSuper(OldCoreTagFilter);
-
-  function OldCoreTagFilter() {
-    var _this;
-
-    _classCallCheck(this, OldCoreTagFilter);
-
-    _this = _super.call(this);
-    _this.state = {
+class OldCoreTagFilter extends _react.Component {
+  constructor() {
+    super();
+    this.state = {
       openDialog: false,
       menuTitle: ''
     };
-    return _this;
   }
-
-  _createClass(OldCoreTagFilter, [{
-    key: "getTagOptions",
-    value: function getTagOptions() {
-      var _this$props = this.props,
-          hideModuleTagFilters = _this$props.hideModuleTagFilters,
-          hideModuleLocationFilters = _this$props.hideModuleLocationFilters,
-          hideMonitoringPointTagFilters = _this$props.hideMonitoringPointTagFilters,
-          hideMonitoringPointTypeFilters = _this$props.hideMonitoringPointTypeFilters,
-          tags = _this$props.tags; // build an array of objects with a title and tagArray
-
-      if (this.state.menuTitle === '__add_module_filter') {
-        var optionArray = [];
-
-        if (!hideModuleTagFilters) {
-          optionArray.push({
-            title: '__tags',
-            options: sortTagOptions(tags.moduleTags),
-            optionName: 'moduleTags',
-            filterArrayName: 'moduleTagFilters'
-          });
-        }
-
-        if (!hideModuleLocationFilters) {
-          optionArray.push({
-            title: '__locations',
-            options: sortTagOptions(tags.locationTags),
-            filterArrayName: 'moduleLocationFilters',
-            optionName: 'locationTags'
-          });
-        }
-
-        return optionArray;
+  getTagOptions() {
+    const {
+      hideModuleTagFilters,
+      hideModuleLocationFilters,
+      hideMonitoringPointTagFilters,
+      hideMonitoringPointTypeFilters,
+      tags
+    } = this.props;
+    // build an array of objects with a title and tagArray
+    if (this.state.menuTitle === '__add_module_filter') {
+      const optionArray = [];
+      if (!hideModuleTagFilters) {
+        optionArray.push({
+          title: '__tags',
+          options: sortTagOptions(tags.moduleTags),
+          optionName: 'moduleTags',
+          filterArrayName: 'moduleTagFilters'
+        });
       }
-
-      if (this.state.menuTitle === '__add_monitoring_points_filter') {
-        var _optionArray = [];
-
-        if (!hideMonitoringPointTagFilters) {
-          _optionArray.push({
-            title: '__tags',
-            options: sortTagOptions(tags.monitoringPointTags),
-            filterArrayName: 'monitoringPointTagFilters',
-            optionName: 'monitoringPointTags'
-          });
-        }
-
-        if (!hideMonitoringPointTypeFilters) {
-          _optionArray.push({
-            title: '__types',
-            options: sortTagOptions(tags.typeTags),
-            filterArrayName: 'monitoringPointTypeFilters',
-            optionName: 'typeTags'
-          });
-        }
-
-        return _optionArray;
+      if (!hideModuleLocationFilters) {
+        optionArray.push({
+          title: '__locations',
+          options: sortTagOptions(tags.locationTags),
+          filterArrayName: 'moduleLocationFilters',
+          optionName: 'locationTags'
+        });
       }
-
-      return [];
+      return optionArray;
     }
-  }, {
-    key: "mapTags",
-    value: function mapTags(arrayName, filterArray, icon, color, tooltip) {
-      var _this2 = this;
-
-      var _deleteTag = function deleteTag(tag) {
-        var newTags = filterArray;
-        newTags.splice(newTags.findIndex(function (_tag) {
-          return _tag === tag;
-        }), 1);
-
-        _this2.updateFilter(_defineProperty({}, arrayName, newTags));
-      };
-
-      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, filterArray.map(function (tag, index) {
-        return /*#__PURE__*/_react.default.createElement(_OldTagChip.default, {
-          tag: tag,
-          color: color,
-          key: String(index),
-          deleteTag: function deleteTag() {
-            return _deleteTag(tag);
-          },
-          showDelete: !_this2.props.mandatoryTags.includes(tag),
-          icon: /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-            title: _this2.props.intl.formatMessage({
-              id: tooltip
-            })
-          }, /*#__PURE__*/_react.default.createElement(_Avatar.default, null, icon))
+    if (this.state.menuTitle === '__add_monitoring_points_filter') {
+      const optionArray = [];
+      if (!hideMonitoringPointTagFilters) {
+        optionArray.push({
+          title: '__tags',
+          options: sortTagOptions(tags.monitoringPointTags),
+          filterArrayName: 'monitoringPointTagFilters',
+          optionName: 'monitoringPointTags'
+        });
+      }
+      if (!hideMonitoringPointTypeFilters) {
+        optionArray.push({
+          title: '__types',
+          options: sortTagOptions(tags.typeTags),
+          filterArrayName: 'monitoringPointTypeFilters',
+          optionName: 'typeTags'
         });
-      }));
-    }
-  }, {
-    key: "handleMenu",
-    value: function handleMenu(open, title) {
-      this.setState({
-        openDialog: open,
-        menuTitle: title
-      });
-    }
-  }, {
-    key: "updateFilter",
-    value: function updateFilter(newFilterProperties) {
-      if (this.props.updateFilter) {
-        // this function should take changes to the array and write the string filter each time
-        var newBasicFilter = ''; // build new filter
-
-        var newFilter = _objectSpread(_objectSpread({}, this.props.filter), newFilterProperties); // join moduleTag and module location filters together using array.join(' OR ')
-
-
-        var moduleFilters = [].concat(_toConsumableArray(newFilter.moduleTagFilters), _toConsumableArray(newFilter.moduleLocationFilters));
-
-        if (moduleFilters.length > 0) {
-          newBasicFilter = "(".concat(moduleFilters.join(' OR '), ")");
-        } // if mpType has elements, add an AND and then joing those elemets with an ' OR '
-
-
-        var typeFilters = _toConsumableArray(newFilter.monitoringPointTypeFilters);
-
-        if (typeFilters.length > 0) {
-          if (moduleFilters.length > 0) {
-            newBasicFilter = "".concat(newBasicFilter, " AND (").concat(typeFilters.join(' OR '), ")");
-          } else {
-            newBasicFilter = "(".concat(typeFilters.join(' OR '), ")");
-          }
-        } // if mpTag has elements add an AND and then joing those elemets with an ' OR '
-
-
-        var tagFilters = _toConsumableArray(newFilter.monitoringPointTagFilters);
-
-        if (tagFilters.length > 0) {
-          if (moduleFilters.length > 0 || typeFilters.length > 0) {
-            newBasicFilter = "".concat(newBasicFilter, " AND (").concat(tagFilters.join(' OR '), ")");
-          } else {
-            newBasicFilter = "(".concat(tagFilters.join(' OR '), ")");
-          }
-        } // merge new basicFilter with newFilter properties and re-call function
-
-
-        this.props.updateFilter(_objectSpread(_objectSpread({}, this.props.filter), _objectSpread(_objectSpread({}, newFilterProperties), {}, {
-          basicFilter: newBasicFilter
-        })));
       }
+      return optionArray;
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this3 = this;
-
-      var _this$props2 = this.props,
-          intl = _this$props2.intl,
-          filter = _this$props2.filter,
-          hideModuleTagFilters = _this$props2.hideModuleTagFilters,
-          hideModuleLocationFilters = _this$props2.hideModuleLocationFilters,
-          hideMonitoringPointTagFilters = _this$props2.hideMonitoringPointTagFilters,
-          hideMonitoringPointTypeFilters = _this$props2.hideMonitoringPointTypeFilters,
-          hideAdvanced = _this$props2.hideAdvanced;
-      var _this$state = this.state,
-          openDialog = _this$state.openDialog,
-          menuTitle = _this$state.menuTitle;
-      return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
-        spacing: 2,
-        container: true
-      }, !hideAdvanced && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
-        align: "center",
-        xs: 8,
-        item: true
-      }), /*#__PURE__*/_react.default.createElement(_Grid.default, {
-        align: "center",
-        xs: 4,
-        item: true
-      }, /*#__PURE__*/_react.default.createElement(_FormControlLabel.default, {
-        labelPlacement: "bottom",
-        label: intl.formatMessage({
-          id: '__advanced'
-        }),
-        control: /*#__PURE__*/_react.default.createElement(_Switch.default, {
-          checked: filter.isAdvanced,
-          onChange: function onChange(event) {
-            return _this3.props.updateFilter(_objectSpread(_objectSpread({}, filter), {}, {
-              isAdvanced: event.target.checked
-            }));
-          }
-        })
-      }))), filter.isAdvanced ? /*#__PURE__*/_react.default.createElement(_Grid.default, {
-        xs: 12,
-        item: true
-      }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
-        variant: "outlined",
-        value: filter.advancedFilter,
-        label: intl.formatMessage({
-          id: '__filter'
-        }),
-        onChange: function onChange(event) {
-          return _this3.props.updateFilter(_objectSpread(_objectSpread({}, filter), {}, {
-            advancedFilter: event.target.value
-          }));
-        },
-        fullWidth: true,
-        multiline: true
-      })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (!hideModuleTagFilters || !hideModuleLocationFilters) && /*#__PURE__*/_react.default.createElement(_Grid.default, {
-        xs: 6,
-        item: true
-      }, /*#__PURE__*/_react.default.createElement(_Card.default, null, /*#__PURE__*/_react.default.createElement(_CardContent.default, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
-        variant: "h6",
-        style: {
-          float: 'left'
-        }
-      }, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
-        id: "__modules"
-      })), /*#__PURE__*/_react.default.createElement("div", {
-        style: {
-          float: 'right'
-        }
-      }, (filter.moduleLocationFilters.length > 0 || filter.moduleTagFilters.length > 0) && /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-        title: intl.formatMessage({
-          id: '__empty_filter'
-        })
-      }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-        onClick: function onClick(event) {
-          return _this3.updateFilter({
-            moduleLocationFilters: [],
-            moduleTagFilters: []
-          });
-        }
-      }, /*#__PURE__*/_react.default.createElement(_DeleteSweep.default, null))), /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-        title: intl.formatMessage({
-          id: '__add_module_filter'
-        })
-      }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-        onClick: function onClick(event) {
-          return _this3.handleMenu(true, '__add_module_filter');
-        }
-      }, /*#__PURE__*/_react.default.createElement(_Add.default, null)))), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), (filter.moduleLocationFilters.length > 0 || filter.moduleTagFilters.length > 0) && /*#__PURE__*/_react.default.createElement("div", {
-        style: {
-          display: 'flex',
-          flexDirection: 'column',
-          overflow: 'auto',
-          maxHeight: '160px'
-        }
-      }, this.mapTags('moduleLocationFilters', filter.moduleLocationFilters, /*#__PURE__*/_react.default.createElement(_NearMe.default, null), 'darkorange', '__location_tags'), this.mapTags('moduleTagFilters', filter.moduleTagFilters, /*#__PURE__*/_react.default.createElement(_LocalOffer.default, null), '#005A96', '__tags'))))), (!hideMonitoringPointTagFilters || !hideMonitoringPointTypeFilters) && /*#__PURE__*/_react.default.createElement(_Grid.default, {
-        xs: 6,
-        item: true
-      }, /*#__PURE__*/_react.default.createElement(_Card.default, null, /*#__PURE__*/_react.default.createElement(_CardContent.default, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
-        variant: "h6",
-        style: {
-          float: 'left'
-        }
-      }, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
-        id: "__monitoring_points"
-      })), /*#__PURE__*/_react.default.createElement("div", {
-        style: {
-          float: 'right'
-        }
-      }, (filter.monitoringPointTagFilters.length > 0 || filter.monitoringPointTypeFilters.length > 0) && /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-        title: intl.formatMessage({
-          id: '__empty_filter'
-        })
-      }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-        onClick: function onClick(event) {
-          event.stopPropagation();
-
-          _this3.updateFilter({
-            monitoringPointTagFilters: [],
-            monitoringPointTypeFilters: []
-          });
-        }
-      }, /*#__PURE__*/_react.default.createElement(_DeleteSweep.default, null))), /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-        title: intl.formatMessage({
-          id: '__add_monitoring_points_filter'
+    return [];
+  }
+  mapTags(arrayName, filterArray, icon, color, tooltip) {
+    const deleteTag = tag => {
+      const newTags = filterArray;
+      newTags.splice(newTags.findIndex(_tag => _tag === tag), 1);
+      this.updateFilter({
+        [arrayName]: newTags
+      });
+    };
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, filterArray.map((tag, index) => /*#__PURE__*/_react.default.createElement(_OldTagChip.default, {
+      tag: tag,
+      color: color,
+      key: String(index),
+      deleteTag: () => deleteTag(tag),
+      showDelete: !this.props.mandatoryTags.includes(tag),
+      icon: /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+        title: this.props.intl.formatMessage({
+          id: tooltip
         })
-      }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-        onClick: function onClick(event) {
-          event.stopPropagation();
-
-          _this3.handleMenu(true, '__add_monitoring_points_filter');
-        }
-      }, /*#__PURE__*/_react.default.createElement(_Add.default, null)))), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), (filter.monitoringPointTagFilters.length > 0 || filter.monitoringPointTypeFilters.length > 0) && /*#__PURE__*/_react.default.createElement("div", {
-        style: {
-          display: 'flex',
-          flexDirection: 'column',
-          overflow: 'auto',
-          maxHeight: '160px'
+      }, /*#__PURE__*/_react.default.createElement(_Avatar.default, null, icon))
+    })));
+  }
+  handleMenu(open, title) {
+    this.setState({
+      openDialog: open,
+      menuTitle: title
+    });
+  }
+  updateFilter(newFilterProperties) {
+    if (this.props.updateFilter) {
+      // this function should take changes to the array and write the string filter each time
+      let newBasicFilter = '';
+      // build new filter
+      const newFilter = _objectSpread(_objectSpread({}, this.props.filter), newFilterProperties);
+      // join moduleTag and module location filters together using array.join(' OR ')
+      const moduleFilters = [...newFilter.moduleTagFilters, ...newFilter.moduleLocationFilters];
+      if (moduleFilters.length > 0) {
+        newBasicFilter = "(".concat(moduleFilters.join(' OR '), ")");
+      }
+      // if mpType has elements, add an AND and then joing those elemets with an ' OR '
+      const typeFilters = [...newFilter.monitoringPointTypeFilters];
+      if (typeFilters.length > 0) {
+        if (moduleFilters.length > 0) {
+          newBasicFilter = "".concat(newBasicFilter, " AND (").concat(typeFilters.join(' OR '), ")");
+        } else {
+          newBasicFilter = "(".concat(typeFilters.join(' OR '), ")");
         }
-      }, this.mapTags('monitoringPointTypeFilters', filter.monitoringPointTypeFilters, /*#__PURE__*/_react.default.createElement(_Category.default, null), 'green', '__type_tags'), this.mapTags('monitoringPointTagFilters', filter.monitoringPointTagFilters, /*#__PURE__*/_react.default.createElement(_LocalOffer.default, null), '#005A96', '__tags'))))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
-        xs: 12,
-        item: true
-      }, /*#__PURE__*/_react.default.createElement(_Card.default, null, /*#__PURE__*/_react.default.createElement(_CardContent.default, null, "".concat(intl.formatMessage({
-        id: '__filter'
-      }), ": ").concat(filter.basicFilter)))))), /*#__PURE__*/_react.default.createElement(_Dialog.default, {
-        maxWidth: "xs",
-        open: openDialog,
-        onClose: function onClose() {
-          return _this3.handleMenu(false, '__close');
-        },
-        fullWidth: true
-      }, /*#__PURE__*/_react.default.createElement(_OldTagFilterSelector.default, {
-        filter: filter,
-        title: menuTitle,
-        tagOptions: this.getTagOptions(),
-        onClose: function onClose() {
-          return _this3.handleMenu(false, '__close');
-        },
-        updateFilter: function updateFilter(newFilterProperties) {
-          return _this3.updateFilter(newFilterProperties);
+      }
+      // if mpTag has elements add an AND and then joing those elemets with an ' OR '
+      const tagFilters = [...newFilter.monitoringPointTagFilters];
+      if (tagFilters.length > 0) {
+        if (moduleFilters.length > 0 || typeFilters.length > 0) {
+          newBasicFilter = "".concat(newBasicFilter, " AND (").concat(tagFilters.join(' OR '), ")");
+        } else {
+          newBasicFilter = "(".concat(tagFilters.join(' OR '), ")");
         }
+      }
+      // merge new basicFilter with newFilter properties and re-call function
+      this.props.updateFilter(_objectSpread(_objectSpread({}, this.props.filter), _objectSpread(_objectSpread({}, newFilterProperties), {}, {
+        basicFilter: newBasicFilter
       })));
     }
-  }]);
-
-  return OldCoreTagFilter;
-}(_react.Component);
-
+  }
+  render() {
+    const {
+      intl,
+      filter,
+      hideModuleTagFilters,
+      hideModuleLocationFilters,
+      hideMonitoringPointTagFilters,
+      hideMonitoringPointTypeFilters,
+      hideAdvanced
+    } = this.props;
+    const {
+      openDialog,
+      menuTitle
+    } = this.state;
+    return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
+      spacing: 2,
+      container: true
+    }, !hideAdvanced && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
+      align: "center",
+      xs: 8,
+      item: true
+    }), /*#__PURE__*/_react.default.createElement(_Grid.default, {
+      align: "center",
+      xs: 4,
+      item: true
+    }, /*#__PURE__*/_react.default.createElement(_FormControlLabel.default, {
+      labelPlacement: "bottom",
+      label: intl.formatMessage({
+        id: '__advanced'
+      }),
+      control: /*#__PURE__*/_react.default.createElement(_Switch.default, {
+        checked: filter.isAdvanced,
+        onChange: event => this.props.updateFilter(_objectSpread(_objectSpread({}, filter), {}, {
+          isAdvanced: event.target.checked
+        }))
+      })
+    }))), filter.isAdvanced ? /*#__PURE__*/_react.default.createElement(_Grid.default, {
+      xs: 12,
+      item: true
+    }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
+      variant: "outlined",
+      value: filter.advancedFilter,
+      label: intl.formatMessage({
+        id: '__filter'
+      }),
+      onChange: event => this.props.updateFilter(_objectSpread(_objectSpread({}, filter), {}, {
+        advancedFilter: event.target.value
+      })),
+      fullWidth: true,
+      multiline: true
+    })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (!hideModuleTagFilters || !hideModuleLocationFilters) && /*#__PURE__*/_react.default.createElement(_Grid.default, {
+      xs: 6,
+      item: true
+    }, /*#__PURE__*/_react.default.createElement(_Card.default, null, /*#__PURE__*/_react.default.createElement(_CardContent.default, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+      variant: "h6",
+      style: {
+        float: 'left'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
+      id: "__modules"
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        float: 'right'
+      }
+    }, (filter.moduleLocationFilters.length > 0 || filter.moduleTagFilters.length > 0) && /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+      title: intl.formatMessage({
+        id: '__empty_filter'
+      })
+    }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+      onClick: event => this.updateFilter({
+        moduleLocationFilters: [],
+        moduleTagFilters: []
+      })
+    }, /*#__PURE__*/_react.default.createElement(_DeleteSweep.default, null))), /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+      title: intl.formatMessage({
+        id: '__add_module_filter'
+      })
+    }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+      onClick: event => this.handleMenu(true, '__add_module_filter')
+    }, /*#__PURE__*/_react.default.createElement(_Add.default, null)))), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), (filter.moduleLocationFilters.length > 0 || filter.moduleTagFilters.length > 0) && /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        display: 'flex',
+        flexDirection: 'column',
+        overflow: 'auto',
+        maxHeight: '160px'
+      }
+    }, this.mapTags('moduleLocationFilters', filter.moduleLocationFilters, /*#__PURE__*/_react.default.createElement(_NearMe.default, null), 'darkorange', '__location_tags'), this.mapTags('moduleTagFilters', filter.moduleTagFilters, /*#__PURE__*/_react.default.createElement(_LocalOffer.default, null), '#005A96', '__tags'))))), (!hideMonitoringPointTagFilters || !hideMonitoringPointTypeFilters) && /*#__PURE__*/_react.default.createElement(_Grid.default, {
+      xs: 6,
+      item: true
+    }, /*#__PURE__*/_react.default.createElement(_Card.default, null, /*#__PURE__*/_react.default.createElement(_CardContent.default, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+      variant: "h6",
+      style: {
+        float: 'left'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
+      id: "__monitoring_points"
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        float: 'right'
+      }
+    }, (filter.monitoringPointTagFilters.length > 0 || filter.monitoringPointTypeFilters.length > 0) && /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+      title: intl.formatMessage({
+        id: '__empty_filter'
+      })
+    }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+      onClick: event => {
+        event.stopPropagation();
+        this.updateFilter({
+          monitoringPointTagFilters: [],
+          monitoringPointTypeFilters: []
+        });
+      }
+    }, /*#__PURE__*/_react.default.createElement(_DeleteSweep.default, null))), /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+      title: intl.formatMessage({
+        id: '__add_monitoring_points_filter'
+      })
+    }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+      onClick: event => {
+        event.stopPropagation();
+        this.handleMenu(true, '__add_monitoring_points_filter');
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Add.default, null)))), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), (filter.monitoringPointTagFilters.length > 0 || filter.monitoringPointTypeFilters.length > 0) && /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        display: 'flex',
+        flexDirection: 'column',
+        overflow: 'auto',
+        maxHeight: '160px'
+      }
+    }, this.mapTags('monitoringPointTypeFilters', filter.monitoringPointTypeFilters, /*#__PURE__*/_react.default.createElement(_Category.default, null), 'green', '__type_tags'), this.mapTags('monitoringPointTagFilters', filter.monitoringPointTagFilters, /*#__PURE__*/_react.default.createElement(_LocalOffer.default, null), '#005A96', '__tags'))))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
+      xs: 12,
+      item: true
+    }, /*#__PURE__*/_react.default.createElement(_Card.default, null, /*#__PURE__*/_react.default.createElement(_CardContent.default, null, "".concat(intl.formatMessage({
+      id: '__filter'
+    }), ": ").concat(filter.basicFilter)))))), /*#__PURE__*/_react.default.createElement(_Dialog.default, {
+      maxWidth: "xs",
+      open: openDialog,
+      onClose: () => this.handleMenu(false, '__close'),
+      fullWidth: true
+    }, /*#__PURE__*/_react.default.createElement(_OldTagFilterSelector.default, {
+      filter: filter,
+      title: menuTitle,
+      tagOptions: this.getTagOptions(),
+      onClose: () => this.handleMenu(false, '__close'),
+      updateFilter: newFilterProperties => this.updateFilter(newFilterProperties)
+    })));
+  }
+}
 OldCoreTagFilter.propTypes = {
   tags: _propTypes.default.shape(),
   hideAdvanced: _propTypes.default.bool,
@@ -468,7 +339,4 @@ OldCoreTagFilter.defaultProps = {
   hideMonitoringPointTagFilters: false,
   hideMonitoringPointTypeFilters: false
 };
-
-var _default = (0, _reactIntl.injectIntl)(OldCoreTagFilter);
-
-exports.default = _default;
+var _default = exports.default = (0, _reactIntl.injectIntl)(OldCoreTagFilter);