@reltio/components 1.4.914 → 1.4.918

package/cjs/components/SideIconPanel/SideButtonsPanel.d.ts

@@ -3,11 +3,11 @@ declare type Props = {
     buttonsProps: {
         icon: ElementType;
         tooltipTitle: string;
-        id: string;
+        id: number;
     }[];
-    activeIndex: number;
+    activeIndexId: number;
     className?: string;
-    onButtonClick: (index: number) => void;
+    onButtonClick: (id: number) => void;
 };
 export declare const SideButtonsPanel: VFC<Props>;
 export {};

package/cjs/components/SideIconPanel/SideButtonsPanel.js

@@ -31,12 +31,12 @@ var classnames_1 = __importDefault(require("classnames"));
 var SmallIconButton_1 = require("../SmallIconButton");
 var styles_1 = require("./styles");
 var SideButtonsPanel = function (_a) {
-    var buttonsProps = _a.buttonsProps, activeIndex = _a.activeIndex, className = _a.className, onButtonClick = _a.onButtonClick;
+    var buttonsProps = _a.buttonsProps, activeIndexId = _a.activeIndexId, className = _a.className, onButtonClick = _a.onButtonClick;
     var styles = styles_1.useStyles();
-    return (react_1.default.createElement("div", { className: classnames_1.default(styles.container, className) }, buttonsProps.map(function (_a, index) {
+    return (react_1.default.createElement("div", { className: classnames_1.default(styles.container, className) }, buttonsProps.map(function (_a) {
         var _b;
         var id = _a.id, buttonProps = __rest(_a, ["id"]);
-        return (react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, __assign({}, buttonProps, { size: "S", key: id, className: classnames_1.default((_b = {}, _b[styles.active] = activeIndex === index, _b), styles.buttonWrapper), onClick: function () { return onButtonClick(index); }, "data-reltio-id": "reltio-profile-right-side-button-" + id })));
+        return (react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, __assign({}, buttonProps, { size: "S", key: id, className: classnames_1.default((_b = {}, _b[styles.active] = activeIndexId === id, _b), styles.buttonWrapper), onClick: function () { return onButtonClick(id); }, "data-reltio-id": "reltio-profile-right-side-button-" + id })));
     })));
 };
 exports.SideButtonsPanel = SideButtonsPanel;

package/cjs/components/SidePanel/SidePanelContentHeader/SidePanelContentHeader.d.ts

@@ -1,7 +1,8 @@
 import { ReactNode, VFC } from 'react';
 declare type HeaderProps = {
-    mainTitle: string;
-    secondTitle: string;
+    mainTitle?: string;
+    secondTitle?: string;
+    content?: ReactNode;
     rightContent?: ReactNode;
 };
 declare type Props = HeaderProps & {

package/cjs/components/SidePanel/SidePanelContentHeader/SidePanelContentHeader.js

@@ -12,13 +12,14 @@ var Divider_1 = __importDefault(require("@material-ui/core/Divider"));
 var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var SmallIconButton_1 = require("../../SmallIconButton");
 var SidePanelContentHeader = function (_a) {
-    var onClose = _a.onClose, mainTitle = _a.mainTitle, secondTitle = _a.secondTitle, rightContent = _a.rightContent;
+    var onClose = _a.onClose, mainTitle = _a.mainTitle, secondTitle = _a.secondTitle, content = _a.content, rightContent = _a.rightContent;
     var styles = styles_1.useStyles();
     return (react_1.default.createElement("div", { className: styles.container },
         react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, { size: "S", icon: Close_1.default, onClick: onClose, className: styles.icon, tooltipTitle: ui_i18n_1.default.text('Close') }),
-        react_1.default.createElement(Typography_1.default, { variant: "h6" }, mainTitle),
-        react_1.default.createElement(Divider_1.default, { orientation: "vertical", flexItem: true, className: styles.divider }),
-        react_1.default.createElement(Typography_1.default, { variant: "body1", color: "textSecondary", className: styles.secondTitle }, secondTitle),
-        rightContent));
+        content || (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(Typography_1.default, { variant: "h6" }, mainTitle),
+            react_1.default.createElement(Divider_1.default, { orientation: "vertical", flexItem: true, className: styles.divider }),
+            react_1.default.createElement(Typography_1.default, { variant: "body1", color: "textSecondary", className: styles.secondTitle }, secondTitle),
+            rightContent))));
 };
 exports.SidePanelContentHeader = SidePanelContentHeader;

package/cjs/components/attributes/AttributesView/index.js

@@ -9,7 +9,7 @@ var mdm_module_1 = __importDefault(require("@reltio/mdm-module"));
 var AttributesView_1 = __importDefault(require("./AttributesView"));
 exports.AttributesView = AttributesView_1.default;
 var mapStateToProps = function (state, ownProps) { return ({
-    entity: ownProps.entity || mdm_module_1.default.selectors.getEntity(state),
+    entity: ownProps.entity || mdm_module_1.default.selectors.getEntityWithDiff(state),
     mode: ownProps.mode || mdm_module_1.default.selectors.getMode(state)
 }); };
 exports.default = react_redux_1.connect(mapStateToProps)(AttributesView_1.default);

package/cjs/components/attributes/editMode/SimpleAttributeEditor/selectors/helpers/parents.js

@@ -30,11 +30,13 @@ var getParents = function (state, valueUri, node) {
     });
     var modifiedEntities = mdm_module_1.default.selectors.getModifiedEntities(state);
     var entityUri = mdm_module_1.default.selectors.getEntityUri(state);
+    var connections = mdm_module_1.default.selectors.getAllRelationsToAddAndEdit(state);
     var ownParentNodesValues = mdm_sdk_1.filterRelatedParentValuesForDependentLookupValueUri({
         parentValues: parentNodesValues,
         valueUri: valueUri,
         entityUri: entityUri,
-        modifiedEntities: modifiedEntities
+        modifiedEntities: modifiedEntities,
+        connections: connections
     });
     var neededParentsAttributeTypes = node.parents.map(function (type) {
         var parentNode = mdm_module_1.default.selectors.getDependentLookupsStructureNode(state, type);

package/cjs/components/history/HistoryFilterButton/HistoryFilterButton.js

@@ -41,6 +41,7 @@ var Button_1 = __importDefault(require("@material-ui/core/Button"));
 var Popover_1 = __importDefault(require("@material-ui/core/Popover"));
 var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
 var SmallIconButton_1 = require("../../SmallIconButton");
+var filters_1 = require("../utils/filters");
 var UserSelector_1 = __importDefault(require("../../UserSelector/UserSelector"));
 var AttributeSelector_1 = __importDefault(require("../../AttributeSelector/AttributeSelector"));
 var DateRangeSelector_1 = __importDefault(require("../DateRangeSelector/DateRangeSelector"));
@@ -80,7 +81,12 @@ var HistoryFilterButton = function (_a) {
                 react_1.default.createElement(Button_1.default, { onClick: clearCurrentValue, className: styles.clearButton }, ui_i18n_1.default.text('Clear all')),
                 react_1.default.createElement(Button_1.default, { onClick: closePopup }, ui_i18n_1.default.text('Cancel')),
                 react_1.default.createElement(Button_1.default, { color: "primary", onClick: function () {
-                        onApplyFilter(currentValue);
+                        if (dateRange && filters_1.isDateRangeValid(dateRange)) {
+                            onApplyFilter(currentValue);
+                        }
+                        else {
+                            onApplyFilter(ramda_1.dissoc('dateRange', currentValue));
+                        }
                         closePopup();
                     } }, ui_i18n_1.default.text('Apply'))))));
 };

package/cjs/components/history/HistoryTree/HistoryTree.js

@@ -39,7 +39,8 @@ var react_resize_detector_1 = __importDefault(require("react-resize-detector"));
 var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var ramda_1 = require("ramda");
 var classnames_1 = __importDefault(require("classnames"));
-var mdm_module_1 = require("@reltio/mdm-module");
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
 var Button_1 = __importDefault(require("@material-ui/core/Button"));
 var HistoryRow_1 = __importDefault(require("../HistoryRow/HistoryRow"));
 var HistoryGraph_1 = __importDefault(require("../HistoryGraph/HistoryGraph"));
@@ -50,6 +51,7 @@ var HistoryTree = function (_a) {
     var historyData = _a.historyData, isLoading = _a.isLoading, canLoadMore = _a.canLoadMore, onLoadMore = _a.onLoadMore, entityUri = _a.entityUri, historyEvent = _a.historyEvent, findPreviousChange = _a.findPreviousChange;
     var styles = styles_1.useStyles();
     var dispatch = react_redux_1.useDispatch();
+    var isEditableMode = react_redux_1.useSelector(mdm_module_1.default.selectors.getIsEditableMode);
     var _c = react_1.useState({ historyLanes: {}, rows: [] }), graphData = _c[0], setGraphData = _c[1];
     var _d = react_1.useState(false), isScrollable = _d[0], setIsScrollable = _d[1];
     var _e = react_1.useState(-1), selectedIndex = _e[0], setSelectedIndex = _e[1];
@@ -78,6 +80,14 @@ var HistoryTree = function (_a) {
         setIsScrollable(scrollLeft < scrollWidth - clientWidth);
     };
     var handleHistoryRowClick = function (index, change, isSelected, isCurrent) {
+        if (isEditableMode) {
+            if (window.confirm(ui_i18n_1.default.text('Are you sure you want to go in history mode? All your changes will be lost.'))) {
+                dispatch(mdm_module_1.profile.mode.actions.modeUpdated(mdm_sdk_1.Mode.Viewing));
+            }
+            else {
+                return;
+            }
+        }
         if ((isCurrent && !isSelected) || (!isCurrent && isSelected)) {
             dispatch(mdm_module_1.profile.history.actions.clearHistoryEvent());
             setSelectedIndex(0);

package/cjs/components/history/hooks/useHistory.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { HistoryFilter } from '../types';
 declare type Props = {
     entityUri: string;
@@ -8,9 +7,10 @@ export declare const useHistory: ({ entityUri, enabled }: Props) => {
     isLoading: boolean;
     canLoadMore: boolean;
     onLoadMore: () => void;
+    onApplyFilter: (filter: HistoryFilter) => void;
     historicUris: string[];
     historyWithTotal: import("@reltio/mdm-sdk").HistoryWithTotal;
     historyFilter: HistoryFilter;
-    setHistoryFilter: import("react").Dispatch<import("react").SetStateAction<HistoryFilter>>;
+    reloadHistory: () => void;
 };
 export {};

package/cjs/components/history/hooks/useHistory.js

@@ -4,11 +4,16 @@ exports.useHistory = void 0;
 var react_1 = require("react");
 var useHistoricUris_1 = require("./useHistoricUris");
 var useHistoryWithTotal_1 = require("./useHistoryWithTotal");
+var types_1 = require("../types");
+var filters_1 = require("../utils/filters");
 var MAX_HISTORY_ROWS = 32;
 var useHistory = function (_a) {
     var entityUri = _a.entityUri, enabled = _a.enabled;
-    var _b = react_1.useState(null), historyFilter = _b[0], setHistoryFilter = _b[1];
+    var _b = react_1.useState({
+        activities: [types_1.HistoryActivityType.MERGE, types_1.HistoryActivityType.UNMERGE, types_1.HistoryActivityType.UPDATE]
+    }), historyFilter = _b[0], setHistoryFilter = _b[1];
     var _c = react_1.useState(0), historyPage = _c[0], setHistoryPage = _c[1];
+    var historyFilterString = react_1.useMemo(function () { return filters_1.buildHistoryFilterString(historyFilter); }, [historyFilter]);
     var _d = useHistoricUris_1.useHistoricUris({
         entityUri: entityUri,
         enabled: enabled
@@ -16,30 +21,39 @@ var useHistory = function (_a) {
     var _e = useHistoryWithTotal_1.useHistoryWithTotal({
         entityUri: entityUri,
         enabled: enabled && !!historicUris,
+        filter: historyFilterString,
         historicUris: historicUris,
         max: MAX_HISTORY_ROWS,
         offset: historyPage * MAX_HISTORY_ROWS,
-        order: 'desc',
-        showAll: true
-    }), isHistoryLoading = _e.isLoading, historyWithTotal = _e.historyWithTotal, loadMore = _e.loadMore;
-    var canLoadMore = react_1.useMemo(function () { return (historyPage + 1) * MAX_HISTORY_ROWS <= (historyWithTotal === null || historyWithTotal === void 0 ? void 0 : historyWithTotal.total); }, [
+        order: 'desc'
+    }), isHistoryLoading = _e.isLoading, historyWithTotal = _e.historyWithTotal, loadMore = _e.loadMore, loadData = _e.loadData;
+    var canLoadMore = react_1.useMemo(function () { return (historyPage + 1) * MAX_HISTORY_ROWS < (historyWithTotal === null || historyWithTotal === void 0 ? void 0 : historyWithTotal.total); }, [
         historyWithTotal,
         historyPage
     ]);
+    var onApplyFilter = react_1.useCallback(function (filter) {
+        setHistoryPage(0);
+        setHistoryFilter(filter);
+    }, []);
     var onLoadMore = react_1.useCallback(function () {
         if (!canLoadMore)
             return;
         loadMore((historyPage + 1) * MAX_HISTORY_ROWS);
         setHistoryPage(historyPage + 1);
     }, [loadMore, historyPage, canLoadMore]);
+    var reloadHistory = react_1.useCallback(function () {
+        loadData();
+        setHistoryPage(0);
+    }, [loadData]);
     return {
         isLoading: isHistoryLoading || isHistoricUrisLoading,
         canLoadMore: canLoadMore,
         onLoadMore: onLoadMore,
+        onApplyFilter: onApplyFilter,
         historicUris: historicUris,
         historyWithTotal: historyWithTotal,
         historyFilter: historyFilter,
-        setHistoryFilter: setHistoryFilter
+        reloadHistory: reloadHistory
     };
 };
 exports.useHistory = useHistory;

package/cjs/components/history/hooks/useHistoryDiff.d.ts

@@ -0,0 +1,2 @@
+import { HistoryDiff } from '@reltio/mdm-sdk';
+export declare const useHistoryDiff: () => HistoryDiff;

package/cjs/components/history/hooks/useHistoryDiff.js

@@ -0,0 +1,62 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useHistoryDiff = void 0;
+var react_1 = require("react");
+var react_redux_1 = require("react-redux");
+var ramda_1 = require("ramda");
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
+var defaultHistoryDiff = {
+    appearance: {},
+    attributes: {},
+    roles: [],
+    tags: []
+};
+var fixRefEntity = ramda_1.evolve({
+    refEntity: mdm_sdk_1.wrapInArrayIfNeeded,
+    refRelation: mdm_sdk_1.wrapInArrayIfNeeded
+});
+var prepareHistorySlice = function (historySlice) {
+    if (historySlice) {
+        return ramda_1.evolve({
+            attributes: ramda_1.map(ramda_1.map(fixRefEntity))
+        })(historySlice);
+    }
+    return historySlice;
+};
+var useHistoryDiff = function () {
+    var dispatch = react_redux_1.useDispatch();
+    var historySlice = react_redux_1.useSelector(mdm_module_1.default.selectors.getHistorySlice);
+    var historyDiff = react_redux_1.useSelector(mdm_module_1.default.selectors.getHistoryDiff);
+    var historyMode = react_redux_1.useSelector(mdm_module_1.default.selectors.getHistoryMode);
+    var entity = react_redux_1.useSelector(mdm_module_1.default.selectors.getEntity);
+    react_1.useEffect(function () {
+        if (historySlice) {
+            var aEntity = historySlice.aEntity, bEntity = historySlice.bEntity;
+            var historyManager = mdm_sdk_1.entity.HistoryManager.createHistoryManager(mdm_sdk_1.entity.AttributesDiff);
+            var historyDiff_1 = historyManager.computeEntityHistoryDiff(prepareHistorySlice(historyMode === mdm_module_1.HistoryMode.Current ? entity : bEntity), prepareHistorySlice(aEntity));
+            dispatch(mdm_module_1.profile.history.actions.setHistoryDiff(historyDiff_1));
+        }
+    }, [historySlice, historyMode, dispatch, entity]);
+    return historyDiff || defaultHistoryDiff;
+};
+exports.useHistoryDiff = useHistoryDiff;

package/cjs/components/history/hooks/useHistoryWithTotal.d.ts

@@ -7,11 +7,12 @@ declare type Props = {
     max?: number;
     offset?: number;
     order?: string;
-    filter?: any;
+    filter?: string;
 };
-export declare const useHistoryWithTotal: ({ entityUri, enabled, historicUris, ...options }: Props) => {
+export declare const useHistoryWithTotal: ({ entityUri, enabled, historicUris, filter, ...options }: Props) => {
     isLoading: boolean;
     historyWithTotal: HistoryWithTotal;
     loadMore: (offset: number) => void;
+    loadData: () => void;
 };
 export {};

package/cjs/components/history/hooks/useHistoryWithTotal.js

@@ -32,7 +32,7 @@ var react_1 = require("react");
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var hooks_1 = require("../../../hooks");
 var useHistoryWithTotal = function (_a) {
-    var entityUri = _a.entityUri, _b = _a.enabled, enabled = _b === void 0 ? true : _b, historicUris = _a.historicUris, options = __rest(_a, ["entityUri", "enabled", "historicUris"]);
+    var entityUri = _a.entityUri, _b = _a.enabled, enabled = _b === void 0 ? true : _b, historicUris = _a.historicUris, filter = _a.filter, options = __rest(_a, ["entityUri", "enabled", "historicUris", "filter"]);
     var _c = react_1.useState(null), historyWithTotal = _c[0], setHistoryWithTotal = _c[1];
     var _d = react_1.useState(false), isLoading = _d[0], setIsLoading = _d[1];
     var safePromise = hooks_1.useSafePromise();
@@ -43,7 +43,7 @@ var useHistoryWithTotal = function (_a) {
     var loadData = react_1.useCallback(function () {
         if (entityUri && historicUris) {
             setIsLoading(true);
-            safePromise(mdm_sdk_1.getHistoryWithTotal(__assign({ entityUri: entityUri, historicUris: historicUris }, options)))
+            safePromise(mdm_sdk_1.getHistoryWithTotal(__assign({ entityUri: entityUri, historicUris: historicUris, filter: filter }, options)))
                 .then(function (results) {
                 setHistoryWithTotal(results);
             })
@@ -55,11 +55,11 @@ var useHistoryWithTotal = function (_a) {
         else {
             setHistoryWithTotal(null);
         }
-    }, [entityUri, historicUris]);
+    }, [entityUri, historicUris, filter]);
     var loadMore = react_1.useCallback(function (offset) {
         if (entityUri && historicUris) {
             setIsLoading(true);
-            safePromise(mdm_sdk_1.getHistoryWithTotal(__assign(__assign({ entityUri: entityUri, historicUris: historicUris }, options), { offset: offset })))
+            safePromise(mdm_sdk_1.getHistoryWithTotal(__assign(__assign({ entityUri: entityUri, historicUris: historicUris, filter: filter }, options), { offset: offset })))
                 .then(function (results) {
                 setHistoryWithTotal(function (prev) { return (__assign(__assign({}, prev), { changes: __spreadArray(__spreadArray([], prev === null || prev === void 0 ? void 0 : prev.changes), results.changes) })); });
             })
@@ -68,12 +68,12 @@ var useHistoryWithTotal = function (_a) {
                 setIsLoading(false);
             });
         }
-    }, [entityUri, historicUris]);
+    }, [entityUri, historicUris, filter]);
     react_1.useEffect(function () {
         if (enabled) {
             loadData();
         }
     }, [loadData, enabled]);
-    return { isLoading: isLoading, historyWithTotal: historyWithTotal, loadMore: loadMore };
+    return { isLoading: isLoading, historyWithTotal: historyWithTotal, loadMore: loadMore, loadData: loadData };
 };
 exports.useHistoryWithTotal = useHistoryWithTotal;

package/cjs/components/history/index.d.ts

@@ -2,6 +2,7 @@ export { useHistoricUris } from './hooks/useHistoricUris';
 export { useHistoryWithTotal } from './hooks/useHistoryWithTotal';
 export { useHistorySlice } from './hooks/useHistorySlice';
 export { useHistory } from './hooks/useHistory';
+export { useHistoryDiff } from './hooks/useHistoryDiff';
 export { default as HistoryView } from './HistoryView/HistoryView';
 export { default as HistoryHeader } from './HistoryHeader/HistoryHeader';
 export { default as ProfileBandHistory } from './ProfileBandHistory/ProfileBandHistory';

package/cjs/components/history/index.js

@@ -13,7 +13,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ProfileBandHistory = exports.HistoryHeader = exports.HistoryView = exports.useHistory = exports.useHistorySlice = exports.useHistoryWithTotal = exports.useHistoricUris = void 0;
+exports.ProfileBandHistory = exports.HistoryHeader = exports.HistoryView = exports.useHistoryDiff = exports.useHistory = exports.useHistorySlice = exports.useHistoryWithTotal = exports.useHistoricUris = void 0;
 var useHistoricUris_1 = require("./hooks/useHistoricUris");
 Object.defineProperty(exports, "useHistoricUris", { enumerable: true, get: function () { return useHistoricUris_1.useHistoricUris; } });
 var useHistoryWithTotal_1 = require("./hooks/useHistoryWithTotal");
@@ -22,6 +22,8 @@ var useHistorySlice_1 = require("./hooks/useHistorySlice");
 Object.defineProperty(exports, "useHistorySlice", { enumerable: true, get: function () { return useHistorySlice_1.useHistorySlice; } });
 var useHistory_1 = require("./hooks/useHistory");
 Object.defineProperty(exports, "useHistory", { enumerable: true, get: function () { return useHistory_1.useHistory; } });
+var useHistoryDiff_1 = require("./hooks/useHistoryDiff");
+Object.defineProperty(exports, "useHistoryDiff", { enumerable: true, get: function () { return useHistoryDiff_1.useHistoryDiff; } });
 var HistoryView_1 = require("./HistoryView/HistoryView");
 Object.defineProperty(exports, "HistoryView", { enumerable: true, get: function () { return __importDefault(HistoryView_1).default; } });
 var HistoryHeader_1 = require("./HistoryHeader/HistoryHeader");

package/cjs/components/history/utils/filters.d.ts

@@ -0,0 +1,3 @@
+import { DateRangeFilter } from '../../../types';
+export declare const buildHistoryFilterString: any;
+export declare const isDateRangeValid: (value: DateRangeFilter) => boolean;

package/cjs/components/history/utils/filters.js

@@ -0,0 +1,67 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isDateRangeValid = exports.buildHistoryFilterString = void 0;
+var moment_1 = __importDefault(require("moment"));
+var ramda_1 = require("ramda");
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var HistoryFilter_1 = require("../types/HistoryFilter");
+var ActivityTypes_1 = require("../../activityLog/types/ActivityTypes");
+var types_1 = require("../../../types");
+var wrapInBrackets = function (str) { return "(" + str + ")"; };
+var multiValueFilter = function (filterClauseFn) { return ramda_1.pipe(ramda_1.map(filterClauseFn), ramda_1.join(' or ')); };
+var durationToTimestamp = function (period) {
+    var amount = period[0], unit = period[1];
+    return moment_1.default().subtract(amount, unit).valueOf();
+};
+var convertHistoryTypes = ramda_1.chain(ramda_1.cond([
+    [
+        ramda_1.equals(HistoryFilter_1.HistoryActivityType.MERGE),
+        function () { return [
+            ActivityTypes_1.ActivityTypes.ENTITIES_MERGED,
+            ActivityTypes_1.ActivityTypes.ENTITIES_MERGED_MANUALLY,
+            ActivityTypes_1.ActivityTypes.ENTITIES_MERGED_ON_THE_FLY
+        ]; }
+    ],
+    [ramda_1.equals(HistoryFilter_1.HistoryActivityType.UNMERGE), function () { return [ActivityTypes_1.ActivityTypes.ENTITIES_SPLITTED]; }],
+    [ramda_1.equals(HistoryFilter_1.HistoryActivityType.UPDATE), function () { return [ActivityTypes_1.ActivityTypes.ENTITY_CHANGED]; }]
+]));
+var buildActivityFilterClause = ramda_1.pipe(ramda_1.defaultTo([]), convertHistoryTypes, ramda_1.concat([ActivityTypes_1.ActivityTypes.ENTITY_CREATED, ActivityTypes_1.ActivityTypes.ENTITY_REMOVED, ActivityTypes_1.ActivityTypes.ENTITY_LOST_MERGE]), multiValueFilter(function (value) { return "equals(type, '" + value + "')"; }));
+var buildUserFilterClause = function (user) { return "equals(user, '" + mdm_sdk_1.escapeQueryValue(user) + "')"; };
+var buildAttributeFilterClause = function (attribute) { return "changes(" + mdm_sdk_1.escapeQueryValue(attribute.value) + ")"; };
+var buildDateRangeFilterClause = function (_a) {
+    var type = _a.type, period = _a.period;
+    switch (type) {
+        case types_1.DateRangeTypes.WITHIN: {
+            return "gte(timestamp, " + durationToTimestamp(period) + ")";
+        }
+        case types_1.DateRangeTypes.AGO: {
+            return "lte(timestamp, " + durationToTimestamp(period) + ")";
+        }
+        case types_1.DateRangeTypes.BETWEEN: {
+            var start = period[0], end = period[1];
+            return "gte(timestamp, " + start.valueOf() + ") and lte(timestamp, " + moment_1.default(end).endOf('date').valueOf() + ")";
+        }
+        default: {
+            return '';
+        }
+    }
+};
+exports.buildHistoryFilterString = ramda_1.pipe(ramda_1.defaultTo({}), ramda_1.reject(mdm_sdk_1.isEmptyValue), ramda_1.evolve({
+    users: multiValueFilter(buildUserFilterClause),
+    attributes: multiValueFilter(buildAttributeFilterClause),
+    dateRange: buildDateRangeFilterClause
+}), ramda_1.over(ramda_1.lensProp('activities'), buildActivityFilterClause), ramda_1.values, ramda_1.reject(mdm_sdk_1.isEmptyValue), ramda_1.append("not equals(user, 'collaboration-service')"), ramda_1.map(wrapInBrackets), ramda_1.join(' and '));
+var isDateRangeValid = function (value) {
+    if (value.type === types_1.DateRangeTypes.AGO || value.type === types_1.DateRangeTypes.WITHIN) {
+        var _a = value.period, amount = _a[0], unit = _a[1];
+        return ramda_1.type(amount) === 'Number' && ramda_1.type(unit) === 'String' && amount > 0;
+    }
+    else if (value.type === types_1.DateRangeTypes.BETWEEN) {
+        var _b = value.period, startDate = _b[0], endDate = _b[1];
+        return startDate instanceof Date && endDate instanceof Date;
+    }
+};
+exports.isDateRangeValid = isDateRangeValid;

package/cjs/contexts/HistoryAppearanceContext/index.js

@@ -7,6 +7,8 @@ exports.HistoryDiffContext = void 0;
 var react_1 = __importDefault(require("react"));
 exports.HistoryDiffContext = react_1.default.createContext({
     appearance: undefined,
-    attributes: undefined
+    attributes: undefined,
+    roles: undefined,
+    tags: undefined
 });
 exports.HistoryDiffContext.displayName = 'HistoryDiffContext';

package/esm/components/SideIconPanel/SideButtonsPanel.d.ts

@@ -3,11 +3,11 @@ declare type Props = {
     buttonsProps: {
         icon: ElementType;
         tooltipTitle: string;
-        id: string;
+        id: number;
     }[];
-    activeIndex: number;
+    activeIndexId: number;
     className?: string;
-    onButtonClick: (index: number) => void;
+    onButtonClick: (id: number) => void;
 };
 export declare const SideButtonsPanel: VFC<Props>;
 export {};

package/esm/components/SideIconPanel/SideButtonsPanel.js

@@ -25,11 +25,11 @@ import classnames from 'classnames';
 import { SmallIconButtonWithTooltip } from '../SmallIconButton';
 import { useStyles } from './styles';
 export var SideButtonsPanel = function (_a) {
-    var buttonsProps = _a.buttonsProps, activeIndex = _a.activeIndex, className = _a.className, onButtonClick = _a.onButtonClick;
+    var buttonsProps = _a.buttonsProps, activeIndexId = _a.activeIndexId, className = _a.className, onButtonClick = _a.onButtonClick;
     var styles = useStyles();
-    return (React.createElement("div", { className: classnames(styles.container, className) }, buttonsProps.map(function (_a, index) {
+    return (React.createElement("div", { className: classnames(styles.container, className) }, buttonsProps.map(function (_a) {
         var _b;
         var id = _a.id, buttonProps = __rest(_a, ["id"]);
-        return (React.createElement(SmallIconButtonWithTooltip, __assign({}, buttonProps, { size: "S", key: id, className: classnames((_b = {}, _b[styles.active] = activeIndex === index, _b), styles.buttonWrapper), onClick: function () { return onButtonClick(index); }, "data-reltio-id": "reltio-profile-right-side-button-" + id })));
+        return (React.createElement(SmallIconButtonWithTooltip, __assign({}, buttonProps, { size: "S", key: id, className: classnames((_b = {}, _b[styles.active] = activeIndexId === id, _b), styles.buttonWrapper), onClick: function () { return onButtonClick(id); }, "data-reltio-id": "reltio-profile-right-side-button-" + id })));
     })));
 };

package/esm/components/SidePanel/SidePanelContentHeader/SidePanelContentHeader.d.ts

@@ -1,7 +1,8 @@
 import { ReactNode, VFC } from 'react';
 declare type HeaderProps = {
-    mainTitle: string;
-    secondTitle: string;
+    mainTitle?: string;
+    secondTitle?: string;
+    content?: ReactNode;
     rightContent?: ReactNode;
 };
 declare type Props = HeaderProps & {

package/esm/components/SidePanel/SidePanelContentHeader/SidePanelContentHeader.js

@@ -6,12 +6,13 @@ import Divider from '@material-ui/core/Divider';
 import i18n from 'ui-i18n';
 import { SmallIconButtonWithTooltip } from '../../SmallIconButton';
 export var SidePanelContentHeader = function (_a) {
-    var onClose = _a.onClose, mainTitle = _a.mainTitle, secondTitle = _a.secondTitle, rightContent = _a.rightContent;
+    var onClose = _a.onClose, mainTitle = _a.mainTitle, secondTitle = _a.secondTitle, content = _a.content, rightContent = _a.rightContent;
     var styles = useStyles();
     return (React.createElement("div", { className: styles.container },
         React.createElement(SmallIconButtonWithTooltip, { size: "S", icon: CloseIcon, onClick: onClose, className: styles.icon, tooltipTitle: i18n.text('Close') }),
-        React.createElement(Typography, { variant: "h6" }, mainTitle),
-        React.createElement(Divider, { orientation: "vertical", flexItem: true, className: styles.divider }),
-        React.createElement(Typography, { variant: "body1", color: "textSecondary", className: styles.secondTitle }, secondTitle),
-        rightContent));
+        content || (React.createElement(React.Fragment, null,
+            React.createElement(Typography, { variant: "h6" }, mainTitle),
+            React.createElement(Divider, { orientation: "vertical", flexItem: true, className: styles.divider }),
+            React.createElement(Typography, { variant: "body1", color: "textSecondary", className: styles.secondTitle }, secondTitle),
+            rightContent))));
 };

package/esm/components/attributes/AttributesView/index.js

@@ -2,7 +2,7 @@ import { connect } from 'react-redux';
 import mdm from '@reltio/mdm-module';
 import AttributesView from './AttributesView';
 var mapStateToProps = function (state, ownProps) { return ({
-    entity: ownProps.entity || mdm.selectors.getEntity(state),
+    entity: ownProps.entity || mdm.selectors.getEntityWithDiff(state),
     mode: ownProps.mode || mdm.selectors.getMode(state)
 }); };
 export { AttributesView };

package/esm/components/attributes/editMode/SimpleAttributeEditor/selectors/helpers/parents.js

@@ -24,11 +24,13 @@ export var getParents = function (state, valueUri, node) {
     });
     var modifiedEntities = mdmModule.selectors.getModifiedEntities(state);
     var entityUri = mdmModule.selectors.getEntityUri(state);
+    var connections = mdmModule.selectors.getAllRelationsToAddAndEdit(state);
     var ownParentNodesValues = filterRelatedParentValuesForDependentLookupValueUri({
         parentValues: parentNodesValues,
         valueUri: valueUri,
         entityUri: entityUri,
-        modifiedEntities: modifiedEntities
+        modifiedEntities: modifiedEntities,
+        connections: connections
     });
     var neededParentsAttributeTypes = node.parents.map(function (type) {
         var parentNode = mdmModule.selectors.getDependentLookupsStructureNode(state, type);

package/esm/components/history/HistoryFilterButton/HistoryFilterButton.js

@@ -11,12 +11,13 @@ var __assign = (this && this.__assign) || function () {
 };
 import React, { useState } from 'react';
 import i18n from 'ui-i18n';
-import { curry } from 'ramda';
+import { curry, dissoc } from 'ramda';
 import FilterListIcon from '@material-ui/icons/FilterList';
 import Button from '@material-ui/core/Button';
 import Popover from '@material-ui/core/Popover';
 import Typography from '@material-ui/core/Typography';
 import { SmallIconButton } from '../../SmallIconButton';
+import { isDateRangeValid } from '../utils/filters';
 import UserSelector from '../../UserSelector/UserSelector';
 import AttributeSelector from '../../AttributeSelector/AttributeSelector';
 import DateRangeSelector from '../DateRangeSelector/DateRangeSelector';
@@ -56,7 +57,12 @@ var HistoryFilterButton = function (_a) {
                 React.createElement(Button, { onClick: clearCurrentValue, className: styles.clearButton }, i18n.text('Clear all')),
                 React.createElement(Button, { onClick: closePopup }, i18n.text('Cancel')),
                 React.createElement(Button, { color: "primary", onClick: function () {
-                        onApplyFilter(currentValue);
+                        if (dateRange && isDateRangeValid(dateRange)) {
+                            onApplyFilter(currentValue);
+                        }
+                        else {
+                            onApplyFilter(dissoc('dateRange', currentValue));
+                        }
                         closePopup();
                     } }, i18n.text('Apply'))))));
 };

package/esm/components/history/HistoryTree/HistoryTree.js

@@ -10,12 +10,13 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import ReactResizeDetector from 'react-resize-detector';
 import i18n from 'ui-i18n';
 import { isNil } from 'ramda';
 import classnames from 'classnames';
-import { profile } from '@reltio/mdm-module';
+import { Mode } from '@reltio/mdm-sdk';
+import mdm, { profile } from '@reltio/mdm-module';
 import Button from '@material-ui/core/Button';
 import HistoryRow from '../HistoryRow/HistoryRow';
 import HistoryGraph from '../HistoryGraph/HistoryGraph';
@@ -26,6 +27,7 @@ var HistoryTree = function (_a) {
     var historyData = _a.historyData, isLoading = _a.isLoading, canLoadMore = _a.canLoadMore, onLoadMore = _a.onLoadMore, entityUri = _a.entityUri, historyEvent = _a.historyEvent, findPreviousChange = _a.findPreviousChange;
     var styles = useStyles();
     var dispatch = useDispatch();
+    var isEditableMode = useSelector(mdm.selectors.getIsEditableMode);
     var _c = useState({ historyLanes: {}, rows: [] }), graphData = _c[0], setGraphData = _c[1];
     var _d = useState(false), isScrollable = _d[0], setIsScrollable = _d[1];
     var _e = useState(-1), selectedIndex = _e[0], setSelectedIndex = _e[1];
@@ -54,6 +56,14 @@ var HistoryTree = function (_a) {
         setIsScrollable(scrollLeft < scrollWidth - clientWidth);
     };
     var handleHistoryRowClick = function (index, change, isSelected, isCurrent) {
+        if (isEditableMode) {
+            if (window.confirm(i18n.text('Are you sure you want to go in history mode? All your changes will be lost.'))) {
+                dispatch(profile.mode.actions.modeUpdated(Mode.Viewing));
+            }
+            else {
+                return;
+            }
+        }
         if ((isCurrent && !isSelected) || (!isCurrent && isSelected)) {
             dispatch(profile.history.actions.clearHistoryEvent());
             setSelectedIndex(0);

package/esm/components/history/hooks/useHistory.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { HistoryFilter } from '../types';
 declare type Props = {
     entityUri: string;
@@ -8,9 +7,10 @@ export declare const useHistory: ({ entityUri, enabled }: Props) => {
     isLoading: boolean;
     canLoadMore: boolean;
     onLoadMore: () => void;
+    onApplyFilter: (filter: HistoryFilter) => void;
     historicUris: string[];
     historyWithTotal: import("@reltio/mdm-sdk").HistoryWithTotal;
     historyFilter: HistoryFilter;
-    setHistoryFilter: import("react").Dispatch<import("react").SetStateAction<HistoryFilter>>;
+    reloadHistory: () => void;
 };
 export {};

package/esm/components/history/hooks/useHistory.js

@@ -1,11 +1,16 @@
 import { useState, useMemo, useCallback } from 'react';
 import { useHistoricUris } from './useHistoricUris';
 import { useHistoryWithTotal } from './useHistoryWithTotal';
+import { HistoryActivityType } from '../types';
+import { buildHistoryFilterString } from '../utils/filters';
 var MAX_HISTORY_ROWS = 32;
 export var useHistory = function (_a) {
     var entityUri = _a.entityUri, enabled = _a.enabled;
-    var _b = useState(null), historyFilter = _b[0], setHistoryFilter = _b[1];
+    var _b = useState({
+        activities: [HistoryActivityType.MERGE, HistoryActivityType.UNMERGE, HistoryActivityType.UPDATE]
+    }), historyFilter = _b[0], setHistoryFilter = _b[1];
     var _c = useState(0), historyPage = _c[0], setHistoryPage = _c[1];
+    var historyFilterString = useMemo(function () { return buildHistoryFilterString(historyFilter); }, [historyFilter]);
     var _d = useHistoricUris({
         entityUri: entityUri,
         enabled: enabled
@@ -13,29 +18,38 @@ export var useHistory = function (_a) {
     var _e = useHistoryWithTotal({
         entityUri: entityUri,
         enabled: enabled && !!historicUris,
+        filter: historyFilterString,
         historicUris: historicUris,
         max: MAX_HISTORY_ROWS,
         offset: historyPage * MAX_HISTORY_ROWS,
-        order: 'desc',
-        showAll: true
-    }), isHistoryLoading = _e.isLoading, historyWithTotal = _e.historyWithTotal, loadMore = _e.loadMore;
-    var canLoadMore = useMemo(function () { return (historyPage + 1) * MAX_HISTORY_ROWS <= (historyWithTotal === null || historyWithTotal === void 0 ? void 0 : historyWithTotal.total); }, [
+        order: 'desc'
+    }), isHistoryLoading = _e.isLoading, historyWithTotal = _e.historyWithTotal, loadMore = _e.loadMore, loadData = _e.loadData;
+    var canLoadMore = useMemo(function () { return (historyPage + 1) * MAX_HISTORY_ROWS < (historyWithTotal === null || historyWithTotal === void 0 ? void 0 : historyWithTotal.total); }, [
         historyWithTotal,
         historyPage
     ]);
+    var onApplyFilter = useCallback(function (filter) {
+        setHistoryPage(0);
+        setHistoryFilter(filter);
+    }, []);
     var onLoadMore = useCallback(function () {
         if (!canLoadMore)
             return;
         loadMore((historyPage + 1) * MAX_HISTORY_ROWS);
         setHistoryPage(historyPage + 1);
     }, [loadMore, historyPage, canLoadMore]);
+    var reloadHistory = useCallback(function () {
+        loadData();
+        setHistoryPage(0);
+    }, [loadData]);
     return {
         isLoading: isHistoryLoading || isHistoricUrisLoading,
         canLoadMore: canLoadMore,
         onLoadMore: onLoadMore,
+        onApplyFilter: onApplyFilter,
         historicUris: historicUris,
         historyWithTotal: historyWithTotal,
         historyFilter: historyFilter,
-        setHistoryFilter: setHistoryFilter
+        reloadHistory: reloadHistory
     };
 };

package/esm/components/history/hooks/useHistoryDiff.d.ts

@@ -0,0 +1,2 @@
+import { HistoryDiff } from '@reltio/mdm-sdk';
+export declare const useHistoryDiff: () => HistoryDiff;

package/esm/components/history/hooks/useHistoryDiff.js

@@ -0,0 +1,39 @@
+import { useEffect } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { evolve, map } from 'ramda';
+import { entity as History, wrapInArrayIfNeeded } from '@reltio/mdm-sdk';
+import mdmModule, { HistoryMode, profile } from '@reltio/mdm-module';
+var defaultHistoryDiff = {
+    appearance: {},
+    attributes: {},
+    roles: [],
+    tags: []
+};
+var fixRefEntity = evolve({
+    refEntity: wrapInArrayIfNeeded,
+    refRelation: wrapInArrayIfNeeded
+});
+var prepareHistorySlice = function (historySlice) {
+    if (historySlice) {
+        return evolve({
+            attributes: map(map(fixRefEntity))
+        })(historySlice);
+    }
+    return historySlice;
+};
+export var useHistoryDiff = function () {
+    var dispatch = useDispatch();
+    var historySlice = useSelector(mdmModule.selectors.getHistorySlice);
+    var historyDiff = useSelector(mdmModule.selectors.getHistoryDiff);
+    var historyMode = useSelector(mdmModule.selectors.getHistoryMode);
+    var entity = useSelector(mdmModule.selectors.getEntity);
+    useEffect(function () {
+        if (historySlice) {
+            var aEntity = historySlice.aEntity, bEntity = historySlice.bEntity;
+            var historyManager = History.HistoryManager.createHistoryManager(History.AttributesDiff);
+            var historyDiff_1 = historyManager.computeEntityHistoryDiff(prepareHistorySlice(historyMode === HistoryMode.Current ? entity : bEntity), prepareHistorySlice(aEntity));
+            dispatch(profile.history.actions.setHistoryDiff(historyDiff_1));
+        }
+    }, [historySlice, historyMode, dispatch, entity]);
+    return historyDiff || defaultHistoryDiff;
+};

package/esm/components/history/hooks/useHistoryWithTotal.d.ts

@@ -7,11 +7,12 @@ declare type Props = {
     max?: number;
     offset?: number;
     order?: string;
-    filter?: any;
+    filter?: string;
 };
-export declare const useHistoryWithTotal: ({ entityUri, enabled, historicUris, ...options }: Props) => {
+export declare const useHistoryWithTotal: ({ entityUri, enabled, historicUris, filter, ...options }: Props) => {
     isLoading: boolean;
     historyWithTotal: HistoryWithTotal;
     loadMore: (offset: number) => void;
+    loadData: () => void;
 };
 export {};

package/esm/components/history/hooks/useHistoryWithTotal.js

@@ -29,7 +29,7 @@ import { useCallback, useEffect, useState } from 'react';
 import { getHistoryWithTotal } from '@reltio/mdm-sdk';
 import { useSafePromise } from '../../../hooks';
 export var useHistoryWithTotal = function (_a) {
-    var entityUri = _a.entityUri, _b = _a.enabled, enabled = _b === void 0 ? true : _b, historicUris = _a.historicUris, options = __rest(_a, ["entityUri", "enabled", "historicUris"]);
+    var entityUri = _a.entityUri, _b = _a.enabled, enabled = _b === void 0 ? true : _b, historicUris = _a.historicUris, filter = _a.filter, options = __rest(_a, ["entityUri", "enabled", "historicUris", "filter"]);
     var _c = useState(null), historyWithTotal = _c[0], setHistoryWithTotal = _c[1];
     var _d = useState(false), isLoading = _d[0], setIsLoading = _d[1];
     var safePromise = useSafePromise();
@@ -40,7 +40,7 @@ export var useHistoryWithTotal = function (_a) {
     var loadData = useCallback(function () {
         if (entityUri && historicUris) {
             setIsLoading(true);
-            safePromise(getHistoryWithTotal(__assign({ entityUri: entityUri, historicUris: historicUris }, options)))
+            safePromise(getHistoryWithTotal(__assign({ entityUri: entityUri, historicUris: historicUris, filter: filter }, options)))
                 .then(function (results) {
                 setHistoryWithTotal(results);
             })
@@ -52,11 +52,11 @@ export var useHistoryWithTotal = function (_a) {
         else {
             setHistoryWithTotal(null);
         }
-    }, [entityUri, historicUris]);
+    }, [entityUri, historicUris, filter]);
     var loadMore = useCallback(function (offset) {
         if (entityUri && historicUris) {
             setIsLoading(true);
-            safePromise(getHistoryWithTotal(__assign(__assign({ entityUri: entityUri, historicUris: historicUris }, options), { offset: offset })))
+            safePromise(getHistoryWithTotal(__assign(__assign({ entityUri: entityUri, historicUris: historicUris, filter: filter }, options), { offset: offset })))
                 .then(function (results) {
                 setHistoryWithTotal(function (prev) { return (__assign(__assign({}, prev), { changes: __spreadArray(__spreadArray([], prev === null || prev === void 0 ? void 0 : prev.changes), results.changes) })); });
             })
@@ -65,11 +65,11 @@ export var useHistoryWithTotal = function (_a) {
                 setIsLoading(false);
             });
         }
-    }, [entityUri, historicUris]);
+    }, [entityUri, historicUris, filter]);
     useEffect(function () {
         if (enabled) {
             loadData();
         }
     }, [loadData, enabled]);
-    return { isLoading: isLoading, historyWithTotal: historyWithTotal, loadMore: loadMore };
+    return { isLoading: isLoading, historyWithTotal: historyWithTotal, loadMore: loadMore, loadData: loadData };
 };

package/esm/components/history/index.d.ts

@@ -2,6 +2,7 @@ export { useHistoricUris } from './hooks/useHistoricUris';
 export { useHistoryWithTotal } from './hooks/useHistoryWithTotal';
 export { useHistorySlice } from './hooks/useHistorySlice';
 export { useHistory } from './hooks/useHistory';
+export { useHistoryDiff } from './hooks/useHistoryDiff';
 export { default as HistoryView } from './HistoryView/HistoryView';
 export { default as HistoryHeader } from './HistoryHeader/HistoryHeader';
 export { default as ProfileBandHistory } from './ProfileBandHistory/ProfileBandHistory';

package/esm/components/history/index.js

@@ -2,6 +2,7 @@ export { useHistoricUris } from './hooks/useHistoricUris';
 export { useHistoryWithTotal } from './hooks/useHistoryWithTotal';
 export { useHistorySlice } from './hooks/useHistorySlice';
 export { useHistory } from './hooks/useHistory';
+export { useHistoryDiff } from './hooks/useHistoryDiff';
 export { default as HistoryView } from './HistoryView/HistoryView';
 export { default as HistoryHeader } from './HistoryHeader/HistoryHeader';
 export { default as ProfileBandHistory } from './ProfileBandHistory/ProfileBandHistory';

package/esm/components/history/utils/filters.d.ts

@@ -0,0 +1,3 @@
+import { DateRangeFilter } from '../../../types';
+export declare const buildHistoryFilterString: any;
+export declare const isDateRangeValid: (value: DateRangeFilter) => boolean;

package/esm/components/history/utils/filters.js

@@ -0,0 +1,60 @@
+import moment from 'moment';
+import { type, pipe, defaultTo, reject, map, join, cond, equals, append, concat, chain, evolve, values, over, lensProp } from 'ramda';
+import { isEmptyValue, escapeQueryValue } from '@reltio/mdm-sdk';
+import { HistoryActivityType } from '../types/HistoryFilter';
+import { ActivityTypes } from '../../activityLog/types/ActivityTypes';
+import { DateRangeTypes } from '../../../types';
+var wrapInBrackets = function (str) { return "(" + str + ")"; };
+var multiValueFilter = function (filterClauseFn) { return pipe(map(filterClauseFn), join(' or ')); };
+var durationToTimestamp = function (period) {
+    var amount = period[0], unit = period[1];
+    return moment().subtract(amount, unit).valueOf();
+};
+var convertHistoryTypes = chain(cond([
+    [
+        equals(HistoryActivityType.MERGE),
+        function () { return [
+            ActivityTypes.ENTITIES_MERGED,
+            ActivityTypes.ENTITIES_MERGED_MANUALLY,
+            ActivityTypes.ENTITIES_MERGED_ON_THE_FLY
+        ]; }
+    ],
+    [equals(HistoryActivityType.UNMERGE), function () { return [ActivityTypes.ENTITIES_SPLITTED]; }],
+    [equals(HistoryActivityType.UPDATE), function () { return [ActivityTypes.ENTITY_CHANGED]; }]
+]));
+var buildActivityFilterClause = pipe(defaultTo([]), convertHistoryTypes, concat([ActivityTypes.ENTITY_CREATED, ActivityTypes.ENTITY_REMOVED, ActivityTypes.ENTITY_LOST_MERGE]), multiValueFilter(function (value) { return "equals(type, '" + value + "')"; }));
+var buildUserFilterClause = function (user) { return "equals(user, '" + escapeQueryValue(user) + "')"; };
+var buildAttributeFilterClause = function (attribute) { return "changes(" + escapeQueryValue(attribute.value) + ")"; };
+var buildDateRangeFilterClause = function (_a) {
+    var type = _a.type, period = _a.period;
+    switch (type) {
+        case DateRangeTypes.WITHIN: {
+            return "gte(timestamp, " + durationToTimestamp(period) + ")";
+        }
+        case DateRangeTypes.AGO: {
+            return "lte(timestamp, " + durationToTimestamp(period) + ")";
+        }
+        case DateRangeTypes.BETWEEN: {
+            var start = period[0], end = period[1];
+            return "gte(timestamp, " + start.valueOf() + ") and lte(timestamp, " + moment(end).endOf('date').valueOf() + ")";
+        }
+        default: {
+            return '';
+        }
+    }
+};
+export var buildHistoryFilterString = pipe(defaultTo({}), reject(isEmptyValue), evolve({
+    users: multiValueFilter(buildUserFilterClause),
+    attributes: multiValueFilter(buildAttributeFilterClause),
+    dateRange: buildDateRangeFilterClause
+}), over(lensProp('activities'), buildActivityFilterClause), values, reject(isEmptyValue), append("not equals(user, 'collaboration-service')"), map(wrapInBrackets), join(' and '));
+export var isDateRangeValid = function (value) {
+    if (value.type === DateRangeTypes.AGO || value.type === DateRangeTypes.WITHIN) {
+        var _a = value.period, amount = _a[0], unit = _a[1];
+        return type(amount) === 'Number' && type(unit) === 'String' && amount > 0;
+    }
+    else if (value.type === DateRangeTypes.BETWEEN) {
+        var _b = value.period, startDate = _b[0], endDate = _b[1];
+        return startDate instanceof Date && endDate instanceof Date;
+    }
+};

package/esm/contexts/HistoryAppearanceContext/index.js

@@ -1,6 +1,8 @@
 import React from 'react';
 export var HistoryDiffContext = React.createContext({
     appearance: undefined,
-    attributes: undefined
+    attributes: undefined,
+    roles: undefined,
+    tags: undefined
 });
 HistoryDiffContext.displayName = 'HistoryDiffContext';

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@reltio/components",
-  "version": "1.4.914",
+  "version": "1.4.918",
   "license": "SEE LICENSE IN LICENSE FILE",
   "main": "./cjs/index.js",
   "module": "./esm/index.js",
   "dependencies": {
     "@date-io/moment": "^1.3.5",
     "@react-google-maps/api": "^2.7.0",
-    "@reltio/mdm-module": "^1.4.914",
-    "@reltio/mdm-sdk": "^1.4.914",
+    "@reltio/mdm-module": "^1.4.918",
+    "@reltio/mdm-sdk": "^1.4.918",
     "classnames": "^2.2.5",
     "d3-cloud": "^1.2.5",
     "d3-geo": "^2.0.1",