@atlaskit/profilecard 20.10.0 → 20.11.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/profilecard
 
+## 20.11.0
+
+### Minor Changes
+
+- [#163611](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/163611)
+  [`559a5e24a2892`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/559a5e24a2892) -
+  Fix asynchronous loading of agent profile card
+
 ## 20.10.0
 
 ### Minor Changes

package/afm-post-office/tsconfig.json

@@ -3,7 +3,7 @@
 	"compilerOptions": {
 		"declaration": true,
 		"target": "es5",
-		"outDir": "../../../../../tsDist/@atlaskit__profilecard/app",
+		"outDir": "../../../../../post-office/tsDist/@atlaskit__profilecard/app",
 		"rootDir": "../",
 		"composite": true
 	},

package/dist/cjs/client/getOrgIdForCloudIdFromAGG.js

@@ -11,7 +11,7 @@ var _graphqlUtils = require("./graphqlUtils");
 var ORG_ID_FROM_CLOUD_ID_QUERY = "query OrgIdFromCloudId($cloudId: ID!) {\n\ttenantContexts(cloudIds: [$cloudId]) {\n\t\torgId\n\t}\n}";
 var addHeaders = function addHeaders(headers) {
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "20.10.0");
+  headers.append('atl-client-version', "20.11.0");
   return headers;
 };
 function getOrgIdForCloudIdFromAGG(_x, _x2) {

package/dist/cjs/client/getTeamFromAGG.js

@@ -57,7 +57,7 @@ var addHeaders = exports.addHeaders = function addHeaders(headers) {
   headers.append('X-ExperimentalApi', 'teams-beta');
   headers.append('X-ExperimentalApi', 'team-members-beta');
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "20.10.0");
+  headers.append('atl-client-version', "20.11.0");
   return headers;
 };
 function getTeamFromAGG(_x, _x2, _x3) {

package/dist/cjs/components/Agent/AgentProfileCardResourced.js

@@ -102,65 +102,46 @@ var AgentProfileCardResourced = exports.AgentProfileCardResourced = function Age
       return _ref.apply(this, arguments);
     };
   }(), [creatorUserId, fireAnalytics, props.cloudId, props.resourceClient]);
-  var getAgentInfo = (0, _react.useCallback)(function () {
-    return props.resourceClient.getRovoAgentProfile({
-      type: 'identity',
-      value: props.accountId
-    }, fireAnalytics);
-  }, [fireAnalytics, props.accountId, props.resourceClient]);
-  var fetchData = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
-    var getAgentData, agentData;
-    return _regenerator.default.wrap(function _callee3$(_context3) {
-      while (1) switch (_context3.prev = _context3.next) {
+  var fetchData = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+    var profileData, agentCreatorInfo;
+    return _regenerator.default.wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
         case 0:
           setIsLoading(true);
-          getAgentData = /*#__PURE__*/function () {
-            var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
-              var profileData, agentCreatorInfo;
-              return _regenerator.default.wrap(function _callee2$(_context2) {
-                while (1) switch (_context2.prev = _context2.next) {
-                  case 0:
-                    _context2.next = 2;
-                    return getAgentInfo();
-                  case 2:
-                    profileData = _context2.sent;
-                    _context2.next = 5;
-                    return getCreator(profileData === null || profileData === void 0 ? void 0 : profileData.creator_type, (profileData === null || profileData === void 0 ? void 0 : profileData.creator) || undefined);
-                  case 5:
-                    agentCreatorInfo = _context2.sent;
-                    return _context2.abrupt("return", _objectSpread(_objectSpread({}, profileData), {}, {
-                      creatorInfo: agentCreatorInfo
-                    }));
-                  case 7:
-                  case "end":
-                    return _context2.stop();
-                }
-              }, _callee2);
-            }));
-            return function getAgentData() {
-              return _ref3.apply(this, arguments);
-            };
-          }();
-          _context3.next = 4;
-          return getAgentData();
+          _context2.prev = 1;
+          _context2.next = 4;
+          return props.resourceClient.getRovoAgentProfile({
+            type: 'identity',
+            value: props.accountId
+          }, fireAnalytics);
         case 4:
-          agentData = _context3.sent;
-          setAgentData(agentData);
-          setIsLoading(false);
+          profileData = _context2.sent;
+          _context2.next = 7;
+          return getCreator(profileData === null || profileData === void 0 ? void 0 : profileData.creator_type, (profileData === null || profileData === void 0 ? void 0 : profileData.creator) || undefined);
         case 7:
+          agentCreatorInfo = _context2.sent;
+          setAgentData(_objectSpread(_objectSpread({}, profileData), {}, {
+            creatorInfo: agentCreatorInfo
+          }));
+          _context2.next = 14;
+          break;
+        case 11:
+          _context2.prev = 11;
+          _context2.t0 = _context2["catch"](1);
+          setError(_context2.t0);
+        case 14:
+          _context2.prev = 14;
+          setIsLoading(false);
+          return _context2.finish(14);
+        case 17:
         case "end":
-          return _context3.stop();
+          return _context2.stop();
       }
-    }, _callee3);
-  })), [getAgentInfo, getCreator]);
+    }, _callee2, null, [[1, 11, 14, 17]]);
+  })), [fireAnalytics, getCreator, props.accountId, props.resourceClient]);
   (0, _react.useEffect)(function () {
-    try {
-      fetchData();
-    } catch (error) {
-      setIsLoading(false);
-      setError(error);
-    }
-  }, [fetchData, getAgentInfo, getCreator, props.accountId, props.cloudId, props.resourceClient]);
+    fetchData();
+  }, [fetchData]);
   if (error || !isLoading && !agentData) {
     return /*#__PURE__*/_react.default.createElement(_AgentProfileCardWrapper.AgentProfileCardWrapper, null, /*#__PURE__*/_react.default.createElement(_ErrorMessage.default, {
       reload: function reload() {
@@ -170,19 +151,18 @@ var AgentProfileCardResourced = exports.AgentProfileCardResourced = function Age
       fireAnalytics: function fireAnalytics() {}
     }));
   }
-  if (agentData) {
-    return /*#__PURE__*/_react.default.createElement(_lazyAgentProfileCard.AgentProfileCardLazy, {
-      agent: agentData,
-      isLoading: isLoading,
-      hasError: !!error,
-      isCreatedByViewingUser: creatorUserId === props.viewingUserId,
-      product: props.product,
-      onConversationStartersClick: props.onConversationStartersClick,
-      onChatClick: props.onChatClick,
-      addFlag: props.addFlag,
-      resourceClient: props.resourceClient,
-      cloudId: props.cloudId
-    });
-  }
-  return null;
+  return /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+    fallback: null
+  }, /*#__PURE__*/_react.default.createElement(_lazyAgentProfileCard.AgentProfileCardLazy, {
+    agent: agentData,
+    isLoading: isLoading,
+    hasError: !!error,
+    isCreatedByViewingUser: creatorUserId === props.viewingUserId,
+    product: props.product,
+    onConversationStartersClick: props.onConversationStartersClick,
+    onChatClick: props.onChatClick,
+    addFlag: props.addFlag,
+    resourceClient: props.resourceClient,
+    cloudId: props.cloudId
+  }));
 };

package/dist/cjs/util/analytics.js

@@ -45,7 +45,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
     actionSubjectId: actionSubjectId,
     attributes: _objectSpread(_objectSpread({
       packageName: "@atlaskit/profilecard",
-      packageVersion: "20.10.0"
+      packageVersion: "20.11.0"
     }, attributes), {}, {
       firedAt: Math.round((0, _performance.getPageTime)())
     })

package/dist/es2019/client/getOrgIdForCloudIdFromAGG.js

@@ -6,7 +6,7 @@ const ORG_ID_FROM_CLOUD_ID_QUERY = `query OrgIdFromCloudId($cloudId: ID!) {
 }`;
 const addHeaders = headers => {
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "20.10.0");
+  headers.append('atl-client-version', "20.11.0");
   return headers;
 };
 export async function getOrgIdForCloudIdFromAGG(url, cloudId) {

package/dist/es2019/client/getTeamFromAGG.js

@@ -67,7 +67,7 @@ export const addHeaders = headers => {
   headers.append('X-ExperimentalApi', 'teams-beta');
   headers.append('X-ExperimentalApi', 'team-members-beta');
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "20.10.0");
+  headers.append('atl-client-version', "20.11.0");
   return headers;
 };
 export async function getTeamFromAGG(url, teamId, siteId) {

package/dist/es2019/components/Agent/AgentProfileCardResourced.js

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { Suspense, useCallback, useEffect, useMemo, useState } from 'react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { fireEvent } from '../../util/analytics';
 import { getAAIDFromARI } from '../../util/rovoAgentUtils';
@@ -51,34 +51,27 @@ export const AgentProfileCardResourced = props => {
         return undefined;
     }
   }, [creatorUserId, fireAnalytics, props.cloudId, props.resourceClient]);
-  const getAgentInfo = useCallback(() => {
-    return props.resourceClient.getRovoAgentProfile({
-      type: 'identity',
-      value: props.accountId
-    }, fireAnalytics);
-  }, [fireAnalytics, props.accountId, props.resourceClient]);
   const fetchData = useCallback(async () => {
     setIsLoading(true);
-    const getAgentData = async () => {
-      const profileData = await getAgentInfo();
+    try {
+      const profileData = await props.resourceClient.getRovoAgentProfile({
+        type: 'identity',
+        value: props.accountId
+      }, fireAnalytics);
       const agentCreatorInfo = await getCreator(profileData === null || profileData === void 0 ? void 0 : profileData.creator_type, (profileData === null || profileData === void 0 ? void 0 : profileData.creator) || undefined);
-      return {
+      setAgentData({
         ...profileData,
         creatorInfo: agentCreatorInfo
-      };
-    };
-    const agentData = await getAgentData();
-    setAgentData(agentData);
-    setIsLoading(false);
-  }, [getAgentInfo, getCreator]);
-  useEffect(() => {
-    try {
-      fetchData();
-    } catch (error) {
+      });
+    } catch (err) {
+      setError(err);
+    } finally {
       setIsLoading(false);
-      setError(error);
     }
-  }, [fetchData, getAgentInfo, getCreator, props.accountId, props.cloudId, props.resourceClient]);
+  }, [fireAnalytics, getCreator, props.accountId, props.resourceClient]);
+  useEffect(() => {
+    fetchData();
+  }, [fetchData]);
   if (error || !isLoading && !agentData) {
     return /*#__PURE__*/React.createElement(AgentProfileCardWrapper, null, /*#__PURE__*/React.createElement(ErrorMessage, {
       reload: () => {
@@ -88,19 +81,18 @@ export const AgentProfileCardResourced = props => {
       fireAnalytics: () => {}
     }));
   }
-  if (agentData) {
-    return /*#__PURE__*/React.createElement(AgentProfileCardLazy, {
-      agent: agentData,
-      isLoading: isLoading,
-      hasError: !!error,
-      isCreatedByViewingUser: creatorUserId === props.viewingUserId,
-      product: props.product,
-      onConversationStartersClick: props.onConversationStartersClick,
-      onChatClick: props.onChatClick,
-      addFlag: props.addFlag,
-      resourceClient: props.resourceClient,
-      cloudId: props.cloudId
-    });
-  }
-  return null;
+  return /*#__PURE__*/React.createElement(Suspense, {
+    fallback: null
+  }, /*#__PURE__*/React.createElement(AgentProfileCardLazy, {
+    agent: agentData,
+    isLoading: isLoading,
+    hasError: !!error,
+    isCreatedByViewingUser: creatorUserId === props.viewingUserId,
+    product: props.product,
+    onConversationStartersClick: props.onConversationStartersClick,
+    onChatClick: props.onChatClick,
+    addFlag: props.addFlag,
+    resourceClient: props.resourceClient,
+    cloudId: props.cloudId
+  }));
 };

package/dist/es2019/util/analytics.js

@@ -32,7 +32,7 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
   actionSubjectId,
   attributes: {
     packageName: "@atlaskit/profilecard",
-    packageVersion: "20.10.0",
+    packageVersion: "20.11.0",
     ...attributes,
     firedAt: Math.round(getPageTime())
   }

package/dist/esm/client/getOrgIdForCloudIdFromAGG.js

@@ -4,7 +4,7 @@ import { AGGQuery } from './graphqlUtils';
 var ORG_ID_FROM_CLOUD_ID_QUERY = "query OrgIdFromCloudId($cloudId: ID!) {\n\ttenantContexts(cloudIds: [$cloudId]) {\n\t\torgId\n\t}\n}";
 var addHeaders = function addHeaders(headers) {
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "20.10.0");
+  headers.append('atl-client-version', "20.11.0");
   return headers;
 };
 export function getOrgIdForCloudIdFromAGG(_x, _x2) {

package/dist/esm/client/getTeamFromAGG.js

@@ -48,7 +48,7 @@ export var addHeaders = function addHeaders(headers) {
   headers.append('X-ExperimentalApi', 'teams-beta');
   headers.append('X-ExperimentalApi', 'team-members-beta');
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "20.10.0");
+  headers.append('atl-client-version', "20.11.0");
   return headers;
 };
 export function getTeamFromAGG(_x, _x2, _x3) {

package/dist/esm/components/Agent/AgentProfileCardResourced.js

@@ -4,7 +4,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { Suspense, useCallback, useEffect, useMemo, useState } from 'react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { fireEvent } from '../../util/analytics';
 import { getAAIDFromARI } from '../../util/rovoAgentUtils';
@@ -92,65 +92,46 @@ export var AgentProfileCardResourced = function AgentProfileCardResourced(props)
       return _ref.apply(this, arguments);
     };
   }(), [creatorUserId, fireAnalytics, props.cloudId, props.resourceClient]);
-  var getAgentInfo = useCallback(function () {
-    return props.resourceClient.getRovoAgentProfile({
-      type: 'identity',
-      value: props.accountId
-    }, fireAnalytics);
-  }, [fireAnalytics, props.accountId, props.resourceClient]);
-  var fetchData = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-    var getAgentData, agentData;
-    return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-      while (1) switch (_context3.prev = _context3.next) {
+  var fetchData = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+    var profileData, agentCreatorInfo;
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
         case 0:
           setIsLoading(true);
-          getAgentData = /*#__PURE__*/function () {
-            var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-              var profileData, agentCreatorInfo;
-              return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-                while (1) switch (_context2.prev = _context2.next) {
-                  case 0:
-                    _context2.next = 2;
-                    return getAgentInfo();
-                  case 2:
-                    profileData = _context2.sent;
-                    _context2.next = 5;
-                    return getCreator(profileData === null || profileData === void 0 ? void 0 : profileData.creator_type, (profileData === null || profileData === void 0 ? void 0 : profileData.creator) || undefined);
-                  case 5:
-                    agentCreatorInfo = _context2.sent;
-                    return _context2.abrupt("return", _objectSpread(_objectSpread({}, profileData), {}, {
-                      creatorInfo: agentCreatorInfo
-                    }));
-                  case 7:
-                  case "end":
-                    return _context2.stop();
-                }
-              }, _callee2);
-            }));
-            return function getAgentData() {
-              return _ref3.apply(this, arguments);
-            };
-          }();
-          _context3.next = 4;
-          return getAgentData();
+          _context2.prev = 1;
+          _context2.next = 4;
+          return props.resourceClient.getRovoAgentProfile({
+            type: 'identity',
+            value: props.accountId
+          }, fireAnalytics);
         case 4:
-          agentData = _context3.sent;
-          setAgentData(agentData);
-          setIsLoading(false);
+          profileData = _context2.sent;
+          _context2.next = 7;
+          return getCreator(profileData === null || profileData === void 0 ? void 0 : profileData.creator_type, (profileData === null || profileData === void 0 ? void 0 : profileData.creator) || undefined);
         case 7:
+          agentCreatorInfo = _context2.sent;
+          setAgentData(_objectSpread(_objectSpread({}, profileData), {}, {
+            creatorInfo: agentCreatorInfo
+          }));
+          _context2.next = 14;
+          break;
+        case 11:
+          _context2.prev = 11;
+          _context2.t0 = _context2["catch"](1);
+          setError(_context2.t0);
+        case 14:
+          _context2.prev = 14;
+          setIsLoading(false);
+          return _context2.finish(14);
+        case 17:
         case "end":
-          return _context3.stop();
+          return _context2.stop();
       }
-    }, _callee3);
-  })), [getAgentInfo, getCreator]);
+    }, _callee2, null, [[1, 11, 14, 17]]);
+  })), [fireAnalytics, getCreator, props.accountId, props.resourceClient]);
   useEffect(function () {
-    try {
-      fetchData();
-    } catch (error) {
-      setIsLoading(false);
-      setError(error);
-    }
-  }, [fetchData, getAgentInfo, getCreator, props.accountId, props.cloudId, props.resourceClient]);
+    fetchData();
+  }, [fetchData]);
   if (error || !isLoading && !agentData) {
     return /*#__PURE__*/React.createElement(AgentProfileCardWrapper, null, /*#__PURE__*/React.createElement(ErrorMessage, {
       reload: function reload() {
@@ -160,19 +141,18 @@ export var AgentProfileCardResourced = function AgentProfileCardResourced(props)
       fireAnalytics: function fireAnalytics() {}
     }));
   }
-  if (agentData) {
-    return /*#__PURE__*/React.createElement(AgentProfileCardLazy, {
-      agent: agentData,
-      isLoading: isLoading,
-      hasError: !!error,
-      isCreatedByViewingUser: creatorUserId === props.viewingUserId,
-      product: props.product,
-      onConversationStartersClick: props.onConversationStartersClick,
-      onChatClick: props.onChatClick,
-      addFlag: props.addFlag,
-      resourceClient: props.resourceClient,
-      cloudId: props.cloudId
-    });
-  }
-  return null;
+  return /*#__PURE__*/React.createElement(Suspense, {
+    fallback: null
+  }, /*#__PURE__*/React.createElement(AgentProfileCardLazy, {
+    agent: agentData,
+    isLoading: isLoading,
+    hasError: !!error,
+    isCreatedByViewingUser: creatorUserId === props.viewingUserId,
+    product: props.product,
+    onConversationStartersClick: props.onConversationStartersClick,
+    onChatClick: props.onChatClick,
+    addFlag: props.addFlag,
+    resourceClient: props.resourceClient,
+    cloudId: props.cloudId
+  }));
 };

package/dist/esm/util/analytics.js

@@ -39,7 +39,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
     actionSubjectId: actionSubjectId,
     attributes: _objectSpread(_objectSpread({
       packageName: "@atlaskit/profilecard",
-      packageVersion: "20.10.0"
+      packageVersion: "20.11.0"
     }, attributes), {}, {
       firedAt: Math.round(getPageTime())
     })

package/dist/types/components/Agent/AgentProfileCardResourced.d.ts

@@ -10,4 +10,4 @@ export type AgentProfileCardResourcedProps = {
     product?: string;
     addFlag?: (flag: Flag) => void;
 } & AgentActionsType;
-export declare const AgentProfileCardResourced: (props: AgentProfileCardResourcedProps) => JSX.Element | null;
+export declare const AgentProfileCardResourced: (props: AgentProfileCardResourcedProps) => JSX.Element;

package/dist/types-ts4.5/components/Agent/AgentProfileCardResourced.d.ts

@@ -10,4 +10,4 @@ export type AgentProfileCardResourcedProps = {
     product?: string;
     addFlag?: (flag: Flag) => void;
 } & AgentActionsType;
-export declare const AgentProfileCardResourced: (props: AgentProfileCardResourcedProps) => JSX.Element | null;
+export declare const AgentProfileCardResourced: (props: AgentProfileCardResourcedProps) => JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/profilecard",
-	"version": "20.10.0",
+	"version": "20.11.0",
 	"description": "A React component to display a card with user information.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"