import React, { useCallback } from 'react';
import i18n from 'ui-i18n';
import classnames from 'classnames';
import { getEntityId, getEntityUriForLink, getLabel } from '@reltio/mdm-sdk';
import { EntityAvatar } from '../../../EntityAvatar';
import { EntityUriLink } from '../../../EntityUriLink';
import { ExpandedValueTooltip } from '../../../ExpandedValueTooltip';
import { EntityTypeBadge } from '../../../EntityTypeBadge';
import { useStyles } from './styles';
export var ProfileCardContent = function (_a) {
    var entity = _a.entity, _b = _a.classes, classes = _b === void 0 ? {} : _b, _c = _a.disableEntityLink, disableEntityLink = _c === void 0 ? false : _c;
    var styles = useStyles();
    var secondaryLabelClass = classes.secondaryLabel, labelClass = classes.label;
    var label = getLabel(entity.label);
    var secondaryLabel = entity.secondaryLabel;
    var handleCopyEntityIdToClipboard = useCallback(function () {
        navigator.clipboard.writeText(getEntityId(entity));
    }, [entity]);
    return (React.createElement(React.Fragment, null,
        React.createElement(EntityAvatar, { entity: entity, imageClassName: styles.image }),
        React.createElement("div", { className: styles.info },
            React.createElement(EntityUriLink, { value: getEntityUriForLink(entity), className: styles.link, disabled: disableEntityLink },
                React.createElement(ExpandedValueTooltip, { value: label, placement: "top", showOnExceededHeight: true },
                    React.createElement("div", { className: classnames(styles.label, labelClass) }, label))),
            secondaryLabel && (React.createElement(ExpandedValueTooltip, { value: secondaryLabel, placement: "top", showOnExceededHeight: true },
                React.createElement("div", { className: classnames(styles.secondaryLabel, secondaryLabelClass) }, secondaryLabel))),
            React.createElement("div", { className: styles.thirdRow },
                React.createElement(EntityTypeBadge, { entity: entity, size: "medium" }),
                React.createElement("div", { className: styles.entityId, onClick: handleCopyEntityIdToClipboard },
                    React.createElement("div", { className: styles.entityIdLabel }, i18n.text('ID:')),
                    React.createElement(ExpandedValueTooltip, { value: "Copy to clipboard ".concat(getEntityId(entity)), placement: "top" },
                        React.createElement("div", { className: styles.entityIdValue }, getEntityId(entity))))))));
};
