@atlaskit/give-kudos 1.1.3 → 2.0.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlassian/give-kudos
 
+## 2.0.1
+
+### Patch Changes
+
+- [`7490bbf65f2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7490bbf65f2) - Exporting types
+
+## 2.0.0
+
+### Major Changes
+
+- [`4ebab06438a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4ebab06438a) - [ux] Added types for the flag event listener. Added new flags for jira kudos success and failure.
+
 ## 1.1.3
 
 ### Patch Changes

package/dist/cjs/index.js

@@ -4,6 +4,12 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "FlagEventType", {
+  enumerable: true,
+  get: function get() {
+    return _types.FlagEventType;
+  }
+});
 Object.defineProperty(exports, "GiveKudosLauncher", {
   enumerable: true,
   get: function get() {

package/dist/cjs/messages.js

@@ -21,6 +21,26 @@ var messages = (0, _reactIntlNext.defineMessages)({
     defaultMessage: 'Your kudos has been sent. <a>View kudos</a>',
     description: 'Description text for the kudos created flag. This includes a link to view the newly created kudos.'
   },
+  JiraKudosCreatedFlag: {
+    id: 'team-central.give-jira-kudos.created.title.flag',
+    defaultMessage: 'Kudos created',
+    description: 'Title text for kudos creation flag.'
+  },
+  JiraKudosCreatedDescriptionFlag: {
+    id: 'team-central.give-jira-kudos.created.description.flag',
+    defaultMessage: 'Our Workplace Experience team will now work their magic for the gift request. ✨',
+    description: 'Description text for the atlas and jira kudos created flag. This includes links to view the newly created kudos and jira kudos request.'
+  },
+  JiraKudosCreationFailedFlag: {
+    id: 'team-central.give-jira-kudos.creation.failed.title.flag',
+    defaultMessage: "We couldn't send the gift",
+    description: 'Title text for jira kudos creation failed flag.'
+  },
+  JiraKudosCreationFailedDescriptionFlag: {
+    id: 'team-central.give-jira-kudos.creation.failed.description.flag',
+    defaultMessage: "We sent the kudos but we couldn't send the gift due to an error. Please raise a separate ticket at <a>go/kudos</a>.",
+    description: 'Description text for the jira kudos creation failed flag. This includes a link to the atlas kudos and jira kudos form.'
+  },
   unsavedKudosWarning: {
     id: 'team-central.give-kudos.unsaved.warning',
     defaultMessage: 'Changes that you made will not be saved.',

package/dist/cjs/types.js

@@ -3,10 +3,19 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.KudosType = void 0;
+exports.KudosType = exports.FlagEventType = void 0;
 var KudosType = /*#__PURE__*/function (KudosType) {
   KudosType["INDIVIDUAL"] = "individual";
   KudosType["TEAM"] = "team";
   return KudosType;
 }({});
-exports.KudosType = KudosType;
+exports.KudosType = KudosType;
+var FlagEventType = /*#__PURE__*/function (FlagEventType) {
+  FlagEventType["KUDOS_CREATED"] = "kudos-created";
+  FlagEventType["JIRA_KUDOS_CREATED"] = "jira-kudos-created";
+  FlagEventType["JIRA_KUDOS_FAILED"] = "jira-kudos-failed";
+  FlagEventType["DIRTY"] = "dirty";
+  FlagEventType["CLOSE"] = "close";
+  return FlagEventType;
+}({});
+exports.FlagEventType = FlagEventType;

package/dist/cjs/ui/GiveKudosLauncher/main.js

@@ -22,6 +22,7 @@ var _portal = _interopRequireDefault(require("@atlaskit/portal"));
 var _colors = require("@atlaskit/theme/colors");
 var _constants = require("@atlaskit/theme/constants");
 var _messages = _interopRequireDefault(require("../../messages"));
+var _types = require("../../types");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -31,7 +32,7 @@ var iframeStyles = (0, _react2.css)({
 });
 var sidebarDivStyles = (0, _react2.css)({
   position: 'absolute',
-  margin: '16px 0 0 16px',
+  margin: "var(--ds-space-200, 16px)".concat(" 0 0 ", "var(--ds-space-200, 16px)"),
   display: 'flex',
   alignItems: 'center',
   justifyContent: 'center'
@@ -90,22 +91,21 @@ var GiveKudosLauncher = function GiveKudosLauncher(props) {
   var closeWarningModal = function closeWarningModal() {
     setIsCloseConfirmModalOpen(false);
   };
-  var messageListener = (0, _react.useCallback)(function (event) {
-    if (!props.isOpen) {
-      return;
-    }
-    if (String(event.data).startsWith('kudos-created-')) {
-      var uuid = String(event.data).replace(/^(kudos-created-)/, '');
+  var createFlagWithJsonStringifiedInput = (0, _react.useCallback)(function (flagEvent) {
+    if (flagEvent.eventType === _types.FlagEventType.KUDOS_CREATED) {
       closeDrawer();
       sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid) {
+        return;
+      }
       addFlag && addFlag({
         title: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.default.kudosCreatedFlag),
-        id: "kudosCreatedFlag-".concat(uuid),
+        id: "kudosCreatedFlag-".concat(flagEvent.kudosUuid),
         description: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.default.kudosCreatedDescriptionFlag, {
           values: {
             a: function a(s) {
               return (0, _react2.jsx)("a", {
-                href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(uuid)
+                href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(flagEvent.kudosUuid)
               }, s);
             }
           }
@@ -115,12 +115,96 @@ var GiveKudosLauncher = function GiveKudosLauncher(props) {
           primaryColor: "var(--ds-icon-success, ".concat(_colors.G300, ")")
         })
       });
-    } else if (event.data === 'dirty') {
+    } else if (flagEvent.eventType === _types.FlagEventType.JIRA_KUDOS_CREATED) {
+      closeDrawer();
+      sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid || !flagEvent.jiraKudosUrl) {
+        return;
+      }
+      addFlag && addFlag({
+        title: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.default.JiraKudosCreatedFlag),
+        id: "kudosCreatedFlag-".concat(flagEvent.kudosUuid),
+        description: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.default.JiraKudosCreatedDescriptionFlag),
+        icon: (0, _react2.jsx)(_checkCircle.default, {
+          label: "success",
+          primaryColor: "var(--ds-icon-success, ".concat(_colors.G300, ")")
+        }),
+        actions: [{
+          content: 'Track gift request',
+          href: flagEvent.jiraKudosUrl
+        }, {
+          content: 'View kudos',
+          href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(flagEvent.kudosUuid)
+        }]
+      });
+    } else if (flagEvent.eventType === _types.FlagEventType.JIRA_KUDOS_FAILED) {
+      closeDrawer();
+      sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid || !flagEvent.jiraKudosFormUrl) {
+        return;
+      }
+      addFlag && addFlag({
+        title: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.default.JiraKudosCreationFailedFlag),
+        id: "jiraKudosCreationFailedFlag-".concat(flagEvent.kudosUuid),
+        description: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.default.JiraKudosCreationFailedDescriptionFlag, {
+          values: {
+            a: function a(s) {
+              return (0, _react2.jsx)("a", {
+                href: flagEvent.jiraKudosFormUrl
+              }, s);
+            }
+          }
+        })),
+        type: 'warning',
+        actions: [{
+          content: 'Visit go/kudos',
+          href: flagEvent.jiraKudosFormUrl
+        }, {
+          content: 'View kudos',
+          href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(flagEvent.kudosUuid)
+        }]
+      });
+    } else if (flagEvent.eventType === _types.FlagEventType.DIRTY) {
       setIsDirty(true);
-    } else if (event.data === 'close') {
+    } else if (flagEvent.eventType === _types.FlagEventType.CLOSE) {
       closeDrawer();
     }
-  }, [props.isOpen, addFlag, teamCentralBaseUrl, sendAnalytic, closeDrawer]);
+  }, [addFlag, closeDrawer, sendAnalytic, teamCentralBaseUrl]);
+  var messageListener = (0, _react.useCallback)(function (event) {
+    if (!props.isOpen) {
+      return;
+    }
+    if (String(event.data).startsWith('kudos-created-') || event.data === 'dirty' || event.data === 'close') {
+      if (String(event.data).startsWith('kudos-created-')) {
+        var uuid = String(event.data).replace(/^(kudos-created-)/, '');
+        closeDrawer();
+        sendAnalytic('created', {});
+        addFlag && addFlag({
+          title: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.default.kudosCreatedFlag),
+          id: "kudosCreatedFlag-".concat(uuid),
+          description: (0, _react2.jsx)(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.default.kudosCreatedDescriptionFlag, {
+            values: {
+              a: function a(s) {
+                return (0, _react2.jsx)("a", {
+                  href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(uuid)
+                }, s);
+              }
+            }
+          })),
+          icon: (0, _react2.jsx)(_checkCircle.default, {
+            label: "success",
+            primaryColor: "var(--ds-icon-success, ".concat(_colors.G300, ")")
+          })
+        });
+      } else if (event.data === 'dirty') {
+        setIsDirty(true);
+      } else if (event.data === 'close') {
+        closeDrawer();
+      }
+    } else {
+      createFlagWithJsonStringifiedInput(JSON.parse(event.data));
+    }
+  }, [props.isOpen, closeDrawer, sendAnalytic, addFlag, teamCentralBaseUrl, createFlagWithJsonStringifiedInput]);
   (0, _react.useEffect)(function () {
     window.removeEventListener('message', messageListenerEventHandler.current);
     messageListenerEventHandler.current = messageListener;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/give-kudos",
-	"version": "1.1.3",
+	"version": "2.0.1",
 	"sideEffects": false
 }

package/dist/es2019/index.js

@@ -1,4 +1,4 @@
-export { KudosType } from './types';
+export { KudosType, FlagEventType } from './types';
 import GiveKudosLauncher from './ui/GiveKudosLauncher/main';
 export { GiveKudosLauncher };
 export { GiveKudosLauncherLazy } from './ui/GiveKudosLauncher';

package/dist/es2019/messages.js

@@ -15,6 +15,26 @@ const messages = defineMessages({
     defaultMessage: 'Your kudos has been sent. <a>View kudos</a>',
     description: 'Description text for the kudos created flag. This includes a link to view the newly created kudos.'
   },
+  JiraKudosCreatedFlag: {
+    id: 'team-central.give-jira-kudos.created.title.flag',
+    defaultMessage: 'Kudos created',
+    description: 'Title text for kudos creation flag.'
+  },
+  JiraKudosCreatedDescriptionFlag: {
+    id: 'team-central.give-jira-kudos.created.description.flag',
+    defaultMessage: 'Our Workplace Experience team will now work their magic for the gift request. ✨',
+    description: 'Description text for the atlas and jira kudos created flag. This includes links to view the newly created kudos and jira kudos request.'
+  },
+  JiraKudosCreationFailedFlag: {
+    id: 'team-central.give-jira-kudos.creation.failed.title.flag',
+    defaultMessage: "We couldn't send the gift",
+    description: 'Title text for jira kudos creation failed flag.'
+  },
+  JiraKudosCreationFailedDescriptionFlag: {
+    id: 'team-central.give-jira-kudos.creation.failed.description.flag',
+    defaultMessage: "We sent the kudos but we couldn't send the gift due to an error. Please raise a separate ticket at <a>go/kudos</a>.",
+    description: 'Description text for the jira kudos creation failed flag. This includes a link to the atlas kudos and jira kudos form.'
+  },
   unsavedKudosWarning: {
     id: 'team-central.give-kudos.unsaved.warning',
     defaultMessage: 'Changes that you made will not be saved.',

package/dist/es2019/types.js

@@ -2,4 +2,12 @@ export let KudosType = /*#__PURE__*/function (KudosType) {
   KudosType["INDIVIDUAL"] = "individual";
   KudosType["TEAM"] = "team";
   return KudosType;
+}({});
+export let FlagEventType = /*#__PURE__*/function (FlagEventType) {
+  FlagEventType["KUDOS_CREATED"] = "kudos-created";
+  FlagEventType["JIRA_KUDOS_CREATED"] = "jira-kudos-created";
+  FlagEventType["JIRA_KUDOS_FAILED"] = "jira-kudos-failed";
+  FlagEventType["DIRTY"] = "dirty";
+  FlagEventType["CLOSE"] = "close";
+  return FlagEventType;
 }({});

package/dist/es2019/ui/GiveKudosLauncher/main.js

@@ -14,12 +14,13 @@ import Portal from '@atlaskit/portal';
 import { G300 } from '@atlaskit/theme/colors';
 import { layers } from '@atlaskit/theme/constants';
 import messages from '../../messages';
+import { FlagEventType } from '../../types';
 const iframeStyles = css({
   border: 0
 });
 const sidebarDivStyles = css({
   position: 'absolute',
-  margin: '16px 0 0 16px',
+  margin: `${"var(--ds-space-200, 16px)"} 0 0 ${"var(--ds-space-200, 16px)"}`,
   display: 'flex',
   alignItems: 'center',
   justifyContent: 'center'
@@ -76,21 +77,20 @@ const GiveKudosLauncher = props => {
   const closeWarningModal = () => {
     setIsCloseConfirmModalOpen(false);
   };
-  const messageListener = useCallback(event => {
-    if (!props.isOpen) {
-      return;
-    }
-    if (String(event.data).startsWith('kudos-created-')) {
-      const uuid = String(event.data).replace(/^(kudos-created-)/, '');
+  const createFlagWithJsonStringifiedInput = useCallback(flagEvent => {
+    if (flagEvent.eventType === FlagEventType.KUDOS_CREATED) {
       closeDrawer();
       sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid) {
+        return;
+      }
       addFlag && addFlag({
         title: jsx(FormattedMessage, messages.kudosCreatedFlag),
-        id: `kudosCreatedFlag-${uuid}`,
+        id: `kudosCreatedFlag-${flagEvent.kudosUuid}`,
         description: jsx(FormattedMessage, _extends({}, messages.kudosCreatedDescriptionFlag, {
           values: {
             a: s => jsx("a", {
-              href: `${teamCentralBaseUrl}/people/kudos/${uuid}`
+              href: `${teamCentralBaseUrl}/people/kudos/${flagEvent.kudosUuid}`
             }, s)
           }
         })),
@@ -99,12 +99,92 @@ const GiveKudosLauncher = props => {
           primaryColor: `var(--ds-icon-success, ${G300})`
         })
       });
-    } else if (event.data === 'dirty') {
+    } else if (flagEvent.eventType === FlagEventType.JIRA_KUDOS_CREATED) {
+      closeDrawer();
+      sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid || !flagEvent.jiraKudosUrl) {
+        return;
+      }
+      addFlag && addFlag({
+        title: jsx(FormattedMessage, messages.JiraKudosCreatedFlag),
+        id: `kudosCreatedFlag-${flagEvent.kudosUuid}`,
+        description: jsx(FormattedMessage, messages.JiraKudosCreatedDescriptionFlag),
+        icon: jsx(SuccessIcon, {
+          label: "success",
+          primaryColor: `var(--ds-icon-success, ${G300})`
+        }),
+        actions: [{
+          content: 'Track gift request',
+          href: flagEvent.jiraKudosUrl
+        }, {
+          content: 'View kudos',
+          href: `${teamCentralBaseUrl}/people/kudos/${flagEvent.kudosUuid}`
+        }]
+      });
+    } else if (flagEvent.eventType === FlagEventType.JIRA_KUDOS_FAILED) {
+      closeDrawer();
+      sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid || !flagEvent.jiraKudosFormUrl) {
+        return;
+      }
+      addFlag && addFlag({
+        title: jsx(FormattedMessage, messages.JiraKudosCreationFailedFlag),
+        id: `jiraKudosCreationFailedFlag-${flagEvent.kudosUuid}`,
+        description: jsx(FormattedMessage, _extends({}, messages.JiraKudosCreationFailedDescriptionFlag, {
+          values: {
+            a: s => jsx("a", {
+              href: flagEvent.jiraKudosFormUrl
+            }, s)
+          }
+        })),
+        type: 'warning',
+        actions: [{
+          content: 'Visit go/kudos',
+          href: flagEvent.jiraKudosFormUrl
+        }, {
+          content: 'View kudos',
+          href: `${teamCentralBaseUrl}/people/kudos/${flagEvent.kudosUuid}`
+        }]
+      });
+    } else if (flagEvent.eventType === FlagEventType.DIRTY) {
       setIsDirty(true);
-    } else if (event.data === 'close') {
+    } else if (flagEvent.eventType === FlagEventType.CLOSE) {
       closeDrawer();
     }
-  }, [props.isOpen, addFlag, teamCentralBaseUrl, sendAnalytic, closeDrawer]);
+  }, [addFlag, closeDrawer, sendAnalytic, teamCentralBaseUrl]);
+  const messageListener = useCallback(event => {
+    if (!props.isOpen) {
+      return;
+    }
+    if (String(event.data).startsWith('kudos-created-') || event.data === 'dirty' || event.data === 'close') {
+      if (String(event.data).startsWith('kudos-created-')) {
+        const uuid = String(event.data).replace(/^(kudos-created-)/, '');
+        closeDrawer();
+        sendAnalytic('created', {});
+        addFlag && addFlag({
+          title: jsx(FormattedMessage, messages.kudosCreatedFlag),
+          id: `kudosCreatedFlag-${uuid}`,
+          description: jsx(FormattedMessage, _extends({}, messages.kudosCreatedDescriptionFlag, {
+            values: {
+              a: s => jsx("a", {
+                href: `${teamCentralBaseUrl}/people/kudos/${uuid}`
+              }, s)
+            }
+          })),
+          icon: jsx(SuccessIcon, {
+            label: "success",
+            primaryColor: `var(--ds-icon-success, ${G300})`
+          })
+        });
+      } else if (event.data === 'dirty') {
+        setIsDirty(true);
+      } else if (event.data === 'close') {
+        closeDrawer();
+      }
+    } else {
+      createFlagWithJsonStringifiedInput(JSON.parse(event.data));
+    }
+  }, [props.isOpen, closeDrawer, sendAnalytic, addFlag, teamCentralBaseUrl, createFlagWithJsonStringifiedInput]);
   useEffect(() => {
     window.removeEventListener('message', messageListenerEventHandler.current);
     messageListenerEventHandler.current = messageListener;

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/give-kudos",
-	"version": "1.1.3",
+	"version": "2.0.1",
 	"sideEffects": false
 }

package/dist/esm/index.js

@@ -1,4 +1,4 @@
-export { KudosType } from './types';
+export { KudosType, FlagEventType } from './types';
 import GiveKudosLauncher from './ui/GiveKudosLauncher/main';
 export { GiveKudosLauncher };
 export { GiveKudosLauncherLazy } from './ui/GiveKudosLauncher';

package/dist/esm/messages.js

@@ -15,6 +15,26 @@ var messages = defineMessages({
     defaultMessage: 'Your kudos has been sent. <a>View kudos</a>',
     description: 'Description text for the kudos created flag. This includes a link to view the newly created kudos.'
   },
+  JiraKudosCreatedFlag: {
+    id: 'team-central.give-jira-kudos.created.title.flag',
+    defaultMessage: 'Kudos created',
+    description: 'Title text for kudos creation flag.'
+  },
+  JiraKudosCreatedDescriptionFlag: {
+    id: 'team-central.give-jira-kudos.created.description.flag',
+    defaultMessage: 'Our Workplace Experience team will now work their magic for the gift request. ✨',
+    description: 'Description text for the atlas and jira kudos created flag. This includes links to view the newly created kudos and jira kudos request.'
+  },
+  JiraKudosCreationFailedFlag: {
+    id: 'team-central.give-jira-kudos.creation.failed.title.flag',
+    defaultMessage: "We couldn't send the gift",
+    description: 'Title text for jira kudos creation failed flag.'
+  },
+  JiraKudosCreationFailedDescriptionFlag: {
+    id: 'team-central.give-jira-kudos.creation.failed.description.flag',
+    defaultMessage: "We sent the kudos but we couldn't send the gift due to an error. Please raise a separate ticket at <a>go/kudos</a>.",
+    description: 'Description text for the jira kudos creation failed flag. This includes a link to the atlas kudos and jira kudos form.'
+  },
   unsavedKudosWarning: {
     id: 'team-central.give-kudos.unsaved.warning',
     defaultMessage: 'Changes that you made will not be saved.',

package/dist/esm/types.js

@@ -2,4 +2,12 @@ export var KudosType = /*#__PURE__*/function (KudosType) {
   KudosType["INDIVIDUAL"] = "individual";
   KudosType["TEAM"] = "team";
   return KudosType;
+}({});
+export var FlagEventType = /*#__PURE__*/function (FlagEventType) {
+  FlagEventType["KUDOS_CREATED"] = "kudos-created";
+  FlagEventType["JIRA_KUDOS_CREATED"] = "jira-kudos-created";
+  FlagEventType["JIRA_KUDOS_FAILED"] = "jira-kudos-failed";
+  FlagEventType["DIRTY"] = "dirty";
+  FlagEventType["CLOSE"] = "close";
+  return FlagEventType;
 }({});

package/dist/esm/ui/GiveKudosLauncher/main.js

@@ -18,12 +18,13 @@ import Portal from '@atlaskit/portal';
 import { G300 } from '@atlaskit/theme/colors';
 import { layers } from '@atlaskit/theme/constants';
 import messages from '../../messages';
+import { FlagEventType } from '../../types';
 var iframeStyles = css({
   border: 0
 });
 var sidebarDivStyles = css({
   position: 'absolute',
-  margin: '16px 0 0 16px',
+  margin: "var(--ds-space-200, 16px)".concat(" 0 0 ", "var(--ds-space-200, 16px)"),
   display: 'flex',
   alignItems: 'center',
   justifyContent: 'center'
@@ -82,22 +83,21 @@ var GiveKudosLauncher = function GiveKudosLauncher(props) {
   var closeWarningModal = function closeWarningModal() {
     setIsCloseConfirmModalOpen(false);
   };
-  var messageListener = useCallback(function (event) {
-    if (!props.isOpen) {
-      return;
-    }
-    if (String(event.data).startsWith('kudos-created-')) {
-      var uuid = String(event.data).replace(/^(kudos-created-)/, '');
+  var createFlagWithJsonStringifiedInput = useCallback(function (flagEvent) {
+    if (flagEvent.eventType === FlagEventType.KUDOS_CREATED) {
       closeDrawer();
       sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid) {
+        return;
+      }
       addFlag && addFlag({
         title: jsx(FormattedMessage, messages.kudosCreatedFlag),
-        id: "kudosCreatedFlag-".concat(uuid),
+        id: "kudosCreatedFlag-".concat(flagEvent.kudosUuid),
         description: jsx(FormattedMessage, _extends({}, messages.kudosCreatedDescriptionFlag, {
           values: {
             a: function a(s) {
               return jsx("a", {
-                href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(uuid)
+                href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(flagEvent.kudosUuid)
               }, s);
             }
           }
@@ -107,12 +107,96 @@ var GiveKudosLauncher = function GiveKudosLauncher(props) {
           primaryColor: "var(--ds-icon-success, ".concat(G300, ")")
         })
       });
-    } else if (event.data === 'dirty') {
+    } else if (flagEvent.eventType === FlagEventType.JIRA_KUDOS_CREATED) {
+      closeDrawer();
+      sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid || !flagEvent.jiraKudosUrl) {
+        return;
+      }
+      addFlag && addFlag({
+        title: jsx(FormattedMessage, messages.JiraKudosCreatedFlag),
+        id: "kudosCreatedFlag-".concat(flagEvent.kudosUuid),
+        description: jsx(FormattedMessage, messages.JiraKudosCreatedDescriptionFlag),
+        icon: jsx(SuccessIcon, {
+          label: "success",
+          primaryColor: "var(--ds-icon-success, ".concat(G300, ")")
+        }),
+        actions: [{
+          content: 'Track gift request',
+          href: flagEvent.jiraKudosUrl
+        }, {
+          content: 'View kudos',
+          href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(flagEvent.kudosUuid)
+        }]
+      });
+    } else if (flagEvent.eventType === FlagEventType.JIRA_KUDOS_FAILED) {
+      closeDrawer();
+      sendAnalytic('created', {});
+      if (!flagEvent.kudosUuid || !flagEvent.jiraKudosFormUrl) {
+        return;
+      }
+      addFlag && addFlag({
+        title: jsx(FormattedMessage, messages.JiraKudosCreationFailedFlag),
+        id: "jiraKudosCreationFailedFlag-".concat(flagEvent.kudosUuid),
+        description: jsx(FormattedMessage, _extends({}, messages.JiraKudosCreationFailedDescriptionFlag, {
+          values: {
+            a: function a(s) {
+              return jsx("a", {
+                href: flagEvent.jiraKudosFormUrl
+              }, s);
+            }
+          }
+        })),
+        type: 'warning',
+        actions: [{
+          content: 'Visit go/kudos',
+          href: flagEvent.jiraKudosFormUrl
+        }, {
+          content: 'View kudos',
+          href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(flagEvent.kudosUuid)
+        }]
+      });
+    } else if (flagEvent.eventType === FlagEventType.DIRTY) {
       setIsDirty(true);
-    } else if (event.data === 'close') {
+    } else if (flagEvent.eventType === FlagEventType.CLOSE) {
       closeDrawer();
     }
-  }, [props.isOpen, addFlag, teamCentralBaseUrl, sendAnalytic, closeDrawer]);
+  }, [addFlag, closeDrawer, sendAnalytic, teamCentralBaseUrl]);
+  var messageListener = useCallback(function (event) {
+    if (!props.isOpen) {
+      return;
+    }
+    if (String(event.data).startsWith('kudos-created-') || event.data === 'dirty' || event.data === 'close') {
+      if (String(event.data).startsWith('kudos-created-')) {
+        var uuid = String(event.data).replace(/^(kudos-created-)/, '');
+        closeDrawer();
+        sendAnalytic('created', {});
+        addFlag && addFlag({
+          title: jsx(FormattedMessage, messages.kudosCreatedFlag),
+          id: "kudosCreatedFlag-".concat(uuid),
+          description: jsx(FormattedMessage, _extends({}, messages.kudosCreatedDescriptionFlag, {
+            values: {
+              a: function a(s) {
+                return jsx("a", {
+                  href: "".concat(teamCentralBaseUrl, "/people/kudos/").concat(uuid)
+                }, s);
+              }
+            }
+          })),
+          icon: jsx(SuccessIcon, {
+            label: "success",
+            primaryColor: "var(--ds-icon-success, ".concat(G300, ")")
+          })
+        });
+      } else if (event.data === 'dirty') {
+        setIsDirty(true);
+      } else if (event.data === 'close') {
+        closeDrawer();
+      }
+    } else {
+      createFlagWithJsonStringifiedInput(JSON.parse(event.data));
+    }
+  }, [props.isOpen, closeDrawer, sendAnalytic, addFlag, teamCentralBaseUrl, createFlagWithJsonStringifiedInput]);
   useEffect(function () {
     window.removeEventListener('message', messageListenerEventHandler.current);
     messageListenerEventHandler.current = messageListener;

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/give-kudos",
-	"version": "1.1.3",
+	"version": "2.0.1",
 	"sideEffects": false
 }

package/dist/types/index.d.ts

@@ -1,5 +1,5 @@
-export type { KudosRecipient, GiveKudosDrawerProps } from './types';
-export { KudosType } from './types';
+export type { KudosRecipient, GiveKudosDrawerProps, FlagEvent } from './types';
+export { KudosType, FlagEventType } from './types';
 import GiveKudosLauncher from './ui/GiveKudosLauncher/main';
 export { GiveKudosLauncher };
 export { GiveKudosLauncherLazy } from './ui/GiveKudosLauncher';

package/dist/types/messages.d.ts

@@ -14,6 +14,26 @@ declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    JiraKudosCreatedFlag: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    JiraKudosCreatedDescriptionFlag: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    JiraKudosCreationFailedFlag: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    JiraKudosCreationFailedDescriptionFlag: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
     unsavedKudosWarning: {
         id: string;
         defaultMessage: string;

package/dist/types/types.d.ts

@@ -2,10 +2,23 @@ export declare enum KudosType {
     INDIVIDUAL = "individual",
     TEAM = "team"
 }
+export declare enum FlagEventType {
+    KUDOS_CREATED = "kudos-created",
+    JIRA_KUDOS_CREATED = "jira-kudos-created",
+    JIRA_KUDOS_FAILED = "jira-kudos-failed",
+    DIRTY = "dirty",
+    CLOSE = "close"
+}
 export interface KudosRecipient {
     type: KudosType;
     recipientId: string;
 }
+export interface FlagEvent {
+    eventType: FlagEventType;
+    kudosUuid?: string;
+    jiraKudosUrl?: string;
+    jiraKudosFormUrl?: string;
+}
 export interface GiveKudosDrawerProps {
     testId?: string;
     isOpen: boolean;

package/dist/types-ts4.5/index.d.ts

@@ -1,5 +1,5 @@
-export type { KudosRecipient, GiveKudosDrawerProps } from './types';
-export { KudosType } from './types';
+export type { KudosRecipient, GiveKudosDrawerProps, FlagEvent } from './types';
+export { KudosType, FlagEventType } from './types';
 import GiveKudosLauncher from './ui/GiveKudosLauncher/main';
 export { GiveKudosLauncher };
 export { GiveKudosLauncherLazy } from './ui/GiveKudosLauncher';

package/dist/types-ts4.5/messages.d.ts

@@ -14,6 +14,26 @@ declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    JiraKudosCreatedFlag: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    JiraKudosCreatedDescriptionFlag: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    JiraKudosCreationFailedFlag: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    JiraKudosCreationFailedDescriptionFlag: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
     unsavedKudosWarning: {
         id: string;
         defaultMessage: string;

package/dist/types-ts4.5/types.d.ts

@@ -2,10 +2,23 @@ export declare enum KudosType {
     INDIVIDUAL = "individual",
     TEAM = "team"
 }
+export declare enum FlagEventType {
+    KUDOS_CREATED = "kudos-created",
+    JIRA_KUDOS_CREATED = "jira-kudos-created",
+    JIRA_KUDOS_FAILED = "jira-kudos-failed",
+    DIRTY = "dirty",
+    CLOSE = "close"
+}
 export interface KudosRecipient {
     type: KudosType;
     recipientId: string;
 }
+export interface FlagEvent {
+    eventType: FlagEventType;
+    kudosUuid?: string;
+    jiraKudosUrl?: string;
+    jiraKudosFormUrl?: string;
+}
 export interface GiveKudosDrawerProps {
     testId?: string;
     isOpen: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/give-kudos",
-  "version": "1.1.3",
+  "version": "2.0.1",
   "description": "Give Kudos experience ",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -40,13 +40,13 @@
   },
   "dependencies": {
     "@atlaskit/analytics-next": "^9.1.0",
-    "@atlaskit/button": "^16.7.0",
+    "@atlaskit/button": "^16.8.0",
     "@atlaskit/drawer": "^7.5.0",
     "@atlaskit/icon": "^21.12.0",
-    "@atlaskit/modal-dialog": "^12.5.0",
+    "@atlaskit/modal-dialog": "^12.6.0",
     "@atlaskit/portal": "^4.3.0",
     "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.5.0",
+    "@atlaskit/tokens": "^1.14.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "react-intl-next": "npm:react-intl@^5.18.1"
@@ -55,10 +55,8 @@
     "react": "^16.8.0"
   },
   "devDependencies": {
-    "@atlaskit/docs": "*",
-    "@atlaskit/flag": "^15.2.0",
     "@atlaskit/ssr": "*",
-    "@atlaskit/tokens": "^1.5.0",
+    "@atlaskit/tokens": "^1.14.0",
     "@atlaskit/webdriver-runner": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0",
     "@testing-library/react": "^12.1.5",
@@ -96,6 +94,9 @@
       "styling": [
         "emotion",
         "static"
+      ],
+      "imports": [
+        "import-no-extraneous-disable-for-examples-and-docs"
       ]
     }
   },

package/report.api.md

@@ -20,6 +20,32 @@
 import { jsx } from '@emotion/react';
 import { LazyExoticComponent } from 'react';
 
+// @public (undocumented)
+export interface FlagEvent {
+  // (undocumented)
+  eventType: FlagEventType;
+  // (undocumented)
+  jiraKudosFormUrl?: string;
+  // (undocumented)
+  jiraKudosUrl?: string;
+  // (undocumented)
+  kudosUuid?: string;
+}
+
+// @public (undocumented)
+export enum FlagEventType {
+  // (undocumented)
+  CLOSE = 'close',
+  // (undocumented)
+  DIRTY = 'dirty',
+  // (undocumented)
+  JIRA_KUDOS_CREATED = 'jira-kudos-created',
+  // (undocumented)
+  JIRA_KUDOS_FAILED = 'jira-kudos-failed',
+  // (undocumented)
+  KUDOS_CREATED = 'kudos-created',
+}
+
 // @public (undocumented)
 export interface GiveKudosDrawerProps {
   // (undocumented)

package/tmp/api-report-tmp.d.ts

@@ -9,6 +9,32 @@
 import { jsx } from '@emotion/react';
 import { LazyExoticComponent } from 'react';
 
+// @public (undocumented)
+export interface FlagEvent {
+    // (undocumented)
+    eventType: FlagEventType;
+    // (undocumented)
+    jiraKudosFormUrl?: string;
+    // (undocumented)
+    jiraKudosUrl?: string;
+    // (undocumented)
+    kudosUuid?: string;
+}
+
+// @public (undocumented)
+export enum FlagEventType {
+    // (undocumented)
+    CLOSE = "close",
+    // (undocumented)
+    DIRTY = "dirty",
+    // (undocumented)
+    JIRA_KUDOS_CREATED = "jira-kudos-created",
+    // (undocumented)
+    JIRA_KUDOS_FAILED = "jira-kudos-failed",
+    // (undocumented)
+    KUDOS_CREATED = "kudos-created"
+}
+
 // @public (undocumented)
 export interface GiveKudosDrawerProps {
     // (undocumented)