import classnames from 'classnames';
import React, { useContext } from 'react';
import { useContextSelector } from '@fluentui/react-context-selector';
import { DCROperationTypes } from '@reltio/mdm-sdk';
import { isEditableChange } from '../../helpers/helpers';
import { ChangeRequestEditorContext } from '../../../contexts/ChangeRequestEditorContext';
import { ChangeItemEditor, ChangeItemOldValue } from '../ChangeItemEditor';
import { extractLineIds } from '../../../helpers/merge';
import { ErrorWrapper } from '../../../../../ErrorWrapper';
import { ScrollToElementContext, isHighlightedErrorType } from '../../../../../contexts/ScrollToElementContext';
import { useScrollToAttributeError } from '../../../../../hooks/useScrollToAttributeError';
import styles from './ChangeItemRow.module.css';
export var ChangeItemRow = function (_a) {
    var _b;
    var change = _a.change, entityInfo = _a.entityInfo;
    var lineIds = change.lineIds || extractLineIds(change === null || change === void 0 ? void 0 : change.newValue);
    var isParentLineRejected = useContextSelector(ChangeRequestEditorContext, function (context) {
        return context.getIsParentLineRejected(lineIds === null || lineIds === void 0 ? void 0 : lineIds[0]);
    });
    var isLineRejected = useContextSelector(ChangeRequestEditorContext, function (context) {
        return context.getIsLineRejected(lineIds === null || lineIds === void 0 ? void 0 : lineIds[0]);
    });
    var isUpdated = useContextSelector(ChangeRequestEditorContext, function (context) {
        return context.getIsLineUpdated(lineIds === null || lineIds === void 0 ? void 0 : lineIds[0]);
    });
    var errorByLineId = useContextSelector(ChangeRequestEditorContext, function (context) {
        return context.getErrorByLineId(lineIds === null || lineIds === void 0 ? void 0 : lineIds[0]);
    });
    var error = errorByLineId === null || errorByLineId === void 0 ? void 0 : errorByLineId.error;
    var errorLineIds = (errorByLineId === null || errorByLineId === void 0 ? void 0 : errorByLineId.lineIds) || [];
    var scrollToElementContext = useContext(ScrollToElementContext);
    var highlightedError = scrollToElementContext === null || scrollToElementContext === void 0 ? void 0 : scrollToElementContext.element;
    var isHighlighted = isHighlightedErrorType(scrollToElementContext === null || scrollToElementContext === void 0 ? void 0 : scrollToElementContext.type) &&
        highlightedError &&
        errorLineIds.includes(highlightedError.uri);
    var _c = useScrollToAttributeError({
        highlightedError: isHighlighted ? scrollToElementContext : null,
        className: styles.changeItemRowWithError
    }), ref = _c.ref, errorClassName = _c.errorClassName;
    var isEditedOperation = change.operation === DCROperationTypes.EDITED;
    var editable = isEditableChange(change, entityInfo);
    return (React.createElement("div", { ref: ref, className: classnames(styles.changeItemRow, errorClassName, (_b = {},
            _b[styles.editableRow] = editable,
            _b[styles.changedRow] = isUpdated,
            _b[styles.rejectedRow] = isLineRejected || isParentLineRejected,
            _b)) },
        React.createElement(ErrorWrapper, { errorMessage: error === null || error === void 0 ? void 0 : error.message, classes: { helperText: styles.errorText } },
            isEditedOperation && React.createElement(ChangeItemOldValue, { change: change }),
            React.createElement(ChangeItemEditor, { change: change, editable: editable, classes: { rejectButton: styles.rejectButton } }))));
};
