@atlaskit/rovo-agent-components
Version:
This package host public components related to rovo agents, the components here are needed for other public atlaskit packages
143 lines (142 loc) • 6.23 kB
JavaScript
import _agentVerificationDropdownItem_AtlaskitRovoAgentComponents_updateAgentVerificationMutation from "./__generated__/agentVerificationDropdownItem_AtlaskitRovoAgentComponents_updateAgentVerificationMutation.graphql";
import _agentVerificationDropdownItem_AtlaskitRovoAgentComponents_userPermissionsRef from "./__generated__/agentVerificationDropdownItem_AtlaskitRovoAgentComponents_userPermissionsRef.graphql";
import _agentVerificationDropdownItem_AtlaskitRovoAgentComponents_agentRef from "./__generated__/agentVerificationDropdownItem_AtlaskitRovoAgentComponents_agentRef.graphql";
import React, { useCallback } from 'react';
import { useIntl } from 'react-intl';
import { graphql, useFragment, useMutation } from 'react-relay';
import { DropdownItem } from '@atlaskit/dropdown-menu';
import { useFlags } from '@atlaskit/flag';
import ErrorIcon from '@atlaskit/icon/core/status-error';
import SuccessIcon from '@atlaskit/icon/core/status-success';
import { useRovoAgentActionAnalytics } from '@atlaskit/rovo-agent-analytics/actions';
import messages from './messages';
/**
* A dropdown item for verifying or unverifying an agent.
* Renders "Verify agent" if the agent is not verified, or "Remove verification" if it is.
* Returns null if the user doesn't have permission to govern agents or the feature flag is off.
*/
export const AgentVerificationDropdownItem = ({
agentRef,
userPermissionsRef,
onClick,
onVerificationSuccess,
testId,
renderItem
}) => {
var _userPermissions$isAb, _agentData$isVerified;
const {
formatMessage
} = useIntl();
const {
showFlag
} = useFlags();
const agentData = useFragment(_agentVerificationDropdownItem_AtlaskitRovoAgentComponents_agentRef, agentRef);
const userPermissions = useFragment(_agentVerificationDropdownItem_AtlaskitRovoAgentComponents_userPermissionsRef, userPermissionsRef);
const isAbleToGovernAgents = (_userPermissions$isAb = userPermissions === null || userPermissions === void 0 ? void 0 : userPermissions.isAbleToGovernAgents) !== null && _userPermissions$isAb !== void 0 ? _userPermissions$isAb : false;
const isVerified = (_agentData$isVerified = agentData === null || agentData === void 0 ? void 0 : agentData.isVerified) !== null && _agentData$isVerified !== void 0 ? _agentData$isVerified : false;
const agentId = agentData === null || agentData === void 0 ? void 0 : agentData.id;
const {
trackAgentEvent
} = useRovoAgentActionAnalytics({
touchPoint: 'agent-verification-dropdown-item',
agentId,
isAbleToGovernAgents
});
const [commitUpdateVerification, isPending] = useMutation(_agentVerificationDropdownItem_AtlaskitRovoAgentComponents_updateAgentVerificationMutation);
const handleError = useCallback((verified, errorMessage) => {
showFlag({
title: formatMessage(verified ? messages.verifyErrorTitle : messages.unverifyErrorTitle),
description: formatMessage(messages.errorDescription, {
errorMessage
}),
appearance: 'error',
icon: /*#__PURE__*/React.createElement(ErrorIcon, {
spacing: "spacious",
label: ""
})
});
}, [formatMessage, showFlag]);
const handleUpdateVerification = useCallback(verified => {
if (!agentId) {
return;
}
onClick === null || onClick === void 0 ? void 0 : onClick();
commitUpdateVerification({
variables: {
id: agentId,
verified
},
onCompleted: response => {
const payload = response === null || response === void 0 ? void 0 : response.agentStudio_updateAgentVerification;
if (payload !== null && payload !== void 0 && payload.success) {
onVerificationSuccess === null || onVerificationSuccess === void 0 ? void 0 : onVerificationSuccess(verified);
trackAgentEvent({
action: verified ? 'verify' : 'unverify',
actionSubject: 'rovoAgent',
attributes: {}
});
showFlag({
title: formatMessage(verified ? messages.verifySuccessTitle : messages.unverifySuccessTitle),
appearance: 'success',
isAutoDismiss: true,
icon: /*#__PURE__*/React.createElement(SuccessIcon, {
spacing: "spacious",
label: ""
})
});
} else {
var _payload$errors, _payload$errors$;
const errorMessage = payload === null || payload === void 0 ? void 0 : (_payload$errors = payload.errors) === null || _payload$errors === void 0 ? void 0 : (_payload$errors$ = _payload$errors[0]) === null || _payload$errors$ === void 0 ? void 0 : _payload$errors$.message;
if (errorMessage) {
trackAgentEvent({
action: verified ? 'verify' : 'unverify',
actionSubject: 'rovoAgentError',
attributes: {
agentId,
error: {
message: errorMessage
}
}
});
handleError(verified, errorMessage);
}
}
},
onError: error => {
trackAgentEvent({
action: verified ? 'verify' : 'unverify',
actionSubject: 'rovoAgentError',
attributes: {
agentId,
error: {
message: error.message
}
}
});
handleError(verified, error.message);
}
});
}, [agentId, commitUpdateVerification, formatMessage, handleError, onClick, onVerificationSuccess, showFlag, trackAgentEvent]);
const labelText = formatMessage(isVerified ? messages.unverifyAgentLabel : messages.verifyAgentLabel);
const handleOnClick = () => handleUpdateVerification(!isVerified);
if (
// Don't render if agent ID is not available
!agentId ||
// Don't render if user doesn't have permission
!isAbleToGovernAgents) {
return null;
}
// Use custom render or default to DropdownItem
if (renderItem) {
return /*#__PURE__*/React.createElement(React.Fragment, null, renderItem({
isPending,
isVerified,
labelText,
onClick: handleOnClick
}));
}
return /*#__PURE__*/React.createElement(DropdownItem, {
testId: testId,
onClick: handleOnClick
}, labelText);
};