@atlaskit/reactions 33.0.2 → 33.1.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/reactions
 
+## 33.1.0
+
+### Minor Changes
+
+- [#170825](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/170825)
+  [`944add6db1310`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/944add6db1310) -
+  Adding an option to optimistically load the emoji using the reaction imagePath.
+
 ## 33.0.2
 
 ### Patch Changes

package/dist/cjs/analytics/index.js

@@ -11,7 +11,7 @@ var _analyticsGasTypes = require("@atlaskit/analytics-gas-types");
 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) { (0, _defineProperty2.default)(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; }
 var packageName = "@atlaskit/reactions";
-var packageVersion = "33.0.2";
+var packageVersion = "33.1.0";
 /**
  * TODO: move to utility package?
  * A random sampling function

package/dist/cjs/components/Reaction.js

@@ -12,6 +12,7 @@ var _react = _interopRequireWildcard(require("react"));
 var React = _react;
 var _runtime = require("@compiled/react/runtime");
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _reactIntlNext = require("react-intl-next");
@@ -27,6 +28,7 @@ var _constants = require("../shared/constants");
 var _ReactionButton = require("./ReactionButton");
 var _StaticReaction = require("./StaticReaction");
 var _compiled = require("@atlaskit/primitives/compiled");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var styles = {
   container: "_kqswh2mm"
@@ -137,11 +139,14 @@ var Reaction = exports.Reaction = function Reaction(_ref) {
   };
   var emojiAndCount = /*#__PURE__*/React.createElement(_compiled.Inline, null, /*#__PURE__*/React.createElement("div", {
     className: (0, _runtime.ax)(["_8hrz1nam _vwz41crf _ca0q1b66 _u5f31b66 _n3td1b66 _19bvu2gc", reaction.count === 0 && "_ca0q1b66 _u5f3v77o _n3td1b66 _19bv19bv"])
-  }, /*#__PURE__*/React.createElement(_emoji.ResourcedEmoji, {
+  }, /*#__PURE__*/React.createElement(_emoji.ResourcedEmoji, (0, _extends2.default)({
     emojiProvider: emojiProvider,
     emojiId: emojiId,
     fitToHeight: _constants.RESOURCED_EMOJI_COMPACT_HEIGHT
-  })), /*#__PURE__*/React.createElement(_Counter.Counter, {
+  }, reaction.emojiPath && (0, _platformFeatureFlags.fg)('platform_optimistic_reaction_emoji') ? {
+    optimistic: true,
+    optimisticImageURL: reaction.emojiPath
+  } : {}))), /*#__PURE__*/React.createElement(_Counter.Counter, {
     value: reaction.count,
     highlight: !isViewOnly && reaction.reacted
   }));

package/dist/es2019/analytics/index.js

@@ -1,7 +1,7 @@
 import { createAndFireEvent } from '@atlaskit/analytics-next';
 import { UI_EVENT_TYPE, OPERATIONAL_EVENT_TYPE } from '@atlaskit/analytics-gas-types';
 const packageName = "@atlaskit/reactions";
-const packageVersion = "33.0.2";
+const packageVersion = "33.1.0";
 /**
  * TODO: move to utility package?
  * A random sampling function

package/dist/es2019/components/Reaction.js

@@ -1,4 +1,5 @@
 /* Reaction.tsx generated by @compiled/babel-plugin v0.36.1 */
+import _extends from "@babel/runtime/helpers/extends";
 import "./Reaction.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
@@ -16,6 +17,7 @@ import { RESOURCED_EMOJI_COMPACT_HEIGHT } from '../shared/constants';
 import { ReactionButton } from './ReactionButton';
 import { StaticReaction } from './StaticReaction';
 import { Box, Inline } from '@atlaskit/primitives/compiled';
+import { fg } from '@atlaskit/platform-feature-flags';
 const styles = {
   container: "_kqswh2mm"
 };
@@ -104,11 +106,14 @@ export const Reaction = ({
   };
   const emojiAndCount = /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement("div", {
     className: ax(["_8hrz1nam _vwz41crf _ca0q1b66 _u5f31b66 _n3td1b66 _19bvu2gc", reaction.count === 0 && "_ca0q1b66 _u5f3v77o _n3td1b66 _19bv19bv"])
-  }, /*#__PURE__*/React.createElement(ResourcedEmoji, {
+  }, /*#__PURE__*/React.createElement(ResourcedEmoji, _extends({
     emojiProvider: emojiProvider,
     emojiId: emojiId,
     fitToHeight: RESOURCED_EMOJI_COMPACT_HEIGHT
-  })), /*#__PURE__*/React.createElement(Counter, {
+  }, reaction.emojiPath && fg('platform_optimistic_reaction_emoji') ? {
+    optimistic: true,
+    optimisticImageURL: reaction.emojiPath
+  } : {}))), /*#__PURE__*/React.createElement(Counter, {
     value: reaction.count,
     highlight: !isViewOnly && reaction.reacted
   }));

package/dist/esm/analytics/index.js

@@ -4,7 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { createAndFireEvent } from '@atlaskit/analytics-next';
 import { UI_EVENT_TYPE, OPERATIONAL_EVENT_TYPE } from '@atlaskit/analytics-gas-types';
 var packageName = "@atlaskit/reactions";
-var packageVersion = "33.0.2";
+var packageVersion = "33.1.0";
 /**
  * TODO: move to utility package?
  * A random sampling function

package/dist/esm/components/Reaction.js

@@ -1,4 +1,5 @@
 /* Reaction.tsx generated by @compiled/babel-plugin v0.36.1 */
+import _extends from "@babel/runtime/helpers/extends";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./Reaction.compiled.css";
@@ -19,6 +20,7 @@ import { RESOURCED_EMOJI_COMPACT_HEIGHT } from '../shared/constants';
 import { ReactionButton } from './ReactionButton';
 import { StaticReaction } from './StaticReaction';
 import { Box, Inline } from '@atlaskit/primitives/compiled';
+import { fg } from '@atlaskit/platform-feature-flags';
 var styles = {
   container: "_kqswh2mm"
 };
@@ -128,11 +130,14 @@ export var Reaction = function Reaction(_ref) {
   };
   var emojiAndCount = /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement("div", {
     className: ax(["_8hrz1nam _vwz41crf _ca0q1b66 _u5f31b66 _n3td1b66 _19bvu2gc", reaction.count === 0 && "_ca0q1b66 _u5f3v77o _n3td1b66 _19bv19bv"])
-  }, /*#__PURE__*/React.createElement(ResourcedEmoji, {
+  }, /*#__PURE__*/React.createElement(ResourcedEmoji, _extends({
     emojiProvider: emojiProvider,
     emojiId: emojiId,
     fitToHeight: RESOURCED_EMOJI_COMPACT_HEIGHT
-  })), /*#__PURE__*/React.createElement(Counter, {
+  }, reaction.emojiPath && fg('platform_optimistic_reaction_emoji') ? {
+    optimistic: true,
+    optimisticImageURL: reaction.emojiPath
+  } : {}))), /*#__PURE__*/React.createElement(Counter, {
     value: reaction.count,
     highlight: !isViewOnly && reaction.reacted
   }));

package/dist/types/types/reaction.d.ts

@@ -36,6 +36,10 @@ export interface ReactionSummary {
      * @deprecated Legacy content Not in use anymore
      */
     optimisticallyUpdated?: boolean;
+    /**
+     * A path to the emoji image, used for optimistic rendering.
+     */
+    emojiPath?: string;
 }
 /**
  * Metadata for composing a summary of emojis that will be shown in the the primary view even if the reaction count is zero

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

@@ -36,6 +36,10 @@ export interface ReactionSummary {
      * @deprecated Legacy content Not in use anymore
      */
     optimisticallyUpdated?: boolean;
+    /**
+     * A path to the emoji image, used for optimistic rendering.
+     */
+    emojiPath?: string;
 }
 /**
  * Metadata for composing a summary of emojis that will be shown in the the primary view even if the reaction count is zero

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/reactions",
-	"version": "33.0.2",
+	"version": "33.1.0",
 	"description": "Reactions component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -137,6 +137,9 @@
 		},
 		"should-render-to-parent-should-be-true-editor-coll": {
 			"type": "boolean"
+		},
+		"platform_optimistic_reaction_emoji": {
+			"type": "boolean"
 		}
 	},
 	"sideEffects": [