@atlaskit/rovo-agent-components 3.28.0 → 3.30.0

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/rovo-agent-components
 
+## 3.30.0
+
+### Minor Changes
+
+- [`ab19c61b46546`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ab19c61b46546) -
+  pass onVerificationSuccess to verification dropdown in browse agent to handle relay connection
+  update
+
+## 3.29.0
+
+### Minor Changes
+
+- [`de588876854b6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/de588876854b6) -
+  Improved horizontal alignment of verified icon badge
+
 ## 3.28.0
 
 ### Minor Changes

package/dist/cjs/ui/agent-dropdown-menu/index.js

@@ -56,7 +56,6 @@ var ChatToAgentButton = exports.ChatToAgentButton = function ChatToAgentButton(_
 };
 var AgentDropdownMenu = exports.AgentDropdownMenu = function AgentDropdownMenu(_ref2) {
   var isAutodevTemplateAgent = _ref2.isAutodevTemplateAgent,
-    agentId = _ref2.agentId,
     onEditAgent = _ref2.onEditAgent,
     onCopyAgent = _ref2.onCopyAgent,
     onDuplicateAgent = _ref2.onDuplicateAgent,
@@ -77,7 +76,8 @@ var AgentDropdownMenu = exports.AgentDropdownMenu = function AgentDropdownMenu(_
     shouldTriggerStopPropagation = _ref2.shouldTriggerStopPropagation,
     agentName = _ref2.agentName,
     agentRef = _ref2.agentRef,
-    userPermissionsRef = _ref2.userPermissionsRef;
+    userPermissionsRef = _ref2.userPermissionsRef,
+    onVerificationSuccess = _ref2.onVerificationSuccess;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     isLoading = _useState2[0],
@@ -200,6 +200,7 @@ var AgentDropdownMenu = exports.AgentDropdownMenu = function AgentDropdownMenu(_
   }, formatMessage(hasBeenCopied ? _messages.default.linkedCopiedToProfile : _messages.default.copyLinkToProfile)), agentRef && userPermissionsRef && (0, _platformFeatureFlags.fg)('rovo_agents_agent_verification') && /*#__PURE__*/_react.default.createElement(_agentVerificationDropdownItem.AgentVerificationDropdownItem, {
     agentRef: agentRef !== null && agentRef !== void 0 ? agentRef : null,
     userPermissionsRef: userPermissionsRef !== null && userPermissionsRef !== void 0 ? userPermissionsRef : null,
+    onVerificationSuccess: onVerificationSuccess,
     testId: "agent-actions-menu-verification"
   })), renderEditDelete());
 };

package/dist/cjs/ui/agent-profile-info/index.js

@@ -164,7 +164,7 @@ var AgentProfileInfo = exports.AgentProfileInfo = function AgentProfileInfo(_ref
     space: "space.100",
     alignBlock: "center"
   }, /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
-    space: "space.100",
+    space: "space.075",
     xcss: styles.headingWrapper
   }, /*#__PURE__*/_react.default.createElement(_heading.default, {
     as: "h2",

package/dist/cjs/ui/agent-verification-dropdown-item/index.js

@@ -30,6 +30,7 @@ var AgentVerificationDropdownItem = exports.AgentVerificationDropdownItem = func
   var agentRef = _ref.agentRef,
     userPermissionsRef = _ref.userPermissionsRef,
     onClick = _ref.onClick,
+    onVerificationSuccess = _ref.onVerificationSuccess,
     testId = _ref.testId;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
@@ -64,32 +65,39 @@ var AgentVerificationDropdownItem = exports.AgentVerificationDropdownItem = func
     });
   }, [formatMessage, showFlag]);
   var handleUpdateVerification = (0, _react.useCallback)(function (verified) {
-    if (!agentId) return;
+    if (!agentId) {
+      return;
+    }
     onClick === null || onClick === void 0 || onClick();
     commitUpdateVerification({
       variables: {
         id: agentId,
         verified: verified
       },
-      onCompleted: function onCompleted(_, errors) {
-        if (errors && errors.length > 0) {
-          var errorMessage = errors[0].message;
-          trackAgentActionError(verified ? _actions.AgentActions.VERIFY : _actions.AgentActions.UNVERIFY, new Error(errorMessage), {
-            agentId: agentId
+      onCompleted: function onCompleted(response) {
+        var payload = response === null || response === void 0 ? void 0 : response.agentStudio_updateAgentVerification;
+        if (payload !== null && payload !== void 0 && payload.success) {
+          onVerificationSuccess === null || onVerificationSuccess === void 0 || onVerificationSuccess(verified);
+          trackAgentAction(verified ? _actions.AgentActions.VERIFY : _actions.AgentActions.UNVERIFY, {});
+          showFlag({
+            title: formatMessage(verified ? _messages.default.verifySuccessTitle : _messages.default.unverifySuccessTitle),
+            appearance: 'success',
+            isAutoDismiss: true,
+            icon: /*#__PURE__*/_react.default.createElement(_statusSuccess.default, {
+              spacing: "spacious",
+              label: ""
+            })
           });
-          handleError(verified, errorMessage);
-          return;
+        } else {
+          var _payload$errors;
+          var errorMessage = payload === null || payload === void 0 || (_payload$errors = payload.errors) === null || _payload$errors === void 0 || (_payload$errors = _payload$errors[0]) === null || _payload$errors === void 0 ? void 0 : _payload$errors.message;
+          if (errorMessage) {
+            trackAgentActionError(verified ? _actions.AgentActions.VERIFY : _actions.AgentActions.UNVERIFY, new Error(errorMessage), {
+              agentId: agentId
+            });
+            handleError(verified, errorMessage);
+          }
         }
-        trackAgentAction(verified ? _actions.AgentActions.VERIFY : _actions.AgentActions.UNVERIFY, {});
-        showFlag({
-          title: formatMessage(verified ? _messages.default.verifySuccessTitle : _messages.default.unverifySuccessTitle),
-          appearance: 'success',
-          isAutoDismiss: true,
-          icon: /*#__PURE__*/_react.default.createElement(_statusSuccess.default, {
-            spacing: "spacious",
-            label: ""
-          })
-        });
       },
       onError: function onError(error) {
         trackAgentActionError(verified ? _actions.AgentActions.VERIFY : _actions.AgentActions.UNVERIFY, error, {
@@ -98,7 +106,7 @@ var AgentVerificationDropdownItem = exports.AgentVerificationDropdownItem = func
         handleError(verified, error.message);
       }
     });
-  }, [agentId, commitUpdateVerification, formatMessage, handleError, onClick, showFlag, trackAgentAction, trackAgentActionError]);
+  }, [agentId, commitUpdateVerification, formatMessage, handleError, onClick, onVerificationSuccess, showFlag, trackAgentAction, trackAgentActionError]);
   if (
   // Don't render if agent ID is not available
   !agentId ||

package/dist/cjs/ui/agent-verified/agent-verified.stories.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.MediumSize = exports.Default = void 0;
+exports.default = exports.TextLarge = exports.HeadingMedium = exports.HeadingLarge = exports.Default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactMagneticDi = require("react-magnetic-di");
 var _reactRelay = require("react-relay");
@@ -26,11 +26,27 @@ var Default = exports.Default = {
     });
   }
 };
-var MediumSize = exports.MediumSize = {
+var TextLarge = exports.TextLarge = {
   render: function render() {
     return /*#__PURE__*/_react.default.createElement(_index.AgentVerified, {
       agentRef: {},
-      size: "medium"
+      adjacentTextSize: "textLarge"
+    });
+  }
+};
+var HeadingMedium = exports.HeadingMedium = {
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(_index.AgentVerified, {
+      agentRef: {},
+      adjacentTextSize: "headingMedium"
+    });
+  }
+};
+var HeadingLarge = exports.HeadingLarge = {
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(_index.AgentVerified, {
+      agentRef: {},
+      adjacentTextSize: "headingLarge"
     });
   }
 };

package/dist/cjs/ui/agent-verified/index.compiled.css

@@ -0,0 +1,3 @@
+._4t3i1f4h{height:28px}
+._4t3i1tcg{height:24px}
+._4t3igktf{height:20px}

package/dist/cjs/ui/agent-verified/index.js

@@ -1,3 +1,4 @@
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -5,35 +6,48 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AgentVerifiedIcon = exports.AgentVerified = void 0;
+require("./index.compiled.css");
+var _runtime = require("@compiled/react/runtime");
 var _agentVerified_AtlaskitRovoAgentComponents2 = _interopRequireDefault(require("./__generated__/agentVerified_AtlaskitRovoAgentComponents.graphql"));
 var _react = _interopRequireDefault(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _reactRelay = require("react-relay");
+var _css = require("@atlaskit/css");
 var _statusVerified = _interopRequireDefault(require("@atlaskit/icon/core/status-verified"));
+var _compiled = require("@atlaskit/primitives/compiled");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _messages = _interopRequireDefault(require("./messages"));
 var AgentVerified = exports.AgentVerified = function AgentVerified(_ref) {
   var agentRef = _ref.agentRef,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'small' : _ref$size;
+    adjacentTextSize = _ref.adjacentTextSize;
   var data = (0, _reactRelay.useFragment)(_agentVerified_AtlaskitRovoAgentComponents2.default, agentRef);
   if (!(data !== null && data !== void 0 && data.isVerified)) {
     return null;
   }
   return /*#__PURE__*/_react.default.createElement(AgentVerifiedIcon, {
-    size: size
+    adjacentTextSize: adjacentTextSize
   });
 };
+var styles = {
+  body: "_4t3igktf",
+  textLarge: "_4t3i1tcg",
+  headingMedium: "_4t3i1tcg",
+  headingLarge: "_4t3i1f4h"
+};
 var AgentVerifiedIcon = exports.AgentVerifiedIcon = function AgentVerifiedIcon(_ref2) {
-  var _ref2$size = _ref2.size,
-    size = _ref2$size === void 0 ? 'small' : _ref2$size;
+  var _ref2$adjacentTextSiz = _ref2.adjacentTextSize,
+    adjacentTextSize = _ref2$adjacentTextSiz === void 0 ? 'body' : _ref2$adjacentTextSiz;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
   return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     content: formatMessage(_messages.default.verifiedAgentTooltip)
+  }, /*#__PURE__*/_react.default.createElement(_compiled.Flex, {
+    justifyContent: "center",
+    alignItems: "center",
+    xcss: (0, _css.cx)(adjacentTextSize === 'body' && styles['body'], adjacentTextSize === 'headingMedium' && styles['headingMedium'], adjacentTextSize === 'headingLarge' && styles['headingLarge'], adjacentTextSize === 'textLarge' && styles['textLarge'])
   }, /*#__PURE__*/_react.default.createElement(_statusVerified.default, {
     color: "var(--ds-icon-accent-blue, #357DE8)",
     label: formatMessage(_messages.default.verifiedIconLabel),
-    size: size
-  }));
+    size: "small"
+  })));
 };

package/dist/es2019/ui/agent-dropdown-menu/index.js

@@ -44,7 +44,6 @@ export const ChatToAgentButton = ({
 };
 export const AgentDropdownMenu = ({
   isAutodevTemplateAgent,
-  agentId,
   onEditAgent,
   onCopyAgent,
   onDuplicateAgent,
@@ -64,7 +63,8 @@ export const AgentDropdownMenu = ({
   shouldTriggerStopPropagation,
   agentName,
   agentRef,
-  userPermissionsRef
+  userPermissionsRef,
+  onVerificationSuccess
 }) => {
   const [isLoading, setIsLoading] = useState(false);
   const {
@@ -160,6 +160,7 @@ export const AgentDropdownMenu = ({
   }, formatMessage(hasBeenCopied ? messages.linkedCopiedToProfile : messages.copyLinkToProfile)), agentRef && userPermissionsRef && fg('rovo_agents_agent_verification') && /*#__PURE__*/React.createElement(AgentVerificationDropdownItem, {
     agentRef: agentRef !== null && agentRef !== void 0 ? agentRef : null,
     userPermissionsRef: userPermissionsRef !== null && userPermissionsRef !== void 0 ? userPermissionsRef : null,
+    onVerificationSuccess: onVerificationSuccess,
     testId: "agent-actions-menu-verification"
   })), renderEditDelete());
 };

package/dist/es2019/ui/agent-profile-info/index.js

@@ -157,7 +157,7 @@ export const AgentProfileInfo = ({
     space: "space.100",
     alignBlock: "center"
   }, /*#__PURE__*/React.createElement(Inline, {
-    space: "space.100",
+    space: "space.075",
     xcss: styles.headingWrapper
   }, /*#__PURE__*/React.createElement(Heading, {
     as: "h2",

package/dist/es2019/ui/agent-verification-dropdown-item/index.js

@@ -19,6 +19,7 @@ export const AgentVerificationDropdownItem = ({
   agentRef,
   userPermissionsRef,
   onClick,
+  onVerificationSuccess,
   testId
 }) => {
   var _userPermissions$isAb, _agentData$isVerified;
@@ -56,32 +57,39 @@ export const AgentVerificationDropdownItem = ({
     });
   }, [formatMessage, showFlag]);
   const handleUpdateVerification = useCallback(verified => {
-    if (!agentId) return;
+    if (!agentId) {
+      return;
+    }
     onClick === null || onClick === void 0 ? void 0 : onClick();
     commitUpdateVerification({
       variables: {
         id: agentId,
         verified
       },
-      onCompleted: (_, errors) => {
-        if (errors && errors.length > 0) {
-          const errorMessage = errors[0].message;
-          trackAgentActionError(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, new Error(errorMessage), {
-            agentId
+      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);
+          trackAgentAction(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, {});
+          showFlag({
+            title: formatMessage(verified ? messages.verifySuccessTitle : messages.unverifySuccessTitle),
+            appearance: 'success',
+            isAutoDismiss: true,
+            icon: /*#__PURE__*/React.createElement(SuccessIcon, {
+              spacing: "spacious",
+              label: ""
+            })
           });
-          handleError(verified, errorMessage);
-          return;
+        } 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) {
+            trackAgentActionError(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, new Error(errorMessage), {
+              agentId
+            });
+            handleError(verified, errorMessage);
+          }
         }
-        trackAgentAction(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, {});
-        showFlag({
-          title: formatMessage(verified ? messages.verifySuccessTitle : messages.unverifySuccessTitle),
-          appearance: 'success',
-          isAutoDismiss: true,
-          icon: /*#__PURE__*/React.createElement(SuccessIcon, {
-            spacing: "spacious",
-            label: ""
-          })
-        });
       },
       onError: error => {
         trackAgentActionError(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, error, {
@@ -90,7 +98,7 @@ export const AgentVerificationDropdownItem = ({
         handleError(verified, error.message);
       }
     });
-  }, [agentId, commitUpdateVerification, formatMessage, handleError, onClick, showFlag, trackAgentAction, trackAgentActionError]);
+  }, [agentId, commitUpdateVerification, formatMessage, handleError, onClick, onVerificationSuccess, showFlag, trackAgentAction, trackAgentActionError]);
   if (
   // Don't render if agent ID is not available
   !agentId ||

package/dist/es2019/ui/agent-verified/agent-verified.stories.js

@@ -15,9 +15,21 @@ export const Default = {
     agentRef: {}
   })
 };
-export const MediumSize = {
+export const TextLarge = {
   render: () => /*#__PURE__*/React.createElement(AgentVerified, {
     agentRef: {},
-    size: "medium"
+    adjacentTextSize: "textLarge"
+  })
+};
+export const HeadingMedium = {
+  render: () => /*#__PURE__*/React.createElement(AgentVerified, {
+    agentRef: {},
+    adjacentTextSize: "headingMedium"
+  })
+};
+export const HeadingLarge = {
+  render: () => /*#__PURE__*/React.createElement(AgentVerified, {
+    agentRef: {},
+    adjacentTextSize: "headingLarge"
   })
 };

package/dist/es2019/ui/agent-verified/index.compiled.css

@@ -0,0 +1,3 @@
+._4t3i1f4h{height:28px}
+._4t3i1tcg{height:24px}
+._4t3igktf{height:20px}

package/dist/es2019/ui/agent-verified/index.js

@@ -1,33 +1,48 @@
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 import _agentVerified_AtlaskitRovoAgentComponents from "./__generated__/agentVerified_AtlaskitRovoAgentComponents.graphql";
 import React from 'react';
 import { useIntl } from 'react-intl-next';
 import { graphql, useFragment } from 'react-relay';
+import { cx } from '@atlaskit/css';
 import VerifiedIcon from '@atlaskit/icon/core/status-verified';
+import { Flex } from '@atlaskit/primitives/compiled';
 import Tooltip from '@atlaskit/tooltip';
 import messages from './messages';
 export const AgentVerified = ({
   agentRef,
-  size = 'small'
+  adjacentTextSize
 }) => {
   const data = useFragment(_agentVerified_AtlaskitRovoAgentComponents, agentRef);
   if (!(data !== null && data !== void 0 && data.isVerified)) {
     return null;
   }
   return /*#__PURE__*/React.createElement(AgentVerifiedIcon, {
-    size: size
+    adjacentTextSize: adjacentTextSize
   });
 };
+const styles = {
+  body: "_4t3igktf",
+  textLarge: "_4t3i1tcg",
+  headingMedium: "_4t3i1tcg",
+  headingLarge: "_4t3i1f4h"
+};
 export const AgentVerifiedIcon = ({
-  size = 'small'
+  adjacentTextSize = 'body'
 }) => {
   const {
     formatMessage
   } = useIntl();
   return /*#__PURE__*/React.createElement(Tooltip, {
     content: formatMessage(messages.verifiedAgentTooltip)
+  }, /*#__PURE__*/React.createElement(Flex, {
+    justifyContent: "center",
+    alignItems: "center",
+    xcss: cx(adjacentTextSize === 'body' && styles['body'], adjacentTextSize === 'headingMedium' && styles['headingMedium'], adjacentTextSize === 'headingLarge' && styles['headingLarge'], adjacentTextSize === 'textLarge' && styles['textLarge'])
   }, /*#__PURE__*/React.createElement(VerifiedIcon, {
     color: "var(--ds-icon-accent-blue, #357DE8)",
     label: formatMessage(messages.verifiedIconLabel),
-    size: size
-  }));
+    size: "small"
+  })));
 };

package/dist/esm/ui/agent-dropdown-menu/index.js

@@ -47,7 +47,6 @@ export var ChatToAgentButton = function ChatToAgentButton(_ref) {
 };
 export var AgentDropdownMenu = function AgentDropdownMenu(_ref2) {
   var isAutodevTemplateAgent = _ref2.isAutodevTemplateAgent,
-    agentId = _ref2.agentId,
     onEditAgent = _ref2.onEditAgent,
     onCopyAgent = _ref2.onCopyAgent,
     onDuplicateAgent = _ref2.onDuplicateAgent,
@@ -68,7 +67,8 @@ export var AgentDropdownMenu = function AgentDropdownMenu(_ref2) {
     shouldTriggerStopPropagation = _ref2.shouldTriggerStopPropagation,
     agentName = _ref2.agentName,
     agentRef = _ref2.agentRef,
-    userPermissionsRef = _ref2.userPermissionsRef;
+    userPermissionsRef = _ref2.userPermissionsRef,
+    onVerificationSuccess = _ref2.onVerificationSuccess;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isLoading = _useState2[0],
@@ -191,6 +191,7 @@ export var AgentDropdownMenu = function AgentDropdownMenu(_ref2) {
   }, formatMessage(hasBeenCopied ? messages.linkedCopiedToProfile : messages.copyLinkToProfile)), agentRef && userPermissionsRef && fg('rovo_agents_agent_verification') && /*#__PURE__*/React.createElement(AgentVerificationDropdownItem, {
     agentRef: agentRef !== null && agentRef !== void 0 ? agentRef : null,
     userPermissionsRef: userPermissionsRef !== null && userPermissionsRef !== void 0 ? userPermissionsRef : null,
+    onVerificationSuccess: onVerificationSuccess,
     testId: "agent-actions-menu-verification"
   })), renderEditDelete());
 };

package/dist/esm/ui/agent-profile-info/index.js

@@ -157,7 +157,7 @@ export var AgentProfileInfo = function AgentProfileInfo(_ref3) {
     space: "space.100",
     alignBlock: "center"
   }, /*#__PURE__*/React.createElement(Inline, {
-    space: "space.100",
+    space: "space.075",
     xcss: styles.headingWrapper
   }, /*#__PURE__*/React.createElement(Heading, {
     as: "h2",

package/dist/esm/ui/agent-verification-dropdown-item/index.js

@@ -21,6 +21,7 @@ export var AgentVerificationDropdownItem = function AgentVerificationDropdownIte
   var agentRef = _ref.agentRef,
     userPermissionsRef = _ref.userPermissionsRef,
     onClick = _ref.onClick,
+    onVerificationSuccess = _ref.onVerificationSuccess,
     testId = _ref.testId;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
@@ -55,32 +56,39 @@ export var AgentVerificationDropdownItem = function AgentVerificationDropdownIte
     });
   }, [formatMessage, showFlag]);
   var handleUpdateVerification = useCallback(function (verified) {
-    if (!agentId) return;
+    if (!agentId) {
+      return;
+    }
     onClick === null || onClick === void 0 || onClick();
     commitUpdateVerification({
       variables: {
         id: agentId,
         verified: verified
       },
-      onCompleted: function onCompleted(_, errors) {
-        if (errors && errors.length > 0) {
-          var errorMessage = errors[0].message;
-          trackAgentActionError(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, new Error(errorMessage), {
-            agentId: agentId
+      onCompleted: function onCompleted(response) {
+        var payload = response === null || response === void 0 ? void 0 : response.agentStudio_updateAgentVerification;
+        if (payload !== null && payload !== void 0 && payload.success) {
+          onVerificationSuccess === null || onVerificationSuccess === void 0 || onVerificationSuccess(verified);
+          trackAgentAction(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, {});
+          showFlag({
+            title: formatMessage(verified ? messages.verifySuccessTitle : messages.unverifySuccessTitle),
+            appearance: 'success',
+            isAutoDismiss: true,
+            icon: /*#__PURE__*/React.createElement(SuccessIcon, {
+              spacing: "spacious",
+              label: ""
+            })
           });
-          handleError(verified, errorMessage);
-          return;
+        } else {
+          var _payload$errors;
+          var errorMessage = payload === null || payload === void 0 || (_payload$errors = payload.errors) === null || _payload$errors === void 0 || (_payload$errors = _payload$errors[0]) === null || _payload$errors === void 0 ? void 0 : _payload$errors.message;
+          if (errorMessage) {
+            trackAgentActionError(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, new Error(errorMessage), {
+              agentId: agentId
+            });
+            handleError(verified, errorMessage);
+          }
         }
-        trackAgentAction(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, {});
-        showFlag({
-          title: formatMessage(verified ? messages.verifySuccessTitle : messages.unverifySuccessTitle),
-          appearance: 'success',
-          isAutoDismiss: true,
-          icon: /*#__PURE__*/React.createElement(SuccessIcon, {
-            spacing: "spacious",
-            label: ""
-          })
-        });
       },
       onError: function onError(error) {
         trackAgentActionError(verified ? AgentActions.VERIFY : AgentActions.UNVERIFY, error, {
@@ -89,7 +97,7 @@ export var AgentVerificationDropdownItem = function AgentVerificationDropdownIte
         handleError(verified, error.message);
       }
     });
-  }, [agentId, commitUpdateVerification, formatMessage, handleError, onClick, showFlag, trackAgentAction, trackAgentActionError]);
+  }, [agentId, commitUpdateVerification, formatMessage, handleError, onClick, onVerificationSuccess, showFlag, trackAgentAction, trackAgentActionError]);
   if (
   // Don't render if agent ID is not available
   !agentId ||

package/dist/esm/ui/agent-verified/agent-verified.stories.js

@@ -19,11 +19,27 @@ export var Default = {
     });
   }
 };
-export var MediumSize = {
+export var TextLarge = {
   render: function render() {
     return /*#__PURE__*/React.createElement(AgentVerified, {
       agentRef: {},
-      size: "medium"
+      adjacentTextSize: "textLarge"
+    });
+  }
+};
+export var HeadingMedium = {
+  render: function render() {
+    return /*#__PURE__*/React.createElement(AgentVerified, {
+      agentRef: {},
+      adjacentTextSize: "headingMedium"
+    });
+  }
+};
+export var HeadingLarge = {
+  render: function render() {
+    return /*#__PURE__*/React.createElement(AgentVerified, {
+      agentRef: {},
+      adjacentTextSize: "headingLarge"
     });
   }
 };

package/dist/esm/ui/agent-verified/index.compiled.css

@@ -0,0 +1,3 @@
+._4t3i1f4h{height:28px}
+._4t3i1tcg{height:24px}
+._4t3igktf{height:20px}

package/dist/esm/ui/agent-verified/index.js

@@ -1,32 +1,46 @@
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 import _agentVerified_AtlaskitRovoAgentComponents from "./__generated__/agentVerified_AtlaskitRovoAgentComponents.graphql";
 import React from 'react';
 import { useIntl } from 'react-intl-next';
 import { graphql, useFragment } from 'react-relay';
+import { cx } from '@atlaskit/css';
 import VerifiedIcon from '@atlaskit/icon/core/status-verified';
+import { Flex } from '@atlaskit/primitives/compiled';
 import Tooltip from '@atlaskit/tooltip';
 import messages from './messages';
 export var AgentVerified = function AgentVerified(_ref) {
   var agentRef = _ref.agentRef,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'small' : _ref$size;
+    adjacentTextSize = _ref.adjacentTextSize;
   var data = useFragment(_agentVerified_AtlaskitRovoAgentComponents, agentRef);
   if (!(data !== null && data !== void 0 && data.isVerified)) {
     return null;
   }
   return /*#__PURE__*/React.createElement(AgentVerifiedIcon, {
-    size: size
+    adjacentTextSize: adjacentTextSize
   });
 };
+var styles = {
+  body: "_4t3igktf",
+  textLarge: "_4t3i1tcg",
+  headingMedium: "_4t3i1tcg",
+  headingLarge: "_4t3i1f4h"
+};
 export var AgentVerifiedIcon = function AgentVerifiedIcon(_ref2) {
-  var _ref2$size = _ref2.size,
-    size = _ref2$size === void 0 ? 'small' : _ref2$size;
+  var _ref2$adjacentTextSiz = _ref2.adjacentTextSize,
+    adjacentTextSize = _ref2$adjacentTextSiz === void 0 ? 'body' : _ref2$adjacentTextSiz;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
   return /*#__PURE__*/React.createElement(Tooltip, {
     content: formatMessage(messages.verifiedAgentTooltip)
+  }, /*#__PURE__*/React.createElement(Flex, {
+    justifyContent: "center",
+    alignItems: "center",
+    xcss: cx(adjacentTextSize === 'body' && styles['body'], adjacentTextSize === 'headingMedium' && styles['headingMedium'], adjacentTextSize === 'headingLarge' && styles['headingLarge'], adjacentTextSize === 'textLarge' && styles['textLarge'])
   }, /*#__PURE__*/React.createElement(VerifiedIcon, {
     color: "var(--ds-icon-accent-blue, #357DE8)",
     label: formatMessage(messages.verifiedIconLabel),
-    size: size
-  }));
+    size: "small"
+  })));
 };

package/dist/types/ui/agent-dropdown-menu/index.d.ts

@@ -46,6 +46,6 @@ type AgentDropdownMenuProps = {
         isEditEnabled: boolean;
         isDeleteEnabled: boolean;
     }>;
-} & ViewAgentOptionProps & ViewAgentFullProfileProps & Partial<Pick<AgentVerificationDropdownItemProps, 'agentRef' | 'userPermissionsRef'>>;
-export declare const AgentDropdownMenu: ({ isAutodevTemplateAgent, agentId, onEditAgent, onCopyAgent, onDuplicateAgent, onDeleteAgent, onViewAgentFullProfileClick, onOpenChange, isForgeAgent, showViewAgentOption, onViewAgentClick, onDropdownTriggerClick, spacing, appearance, dropdownMenuTestId, doesAgentHaveIdentityAccountId, loadAgentPermissions, loadPermissionsOnMount, shouldTriggerStopPropagation, agentName, agentRef, userPermissionsRef, }: AgentDropdownMenuProps) => JSX.Element;
+} & ViewAgentOptionProps & ViewAgentFullProfileProps & Partial<Pick<AgentVerificationDropdownItemProps, 'agentRef' | 'userPermissionsRef' | 'onVerificationSuccess'>>;
+export declare const AgentDropdownMenu: ({ isAutodevTemplateAgent, onEditAgent, onCopyAgent, onDuplicateAgent, onDeleteAgent, onViewAgentFullProfileClick, onOpenChange, isForgeAgent, showViewAgentOption, onViewAgentClick, onDropdownTriggerClick, spacing, appearance, dropdownMenuTestId, doesAgentHaveIdentityAccountId, loadAgentPermissions, loadPermissionsOnMount, shouldTriggerStopPropagation, agentName, agentRef, userPermissionsRef, onVerificationSuccess, }: AgentDropdownMenuProps) => JSX.Element;
 export {};

package/dist/types/ui/agent-verification-dropdown-item/index.d.ts

@@ -8,6 +8,11 @@ export type AgentVerificationDropdownItemProps = {
      * Optional callback fired when the dropdown item is clicked, before the mutation is executed.
      */
     onClick?: () => void;
+    /**
+     * Optional callback fired when verification mutation succeeds.
+     * Called with the new verified state.
+     */
+    onVerificationSuccess?: (verified: boolean) => void;
     /**
      * Test ID for the dropdown item.
      */
@@ -18,4 +23,4 @@ export type AgentVerificationDropdownItemProps = {
  * Renders "Verify agent" if the agent is not verified, or "Unverify agent" if it is.
  * Returns null if the user doesn't have permission to govern agents or the feature flag is off.
  */
-export declare const AgentVerificationDropdownItem: ({ agentRef, userPermissionsRef, onClick, testId, }: AgentVerificationDropdownItemProps) => React.JSX.Element | null;
+export declare const AgentVerificationDropdownItem: ({ agentRef, userPermissionsRef, onClick, onVerificationSuccess, testId, }: AgentVerificationDropdownItemProps) => React.JSX.Element | null;

package/dist/types/ui/agent-verified/index.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
-import type { IconSize } from '@atlaskit/icon';
 import type { agentVerified_AtlaskitRovoAgentComponents$key } from './__generated__/agentVerified_AtlaskitRovoAgentComponents.graphql';
-export type AgentVerifiedProps = {
+export type AgentVerifiedProps = AgentVerifiedIconProps & {
     agentRef: agentVerified_AtlaskitRovoAgentComponents$key | null;
-    size?: IconSize;
 };
-export declare const AgentVerified: ({ agentRef, size, }: AgentVerifiedProps) => React.JSX.Element | null;
+export declare const AgentVerified: ({ agentRef, adjacentTextSize }: AgentVerifiedProps) => React.JSX.Element | null;
 export type AgentVerifiedIconProps = {
-    size?: IconSize;
+    /**
+     * Height matches line-height of adjacent text for proper vertical alignment
+     * when inline content wraps to multiple lines.
+     */
+    adjacentTextSize?: 'body' | 'textLarge' | 'headingMedium' | 'headingLarge';
 };
-export declare const AgentVerifiedIcon: ({ size }: AgentVerifiedIconProps) => React.JSX.Element;
+export declare const AgentVerifiedIcon: ({ adjacentTextSize }: AgentVerifiedIconProps) => React.JSX.Element;

package/dist/types-ts4.5/ui/agent-dropdown-menu/index.d.ts

@@ -46,6 +46,6 @@ type AgentDropdownMenuProps = {
         isEditEnabled: boolean;
         isDeleteEnabled: boolean;
     }>;
-} & ViewAgentOptionProps & ViewAgentFullProfileProps & Partial<Pick<AgentVerificationDropdownItemProps, 'agentRef' | 'userPermissionsRef'>>;
-export declare const AgentDropdownMenu: ({ isAutodevTemplateAgent, agentId, onEditAgent, onCopyAgent, onDuplicateAgent, onDeleteAgent, onViewAgentFullProfileClick, onOpenChange, isForgeAgent, showViewAgentOption, onViewAgentClick, onDropdownTriggerClick, spacing, appearance, dropdownMenuTestId, doesAgentHaveIdentityAccountId, loadAgentPermissions, loadPermissionsOnMount, shouldTriggerStopPropagation, agentName, agentRef, userPermissionsRef, }: AgentDropdownMenuProps) => JSX.Element;
+} & ViewAgentOptionProps & ViewAgentFullProfileProps & Partial<Pick<AgentVerificationDropdownItemProps, 'agentRef' | 'userPermissionsRef' | 'onVerificationSuccess'>>;
+export declare const AgentDropdownMenu: ({ isAutodevTemplateAgent, onEditAgent, onCopyAgent, onDuplicateAgent, onDeleteAgent, onViewAgentFullProfileClick, onOpenChange, isForgeAgent, showViewAgentOption, onViewAgentClick, onDropdownTriggerClick, spacing, appearance, dropdownMenuTestId, doesAgentHaveIdentityAccountId, loadAgentPermissions, loadPermissionsOnMount, shouldTriggerStopPropagation, agentName, agentRef, userPermissionsRef, onVerificationSuccess, }: AgentDropdownMenuProps) => JSX.Element;
 export {};

package/dist/types-ts4.5/ui/agent-verification-dropdown-item/index.d.ts

@@ -8,6 +8,11 @@ export type AgentVerificationDropdownItemProps = {
      * Optional callback fired when the dropdown item is clicked, before the mutation is executed.
      */
     onClick?: () => void;
+    /**
+     * Optional callback fired when verification mutation succeeds.
+     * Called with the new verified state.
+     */
+    onVerificationSuccess?: (verified: boolean) => void;
     /**
      * Test ID for the dropdown item.
      */
@@ -18,4 +23,4 @@ export type AgentVerificationDropdownItemProps = {
  * Renders "Verify agent" if the agent is not verified, or "Unverify agent" if it is.
  * Returns null if the user doesn't have permission to govern agents or the feature flag is off.
  */
-export declare const AgentVerificationDropdownItem: ({ agentRef, userPermissionsRef, onClick, testId, }: AgentVerificationDropdownItemProps) => React.JSX.Element | null;
+export declare const AgentVerificationDropdownItem: ({ agentRef, userPermissionsRef, onClick, onVerificationSuccess, testId, }: AgentVerificationDropdownItemProps) => React.JSX.Element | null;

package/dist/types-ts4.5/ui/agent-verified/index.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
-import type { IconSize } from '@atlaskit/icon';
 import type { agentVerified_AtlaskitRovoAgentComponents$key } from './__generated__/agentVerified_AtlaskitRovoAgentComponents.graphql';
-export type AgentVerifiedProps = {
+export type AgentVerifiedProps = AgentVerifiedIconProps & {
     agentRef: agentVerified_AtlaskitRovoAgentComponents$key | null;
-    size?: IconSize;
 };
-export declare const AgentVerified: ({ agentRef, size, }: AgentVerifiedProps) => React.JSX.Element | null;
+export declare const AgentVerified: ({ agentRef, adjacentTextSize }: AgentVerifiedProps) => React.JSX.Element | null;
 export type AgentVerifiedIconProps = {
-    size?: IconSize;
+    /**
+     * Height matches line-height of adjacent text for proper vertical alignment
+     * when inline content wraps to multiple lines.
+     */
+    adjacentTextSize?: 'body' | 'textLarge' | 'headingMedium' | 'headingLarge';
 };
-export declare const AgentVerifiedIcon: ({ size }: AgentVerifiedIconProps) => React.JSX.Element;
+export declare const AgentVerifiedIcon: ({ adjacentTextSize }: AgentVerifiedIconProps) => React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/rovo-agent-components",
-	"version": "3.28.0",
+	"version": "3.30.0",
 	"description": "This package host public components related to rovo agents, the components here are needed for other public atlaskit packages",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -39,7 +39,7 @@
 		"@atlaskit/css": "^0.19.0",
 		"@atlaskit/dropdown-menu": "^16.4.0",
 		"@atlaskit/flag": "^17.8.0",
-		"@atlaskit/heading": "^5.2.0",
+		"@atlaskit/heading": "^5.3.0",
 		"@atlaskit/icon": "^30.0.0",
 		"@atlaskit/link": "^3.3.0",
 		"@atlaskit/logo": "^19.10.0",