@atlaskit/profilecard
Version:
A React component to display a card with user information.
215 lines • 7.33 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import React, { useCallback, useState } from 'react';
import { defineMessages, FormattedMessage, useIntl } from 'react-intl-next';
import Button, { IconButton } from '@atlaskit/button/new';
import DropdownMenu, { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
import MoreIcon from '@atlaskit/icon/core/migration/show-more-horizontal--more';
import { fg } from '@atlaskit/platform-feature-flags';
import { Box, Inline, xcss } from '@atlaskit/primitives';
import { AgentDropdownMenu, ChatPillIcon } from '@atlaskit/rovo-agent-components';
import { AgentDeleteConfirmationModal } from './AgentDeleteConfirmationModal';
const chatToAgentButtonContainer = xcss({
width: '100%'
});
const chatToAgentButtonWrapper = xcss({
display: 'flex',
justifyContent: 'center',
lineHeight: '20px',
fontWeight: 'font.weight.medium'
});
const chatPillButtonInlineStyles = xcss({
paddingInline: 'space.025'
});
const chatPillTextStyles = xcss({
wordBreak: 'break-word',
textAlign: 'left',
whiteSpace: 'pre-wrap'
});
const chatPillIconWrapper = xcss({
minWidth: '20px',
height: '20px'
});
const actionsWrapperStyles = xcss({
borderTop: '1px',
borderTopStyle: 'solid',
borderColor: 'color.border',
padding: 'space.200',
marginBlockStart: 'space.200',
color: 'color.text'
});
const buildAgentActions = ({
onDuplicateAgent,
onCopyAgent,
isForgeAgent
}) => {
return isForgeAgent ? [{
text: /*#__PURE__*/React.createElement(FormattedMessage, messages.actionCopyLink),
onClick: onCopyAgent
}] : [{
text: /*#__PURE__*/React.createElement(FormattedMessage, messages.actionDuplicate),
onClick: onDuplicateAgent
}, {
text: /*#__PURE__*/React.createElement(FormattedMessage, messages.actionCopyLink),
onClick: onCopyAgent
}];
};
const buildAgentSettings = ({
onEditAgent,
onDeleteAgent
}) => {
return [{
text: /*#__PURE__*/React.createElement(FormattedMessage, messages.actionEdit),
onClick: onEditAgent
}, {
text: /*#__PURE__*/React.createElement(FormattedMessage, messages.actionDelete),
onClick: onDeleteAgent
}];
};
export const AgentActions = ({
isAgentCreatedByCurrentUser,
onEditAgent,
onDeleteAgent,
onDuplicateAgent,
onCopyAgent,
onChatClick,
onViewFullProfileClick,
agent,
resourceClient
}) => {
const {
formatMessage
} = useIntl();
const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
const isForgeAgent = agent.creator_type === 'FORGE' || agent.creator_type === 'THIRD_PARTY';
const loadAgentPermissions = useCallback(async () => {
const {
permissions: {
AGENT_UPDATE,
AGENT_DEACTIVATE
}
} = await resourceClient.getRovoAgentPermissions(agent.id);
return {
isEditEnabled: AGENT_UPDATE.permitted,
isDeleteEnabled: AGENT_DEACTIVATE.permitted
};
}, [agent.id, resourceClient]);
const agentActions = buildAgentActions({
onDuplicateAgent,
onCopyAgent,
isForgeAgent: agent.creator_type === 'FORGE' || agent.creator_type === 'THIRD_PARTY'
});
const agentSetting = buildAgentSettings({
onEditAgent,
onDeleteAgent: () => {
setIsDeleteModalOpen(true);
}
});
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Inline, {
space: "space.100",
xcss: actionsWrapperStyles
}, /*#__PURE__*/React.createElement(Box, {
xcss: chatToAgentButtonContainer
}, /*#__PURE__*/React.createElement(Button, {
shouldFitContainer: true,
onClick: e => {
e.stopPropagation();
onChatClick();
}
}, /*#__PURE__*/React.createElement(Box, {
xcss: chatToAgentButtonWrapper
}, /*#__PURE__*/React.createElement(Inline, {
space: "space.050",
xcss: chatPillButtonInlineStyles
}, /*#__PURE__*/React.createElement(Box, {
xcss: chatPillIconWrapper
}, /*#__PURE__*/React.createElement(ChatPillIcon, null)), /*#__PURE__*/React.createElement(Box, {
xcss: chatPillTextStyles
}, formatMessage(messages.actionChatToAgent)))))), fg('rovo_use_agent_permissions') ? /*#__PURE__*/React.createElement(AgentDropdownMenu, {
agentId: agent.id,
isAgentCreatedByUser: isAgentCreatedByCurrentUser !== null && isAgentCreatedByCurrentUser !== void 0 ? isAgentCreatedByCurrentUser : false,
onDeleteAgent: () => setIsDeleteModalOpen(true),
onEditAgent: onEditAgent,
onDuplicateAgent: onDuplicateAgent,
onCopyAgent: onCopyAgent,
isForgeAgent: isForgeAgent,
loadAgentPermissions: loadAgentPermissions,
loadPermissionsOnMount: true,
onViewAgentFullProfileClick: onViewFullProfileClick,
doesAgentHaveIdentityAccountId: !!agent.identity_account_id,
shouldTriggerStopPropagation: true
}) : /*#__PURE__*/React.createElement(DropdownMenu, {
trigger: ({
triggerRef,
...props
}) => /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(IconButton, _extends({}, props, {
icon: MoreIcon,
label: "more",
ref: triggerRef,
onClick: e => {
var _props$onClick;
e.stopPropagation();
(_props$onClick = props.onClick) === null || _props$onClick === void 0 ? void 0 : _props$onClick.call(props, e);
}
}))),
placement: "bottom-end"
}, /*#__PURE__*/React.createElement(DropdownItemGroup, null, agentActions.map(({
text,
onClick
}, idx) => {
return /*#__PURE__*/React.createElement(DropdownItem, {
key: idx,
onClick: e => {
e.stopPropagation();
onClick === null || onClick === void 0 ? void 0 : onClick();
}
}, text);
})), isAgentCreatedByCurrentUser && /*#__PURE__*/React.createElement(DropdownItemGroup, {
hasSeparator: true
}, agentSetting.map(({
text,
onClick
}, idx) => {
return /*#__PURE__*/React.createElement(DropdownItem, {
key: idx,
onClick: e => {
e.stopPropagation();
onClick === null || onClick === void 0 ? void 0 : onClick();
}
}, text);
})))), /*#__PURE__*/React.createElement(AgentDeleteConfirmationModal, {
isOpen: isDeleteModalOpen,
onClose: () => {
setIsDeleteModalOpen(false);
},
onSubmit: onDeleteAgent,
agentId: agent.id,
agentName: agent.name
}));
};
const messages = defineMessages({
actionChatToAgent: {
id: 'ptc-directory.agent-profile.action.dropdown.chat-to-agent.nonfinal',
defaultMessage: 'Chat to Agent',
description: 'Text for the "chat to agent" action to chat to the agent'
},
actionDelete: {
id: 'ptc-directory.agent-profile.action.dropdown.delete.nonfinal',
defaultMessage: 'Delete Agent',
description: 'Text for the "Delete" action to delete an agent'
},
actionEdit: {
id: 'ptc-directory.agent-profile.action.dropdown.edit.nonfinal',
defaultMessage: 'Edit Agent',
description: 'Text for the "Edit" action to edit an agent'
},
actionCopyLink: {
id: 'ptc-directory.agent-profile.action.dropdown.copy-link.nonfinal',
defaultMessage: 'Copy link',
description: 'Text for the Copy link of an agent'
},
actionDuplicate: {
id: 'ptc-directory.agent-profile.action.dropdown.duplicate.nonfinal',
defaultMessage: 'Duplicate Agent',
description: 'Text for the Duplicate Agent action to create a duplicate'
}
});