@atlaskit/rovo-agent-components 0.1.0 → 0.1.2

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/rovo-agent-components
 
+## 0.1.2
+
+### Patch Changes
+
+- [#126478](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/126478)
+  [`09da97621f790`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/09da97621f790) -
+  Moving conversation-starters ans ChatPillIcon to rovo-agent-components, created
+  ConversationStarterWithAnalytics to be re-exported for internal atlassian consumption
+
+## 0.1.1
+
+### Patch Changes
+
+- [#125026](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/125026)
+  [`6a0fb797d9383`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/6a0fb797d9383) -
+  Fix not showing loading state if favouriteCount is undefined
+- Updated dependencies
+
 ## 0.1.0
 
 ### Minor Changes

package/dist/cjs/common/ui/chat-icon/index.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ChatPillIcon = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _icon = _interopRequireDefault(require("@atlaskit/icon"));
+var CustomGlyph = function CustomGlyph(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
+    width: "20",
+    height: "20",
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/_react.default.createElement("path", {
+    d: "M8.00023 14.25C7.86431 14.25 7.73094 14.287 7.61439 14.3569L3.75024 16.6752V14V4.99998C3.75024 4.30963 4.30988 3.74999 5.00023 3.74998L15.0002 3.74984C15.6906 3.74984 16.2502 4.30948 16.2502 4.99984V12.9999C16.2502 13.6902 15.6906 14.2498 15.0003 14.2499L8.00023 14.25Z",
+    stroke: "currentColor",
+    strokeWidth: "1.5",
+    strokeLinejoin: "round",
+    fill: "transparent"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "8",
+    width: "2",
+    height: "2",
+    rx: "1",
+    fill: "currentColor"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "9",
+    y: "8",
+    width: "2",
+    height: "2",
+    rx: "1",
+    fill: "currentColor"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "12",
+    y: "8",
+    width: "2",
+    height: "2",
+    rx: "1",
+    fill: "currentColor"
+  }));
+};
+var ChatPillIcon = exports.ChatPillIcon = function ChatPillIcon(props) {
+  return /*#__PURE__*/_react.default.createElement(_icon.default, (0, _extends2.default)({}, props, {
+    glyph: CustomGlyph,
+    label: ""
+  }));
+};

package/dist/cjs/common/ui/chat-pill/index.js

@@ -0,0 +1,64 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ChatPill = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _primitives = require("@atlaskit/primitives");
+var _chatIcon = require("../chat-icon");
+var _excluded = ["children", "whiteSpacePreWrap"];
+var buttonStyles = (0, _primitives.xcss)({
+  color: 'color.text',
+  padding: 'space.100',
+  borderRadius: 'border.radius.200',
+  borderBottomRightRadius: "var(--ds-border-radius-050, 2px)",
+  lineHeight: '20px',
+  fontWeight: '500',
+  fontSize: '14px',
+  textOverflow: 'ellipsis',
+  whiteSpace: 'nowrap',
+  flexShrink: 1,
+  backgroundColor: 'color.background.neutral',
+  ':hover': {
+    backgroundColor: 'color.background.neutral.hovered'
+  },
+  ':active': {
+    backgroundColor: 'color.background.neutral.pressed'
+  }
+});
+var buttonInlineStyles = (0, _primitives.xcss)({
+  paddingInline: 'space.025'
+});
+var queryTextStyles = (0, _primitives.xcss)({
+  wordBreak: 'break-word',
+  textAlign: 'left'
+});
+var whiteSpacePreWrapStyles = (0, _primitives.xcss)({
+  whiteSpace: 'pre-wrap'
+});
+var iconWrapper = (0, _primitives.xcss)({
+  minWidth: '20px',
+  height: '20px'
+});
+var ChatPill = exports.ChatPill = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    _ref$whiteSpacePreWra = _ref.whiteSpacePreWrap,
+    whiteSpacePreWrap = _ref$whiteSpacePreWra === void 0 ? true : _ref$whiteSpacePreWra,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_primitives.Pressable, (0, _extends2.default)({
+    ref: ref
+  }, props, {
+    xcss: buttonStyles
+  }), /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
+    space: "space.050",
+    xcss: buttonInlineStyles
+  }, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    xcss: iconWrapper
+  }, /*#__PURE__*/_react.default.createElement(_chatIcon.ChatPillIcon, null)), /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    xcss: [queryTextStyles, whiteSpacePreWrap && whiteSpacePreWrapStyles]
+  }, children)));
+});

package/dist/cjs/index.js

@@ -3,6 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "AgentConversationStarters", {
+  enumerable: true,
+  get: function get() {
+    return _agentConversationStarters.AgentConversationStarters;
+  }
+});
 Object.defineProperty(exports, "AgentProfileCreator", {
   enumerable: true,
   get: function get() {
@@ -21,11 +27,32 @@ Object.defineProperty(exports, "AgentStarCount", {
     return _agentProfileInfo.AgentStarCount;
   }
 });
+Object.defineProperty(exports, "ChatPill", {
+  enumerable: true,
+  get: function get() {
+    return _chatPill.ChatPill;
+  }
+});
+Object.defineProperty(exports, "ChatPillIcon", {
+  enumerable: true,
+  get: function get() {
+    return _chatIcon.ChatPillIcon;
+  }
+});
 Object.defineProperty(exports, "StarIconButton", {
   enumerable: true,
   get: function get() {
     return _starIconButton.StarIconButton;
   }
 });
+Object.defineProperty(exports, "getConversationStarters", {
+  enumerable: true,
+  get: function get() {
+    return _agentConversationStarters.getConversationStarters;
+  }
+});
 var _agentProfileInfo = require("./ui/agent-profile-info");
-var _starIconButton = require("./common/ui/star-icon-button");
+var _starIconButton = require("./common/ui/star-icon-button");
+var _agentConversationStarters = require("./ui/agent-conversation-starters");
+var _chatPill = require("./common/ui/chat-pill");
+var _chatIcon = require("./common/ui/chat-icon");

package/dist/cjs/ui/agent-avatar/icons/index.js

@@ -0,0 +1 @@
+"use strict";

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

@@ -0,0 +1 @@
+"use strict";

package/dist/cjs/ui/agent-conversation-starters/index.js

@@ -0,0 +1,143 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePageContextType = exports.getConversationStarters = exports.PageContextType = exports.AgentConversationStarters = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _bindEventListener = require("bind-event-listener");
+var _reactIntlNext = require("react-intl-next");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _chatPill = require("../../common/ui/chat-pill");
+var _messages = require("./messages");
+var _PAGE_TYPE_CONVERSATI;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function useWindowLocationChange() {
+  var _useState = (0, _react.useState)(window.location.href),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    location = _useState2[0],
+    setLocation = _useState2[1];
+  var handleLocationChange = function handleLocationChange() {
+    setLocation(window.location.href);
+  };
+  (0, _react.useEffect)(function () {
+    var originalPushState = window.history.pushState;
+    var originalReplaceState = window.history.replaceState;
+    window.history.pushState = function () {
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      originalPushState.apply(this, args);
+      handleLocationChange();
+    };
+    window.history.replaceState = function () {
+      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+        args[_key2] = arguments[_key2];
+      }
+      originalReplaceState.apply(this, args);
+      handleLocationChange();
+    };
+    var unbind = (0, _bindEventListener.bindAll)(window, [{
+      type: 'popstate',
+      listener: handleLocationChange
+    }]);
+    return function () {
+      unbind();
+      window.history.pushState = originalPushState;
+      window.history.replaceState = originalReplaceState;
+    };
+  }, []);
+  return location;
+}
+var PageContextType = exports.PageContextType = /*#__PURE__*/function (PageContextType) {
+  PageContextType["CONFLUENCE_HOME"] = "confluence-home";
+  PageContextType["CONFLUENCE_PAGE_VIEW"] = "confluence-page-view";
+  PageContextType["CONFLUENCE_PAGE_EDIT"] = "confluence-page-edit";
+  PageContextType["JIRA_HOME"] = "jira-home";
+  PageContextType["JIRA_ISSUE_VIEW"] = "jira-issue-view";
+  PageContextType["JIRA_ISSUE_LIST"] = "jira-issue-list";
+  PageContextType["UNKNOWN"] = "unknown";
+  return PageContextType;
+}({});
+var PAGE_TYPE_CONVERSATION_STARTERS = (_PAGE_TYPE_CONVERSATI = {}, (0, _defineProperty2.default)(_PAGE_TYPE_CONVERSATI, PageContextType.CONFLUENCE_HOME, [_messages.messages.confluenceHomeSuggestion1, _messages.messages.confluenceHomeSuggestion2, _messages.messages.confluenceHomeSuggestion3]), (0, _defineProperty2.default)(_PAGE_TYPE_CONVERSATI, PageContextType.CONFLUENCE_PAGE_EDIT, [_messages.messages.confluencePageEditSuggestion1, _messages.messages.confluencePageEditSuggestion2, _messages.messages.confluencePageEditSuggestion3]), (0, _defineProperty2.default)(_PAGE_TYPE_CONVERSATI, PageContextType.CONFLUENCE_PAGE_VIEW, [_messages.messages.confluencePageViewSuggestion1, _messages.messages.confluencePageViewSuggestion2, _messages.messages.confluencePageViewSuggestion3]), (0, _defineProperty2.default)(_PAGE_TYPE_CONVERSATI, PageContextType.JIRA_HOME, [_messages.messages.jiraHomeSuggestion1, _messages.messages.jiraHomeSuggestion2, _messages.messages.jiraHomeSuggestion3]), (0, _defineProperty2.default)(_PAGE_TYPE_CONVERSATI, PageContextType.JIRA_ISSUE_VIEW, [_messages.messages.jiraIssueViewSuggestion1, _messages.messages.jiraIssueViewSuggestion2, _messages.messages.jiraIssueViewSuggestion3]), (0, _defineProperty2.default)(_PAGE_TYPE_CONVERSATI, PageContextType.JIRA_ISSUE_LIST, [_messages.messages.jiraIssueListSuggestion1, _messages.messages.jiraIssueListSuggestion2, _messages.messages.jiraIssueListSuggestion3]), (0, _defineProperty2.default)(_PAGE_TYPE_CONVERSATI, PageContextType.UNKNOWN, [_messages.messages.emptyStateSuggestion1, _messages.messages.emptyStateSuggestion2, _messages.messages.emptyStateSuggestion3]), _PAGE_TYPE_CONVERSATI);
+function determinePageType(location) {
+  var urlPatterns = [[PageContextType.CONFLUENCE_HOME, /\/wiki\/home$/], [PageContextType.CONFLUENCE_PAGE_EDIT, /\/wiki\/spaces\/[^\/]+\/(?:pages|blog)\/edit-v2\//], [PageContextType.CONFLUENCE_PAGE_VIEW, /\/wiki\/spaces\/[^\/]+\/(?:pages|blog)\//], [PageContextType.JIRA_ISSUE_VIEW, /\/browse\/[^\/]+$/], [PageContextType.JIRA_ISSUE_VIEW, /\/jira\/.+\/projects\/.+\?selectedIssue/], [PageContextType.JIRA_ISSUE_LIST, /\/jira\/.+\/projects\//], [PageContextType.JIRA_HOME, /\/jira\/dashboards\/last-visited$/]];
+  for (var _i = 0, _urlPatterns = urlPatterns; _i < _urlPatterns.length; _i++) {
+    var _urlPatterns$_i = (0, _slicedToArray2.default)(_urlPatterns[_i], 2),
+      type = _urlPatterns$_i[0],
+      pattern = _urlPatterns$_i[1];
+    if (pattern.test(location)) {
+      return type;
+    }
+  }
+  return PageContextType.UNKNOWN;
+}
+var usePageContextType = exports.usePageContextType = function usePageContextType() {
+  var location = useWindowLocationChange();
+  var _useState3 = (0, _react.useState)(determinePageType(location)),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    pageContextType = _useState4[0],
+    setPageContextType = _useState4[1];
+  (0, _react.useEffect)(function () {
+    setPageContextType(determinePageType(location));
+  }, [location]);
+  return pageContextType;
+};
+var getConversationStarters = exports.getConversationStarters = function getConversationStarters(_ref) {
+  var userDefinedConversationStartersParam = _ref.userDefinedConversationStarters,
+    isAgentDefault = _ref.isAgentDefault,
+    _ref$pageContextType = _ref.pageContextType,
+    pageContextType = _ref$pageContextType === void 0 ? PageContextType.UNKNOWN : _ref$pageContextType;
+  var customAgentConversationStarters = [_messages.messages.agentEmptyStateSuggestion1, _messages.messages.agentEmptyStateSuggestion2, _messages.messages.agentEmptyStateSuggestion3];
+  var userDefinedConversationStarters = userDefinedConversationStartersParam !== null && userDefinedConversationStartersParam !== void 0 ? userDefinedConversationStartersParam : [];
+  var isPageContextConvoStartersEnabled = (0, _platformFeatureFlags.fg)('rovo_chat_page_context_static_convo_starters');
+  var defaultAgentConversationStarters = isPageContextConvoStartersEnabled ? PAGE_TYPE_CONVERSATION_STARTERS[pageContextType] : [_messages.messages.emptyStateSuggestion1, _messages.messages.emptyStateSuggestion2, _messages.messages.emptyStateSuggestion3];
+  var getCombinedConversationStarters = function getCombinedConversationStarters() {
+    if (!isAgentDefault && (0, _platformFeatureFlags.fg)('rovo_chat_new_create_agent')) {
+      // Return default suggestions + user defined suggestions with a max of 3 suggestions
+      return [].concat((0, _toConsumableArray2.default)(customAgentConversationStarters.slice(0, 3 - userDefinedConversationStarters.length)), (0, _toConsumableArray2.default)(userDefinedConversationStarters));
+    }
+    return defaultAgentConversationStarters;
+  };
+  return {
+    userDefinedConversationStarters: userDefinedConversationStarters,
+    customAgentConversationStarters: customAgentConversationStarters,
+    defaultAgentConversationStarters: defaultAgentConversationStarters,
+    combinedConversationStarters: getCombinedConversationStarters()
+  };
+};
+var AgentConversationStarters = exports.AgentConversationStarters = function AgentConversationStarters(_ref2) {
+  var userDefinedConversationStarters = _ref2.userDefinedConversationStarters,
+    isAgentDefault = _ref2.isAgentDefault,
+    onConversationStarterClick = _ref2.onConversationStarterClick;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var pageContextType = usePageContextType();
+  var _useMemo = (0, _react.useMemo)(function () {
+      return getConversationStarters({
+        userDefinedConversationStarters: userDefinedConversationStarters,
+        isAgentDefault: isAgentDefault,
+        pageContextType: pageContextType
+      });
+    }, [userDefinedConversationStarters, isAgentDefault, pageContextType]),
+    combinedConversationStarters = _useMemo.combinedConversationStarters;
+  var _onClick = (0, _react.useCallback)(function (message) {
+    onConversationStarterClick(message);
+  }, [onConversationStarterClick]);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, combinedConversationStarters.map(function (starter) {
+    var translatedMessage = typeof starter === 'string' ? starter : formatMessage(starter);
+    return /*#__PURE__*/_react.default.createElement(_chatPill.ChatPill, {
+      testId: "conversation-starter",
+      key: translatedMessage,
+      onClick: function onClick() {
+        return _onClick(translatedMessage);
+      }
+    }, translatedMessage);
+  }));
+};

package/dist/cjs/ui/agent-conversation-starters/messages.js

@@ -0,0 +1,129 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.messages = void 0;
+var _reactIntlNext = require("react-intl-next");
+var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
+  emptyStateSuggestion1: {
+    id: 'ai-mate.chat-history.empty-state.suggestion1',
+    defaultMessage: 'Are any of my tickets overdue?',
+    description: 'The first suggestion displayed in the empty state of the chat history'
+  },
+  emptyStateSuggestion2: {
+    id: 'ai-mate.chat-history.empty-state.suggestion2',
+    defaultMessage: 'What should I work on next?',
+    description: 'The second suggestion displayed in the empty state of the chat history'
+  },
+  emptyStateSuggestion3: {
+    id: 'ai-mate.chat-history.empty-state.suggestion3',
+    defaultMessage: 'Write an update about my week',
+    description: 'The third suggestion displayed in the empty state of the chat history'
+  },
+  agentEmptyStateSuggestion1: {
+    id: 'ai-mate.chat-history.empty-state.agent-suggestion1',
+    defaultMessage: 'Tell me about yourself',
+    description: 'The first suggestion displayed in the empty state when an agent is selected'
+  },
+  agentEmptyStateSuggestion2: {
+    id: 'ai-mate.chat-history.empty-state.agent-suggestion2',
+    defaultMessage: 'What can you help me with?',
+    description: 'The second suggestion displayed in the empty state when an agent is selected'
+  },
+  agentEmptyStateSuggestion3: {
+    id: 'ai-mate.chat-history.empty-state.agent-suggestion3',
+    defaultMessage: "Summarize what I'm looking at",
+    description: 'The third suggestion displayed in the empty state when an agent is selected'
+  },
+  confluenceHomeSuggestion1: {
+    id: 'ai-mate.chat-history.empty-state.confluence-home.suggestion1',
+    defaultMessage: "Is there any new activity on pages I've written?",
+    description: 'The first suggestion displayed in the empty state of the chat history when viewing confluence home.'
+  },
+  confluenceHomeSuggestion2: {
+    id: 'ai-mate.chat-history.empty-state.confluence-home.suggestion2',
+    defaultMessage: "What's popular at the moment?",
+    description: 'The second suggestion displayed in the empty state of the chat history when viewing confluence home.'
+  },
+  confluenceHomeSuggestion3: {
+    id: 'ai-mate.chat-history.empty-state.confluence-home.suggestion3',
+    defaultMessage: 'How can Rovo help me use Confluence?',
+    description: 'The third suggestion displayed in the empty state of the chat history when viewing confluence home.'
+  },
+  confluencePageEditSuggestion1: {
+    id: 'ai-mate.chat-history.empty-state.confluence-page-edit.suggestion1',
+    defaultMessage: 'Can you improve the writing on this page?',
+    description: 'The first suggestion displayed in the empty state of the chat history when editing a confluence page.'
+  },
+  confluencePageEditSuggestion2: {
+    id: 'ai-mate.chat-history.empty-state.confluence-page-edit.suggestion2',
+    defaultMessage: 'Write an executive summary for this page.',
+    description: 'The second suggestion displayed in the empty state of the chat history when editing a confluence page.'
+  },
+  confluencePageEditSuggestion3: {
+    id: 'ai-mate.chat-history.empty-state.confluence-page-edit.suggestion3',
+    defaultMessage: 'Give me links to some other relevant pages.',
+    description: 'The third suggestion displayed in the empty state of the chat history when editing a confluence page.'
+  },
+  confluencePageViewSuggestion1: {
+    id: 'ai-mate.chat-history.empty-state.confluence-page-view.suggestion1',
+    defaultMessage: 'Summarize what I’m looking at.',
+    description: 'The first suggestion displayed in the empty state of the chat history when viewing a confluence page.'
+  },
+  confluencePageViewSuggestion2: {
+    id: 'ai-mate.chat-history.empty-state.confluence-page-view.suggestion2',
+    defaultMessage: 'Has anything on this page changed in the last week?',
+    description: 'The second suggestion displayed in the empty state of the chat history when viewing a confluence page.'
+  },
+  confluencePageViewSuggestion3: {
+    id: 'ai-mate.chat-history.empty-state.confluence-page-view.suggestion3',
+    defaultMessage: 'Summarize the comments on this page.',
+    description: 'The third suggestion displayed in the empty state of the chat history when viewing a confluence page.'
+  },
+  jiraHomeSuggestion1: {
+    id: 'ai-mate.chat-history.empty-state.jira-home.suggestion1',
+    defaultMessage: 'What’s changed in the past week?',
+    description: 'The first suggestion displayed in the empty state of the chat history when viewing jira home.'
+  },
+  jiraHomeSuggestion2: {
+    id: 'ai-mate.chat-history.empty-state.jira-home.suggestion2',
+    defaultMessage: 'What issues are the highest priority?',
+    description: 'The second suggestion displayed in the empty state of the chat history when viewing jira home.'
+  },
+  jiraHomeSuggestion3: {
+    id: 'ai-mate.chat-history.empty-state.jira-home.suggestion3',
+    defaultMessage: 'What issues have comments mentioning me?',
+    description: 'The third suggestion displayed in the empty state of the chat history when viewing jira home.'
+  },
+  jiraIssueViewSuggestion1: {
+    id: 'ai-mate.chat-history.empty-state.jira-issue-view.suggestion1',
+    defaultMessage: 'Are there any similar issues to this one?',
+    description: 'The first suggestion displayed in the empty state of the chat history when viewing a jira issue.'
+  },
+  jiraIssueViewSuggestion2: {
+    id: 'ai-mate.chat-history.empty-state.jira-issue-view.suggestion2',
+    defaultMessage: 'What issues aren’t connected to a parent issue?',
+    description: 'The second suggestion displayed in the empty state of the chat history when viewing a jira issue.'
+  },
+  jiraIssueViewSuggestion3: {
+    id: 'ai-mate.chat-history.empty-state.jira-issue-view.suggestion3',
+    defaultMessage: 'List the issues that are currently “In Progress” and group them by assignee.',
+    description: 'The third suggestion displayed in the empty state of the chat history when viewing a jira issue.'
+  },
+  jiraIssueListSuggestion1: {
+    id: 'ai-mate.chat-history.empty-state.jira-issue-list.suggestion1',
+    defaultMessage: 'What issues are unassigned?',
+    description: 'The first suggestion displayed in the empty state of the chat history when viewing a list of jira issues.'
+  },
+  jiraIssueListSuggestion2: {
+    id: 'ai-mate.chat-history.empty-state.jira-issue-list.suggestion2',
+    defaultMessage: 'What issues have been open the longest?',
+    description: 'The second suggestion displayed in the empty state of the chat history when viewing a list of jira issues.'
+  },
+  jiraIssueListSuggestion3: {
+    id: 'ai-mate.chat-history.empty-state.jira-issue-list.suggestion3',
+    defaultMessage: 'Who has the most tasks?',
+    description: 'The third suggestion displayed in the empty state of the chat history when viewing a list of jira issues.'
+  }
+});

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

@@ -88,7 +88,7 @@ var AgentStarCount = exports.AgentStarCount = function AgentStarCount(_ref2) {
     isLoading = _ref2.isLoading;
   var _useIntl2 = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl2.formatMessage;
-  if (starCount === null || starCount === undefined) {
+  if ((starCount === null || starCount === undefined) && !isLoading) {
     return null;
   }
   return /*#__PURE__*/_react.default.createElement(_primitives.Box, {

package/dist/es2019/common/ui/chat-icon/index.js

@@ -0,0 +1,41 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Icon from '@atlaskit/icon';
+const CustomGlyph = props => /*#__PURE__*/React.createElement("svg", _extends({
+  width: "20",
+  height: "20",
+  viewBox: "0 0 20 20",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, props), /*#__PURE__*/React.createElement("path", {
+  d: "M8.00023 14.25C7.86431 14.25 7.73094 14.287 7.61439 14.3569L3.75024 16.6752V14V4.99998C3.75024 4.30963 4.30988 3.74999 5.00023 3.74998L15.0002 3.74984C15.6906 3.74984 16.2502 4.30948 16.2502 4.99984V12.9999C16.2502 13.6902 15.6906 14.2498 15.0003 14.2499L8.00023 14.25Z",
+  stroke: "currentColor",
+  strokeWidth: "1.5",
+  strokeLinejoin: "round",
+  fill: "transparent"
+}), /*#__PURE__*/React.createElement("rect", {
+  x: "6",
+  y: "8",
+  width: "2",
+  height: "2",
+  rx: "1",
+  fill: "currentColor"
+}), /*#__PURE__*/React.createElement("rect", {
+  x: "9",
+  y: "8",
+  width: "2",
+  height: "2",
+  rx: "1",
+  fill: "currentColor"
+}), /*#__PURE__*/React.createElement("rect", {
+  x: "12",
+  y: "8",
+  width: "2",
+  height: "2",
+  rx: "1",
+  fill: "currentColor"
+}));
+export const ChatPillIcon = props => /*#__PURE__*/React.createElement(Icon, _extends({}, props, {
+  glyph: CustomGlyph,
+  label: ""
+}));

package/dist/es2019/common/ui/chat-pill/index.js

@@ -0,0 +1,53 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { Box, Inline, Pressable, xcss } from '@atlaskit/primitives';
+import { ChatPillIcon } from '../chat-icon';
+const buttonStyles = xcss({
+  color: 'color.text',
+  padding: 'space.100',
+  borderRadius: 'border.radius.200',
+  borderBottomRightRadius: "var(--ds-border-radius-050, 2px)",
+  lineHeight: '20px',
+  fontWeight: '500',
+  fontSize: '14px',
+  textOverflow: 'ellipsis',
+  whiteSpace: 'nowrap',
+  flexShrink: 1,
+  backgroundColor: 'color.background.neutral',
+  ':hover': {
+    backgroundColor: 'color.background.neutral.hovered'
+  },
+  ':active': {
+    backgroundColor: 'color.background.neutral.pressed'
+  }
+});
+const buttonInlineStyles = xcss({
+  paddingInline: 'space.025'
+});
+const queryTextStyles = xcss({
+  wordBreak: 'break-word',
+  textAlign: 'left'
+});
+const whiteSpacePreWrapStyles = xcss({
+  whiteSpace: 'pre-wrap'
+});
+const iconWrapper = xcss({
+  minWidth: '20px',
+  height: '20px'
+});
+export const ChatPill = /*#__PURE__*/React.forwardRef(({
+  children,
+  whiteSpacePreWrap = true,
+  ...props
+}, ref) => /*#__PURE__*/React.createElement(Pressable, _extends({
+  ref: ref
+}, props, {
+  xcss: buttonStyles
+}), /*#__PURE__*/React.createElement(Inline, {
+  space: "space.050",
+  xcss: buttonInlineStyles
+}, /*#__PURE__*/React.createElement(Box, {
+  xcss: iconWrapper
+}, /*#__PURE__*/React.createElement(ChatPillIcon, null)), /*#__PURE__*/React.createElement(Box, {
+  xcss: [queryTextStyles, whiteSpacePreWrap && whiteSpacePreWrapStyles]
+}, children))));

package/dist/es2019/index.js

@@ -1,2 +1,5 @@
 export { AgentProfileInfo, AgentProfileCreator, AgentStarCount } from './ui/agent-profile-info';
-export { StarIconButton } from './common/ui/star-icon-button';
+export { StarIconButton } from './common/ui/star-icon-button';
+export { AgentConversationStarters, getConversationStarters } from './ui/agent-conversation-starters';
+export { ChatPill } from './common/ui/chat-pill';
+export { ChatPillIcon } from './common/ui/chat-icon';