import React, { useMemo } from 'react';
import classnames from 'classnames';
import { isNil } from 'ramda';
import i18n from 'ui-i18n';
import ReplayIcon from '@mui/icons-material/Replay';
import Button from '@mui/material/Button';
import { DCROperationTypes, EntityAttrTypes, getAttributeValue, getEntityType } from '@reltio/mdm-sdk';
import { useMdmEntity, useMdmMetadata } from '../../../../../contexts/MdmModuleContext';
import { DataTypeValue } from '../../../../../DataTypeValue';
import { SmallIconButton } from '../../../../../SmallIconButton';
import { getDataTypeDefinition, prepareRolesOrTagsValue } from '../../../helpers/common';
import { checkCanInitiateChangeRequest } from '../../helpers/helpers';
import { OperationChip } from '../../../OperationChip';
import { RelationEntityLink } from '../../../RelationEntityLink';
import { useChangeRequestEditor } from '../../hooks/useChangeRequestEditor';
import { ChangeItemLabel } from '../ChangeItemLabel';
import { DCRValueEditor } from '../DCRValueEditor';
import { StatusChips } from '../StatusChips';
import styles from './ChangeItemEditor.module.css';
export var ChangeItemEditor = function (_a) {
    var _b, _c, _d;
    var change = _a.change, _e = _a.editable, editable = _e === void 0 ? true : _e, classes = _a.classes;
    var metadata = useMdmMetadata();
    var _f = useChangeRequestEditor({ change: change }), handleChange = _f.handleChange, handleReject = _f.handleReject, handleRevert = _f.handleRevert, lineData = _f.lineData, isLineRejected = _f.isLineRejected, isParentLineRejected = _f.isParentLineRejected, isUpdated = _f.isUpdated, hasChangeId = _f.hasChangeId, isSubAttributeOfDeletedAttribute = _f.isSubAttributeOfDeletedAttribute;
    var entity = useMdmEntity();
    var entityType = getEntityType(metadata, entity === null || entity === void 0 ? void 0 : entity.type);
    var isUpdateOperation = change.operation === DCROperationTypes.EDITED;
    var isAddOperation = change.operation === DCROperationTypes.ADDED;
    var oldValue = getAttributeValue(change.oldValue);
    var currentNewValue = !isNil(lineData === null || lineData === void 0 ? void 0 : lineData.value) && !isParentLineRejected ? lineData.value : change.newValue;
    var newValue = getAttributeValue(currentNewValue);
    var hasNewValue = !isNil(newValue);
    var dataTypeDefinition = useMemo(function () {
        return change.attributeType && getDataTypeDefinition(change.attributeType, newValue || oldValue);
    }, [change.attributeType, newValue, oldValue]);
    var isRolesOrTags = ((_b = change === null || change === void 0 ? void 0 : change.attributeType) === null || _b === void 0 ? void 0 : _b.uri) === EntityAttrTypes.roles.uri ||
        ((_c = change === null || change === void 0 ? void 0 : change.attributeType) === null || _c === void 0 ? void 0 : _c.uri) === EntityAttrTypes.tags.uri;
    var canEdit = checkCanInitiateChangeRequest(metadata, entityType, change);
    var shouldShowValueEditor = (isUpdateOperation || isAddOperation) && editable && canEdit;
    var preparedValue = useMemo(function () {
        return isRolesOrTags
            ? prepareRolesOrTagsValue(metadata, newValue, change.attributeType.uri)
            : newValue;
    }, [isRolesOrTags, metadata, newValue, (_d = change.attributeType) === null || _d === void 0 ? void 0 : _d.uri]);
    var showUndoButton = (isUpdated || isLineRejected) && !isParentLineRejected;
    var showRejectButton = canEdit &&
        !isLineRejected &&
        !isUpdated &&
        !isParentLineRejected &&
        hasChangeId &&
        !isSubAttributeOfDeletedAttribute &&
        !(change.isReferenceSubAttribute && !editable);
    var showStatusChips = !isParentLineRejected;
    var isRejected = isLineRejected || isParentLineRejected;
    return (React.createElement("div", { className: styles.attributeRow, "data-reltio-id": "change-item-editor" },
        React.createElement(ChangeItemLabel, { change: change, className: styles.labelColumn, showLabel: !isUpdateOperation }),
        React.createElement("div", { className: styles.valueColumn },
            React.createElement(RelationEntityLink, { attributeOrRelationType: change.attributeType || change.relationType, attributeValue: change.attributeValue, className: styles.relationEntityLink }),
            shouldShowValueEditor ? (React.createElement(DCRValueEditor, { attributeType: change.attributeType, value: currentNewValue, onChange: handleChange, disabled: !editable || isRejected })) : (hasNewValue && (React.createElement("div", { className: styles.value },
                React.createElement(DataTypeValue, { value: preparedValue, dataTypeDefinition: dataTypeDefinition }))))),
        React.createElement("div", { className: styles.revertColumn }, showUndoButton && (React.createElement(SmallIconButton, { icon: ReplayIcon, onClick: handleRevert, className: styles.revertButton, title: i18n.text('Undo'), size: "S" }))),
        React.createElement("div", { className: styles.operationColumn }, change.operation && React.createElement(OperationChip, { operation: change.operation, size: "small", variant: "outlined" })),
        React.createElement("div", { className: styles.statusColumn }, showStatusChips && React.createElement(StatusChips, { showUpdatedChip: isUpdated, showRejectedChip: isLineRejected })),
        React.createElement("div", { className: styles.rejectColumn }, showRejectButton && (React.createElement(Button, { onClick: handleReject, className: classnames(styles.rejectButton, classes === null || classes === void 0 ? void 0 : classes.rejectButton), title: i18n.text('Reject'), size: "medium" }, i18n.text('Reject'))))));
};
