import React, { memo, useMemo, useCallback } from 'react';
import { checkIfOptionHasValues, getAttrDataTypeDefinition, getDataTypeDefinitionForFilterValue, shouldDisableTimestampLocalizationForAttribute } from '@reltio/mdm-sdk';
import { FilterValueEditor } from '../FilterValueEditor';
import { useMdmDisableTimestampLocalization } from '../contexts/MdmModuleContext';
import { useStyles } from './styles';
var EMPTY_ARRAY = [];
var EMPTY_OBJECT = {};
var AttributesValuesEditor = function (_a) {
    var rowData = _a.rowData, rowContext = _a.rowContext;
    var styles = useStyles();
    var canFilterAcceptValues = (rowData === null || rowData === void 0 ? void 0 : rowData.attribute) && checkIfOptionHasValues(rowData.filter);
    var changeFilter = rowContext.changeFilter;
    var _b = (rowData || EMPTY_OBJECT), _c = _b.values, values = _c === void 0 ? EMPTY_ARRAY : _c, _d = _b.attribute, _e = _d === void 0 ? EMPTY_OBJECT : _d, attrType = _e.attrType, _f = _e.fieldName, fieldName = _f === void 0 ? null : _f, filter = _b.filter, id = _b.id, operator = _b.operator;
    var disableTimestampLocalizationFlag = useMdmDisableTimestampLocalization();
    var disableTimestampLocalization = shouldDisableTimestampLocalizationForAttribute(attrType, {
        disableTimestampLocalization: disableTimestampLocalizationFlag
    });
    var valueDataTypeDefinition = attrType && getAttrDataTypeDefinition(attrType);
    var filterValueDataTypeDefinition = valueDataTypeDefinition &&
        getDataTypeDefinitionForFilterValue(valueDataTypeDefinition, filter, { disableTimestampLocalization: disableTimestampLocalization });
    var editorFilter = useMemo(function () { return ({
        filter: filter,
        fieldName: fieldName,
        operator: operator,
        values: values || []
    }); }, [filter, fieldName, operator, values]);
    var TextFieldProps = useMemo(function () { return ({
        InputProps: {
            classes: {
                root: styles.input
            }
        }
    }); }, [styles]);
    var editorClasses = useMemo(function () { return ({ root: styles.root }); }, [styles]);
    var changeValue = useCallback(function (newValues) {
        var newFilter = {
            fieldName: fieldName,
            filter: filter,
            operator: operator,
            values: newValues
        };
        changeFilter(newFilter, id);
    }, [fieldName, filter, operator, changeFilter, id]);
    return (React.createElement("div", { className: styles.valuesEditor }, (rowData === null || rowData === void 0 ? void 0 : rowData.attribute) && canFilterAcceptValues && (React.createElement(FilterValueEditor, { "data-reltio-id": "filter-value-editor", filter: editorFilter, onChange: changeValue, dataTypeDefinition: filterValueDataTypeDefinition, fullWidth: true, TextFieldProps: TextFieldProps, color: "primary", classes: editorClasses, orientation: "horizontal" }))));
};
export default memo(AttributesValuesEditor);
