@reltio/components 1.4.2190 → 1.4.2191

package/cjs/features/workflow/ReviewDCRDialog/helpers/calculateDCRChanges.d.ts

@@ -0,0 +1,3 @@
+import { DCROperationTypes, DCRChanges, GroupedObjectsInfo, Metadata } from '@reltio/mdm-sdk';
+export type DCRChangeCounts = Partial<Record<DCROperationTypes, number>>;
+export declare const calculateDCRChanges: (metadata: Metadata, changes: DCRChanges, groupedObjects: GroupedObjectsInfo[]) => DCRChangeCounts;

package/cjs/features/workflow/ReviewDCRDialog/helpers/calculateDCRChanges.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.calculateDCRChanges = void 0;
+var merge_1 = require("../../AttributesChanges/helpers/merge");
+var calculateDCRChanges = function (metadata, changes, groupedObjects) {
+    var mergedChanges = groupedObjects.reduce(function (mergedChanges, object) {
+        var _a = (0, merge_1.mergeChanges)(metadata, changes, object.entity, object.relations), mergedEntityChanges = _a[0], mergedRelationsChanges = _a[1];
+        return mergedChanges.concat(mergedEntityChanges).concat(mergedRelationsChanges);
+    }, []);
+    var changesCounts = mergedChanges.reduce(function (changesCounts, _a) {
+        var operation = _a.operation;
+        if (operation) {
+            changesCounts[operation] = (changesCounts[operation] || 0) + 1;
+        }
+        return changesCounts;
+    }, {});
+    return changesCounts;
+};
+exports.calculateDCRChanges = calculateDCRChanges;

package/cjs/features/workflow/ReviewDCRDialog/helpers/calculateDCRChanges.test.d.ts

@@ -0,0 +1 @@
+export {};

package/cjs/features/workflow/ReviewDCRDialog/helpers/calculateDCRChanges.test.js

@@ -0,0 +1,124 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var calculateDCRChanges_1 = require("./calculateDCRChanges");
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+describe('calculateDCRChanges', function () {
+    var metadata = {
+        entityTypes: [
+            {
+                uri: 'configuration/entityTypes/HCP',
+                label: 'HCP',
+                attributes: [
+                    {
+                        label: 'Name',
+                        name: 'Name',
+                        type: 'String',
+                        uri: 'configuration/entityTypes/HCP/attributes/Name'
+                    },
+                    {
+                        label: 'City',
+                        name: 'City',
+                        type: 'String',
+                        uri: 'configuration/entityTypes/HCP/attributes/City'
+                    },
+                    {
+                        label: 'Tags',
+                        name: 'Tags',
+                        type: 'String',
+                        uri: 'configuration/entityTypes/HCP/attributes/Tags'
+                    }
+                ]
+            }
+        ]
+    };
+    var groupedObjects = [
+        {
+            entity: {
+                uri: 'entities/123',
+                label: 'Entity 123',
+                type: 'configuration/entityTypes/HCP',
+                isExist: true,
+                secondaryLabel: 'Test Secondary Label'
+            },
+            relations: []
+        }
+    ];
+    it('should count "added" changes correctly', function () {
+        var changes = {
+            'entities/123': [
+                {
+                    id: 'change1',
+                    type: mdm_sdk_1.DCRTypes.UPDATE_TAGS,
+                    oldValue: ['tag1', 'tag2'],
+                    newValue: ['tag1', 'tag2', 'tag3']
+                },
+                {
+                    id: 'change2',
+                    type: mdm_sdk_1.DCRTypes.UPDATE_ROLES,
+                    oldValue: ['role1'],
+                    newValue: ['role1', 'role2']
+                },
+                {
+                    id: 'change3',
+                    attributePath: 'Name',
+                    type: mdm_sdk_1.DCRTypes.INSERT_ATTRIBUTE,
+                    objectType: 'configuration/entityTypes/HCP',
+                    newValue: {
+                        value: {
+                            Name: [{ value: 'John' }]
+                        }
+                    }
+                }
+            ]
+        };
+        var result = (0, calculateDCRChanges_1.calculateDCRChanges)(metadata, changes, groupedObjects);
+        expect(result).toEqual({
+            added: 3
+        });
+    });
+    it('should count multiple change types correctly', function () {
+        var changes = {
+            'entities/123': [
+                {
+                    id: 'change1',
+                    type: mdm_sdk_1.DCRTypes.UPDATE_TAGS,
+                    oldValue: ['tag1'],
+                    newValue: ['tag1', 'tag2', 'tag3']
+                },
+                {
+                    id: 'change2',
+                    type: mdm_sdk_1.DCRTypes.UPDATE_ROLES,
+                    oldValue: ['role1', 'role2'],
+                    newValue: ['role1']
+                },
+                {
+                    id: 'change3',
+                    attributePath: 'City',
+                    type: mdm_sdk_1.DCRTypes.INSERT_ATTRIBUTE,
+                    objectType: 'configuration/entityTypes/HCP',
+                    newValue: { value: { City: [{ value: 'New York' }] } }
+                },
+                {
+                    id: 'change4',
+                    attributePath: 'Name/21vmKank',
+                    attributeType: 'configuration/entityTypes/HCP/attributes/Name',
+                    type: mdm_sdk_1.DCRTypes.UPDATE_ATTRIBUTE,
+                    objectType: 'configuration/entityTypes/HCP',
+                    oldValue: { value: 'John' },
+                    newValue: { value: 'Mike' }
+                }
+            ]
+        };
+        var result = (0, calculateDCRChanges_1.calculateDCRChanges)(metadata, changes, groupedObjects);
+        expect(result).toEqual({
+            added: 2,
+            deleted: 1,
+            edited: 1
+        });
+    });
+    it('should handle empty changes', function () {
+        var changes = {};
+        var result = (0, calculateDCRChanges_1.calculateDCRChanges)(metadata, changes, groupedObjects);
+        expect(result).toEqual({});
+    });
+});

package/cjs/features/workflow/ReviewDCRDialog/helpers/index.d.ts

@@ -0,0 +1 @@
+export { calculateDCRChanges, type DCRChangeCounts } from './calculateDCRChanges';

package/cjs/features/workflow/ReviewDCRDialog/helpers/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.calculateDCRChanges = void 0;
+var calculateDCRChanges_1 = require("./calculateDCRChanges");
+Object.defineProperty(exports, "calculateDCRChanges", { enumerable: true, get: function () { return calculateDCRChanges_1.calculateDCRChanges; } });

package/cjs/features/workflow/ReviewDCRDialog/index.d.ts

@@ -0,0 +1 @@
+export { ReviewDCRDialog } from './ReviewDCRDialog';

package/cjs/features/workflow/ReviewDCRDialog/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReviewDCRDialog = void 0;
+var ReviewDCRDialog_1 = require("./ReviewDCRDialog");
+Object.defineProperty(exports, "ReviewDCRDialog", { enumerable: true, get: function () { return ReviewDCRDialog_1.ReviewDCRDialog; } });

package/cjs/features/workflow/WorkflowActionButtons/WorkflowActionButtons.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { TaskAction } from '../types';
+type Props = {
+    workflowActions: TaskAction[];
+    actionRequestIsInProgress?: boolean;
+    preferredAction?: {
+        label: string;
+    };
+    comment?: string;
+};
+export declare const WorkflowActionButtons: ({ workflowActions: actions, actionRequestIsInProgress, preferredAction, comment }: Props) => React.JSX.Element;
+export {};

package/cjs/features/workflow/WorkflowActionButtons/WorkflowActionButtons.js

@@ -0,0 +1,57 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WorkflowActionButtons = void 0;
+var react_1 = __importStar(require("react"));
+var Button_1 = __importDefault(require("@mui/material/Button"));
+var ModeSwitcherSelect_1 = require("../../../ModeSwitcherSelect");
+var WorkflowActionButtons = function (_a) {
+    var actions = _a.workflowActions, actionRequestIsInProgress = _a.actionRequestIsInProgress, preferredAction = _a.preferredAction, _b = _a.comment, comment = _b === void 0 ? '' : _b;
+    var _c = (0, react_1.useState)(function () { var _a; return (preferredAction === null || preferredAction === void 0 ? void 0 : preferredAction.label) || ((_a = actions[0]) === null || _a === void 0 ? void 0 : _a.text); }), currentAction = _c[0], setCurrentAction = _c[1];
+    var buttonsGroup = (0, react_1.useMemo)(function () {
+        return actions.map(function (_a) {
+            var text = _a.text, onClick = _a.onClick;
+            return ({
+                label: text,
+                onClick: function () {
+                    setCurrentAction(text);
+                    onClick(comment);
+                },
+                value: text
+            });
+        });
+    }, [actions, comment]);
+    if (buttonsGroup.length === 0) {
+        return null;
+    }
+    if (buttonsGroup.length === 1) {
+        return (react_1.default.createElement(Button_1.default, { variant: "outlined", onClick: buttonsGroup[0].onClick, disabled: actionRequestIsInProgress, size: "small" }, buttonsGroup[0].label));
+    }
+    return (react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { buttonsGroup: buttonsGroup, value: currentAction, loading: actionRequestIsInProgress, disabled: actionRequestIsInProgress }));
+};
+exports.WorkflowActionButtons = WorkflowActionButtons;

package/cjs/features/workflow/WorkflowActionButtons/index.d.ts

@@ -0,0 +1 @@
+export { WorkflowActionButtons } from './WorkflowActionButtons';

package/cjs/features/workflow/WorkflowActionButtons/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WorkflowActionButtons = void 0;
+var WorkflowActionButtons_1 = require("./WorkflowActionButtons");
+Object.defineProperty(exports, "WorkflowActionButtons", { enumerable: true, get: function () { return WorkflowActionButtons_1.WorkflowActionButtons; } });

package/cjs/features/workflow/WorkflowComments/WorkflowComments.d.ts

@@ -8,6 +8,12 @@ type Props = {
     taskId: string;
     isTaskOpen: boolean;
     preferredAction?: WorkflowAction;
+    showActionButtons?: boolean;
+    alwaysExpanded?: boolean;
+    classes?: {
+        container?: string;
+        commentsContainer?: string;
+    };
 };
-export declare const WorkflowComments: ({ workflowActions: actions, actionRequestIsInProgress, processInstanceComments, taskId, isTaskOpen, preferredAction }: Props) => React.JSX.Element;
+export declare const WorkflowComments: ({ workflowActions: actions, actionRequestIsInProgress, processInstanceComments, taskId, isTaskOpen, preferredAction, showActionButtons, alwaysExpanded, classes }: Props) => React.JSX.Element;
 export {};

package/cjs/features/workflow/WorkflowComments/WorkflowComments.js

@@ -28,28 +28,26 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.WorkflowComments = void 0;
 var react_1 = __importStar(require("react"));
+var classnames_1 = __importDefault(require("classnames"));
 var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var Input_1 = __importDefault(require("@mui/material/Input"));
 var InputAdornment_1 = __importDefault(require("@mui/material/InputAdornment"));
 var Send_1 = __importDefault(require("@mui/icons-material/Send"));
-var Button_1 = __importDefault(require("@mui/material/Button"));
 var CollapsedComments_1 = require("./components/CollapsedComments");
 var ExpandedComments_1 = require("./components/ExpandedComments");
 var useWorkflowComments_1 = require("../hooks/useWorkflowComments");
 var SmallIconButton_1 = require("../../../SmallIconButton");
-var ModeSwitcherSelect_1 = require("../../../ModeSwitcherSelect");
-var styles_1 = require("./styles");
+var WorkflowActionButtons_1 = require("../WorkflowActionButtons");
+var WorkflowComments_module_css_1 = __importDefault(require("./WorkflowComments.module.css"));
 var WorkflowComments = function (_a) {
-    var actions = _a.workflowActions, actionRequestIsInProgress = _a.actionRequestIsInProgress, processInstanceComments = _a.processInstanceComments, taskId = _a.taskId, isTaskOpen = _a.isTaskOpen, preferredAction = _a.preferredAction;
-    var styles = (0, styles_1.useStyles)();
-    var _b = (0, react_1.useState)(false), expanded = _b[0], setExpanded = _b[1];
-    var _c = (0, react_1.useState)(''), comment = _c[0], setComment = _c[1];
-    var _d = (0, react_1.useState)(function () { var _a; return (preferredAction === null || preferredAction === void 0 ? void 0 : preferredAction.label) || ((_a = actions[0]) === null || _a === void 0 ? void 0 : _a.text); }), currentAction = _d[0], setCurrentAction = _d[1];
-    var _e = (0, useWorkflowComments_1.useWorkflowComments)({
+    var actions = _a.workflowActions, actionRequestIsInProgress = _a.actionRequestIsInProgress, processInstanceComments = _a.processInstanceComments, taskId = _a.taskId, isTaskOpen = _a.isTaskOpen, preferredAction = _a.preferredAction, _b = _a.showActionButtons, showActionButtons = _b === void 0 ? true : _b, _c = _a.alwaysExpanded, alwaysExpanded = _c === void 0 ? false : _c, classes = _a.classes;
+    var _d = (0, react_1.useState)(false), expanded = _d[0], setExpanded = _d[1];
+    var _e = (0, react_1.useState)(''), comment = _e[0], setComment = _e[1];
+    var _f = (0, useWorkflowComments_1.useWorkflowComments)({
         processInstanceComments: processInstanceComments,
         taskId: taskId,
         isOpen: isTaskOpen
-    }), comments = _e.comments, writeComment = _e.writeComment, readOnly = _e.readOnly;
+    }), comments = _f.comments, writeComment = _f.writeComment, readOnly = _f.readOnly;
     var sendComment = (0, react_1.useCallback)(function () {
         writeComment(comment);
         setComment('');
@@ -69,29 +67,15 @@ var WorkflowComments = function (_a) {
             e.preventDefault();
         }
     }, [comment, sendComment]);
-    var buttonsGroup = (0, react_1.useMemo)(function () {
-        return actions.map(function (_a) {
-            var text = _a.text, onClick = _a.onClick;
-            return ({
-                label: text,
-                onClick: function () {
-                    setCurrentAction(text);
-                    onClick(comment);
-                },
-                value: text
-            });
-        });
-    }, [actions, comment]);
-    return (react_1.default.createElement("div", { className: styles.container },
-        react_1.default.createElement("div", { className: styles.title },
+    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(WorkflowComments_module_css_1.default.container, classes === null || classes === void 0 ? void 0 : classes.container) },
+        react_1.default.createElement("div", { className: WorkflowComments_module_css_1.default.title },
             " ",
             ui_i18n_1.default.text('Comments'),
             " "),
-        react_1.default.createElement("div", { className: styles.commentsContainer }, expanded || comments.length < 3 ? (react_1.default.createElement(ExpandedComments_1.ExpandedComments, { comments: comments })) : (react_1.default.createElement(CollapsedComments_1.CollapsedComments, { onClick: function () { return setExpanded(true); }, comments: comments }))),
-        !readOnly && (react_1.default.createElement(Input_1.default, { endAdornment: react_1.default.createElement(InputAdornment_1.default, { position: "end", className: styles.sendButton },
-                react_1.default.createElement(SmallIconButton_1.SmallIconButton, { icon: Send_1.default, disabled: comment.length === 0, onClick: sendComment, "data-reltio-id": "send-button" })), classes: { root: styles.filledInputRoot }, placeholder: ui_i18n_1.default.text('Write a comment'), value: comment, onKeyPress: handleKeyPress, onChange: handleChange, disableUnderline: true, multiline: true })),
-        react_1.default.createElement("div", { className: styles.modeSwitcherWrapper },
-            buttonsGroup.length === 1 && (react_1.default.createElement(Button_1.default, { variant: "outlined", onClick: buttonsGroup[0].onClick, disabled: actionRequestIsInProgress }, buttonsGroup[0].label)),
-            buttonsGroup.length > 1 && (react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { buttonsGroup: buttonsGroup, value: currentAction, loading: actionRequestIsInProgress, disabled: actionRequestIsInProgress })))));
+        react_1.default.createElement("div", { className: (0, classnames_1.default)(WorkflowComments_module_css_1.default.commentsContainer, classes === null || classes === void 0 ? void 0 : classes.commentsContainer) }, expanded || alwaysExpanded || comments.length < 3 ? (react_1.default.createElement(ExpandedComments_1.ExpandedComments, { comments: comments })) : (react_1.default.createElement(CollapsedComments_1.CollapsedComments, { onClick: function () { return setExpanded(true); }, comments: comments }))),
+        !readOnly && (react_1.default.createElement(Input_1.default, { endAdornment: react_1.default.createElement(InputAdornment_1.default, { position: "end", className: WorkflowComments_module_css_1.default.sendButton },
+                react_1.default.createElement(SmallIconButton_1.SmallIconButton, { icon: Send_1.default, disabled: comment.length === 0, onClick: sendComment, "data-reltio-id": "send-button" })), classes: { root: WorkflowComments_module_css_1.default.filledInputRoot }, placeholder: ui_i18n_1.default.text('Write a comment'), value: comment, onKeyPress: handleKeyPress, onChange: handleChange, disableUnderline: true, multiline: true })),
+        showActionButtons && (react_1.default.createElement("div", { className: WorkflowComments_module_css_1.default.modeSwitcherWrapper },
+            react_1.default.createElement(WorkflowActionButtons_1.WorkflowActionButtons, { workflowActions: actions, actionRequestIsInProgress: actionRequestIsInProgress, preferredAction: preferredAction, comment: comment })))));
 };
 exports.WorkflowComments = WorkflowComments;

package/cjs/features/workflow/WorkflowComments/WorkflowComments.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"container":"WorkflowComments-container--zu4Un","commentsContainer":"WorkflowComments-commentsContainer--CHV0q","title":"WorkflowComments-title--a0FTZ","filledInputRoot":"WorkflowComments-filledInputRoot--q5WAu","focused":"WorkflowComments-focused--s-NQa","modeSwitcherWrapper":"WorkflowComments-modeSwitcherWrapper--b585U","sendButton":"WorkflowComments-sendButton--NjNcl"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.WorkflowComments-container--zu4Un{display:flex;flex-direction:column;padding:5px 0}.WorkflowComments-commentsContainer--CHV0q{max-height:300px;overflow-y:auto}.WorkflowComments-title--a0FTZ{color:rgba(0,0,0,.87);font-size:14px;margin:0 0 8px 5px}.WorkflowComments-filledInputRoot--q5WAu{background-color:rgba(0,0,0,.03);font-size:14px;margin:10px 17px 0 6px;min-height:40px;padding:10px 6px}.WorkflowComments-filledInputRoot--q5WAu.WorkflowComments-focused--s-NQa,.WorkflowComments-filledInputRoot--q5WAu:hover{background-color:rgba(0,0,0,.03)}.WorkflowComments-modeSwitcherWrapper--b585U{margin-left:auto;margin-right:16px;margin-top:8px}.WorkflowComments-sendButton--NjNcl{align-self:end;margin-bottom:10px}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/features/workflow/WorkflowTaskCard/components/DataChangeRequestTaskCard/DataChangeRequestTaskCard.js

@@ -1,23 +1,63 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataChangeRequestTaskCard = void 0;
-var react_1 = __importDefault(require("react"));
+var react_1 = __importStar(require("react"));
 var DcrTaskIcon_1 = __importDefault(require("../../../../../icons/DcrTaskIcon"));
+var MdmModuleContext_1 = require("../../../../../contexts/MdmModuleContext");
 var GenericWorkflowTaskCard_1 = require("../GenericWorkflowTaskCard");
 var AttributesChanges_1 = require("../../../AttributesChanges");
 var LineDecorator_1 = require("../../../LineDecorator");
 var useChangeRequest_1 = require("../../../hooks/useChangeRequest");
 var common_1 = require("../../../helpers/common");
+var ReviewDCRDialog_1 = require("../../../ReviewDCRDialog");
+var ReviewDCRButton_1 = require("../../../ReviewDCRButton");
 var DataChangeRequestTaskCard = function (_a) {
     var task = _a.task;
-    var objectURIs = task.objectURIs;
+    var reviewDCREnabled = (0, MdmModuleContext_1.useMdmReviewDCREnabled)();
+    var username = (0, MdmModuleContext_1.useMdmUsername)();
+    var _b = (0, react_1.useState)(false), isReviewDCRDialogOpen = _b[0], setIsReviewDCRDialogOpen = _b[1];
+    var objectURIs = task.objectURIs, assignee = task.assignee;
     var dcrUri = (0, common_1.getDCRUri)(objectURIs);
-    var _b = (0, useChangeRequest_1.useChangeRequest)(dcrUri), dcr = _b.dcr, groupedObjects = _b.groupedObjects;
-    return (react_1.default.createElement(GenericWorkflowTaskCard_1.GenericWorkflowTaskCard, { task: task, Icon: DcrTaskIcon_1.default }, dcr &&
-        groupedObjects.map(function (object, index) { return (react_1.default.createElement(LineDecorator_1.LineDecorator, { key: index, last: index === groupedObjects.length - 1, divider: true },
-            react_1.default.createElement(AttributesChanges_1.AttributesChanges, { entityInfo: object.entity, relationsInfo: object.relations, changes: dcr.changes, objectsInfo: dcr.objectsInfo, dcrUri: dcrUri }))); })));
+    var _c = (0, useChangeRequest_1.useChangeRequest)(dcrUri), dcr = _c.dcr, groupedObjects = _c.groupedObjects;
+    var handleReviewDCR = (0, react_1.useCallback)(function () {
+        setIsReviewDCRDialogOpen(true);
+    }, []);
+    var handleCloseReviewDCRDialog = (0, react_1.useCallback)(function () {
+        setIsReviewDCRDialogOpen(false);
+    }, []);
+    var showReviewDCRButton = reviewDCREnabled && assignee == username;
+    var showReviewDialog = isReviewDCRDialogOpen && (showReviewDCRButton || reviewDCREnabled);
+    var customActionsSlot = (0, react_1.useMemo)(function () { return showReviewDCRButton && react_1.default.createElement(ReviewDCRButton_1.ReviewDCRButton, { onClick: handleReviewDCR }); }, [showReviewDCRButton, handleReviewDCR]);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(GenericWorkflowTaskCard_1.GenericWorkflowTaskCard, { task: task, Icon: DcrTaskIcon_1.default, customActionsSlot: customActionsSlot }, dcr &&
+            groupedObjects.map(function (object, index) { return (react_1.default.createElement(LineDecorator_1.LineDecorator, { key: index, last: index === groupedObjects.length - 1, divider: true },
+                react_1.default.createElement(AttributesChanges_1.AttributesChanges, { entityInfo: object.entity, relationsInfo: object.relations, changes: dcr.changes, objectsInfo: dcr.objectsInfo, dcrUri: dcrUri }))); })),
+        showReviewDialog && (react_1.default.createElement(ReviewDCRDialog_1.ReviewDCRDialog, { open: isReviewDCRDialogOpen, onClose: handleCloseReviewDCRDialog, dcr: dcr, groupedObjects: groupedObjects, task: task }))));
 };
 exports.DataChangeRequestTaskCard = DataChangeRequestTaskCard;

package/cjs/features/workflow/WorkflowTaskCard/components/GenericWorkflowTaskCard/GenericWorkflowTaskCard.d.ts

@@ -5,6 +5,7 @@ type Props = {
     children?: React.ReactNode;
     actions?: React.ReactNode;
     Icon?: React.ElementType;
+    customActionsSlot?: React.ReactNode;
 };
-export declare const GenericWorkflowTaskCard: ({ task, children, actions, Icon }: Props) => React.JSX.Element;
+export declare const GenericWorkflowTaskCard: ({ task, children, actions, Icon, customActionsSlot }: Props) => React.JSX.Element;
 export {};

package/cjs/features/workflow/WorkflowTaskCard/components/GenericWorkflowTaskCard/GenericWorkflowTaskCard.js

@@ -44,14 +44,13 @@ var useWorkflowCheckPermission_1 = require("../../../hooks/useWorkflowCheckPermi
 var CollaborationIcon_1 = __importDefault(require("../../../../../icons/CollaborationIcon"));
 var useWorkflowActions_1 = require("../../../hooks/useWorkflowActions");
 var common_1 = require("../../../helpers/common");
-var styles_1 = require("./styles");
+var GenericWorkflowTaskCard_module_css_1 = __importDefault(require("./GenericWorkflowTaskCard.module.css"));
 var GenericWorkflowTaskCard = function (_a) {
     var _b;
-    var task = _a.task, children = _a.children, actions = _a.actions, Icon = _a.Icon;
+    var task = _a.task, children = _a.children, actions = _a.actions, Icon = _a.Icon, customActionsSlot = _a.customActionsSlot;
     var taskId = task.taskId, dueDate = task.dueDate, priority = task.priority, assignee = task.assignee, createdBy = task.createdBy, createTime = task.createTime, step = task.displayName, processDefinitionDisplayName = task.processDefinitionDisplayName, objectURIs = task.objectURIs, processInstanceComments = task.processInstanceComments, possibleActions = task.possibleActions, isTaskOpen = task.isOpen, preferredAction = task.preferredAction;
     var dcrId = (0, common_1.getDCRId)(objectURIs);
     var color = (0, useWorkflowColor_1.useWorkflowColor)({ processDefinitionDisplayName: processDefinitionDisplayName });
-    var styles = (0, styles_1.useStyles)({ color: color });
     var _c = (0, react_1.useState)(false), isExpanded = _c[0], setExpanded = _c[1];
     var checkWorkflowPermission = (0, useWorkflowCheckPermission_1.useWorkflowCheckPermission)();
     var canViewComments = checkWorkflowPermission('VIEW_PROCESS_INSTANCE_COMMENTS');
@@ -61,52 +60,54 @@ var GenericWorkflowTaskCard = function (_a) {
         assignee: assignee,
         isOpen: isTaskOpen
     }), workflowActions = _d.actions, actionRequestIsInProgress = _d.actionRequestIsInProgress;
-    return (react_1.default.createElement("div", { className: styles.card },
-        react_1.default.createElement("div", { className: (0, classnames_1.default)((_b = {}, _b[styles.withBackground] = isExpanded, _b)) },
-            react_1.default.createElement("div", { className: styles.lineWrapper },
-                react_1.default.createElement("div", { className: styles.line }),
-                Icon && react_1.default.createElement(Icon, { className: styles.icon }),
+    return (react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.card },
+        react_1.default.createElement("div", { className: (0, classnames_1.default)((_b = {}, _b[GenericWorkflowTaskCard_module_css_1.default.withBackground] = isExpanded, _b)) },
+            react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.lineWrapper, style: { '--workflow-color': color } },
+                react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.line }),
+                Icon && react_1.default.createElement(Icon, { className: GenericWorkflowTaskCard_module_css_1.default.icon }),
                 react_1.default.createElement(LineDecorator_1.LineDecorator, { plain: true, first: true, transparent: !isExpanded },
-                    react_1.default.createElement("div", { className: styles.mainInfo },
-                        react_1.default.createElement("div", { className: styles.title },
-                            react_1.default.createElement("div", { className: (0, classnames_1.default)(styles.caption, styles.flex) }, ui_i18n_1.default.text(processDefinitionDisplayName)),
-                            react_1.default.createElement(Flag_1.default, { className: styles.flag }),
+                    react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.mainInfo },
+                        react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.title },
+                            react_1.default.createElement("div", { className: (0, classnames_1.default)(GenericWorkflowTaskCard_module_css_1.default.caption, GenericWorkflowTaskCard_module_css_1.default.flex) }, ui_i18n_1.default.text(processDefinitionDisplayName)),
+                            react_1.default.createElement(Flag_1.default, { className: GenericWorkflowTaskCard_module_css_1.default.flag }),
                             react_1.default.createElement(Tooltip_1.default, { title: ui_i18n_1.default.text('Due date') },
-                                react_1.default.createElement("span", { className: styles.date }, ui_i18n_1.default.date(dueDate, 'L'))),
+                                react_1.default.createElement("span", { className: GenericWorkflowTaskCard_module_css_1.default.date }, ui_i18n_1.default.date(dueDate, 'L'))),
                             react_1.default.createElement(CollapseButton_1.CollapseButton, { isOpen: isExpanded, size: "L", onClick: function () {
                                     setExpanded(!isExpanded);
                                 } })),
-                        react_1.default.createElement("div", { className: styles.infoBlock, "data-reltio-id": "info-block" },
-                            react_1.default.createElement("div", { className: styles.flex },
-                                dcrId && (react_1.default.createElement("div", { className: styles.info },
+                        react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.infoBlock, "data-reltio-id": "info-block" },
+                            react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.flex },
+                                dcrId && (react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.info },
                                     ui_i18n_1.default.text('DCR ID'),
                                     ': ',
-                                    react_1.default.createElement("span", { className: styles.infoValue }, dcrId))),
-                                react_1.default.createElement("div", { className: styles.info },
+                                    react_1.default.createElement("span", { className: GenericWorkflowTaskCard_module_css_1.default.infoValue }, dcrId))),
+                                react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.info },
                                     ui_i18n_1.default.text('Created by'),
                                     ': ',
-                                    react_1.default.createElement("span", { className: styles.infoValue }, createdBy),
+                                    react_1.default.createElement("span", { className: GenericWorkflowTaskCard_module_css_1.default.infoValue }, createdBy),
                                     " ",
                                     ui_i18n_1.default.text('on'),
                                     ' ',
-                                    react_1.default.createElement("span", { className: styles.infoValue }, ui_i18n_1.default.date(createTime, 'L'))),
-                                react_1.default.createElement("div", { className: styles.info },
+                                    react_1.default.createElement("span", { className: GenericWorkflowTaskCard_module_css_1.default.infoValue }, ui_i18n_1.default.date(createTime, 'L'))),
+                                react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.info },
                                     ui_i18n_1.default.text('Step'),
                                     ': ',
-                                    react_1.default.createElement("span", { className: styles.infoValue }, step)),
-                                canViewComments && (processInstanceComments === null || processInstanceComments === void 0 ? void 0 : processInstanceComments.length) > 0 && (react_1.default.createElement("div", { className: styles.commentsInfo },
-                                    react_1.default.createElement(CollaborationIcon_1.default, { className: styles.commentsIcon }),
-                                    react_1.default.createElement("div", { className: styles.infoValue }, processInstanceComments.length)))),
+                                    react_1.default.createElement("span", { className: GenericWorkflowTaskCard_module_css_1.default.infoValue }, step)),
+                                react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.bottomInfo },
+                                    canViewComments && (processInstanceComments === null || processInstanceComments === void 0 ? void 0 : processInstanceComments.length) > 0 && (react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.commentsInfo },
+                                        react_1.default.createElement(CollaborationIcon_1.default, { className: GenericWorkflowTaskCard_module_css_1.default.commentsIcon }),
+                                        react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.infoValue }, processInstanceComments.length))),
+                                    customActionsSlot && (react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.customActionsSlot }, customActionsSlot)))),
                             actions || (react_1.default.createElement(TaskActions_1.TaskActions, { actions: workflowActions, isInProgress: actionRequestIsInProgress })))))),
             isExpanded && (react_1.default.createElement(LineDecorator_1.LineDecorator, { plain: true },
-                react_1.default.createElement("div", { className: styles.controlsBox },
-                    react_1.default.createElement("div", { className: styles.controlsInRow },
+                react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.controlsBox },
+                    react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.controlsInRow },
                         react_1.default.createElement(DueDateField_1.DueDateField, { taskId: taskId, dueDate: dueDate, isTaskOpen: isTaskOpen }),
-                        react_1.default.createElement(PrioritySelector_1.PrioritySelector, { taskId: taskId, priority: priority, className: styles.priority, isTaskOpen: isTaskOpen })),
+                        react_1.default.createElement(PrioritySelector_1.PrioritySelector, { taskId: taskId, priority: priority, className: GenericWorkflowTaskCard_module_css_1.default.priority, isTaskOpen: isTaskOpen })),
                     react_1.default.createElement(AssigneeSelector_1.AssigneeSelector, { taskId: taskId, assignee: assignee, isTaskOpen: isTaskOpen }))))),
         isExpanded && (react_1.default.createElement(react_1.default.Fragment, null,
             children,
-            canViewComments && (react_1.default.createElement("div", { className: styles.comments },
+            canViewComments && (react_1.default.createElement("div", { className: GenericWorkflowTaskCard_module_css_1.default.comments },
                 react_1.default.createElement(WorkflowComments_1.WorkflowComments, { workflowActions: workflowActions, actionRequestIsInProgress: actionRequestIsInProgress, preferredAction: preferredAction, taskId: taskId, processInstanceComments: processInstanceComments, isTaskOpen: isTaskOpen })))))));
 };
 exports.GenericWorkflowTaskCard = GenericWorkflowTaskCard;

package/cjs/features/workflow/WorkflowTaskCard/components/GenericWorkflowTaskCard/GenericWorkflowTaskCard.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"card":"GenericWorkflowTaskCard-card--EMo-i","withBackground":"GenericWorkflowTaskCard-withBackground--Y--db","lineWrapper":"GenericWorkflowTaskCard-lineWrapper--15MN6","icon":"GenericWorkflowTaskCard-icon--eoHOp","line":"GenericWorkflowTaskCard-line--Z1Emv","info":"GenericWorkflowTaskCard-info--2OyKu","bottomInfo":"GenericWorkflowTaskCard-bottomInfo--4bsc4","commentsInfo":"GenericWorkflowTaskCard-commentsInfo--Q6M07","commentsIcon":"GenericWorkflowTaskCard-commentsIcon--crUiN","infoValue":"GenericWorkflowTaskCard-infoValue---gkaX","infoBlock":"GenericWorkflowTaskCard-infoBlock--VyI2O","header":"GenericWorkflowTaskCard-header--bN0nh","flex":"GenericWorkflowTaskCard-flex--5oWde","caption":"GenericWorkflowTaskCard-caption--vxnNJ","title":"GenericWorkflowTaskCard-title--zyCft","flag":"GenericWorkflowTaskCard-flag--dfydb","date":"GenericWorkflowTaskCard-date--MHd-G","mainInfo":"GenericWorkflowTaskCard-mainInfo--l5b9R","controlsBox":"GenericWorkflowTaskCard-controlsBox--ZHDhQ","controlsInRow":"GenericWorkflowTaskCard-controlsInRow--c48Nv","priority":"GenericWorkflowTaskCard-priority--xnnl9","comments":"GenericWorkflowTaskCard-comments--OG-db","customActionsSlot":"GenericWorkflowTaskCard-customActionsSlot--J-mXk"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.GenericWorkflowTaskCard-card--EMo-i{border-bottom:1px solid rgba(0,0,0,.06)}.GenericWorkflowTaskCard-withBackground--Y--db{background-color:rgba(0,0,0,.03)}.GenericWorkflowTaskCard-lineWrapper--15MN6{position:relative}.GenericWorkflowTaskCard-icon--eoHOp{height:32px;left:16px;position:absolute;top:8px;width:32px;z-index:1}.GenericWorkflowTaskCard-line--Z1Emv{border-left:3px solid var(--workflow-color);bottom:0;left:0;position:absolute;top:0}.GenericWorkflowTaskCard-info--2OyKu{color:rgba(0,0,0,.54);font-size:13px;word-wrap:break-word;line-height:15px}.GenericWorkflowTaskCard-bottomInfo--4bsc4{align-items:flex-start;display:flex}.GenericWorkflowTaskCard-commentsInfo--Q6M07{align-items:center;display:flex;margin-bottom:-4px;margin-top:7px}.GenericWorkflowTaskCard-commentsIcon--crUiN{height:11px;margin-left:2px;margin-right:6px;margin-top:-2px;width:11px}.GenericWorkflowTaskCard-infoValue---gkaX{color:rgba(0,0,0,.87)}.GenericWorkflowTaskCard-infoBlock--VyI2O{display:flex;flex-direction:row;margin-bottom:5px}.GenericWorkflowTaskCard-header--bN0nh{display:flex;flex-direction:row;padding-bottom:12px}.GenericWorkflowTaskCard-flex--5oWde{flex:1}.GenericWorkflowTaskCard-caption--vxnNJ{color:rgba(0,0,0,.87);font-size:16px}.GenericWorkflowTaskCard-title--zyCft{align-items:center;display:flex;flex-direction:row;margin-bottom:-4px}.GenericWorkflowTaskCard-flag--dfydb{height:13px;width:13px;stroke:#000;fill:none;margin:2px 5px 0}.GenericWorkflowTaskCard-date--MHd-G{color:rgba(0,0,0,.87);font-size:13px}.GenericWorkflowTaskCard-mainInfo--l5b9R{display:flex;flex:1;flex-direction:column}.GenericWorkflowTaskCard-controlsBox--ZHDhQ{margin-bottom:12px;margin-right:16px;margin-top:13px}.GenericWorkflowTaskCard-controlsInRow--c48Nv{align-items:center;display:flex;flex-direction:row;justify-content:space-between;margin-bottom:20px}.GenericWorkflowTaskCard-priority--xnnl9{width:162px}.GenericWorkflowTaskCard-comments--OG-db{margin-left:11px}.GenericWorkflowTaskCard-customActionsSlot--J-mXk{display:flex;flex-grow:1;justify-content:flex-end;margin-right:-30px}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/features/workflow/WorkflowTaskCard/components/GenericWorkflowTaskCard/GenericWorkflowTaskCard.spec.js

@@ -76,6 +76,7 @@ var CommentDialogContext_1 = require("../../../../../contexts/CommentDialogConte
 var ErrorPopup_1 = require("../../../../../ErrorPopup");
 var task_test_data_1 = require("./task.test-data");
 var GenericWorkflowTaskCard_1 = require("./GenericWorkflowTaskCard");
+var ReviewDCRButton_1 = require("../../../ReviewDCRButton");
 jest.mock('@reltio/mdm-sdk', function () { return (__assign(__assign({}, jest.requireActual('@reltio/mdm-sdk')), { runTaskAction: jest.fn().mockReturnValue(Promise.resolve()), getAssigneeForTask: jest.fn().mockResolvedValue({ data: ['assignee1', 'assignee2'] }), addCommentForTask: jest.fn().mockResolvedValue({ status: 'success' }), getTaskById: jest.fn() })); });
 var onActionSuccess = jest.fn();
 var workflowTaskContextValue = { onActionSuccess: onActionSuccess };
@@ -107,14 +108,14 @@ var defaultMdmValues = {
 var errorSet = jest.fn();
 var defaultTask = (0, task_test_data_1.getDefaultTask)();
 var setUp = function (_a) {
-    var _b = _a === void 0 ? {} : _a, _c = _b.mdmValues, mdmValues = _c === void 0 ? defaultMdmValues : _c, _d = _b.task, task = _d === void 0 ? defaultTask : _d;
+    var _b = _a === void 0 ? {} : _a, _c = _b.mdmValues, mdmValues = _c === void 0 ? defaultMdmValues : _c, _d = _b.task, task = _d === void 0 ? defaultTask : _d, customActionsSlot = _b.customActionsSlot;
     var user = user_event_1.default.setup();
     return __assign(__assign({}, (0, react_2.render)(react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: mdmValues, actions: { errorSet: errorSet } },
         react_1.default.createElement(styles_2.ThemeProvider, { theme: (0, styles_1.createTheme)(constants_1.theme) },
             react_1.default.createElement(LocalizationProvider_1.LocalizationProvider, { dateAdapter: AdapterMoment_1.AdapterMoment },
                 react_1.default.createElement(CommentDialogContext_1.CommentDialogProvider, null,
                     react_1.default.createElement(WorkflowTasksContext_1.WorkflowTasksContext.Provider, { value: workflowTaskContextValue },
-                        react_1.default.createElement(GenericWorkflowTaskCard_1.GenericWorkflowTaskCard, { task: task },
+                        react_1.default.createElement(GenericWorkflowTaskCard_1.GenericWorkflowTaskCard, { task: task, customActionsSlot: customActionsSlot },
                             react_1.default.createElement("div", { className: "someChildren" }, "some children")),
                         react_1.default.createElement(ErrorPopup_1.ErrorPopup, { showErrorFromStore: true })))))))), { user: user });
 };
@@ -456,6 +457,23 @@ describe('GenericWorkflowTaskCard tests', function () {
             }
         });
     }); });
+    it('should render custom actions slot if it is provided', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var openReviewDialog, user, reviewDCRButton;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    openReviewDialog = jest.fn();
+                    user = setUp({ customActionsSlot: react_1.default.createElement(ReviewDCRButton_1.ReviewDCRButton, { onClick: openReviewDialog }) }).user;
+                    reviewDCRButton = react_2.screen.getByRole('button', { name: 'Review DCR' });
+                    expect(reviewDCRButton).toBeInTheDocument();
+                    return [4 /*yield*/, user.click(reviewDCRButton)];
+                case 1:
+                    _a.sent();
+                    expect(openReviewDialog).toHaveBeenCalled();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
     describe('Required comments', function () {
         it('should show comment dialog when user runs action and comment is required', function () { return __awaiter(void 0, void 0, void 0, function () {
             var task, user, dialog, comment, commentInput;