@atlaskit/media-picker 64.2.2 → 64.2.4

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/media-picker
 
+## 64.2.4
+
+### Patch Changes
+
+- [`b37723f2cfa`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b37723f2cfa) - The component now logs the full provided feature flags object
+- Updated dependencies
+
+## 64.2.3
+
+### Patch Changes
+
+- [`0e2981295ce`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0e2981295ce) - Media Picker passes feature flags object through Media Client upload method, overriding internal Media Client flags
+- Updated dependencies
+
 ## 64.2.2
 
 ### Patch Changes

package/dist/cjs/components/browser/browser.js

@@ -37,15 +37,16 @@ var BrowserBase = /*#__PURE__*/function (_LocalUploadComponent) {
         return;
       }
       var replaceFileId = _this.props.config.replaceFileId;
+      var featureFlags = _this.props.featureFlags;
       var filesArray = [].slice.call(event.target.files);
 
       // refreshes uploadParams as only set once in parent constructor
       _this.setUploadParams(_this.props.config.uploadParams);
       try {
         if (replaceFileId) {
-          _this.uploadService.addFile(filesArray[0], replaceFileId);
+          _this.uploadService.addFile(filesArray[0], replaceFileId, featureFlags);
         } else {
-          _this.uploadService.addFiles(filesArray);
+          _this.uploadService.addFiles(filesArray, featureFlags);
         }
       } finally {
         if (_this.browserRef.current) {
@@ -148,7 +149,5 @@ exports.BrowserBase = BrowserBase;
 });
 var _default = BrowserBase;
 exports.default = _default;
-var Browser = (0, _mediaCommon.withMediaAnalyticsContext)((0, _analytics.getPackageAttributes)(COMPONENT_NAME), {
-  filterFeatureFlags: _analytics.LOGGED_FEATURE_FLAGS
-})((0, _analyticsNext.withAnalyticsEvents)()(BrowserBase));
+var Browser = (0, _mediaCommon.withMediaAnalyticsContext)((0, _analytics.getPackageAttributes)(COMPONENT_NAME))((0, _analyticsNext.withAnalyticsEvents)()(BrowserBase));
 exports.Browser = Browser;

package/dist/cjs/components/clipboard/clipboard.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getFilesFromClipboard = exports.default = exports.ClipboardBase = exports.Clipboard = void 0;
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
@@ -38,10 +37,11 @@ var defaultConfig = {
 };
 var COMPONENT_NAME = 'clipboard';
 var ClipboardImpl = /*#__PURE__*/function () {
-  function ClipboardImpl(uploadService, createAnalyticsEvent) {
+  function ClipboardImpl(uploadService, createAnalyticsEvent, featureFlags) {
     (0, _classCallCheck2.default)(this, ClipboardImpl);
     this.uploadService = uploadService;
     this.createAnalyticsEvent = createAnalyticsEvent;
+    this.featureFlags = featureFlags;
   }
   (0, _createClass2.default)(ClipboardImpl, [{
     key: "activate",
@@ -68,7 +68,8 @@ var ClipboardImpl = /*#__PURE__*/function () {
   }, {
     key: "onFilesPasted",
     value: function onFilesPasted(files) {
-      this.uploadService.addFilesWithSource(files);
+      var featureFlags = this.featureFlags;
+      this.uploadService.addFilesWithSource(files, featureFlags);
       this.fireAnalyticsEvent(files);
     }
   }, {
@@ -145,7 +146,7 @@ var ClipboardBase = /*#__PURE__*/function (_LocalUploadComponent) {
     var _this;
     (0, _classCallCheck2.default)(this, ClipboardBase);
     _this = _super.call(this, props, COMPONENT_NAME);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "clipboard", new ClipboardImpl(_this.uploadService, _this.props.createAnalyticsEvent));
+    _this.clipboard = new ClipboardImpl(_this.uploadService, _this.props.createAnalyticsEvent, props.featureFlags);
     return _this;
   }
   (0, _createClass2.default)(ClipboardBase, [{
@@ -153,6 +154,13 @@ var ClipboardBase = /*#__PURE__*/function (_LocalUploadComponent) {
     value: function componentDidMount() {
       this.clipboard.activate();
     }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      if (prevProps.featureFlags !== this.props.featureFlags) {
+        this.clipboard.featureFlags = this.props.featureFlags;
+      }
+    }
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
@@ -172,7 +180,5 @@ exports.ClipboardBase = ClipboardBase;
 });
 var _default = ClipboardBase;
 exports.default = _default;
-var Clipboard = (0, _mediaCommon.withMediaAnalyticsContext)((0, _analytics.getPackageAttributes)(COMPONENT_NAME), {
-  filterFeatureFlags: _analytics.LOGGED_FEATURE_FLAGS
-})((0, _analyticsNext.withAnalyticsEvents)()(ClipboardBase));
+var Clipboard = (0, _mediaCommon.withMediaAnalyticsContext)((0, _analytics.getPackageAttributes)(COMPONENT_NAME))((0, _analyticsNext.withAnalyticsEvents)()(ClipboardBase));
 exports.Clipboard = Clipboard;

package/dist/cjs/components/dropzone/dropzone.js

@@ -83,7 +83,7 @@ var DropzoneBase = /*#__PURE__*/function (_LocalUploadComponent) {
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onFileDropped", /*#__PURE__*/function () {
       var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(dragEvent) {
-        var flattenedDirectoryFiles, files;
+        var featureFlags, flattenedDirectoryFiles, files;
         return _regenerator.default.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
@@ -96,30 +96,30 @@ var DropzoneBase = /*#__PURE__*/function (_LocalUploadComponent) {
               case 2:
                 dragEvent.preventDefault();
                 dragEvent.stopPropagation();
-
+                featureFlags = _this.props.featureFlags;
                 /*
                  * Only enable support for folders if (1) the browser is supported (2) feature flag is enabled
                  * The file flattening library used to add support for Folders uses a function called webkitEntry.
                  * Some browser types are not supported https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitEntries
                  */
-                if (!((0, _browser.isWebkitSupported)() && (0, _mediaCommon.getMediaFeatureFlag)('folderUploads', _this.props.featureFlags))) {
-                  _context.next = 13;
+                if (!((0, _browser.isWebkitSupported)() && (0, _mediaCommon.getMediaFeatureFlag)('folderUploads', featureFlags))) {
+                  _context.next = 14;
                   break;
                 }
                 _this.fireAnalyticsForFolders(dragEvent.dataTransfer.items);
-                _context.next = 8;
+                _context.next = 9;
                 return _this.getFilesFromDragEvent(dragEvent.dataTransfer.items);
-              case 8:
+              case 9:
                 flattenedDirectoryFiles = _context.sent;
                 _this.onDropFolders(flattenedDirectoryFiles.length);
-                _this.uploadService.addFiles(flattenedDirectoryFiles);
-                _context.next = 16;
+                _this.uploadService.addFiles(flattenedDirectoryFiles, featureFlags);
+                _context.next = 17;
                 break;
-              case 13:
+              case 14:
                 _this.onDrop(dragEvent);
                 files = Array.from(dragEvent.dataTransfer.files);
-                _this.uploadService.addFiles(files);
-              case 16:
+                _this.uploadService.addFiles(files, featureFlags);
+              case 17:
               case "end":
                 return _context.stop();
             }
@@ -321,7 +321,5 @@ var DropzoneBase = /*#__PURE__*/function (_LocalUploadComponent) {
 exports.DropzoneBase = DropzoneBase;
 var _default = DropzoneBase;
 exports.default = _default;
-var Dropzone = (0, _mediaCommon.withMediaAnalyticsContext)((0, _analytics.getPackageAttributes)(COMPONENT_NAME), {
-  filterFeatureFlags: _analytics.LOGGED_FEATURE_FLAGS
-})((0, _analyticsNext.withAnalyticsEvents)()(DropzoneBase));
+var Dropzone = (0, _mediaCommon.withMediaAnalyticsContext)((0, _analytics.getPackageAttributes)(COMPONENT_NAME))((0, _analyticsNext.withAnalyticsEvents)()(DropzoneBase));
 exports.Dropzone = Dropzone;

package/dist/cjs/service/uploadServiceImpl.js

@@ -91,13 +91,13 @@ var UploadServiceImpl = /*#__PURE__*/function () {
     }
   }, {
     key: "addFiles",
-    value: function addFiles(files) {
+    value: function addFiles(files, featureFlags) {
       this.addFilesWithSource(files.map(function (file) {
         return {
           file: file,
           source: _types.LocalFileSource.LocalUpload
         };
-      }));
+      }), featureFlags);
     }
   }, {
     key: "addFile",
@@ -110,7 +110,7 @@ var UploadServiceImpl = /*#__PURE__*/function () {
     }
   }, {
     key: "addFilesWithSource",
-    value: function addFilesWithSource(files) {
+    value: function addFilesWithSource(files, featureFlags) {
       var _this2 = this;
       if (files.length === 0) {
         return;
@@ -176,7 +176,7 @@ var UploadServiceImpl = /*#__PURE__*/function () {
           deferredUploadId: deferredUploadId
         };
         var controller = _this2.createUploadController();
-        var sourceFileObservable = mediaClient.file.upload(uploadableFile, controller, uploadableUpfrontIds, traceContext);
+        var sourceFileObservable = mediaClient.file.upload(uploadableFile, controller, uploadableUpfrontIds, traceContext, featureFlags);
         var mediaFile = {
           id: id,
           name: file.name,

package/dist/cjs/util/analytics.js

@@ -3,27 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.LOGGED_FEATURE_FLAG_KEYS = exports.LOGGED_FEATURE_FLAGS = void 0;
 exports.getPackageAttributes = getPackageAttributes;
 exports.getRequestMetadata = getRequestMetadata;
 var _mediaClient = require("@atlaskit/media-client");
-var _mediaCommon = require("@atlaskit/media-common");
-var relevantFlags = {
-  newCardExperience: true,
-  captions: false,
-  timestampOnVideo: false,
-  observedWidth: false,
-  mediaInline: false,
-  folderUploads: true,
-  memoryCacheLogging: false,
-  fetchFileStateAfterUpload: true
-};
 var packageName = "@atlaskit/media-picker";
-var packageVersion = "64.2.2";
-var LOGGED_FEATURE_FLAGS = (0, _mediaCommon.filterFeatureFlagNames)(relevantFlags);
-exports.LOGGED_FEATURE_FLAGS = LOGGED_FEATURE_FLAGS;
-var LOGGED_FEATURE_FLAG_KEYS = (0, _mediaCommon.filterFeatureFlagKeysAllProducts)(relevantFlags);
-exports.LOGGED_FEATURE_FLAG_KEYS = LOGGED_FEATURE_FLAG_KEYS;
+var packageVersion = "64.2.4";
 function getPackageAttributes(componentName) {
   return {
     packageName: packageName,

package/dist/cjs/util/ufoExperiences.js

@@ -7,12 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.succeedMediaUploadUfoExperience = exports.startMediaUploadUfoExperience = exports.failMediaUploadUfoExperience = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _ufo = require("@atlaskit/ufo");
+var _mediaCommon = require("@atlaskit/media-common");
 var _mediaClient = require("@atlaskit/media-client");
-var _analytics = require("./analytics");
 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; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var packageName = "@atlaskit/media-picker";
-var packageVersion = "64.2.2";
+var packageVersion = "64.2.4";
 var ufoExperience;
 var initExperience = function initExperience(id, componentName) {
   if (!ufoExperience) {
@@ -22,7 +22,7 @@ var initExperience = function initExperience(id, componentName) {
       },
       type: _ufo.ExperienceTypes.Experience,
       performanceType: _ufo.ExperiencePerformanceTypes.InlineResult,
-      featureFlags: _analytics.LOGGED_FEATURE_FLAG_KEYS
+      featureFlags: (0, _mediaCommon.getFeatureFlagKeysAllProducts)()
     };
     ufoExperience = new _ufo.ConcurrentExperience('media-upload', inlineExperience);
   }

package/dist/cjs/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/media-picker",
-	"version": "64.2.2"
+	"version": "64.2.4"
 }

package/dist/es2019/components/browser/browser.js

@@ -4,7 +4,7 @@ import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { withMediaAnalyticsContext } from '@atlaskit/media-common';
 import isValidId from 'uuid-validate';
 import { LocalUploadComponentReact } from '../localUploadReact';
-import { getPackageAttributes, LOGGED_FEATURE_FLAGS } from '../../util/analytics';
+import { getPackageAttributes } from '../../util/analytics';
 const defaultConfig = {
   uploadParams: {}
 };
@@ -20,15 +20,18 @@ export class BrowserBase extends LocalUploadComponentReact {
       const {
         replaceFileId
       } = this.props.config;
+      const {
+        featureFlags
+      } = this.props;
       const filesArray = [].slice.call(event.target.files);
 
       // refreshes uploadParams as only set once in parent constructor
       this.setUploadParams(this.props.config.uploadParams);
       try {
         if (replaceFileId) {
-          this.uploadService.addFile(filesArray[0], replaceFileId);
+          this.uploadService.addFile(filesArray[0], replaceFileId, featureFlags);
         } else {
-          this.uploadService.addFiles(filesArray);
+          this.uploadService.addFiles(filesArray, featureFlags);
         }
       } finally {
         if (this.browserRef.current) {
@@ -134,6 +137,4 @@ _defineProperty(BrowserBase, "defaultProps", {
   config: defaultConfig
 });
 export default BrowserBase;
-export const Browser = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME), {
-  filterFeatureFlags: LOGGED_FEATURE_FLAGS
-})(withAnalyticsEvents()(BrowserBase));
+export const Browser = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME))(withAnalyticsEvents()(BrowserBase));

package/dist/es2019/components/clipboard/clipboard.js

@@ -3,7 +3,7 @@ import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { ANALYTICS_MEDIA_CHANNEL, withMediaAnalyticsContext } from '@atlaskit/media-common';
 import { LocalUploadComponentReact } from '../localUploadReact';
 import { LocalFileSource } from '../../service/types';
-import { getPackageAttributes, LOGGED_FEATURE_FLAGS } from '../../util/analytics';
+import { getPackageAttributes } from '../../util/analytics';
 import { appendTimestamp } from '../../util/appendTimestamp';
 export const getFilesFromClipboard = files => {
   return Array.from(files).map(file => {
@@ -22,9 +22,10 @@ const defaultConfig = {
 };
 const COMPONENT_NAME = 'clipboard';
 class ClipboardImpl {
-  constructor(uploadService, createAnalyticsEvent) {
+  constructor(uploadService, createAnalyticsEvent, featureFlags) {
     this.uploadService = uploadService;
     this.createAnalyticsEvent = createAnalyticsEvent;
+    this.featureFlags = featureFlags;
   }
   static get latestInstance() {
     return ClipboardImpl.instances[ClipboardImpl.instances.length - 1];
@@ -48,7 +49,10 @@ class ClipboardImpl {
     }
   }
   onFilesPasted(files) {
-    this.uploadService.addFilesWithSource(files);
+    const {
+      featureFlags
+    } = this;
+    this.uploadService.addFilesWithSource(files, featureFlags);
     this.fireAnalyticsEvent(files);
   }
   fireAnalyticsEvent(files) {
@@ -112,11 +116,16 @@ _defineProperty(ClipboardImpl, "handleEvent", event => {
 export class ClipboardBase extends LocalUploadComponentReact {
   constructor(props) {
     super(props, COMPONENT_NAME);
-    _defineProperty(this, "clipboard", new ClipboardImpl(this.uploadService, this.props.createAnalyticsEvent));
+    this.clipboard = new ClipboardImpl(this.uploadService, this.props.createAnalyticsEvent, props.featureFlags);
   }
   componentDidMount() {
     this.clipboard.activate();
   }
+  componentDidUpdate(prevProps) {
+    if (prevProps.featureFlags !== this.props.featureFlags) {
+      this.clipboard.featureFlags = this.props.featureFlags;
+    }
+  }
   componentWillUnmount() {
     this.clipboard.deactivate();
   }
@@ -128,6 +137,4 @@ _defineProperty(ClipboardBase, "defaultProps", {
   config: defaultConfig
 });
 export default ClipboardBase;
-export const Clipboard = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME), {
-  filterFeatureFlags: LOGGED_FEATURE_FLAGS
-})(withAnalyticsEvents()(ClipboardBase));
+export const Clipboard = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME))(withAnalyticsEvents()(ClipboardBase));

package/dist/es2019/components/dropzone/dropzone.js

@@ -4,7 +4,7 @@ import { ANALYTICS_MEDIA_CHANNEL, getMediaFeatureFlag, withMediaAnalyticsContext
 import { isWebkitSupported } from '@atlaskit/media-ui/browser';
 import { getFilesFromItems, getFilesFromFileSystemEntries } from 'flat-files';
 import { LocalUploadComponentReact } from '../localUploadReact';
-import { getPackageAttributes, LOGGED_FEATURE_FLAGS } from '../../util/analytics';
+import { getPackageAttributes } from '../../util/analytics';
 function dragContainsFiles(event) {
   if (!event.dataTransfer) {
     return false;
@@ -66,21 +66,23 @@ export class DropzoneBase extends LocalUploadComponentReact {
       }
       dragEvent.preventDefault();
       dragEvent.stopPropagation();
-
+      const {
+        featureFlags
+      } = this.props;
       /*
        * Only enable support for folders if (1) the browser is supported (2) feature flag is enabled
        * The file flattening library used to add support for Folders uses a function called webkitEntry.
        * Some browser types are not supported https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitEntries
        */
-      if (isWebkitSupported() && getMediaFeatureFlag('folderUploads', this.props.featureFlags)) {
+      if (isWebkitSupported() && getMediaFeatureFlag('folderUploads', featureFlags)) {
         this.fireAnalyticsForFolders(dragEvent.dataTransfer.items);
         const flattenedDirectoryFiles = await this.getFilesFromDragEvent(dragEvent.dataTransfer.items);
         this.onDropFolders(flattenedDirectoryFiles.length);
-        this.uploadService.addFiles(flattenedDirectoryFiles);
+        this.uploadService.addFiles(flattenedDirectoryFiles, featureFlags);
       } else {
         this.onDrop(dragEvent);
         const files = Array.from(dragEvent.dataTransfer.files);
-        this.uploadService.addFiles(files);
+        this.uploadService.addFiles(files, featureFlags);
       }
     });
     _defineProperty(this, "fireAnalyticsForFolders", items => {
@@ -248,6 +250,4 @@ export class DropzoneBase extends LocalUploadComponentReact {
   }
 }
 export default DropzoneBase;
-export const Dropzone = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME), {
-  filterFeatureFlags: LOGGED_FEATURE_FLAGS
-})(withAnalyticsEvents()(DropzoneBase));
+export const Dropzone = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME))(withAnalyticsEvents()(DropzoneBase));

package/dist/es2019/service/uploadServiceImpl.js

@@ -58,11 +58,11 @@ export class UploadServiceImpl {
   createUploadController() {
     return new UploadController();
   }
-  addFiles(files) {
+  addFiles(files, featureFlags) {
     this.addFilesWithSource(files.map(file => ({
       file,
       source: LocalFileSource.LocalUpload
-    })));
+    })), featureFlags);
   }
   addFile(file, replaceFileId) {
     this.addFilesWithSource([{
@@ -71,7 +71,7 @@ export class UploadServiceImpl {
       replaceFileId
     }]);
   }
-  addFilesWithSource(files) {
+  addFilesWithSource(files, featureFlags) {
     if (files.length === 0) {
       return;
     }
@@ -141,7 +141,7 @@ export class UploadServiceImpl {
         deferredUploadId
       };
       const controller = this.createUploadController();
-      const sourceFileObservable = mediaClient.file.upload(uploadableFile, controller, uploadableUpfrontIds, traceContext);
+      const sourceFileObservable = mediaClient.file.upload(uploadableFile, controller, uploadableUpfrontIds, traceContext, featureFlags);
       const mediaFile = {
         id,
         name: file.name,

package/dist/es2019/util/analytics.js

@@ -1,22 +1,6 @@
 import { isRequestError } from '@atlaskit/media-client';
-import { filterFeatureFlagKeysAllProducts, filterFeatureFlagNames } from '@atlaskit/media-common';
-
-// Component name will be prefixed with "media-picker-" in logs. Check ufoExperiences in utils files
-
-const relevantFlags = {
-  newCardExperience: true,
-  captions: false,
-  timestampOnVideo: false,
-  observedWidth: false,
-  mediaInline: false,
-  folderUploads: true,
-  memoryCacheLogging: false,
-  fetchFileStateAfterUpload: true
-};
 const packageName = "@atlaskit/media-picker";
-const packageVersion = "64.2.2";
-export const LOGGED_FEATURE_FLAGS = filterFeatureFlagNames(relevantFlags);
-export const LOGGED_FEATURE_FLAG_KEYS = filterFeatureFlagKeysAllProducts(relevantFlags);
+const packageVersion = "64.2.4";
 export function getPackageAttributes(componentName) {
   return {
     packageName,

package/dist/es2019/util/ufoExperiences.js

@@ -1,8 +1,8 @@
 import { ConcurrentExperience, ExperiencePerformanceTypes, ExperienceTypes } from '@atlaskit/ufo';
+import { getFeatureFlagKeysAllProducts } from '@atlaskit/media-common';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
-import { LOGGED_FEATURE_FLAG_KEYS } from './analytics';
 const packageName = "@atlaskit/media-picker";
-const packageVersion = "64.2.2";
+const packageVersion = "64.2.4";
 let ufoExperience;
 const initExperience = (id, componentName) => {
   if (!ufoExperience) {
@@ -12,7 +12,7 @@ const initExperience = (id, componentName) => {
       },
       type: ExperienceTypes.Experience,
       performanceType: ExperiencePerformanceTypes.InlineResult,
-      featureFlags: LOGGED_FEATURE_FLAG_KEYS
+      featureFlags: getFeatureFlagKeysAllProducts()
     };
     ufoExperience = new ConcurrentExperience('media-upload', inlineExperience);
   }

package/dist/es2019/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/media-picker",
-	"version": "64.2.2"
+	"version": "64.2.4"
 }

package/dist/esm/components/browser/browser.js

@@ -12,7 +12,7 @@ import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { withMediaAnalyticsContext } from '@atlaskit/media-common';
 import isValidId from 'uuid-validate';
 import { LocalUploadComponentReact } from '../localUploadReact';
-import { getPackageAttributes, LOGGED_FEATURE_FLAGS } from '../../util/analytics';
+import { getPackageAttributes } from '../../util/analytics';
 var defaultConfig = {
   uploadParams: {}
 };
@@ -30,15 +30,16 @@ export var BrowserBase = /*#__PURE__*/function (_LocalUploadComponent) {
         return;
       }
       var replaceFileId = _this.props.config.replaceFileId;
+      var featureFlags = _this.props.featureFlags;
       var filesArray = [].slice.call(event.target.files);
 
       // refreshes uploadParams as only set once in parent constructor
       _this.setUploadParams(_this.props.config.uploadParams);
       try {
         if (replaceFileId) {
-          _this.uploadService.addFile(filesArray[0], replaceFileId);
+          _this.uploadService.addFile(filesArray[0], replaceFileId, featureFlags);
         } else {
-          _this.uploadService.addFiles(filesArray);
+          _this.uploadService.addFiles(filesArray, featureFlags);
         }
       } finally {
         if (_this.browserRef.current) {
@@ -139,6 +140,4 @@ _defineProperty(BrowserBase, "defaultProps", {
   config: defaultConfig
 });
 export default BrowserBase;
-export var Browser = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME), {
-  filterFeatureFlags: LOGGED_FEATURE_FLAGS
-})(withAnalyticsEvents()(BrowserBase));
+export var Browser = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME))(withAnalyticsEvents()(BrowserBase));

package/dist/esm/components/clipboard/clipboard.js

@@ -1,4 +1,3 @@
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
@@ -11,7 +10,7 @@ import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { ANALYTICS_MEDIA_CHANNEL, withMediaAnalyticsContext } from '@atlaskit/media-common';
 import { LocalUploadComponentReact } from '../localUploadReact';
 import { LocalFileSource } from '../../service/types';
-import { getPackageAttributes, LOGGED_FEATURE_FLAGS } from '../../util/analytics';
+import { getPackageAttributes } from '../../util/analytics';
 import { appendTimestamp } from '../../util/appendTimestamp';
 export var getFilesFromClipboard = function getFilesFromClipboard(files) {
   return Array.from(files).map(function (file) {
@@ -30,10 +29,11 @@ var defaultConfig = {
 };
 var COMPONENT_NAME = 'clipboard';
 var ClipboardImpl = /*#__PURE__*/function () {
-  function ClipboardImpl(uploadService, createAnalyticsEvent) {
+  function ClipboardImpl(uploadService, createAnalyticsEvent, featureFlags) {
     _classCallCheck(this, ClipboardImpl);
     this.uploadService = uploadService;
     this.createAnalyticsEvent = createAnalyticsEvent;
+    this.featureFlags = featureFlags;
   }
   _createClass(ClipboardImpl, [{
     key: "activate",
@@ -60,7 +60,8 @@ var ClipboardImpl = /*#__PURE__*/function () {
   }, {
     key: "onFilesPasted",
     value: function onFilesPasted(files) {
-      this.uploadService.addFilesWithSource(files);
+      var featureFlags = this.featureFlags;
+      this.uploadService.addFilesWithSource(files, featureFlags);
       this.fireAnalyticsEvent(files);
     }
   }, {
@@ -137,7 +138,7 @@ export var ClipboardBase = /*#__PURE__*/function (_LocalUploadComponent) {
     var _this;
     _classCallCheck(this, ClipboardBase);
     _this = _super.call(this, props, COMPONENT_NAME);
-    _defineProperty(_assertThisInitialized(_this), "clipboard", new ClipboardImpl(_this.uploadService, _this.props.createAnalyticsEvent));
+    _this.clipboard = new ClipboardImpl(_this.uploadService, _this.props.createAnalyticsEvent, props.featureFlags);
     return _this;
   }
   _createClass(ClipboardBase, [{
@@ -145,6 +146,13 @@ export var ClipboardBase = /*#__PURE__*/function (_LocalUploadComponent) {
     value: function componentDidMount() {
       this.clipboard.activate();
     }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      if (prevProps.featureFlags !== this.props.featureFlags) {
+        this.clipboard.featureFlags = this.props.featureFlags;
+      }
+    }
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
@@ -162,6 +170,4 @@ _defineProperty(ClipboardBase, "defaultProps", {
   config: defaultConfig
 });
 export default ClipboardBase;
-export var Clipboard = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME), {
-  filterFeatureFlags: LOGGED_FEATURE_FLAGS
-})(withAnalyticsEvents()(ClipboardBase));
+export var Clipboard = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME))(withAnalyticsEvents()(ClipboardBase));

package/dist/esm/components/dropzone/dropzone.js

@@ -14,7 +14,7 @@ import { ANALYTICS_MEDIA_CHANNEL, getMediaFeatureFlag, withMediaAnalyticsContext
 import { isWebkitSupported } from '@atlaskit/media-ui/browser';
 import { getFilesFromItems, getFilesFromFileSystemEntries } from 'flat-files';
 import { LocalUploadComponentReact } from '../localUploadReact';
-import { getPackageAttributes, LOGGED_FEATURE_FLAGS } from '../../util/analytics';
+import { getPackageAttributes } from '../../util/analytics';
 function dragContainsFiles(event) {
   if (!event.dataTransfer) {
     return false;
@@ -76,7 +76,7 @@ export var DropzoneBase = /*#__PURE__*/function (_LocalUploadComponent) {
     });
     _defineProperty(_assertThisInitialized(_this), "onFileDropped", /*#__PURE__*/function () {
       var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(dragEvent) {
-        var flattenedDirectoryFiles, files;
+        var featureFlags, flattenedDirectoryFiles, files;
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
@@ -89,30 +89,30 @@ export var DropzoneBase = /*#__PURE__*/function (_LocalUploadComponent) {
               case 2:
                 dragEvent.preventDefault();
                 dragEvent.stopPropagation();
-
+                featureFlags = _this.props.featureFlags;
                 /*
                  * Only enable support for folders if (1) the browser is supported (2) feature flag is enabled
                  * The file flattening library used to add support for Folders uses a function called webkitEntry.
                  * Some browser types are not supported https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitEntries
                  */
-                if (!(isWebkitSupported() && getMediaFeatureFlag('folderUploads', _this.props.featureFlags))) {
-                  _context.next = 13;
+                if (!(isWebkitSupported() && getMediaFeatureFlag('folderUploads', featureFlags))) {
+                  _context.next = 14;
                   break;
                 }
                 _this.fireAnalyticsForFolders(dragEvent.dataTransfer.items);
-                _context.next = 8;
+                _context.next = 9;
                 return _this.getFilesFromDragEvent(dragEvent.dataTransfer.items);
-              case 8:
+              case 9:
                 flattenedDirectoryFiles = _context.sent;
                 _this.onDropFolders(flattenedDirectoryFiles.length);
-                _this.uploadService.addFiles(flattenedDirectoryFiles);
-                _context.next = 16;
+                _this.uploadService.addFiles(flattenedDirectoryFiles, featureFlags);
+                _context.next = 17;
                 break;
-              case 13:
+              case 14:
                 _this.onDrop(dragEvent);
                 files = Array.from(dragEvent.dataTransfer.files);
-                _this.uploadService.addFiles(files);
-              case 16:
+                _this.uploadService.addFiles(files, featureFlags);
+              case 17:
               case "end":
                 return _context.stop();
             }
@@ -312,6 +312,4 @@ export var DropzoneBase = /*#__PURE__*/function (_LocalUploadComponent) {
   return DropzoneBase;
 }(LocalUploadComponentReact);
 export default DropzoneBase;
-export var Dropzone = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME), {
-  filterFeatureFlags: LOGGED_FEATURE_FLAGS
-})(withAnalyticsEvents()(DropzoneBase));
+export var Dropzone = withMediaAnalyticsContext(getPackageAttributes(COMPONENT_NAME))(withAnalyticsEvents()(DropzoneBase));

package/dist/esm/service/uploadServiceImpl.js

@@ -84,13 +84,13 @@ export var UploadServiceImpl = /*#__PURE__*/function () {
     }
   }, {
     key: "addFiles",
-    value: function addFiles(files) {
+    value: function addFiles(files, featureFlags) {
       this.addFilesWithSource(files.map(function (file) {
         return {
           file: file,
           source: LocalFileSource.LocalUpload
         };
-      }));
+      }), featureFlags);
     }
   }, {
     key: "addFile",
@@ -103,7 +103,7 @@ export var UploadServiceImpl = /*#__PURE__*/function () {
     }
   }, {
     key: "addFilesWithSource",
-    value: function addFilesWithSource(files) {
+    value: function addFilesWithSource(files, featureFlags) {
       var _this2 = this;
       if (files.length === 0) {
         return;
@@ -169,7 +169,7 @@ export var UploadServiceImpl = /*#__PURE__*/function () {
           deferredUploadId: deferredUploadId
         };
         var controller = _this2.createUploadController();
-        var sourceFileObservable = mediaClient.file.upload(uploadableFile, controller, uploadableUpfrontIds, traceContext);
+        var sourceFileObservable = mediaClient.file.upload(uploadableFile, controller, uploadableUpfrontIds, traceContext, featureFlags);
         var mediaFile = {
           id: id,
           name: file.name,

package/dist/esm/util/analytics.js

@@ -1,22 +1,6 @@
 import { isRequestError } from '@atlaskit/media-client';
-import { filterFeatureFlagKeysAllProducts, filterFeatureFlagNames } from '@atlaskit/media-common';
-
-// Component name will be prefixed with "media-picker-" in logs. Check ufoExperiences in utils files
-
-var relevantFlags = {
-  newCardExperience: true,
-  captions: false,
-  timestampOnVideo: false,
-  observedWidth: false,
-  mediaInline: false,
-  folderUploads: true,
-  memoryCacheLogging: false,
-  fetchFileStateAfterUpload: true
-};
 var packageName = "@atlaskit/media-picker";
-var packageVersion = "64.2.2";
-export var LOGGED_FEATURE_FLAGS = filterFeatureFlagNames(relevantFlags);
-export var LOGGED_FEATURE_FLAG_KEYS = filterFeatureFlagKeysAllProducts(relevantFlags);
+var packageVersion = "64.2.4";
 export function getPackageAttributes(componentName) {
   return {
     packageName: packageName,

package/dist/esm/util/ufoExperiences.js

@@ -2,10 +2,10 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { ConcurrentExperience, ExperiencePerformanceTypes, ExperienceTypes } from '@atlaskit/ufo';
+import { getFeatureFlagKeysAllProducts } from '@atlaskit/media-common';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
-import { LOGGED_FEATURE_FLAG_KEYS } from './analytics';
 var packageName = "@atlaskit/media-picker";
-var packageVersion = "64.2.2";
+var packageVersion = "64.2.4";
 var ufoExperience;
 var initExperience = function initExperience(id, componentName) {
   if (!ufoExperience) {
@@ -15,7 +15,7 @@ var initExperience = function initExperience(id, componentName) {
       },
       type: ExperienceTypes.Experience,
       performanceType: ExperiencePerformanceTypes.InlineResult,
-      featureFlags: LOGGED_FEATURE_FLAG_KEYS
+      featureFlags: getFeatureFlagKeysAllProducts()
     };
     ufoExperience = new ConcurrentExperience('media-upload', inlineExperience);
   }

package/dist/esm/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/media-picker",
-	"version": "64.2.2"
+	"version": "64.2.4"
 }

package/dist/types/components/clipboard/clipboard.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
+import { MediaFeatureFlags } from '@atlaskit/media-common';
 import { LocalUploadComponentReact, LocalUploadComponentBaseProps } from '../localUploadReact';
 import { LocalFileWithSource, UploadService } from '../../service/types';
 import { ClipboardConfig } from '../../types';
@@ -13,8 +14,9 @@ export declare type ClipboardProps = LocalUploadComponentBaseProps & {
 declare class ClipboardImpl {
     private readonly uploadService;
     private readonly createAnalyticsEvent?;
+    featureFlags?: MediaFeatureFlags | undefined;
     static instances: ClipboardImpl[];
-    constructor(uploadService: UploadService, createAnalyticsEvent?: CreateUIAnalyticsEvent | undefined);
+    constructor(uploadService: UploadService, createAnalyticsEvent?: CreateUIAnalyticsEvent | undefined, featureFlags?: MediaFeatureFlags | undefined);
     static get latestInstance(): ClipboardImpl | undefined;
     activate(): void;
     deactivate(): void;
@@ -29,6 +31,7 @@ export declare class ClipboardBase extends LocalUploadComponentReact<ClipboardPr
         config: ClipboardConfig;
     };
     componentDidMount(): void;
+    componentDidUpdate(prevProps: ClipboardProps): void;
     componentWillUnmount(): void;
     render(): null;
 }

package/dist/types/service/types.d.ts

@@ -1,3 +1,4 @@
+import { MediaFeatureFlags } from '@atlaskit/media-common';
 import { UploadEndEventPayload, UploadErrorEventPayload, UploadPreviewUpdateEventPayload, UploadsStartEventPayload, UploadParams } from '../types';
 export declare type UploadServiceEventPayloadTypes = {
     readonly 'files-added': UploadsStartEventPayload;
@@ -10,9 +11,9 @@ export declare type UploadServiceEventListener<E extends keyof UploadServiceEven
 export declare const MAX_FILE_SIZE_FOR_PREVIEW = 10000000;
 export interface UploadService {
     setUploadParams(uploadParams: UploadParams): void;
-    addFile(file: File, replaceFileId?: string): void;
-    addFiles(files: File[]): void;
-    addFilesWithSource(files: LocalFileWithSource[]): void;
+    addFile(file: File, replaceFileId?: string, featureFlags?: MediaFeatureFlags): void;
+    addFiles(files: File[], featureFlags?: MediaFeatureFlags): void;
+    addFilesWithSource(files: LocalFileWithSource[], featureFlags?: MediaFeatureFlags): void;
     cancel(id?: string): void;
     on<E extends keyof UploadServiceEventPayloadTypes>(event: E, listener: UploadServiceEventListener<E>): void;
     off<E extends keyof UploadServiceEventPayloadTypes>(event: E, listener: UploadServiceEventListener<E>): void;

package/dist/types/service/uploadServiceImpl.d.ts

@@ -2,6 +2,7 @@ import { MediaClient } from '@atlaskit/media-client';
 import { MediaFile, UploadParams } from '../types';
 import { UploadService, UploadServiceEventListener, UploadServiceEventPayloadTypes } from './types';
 import { LocalFileSource, LocalFileWithSource } from '../service/types';
+import { MediaFeatureFlags } from '@atlaskit/media-common';
 export interface CancellableFileUpload {
     mediaFile: MediaFile;
     file: File;
@@ -18,9 +19,9 @@ export declare class UploadServiceImpl implements UploadService {
     constructor(tenantMediaClient: MediaClient, tenantUploadParams: UploadParams, shouldCopyFileToRecents: boolean);
     setUploadParams(uploadParams: UploadParams): void;
     private createUploadController;
-    addFiles(files: File[]): void;
+    addFiles(files: File[], featureFlags?: MediaFeatureFlags): void;
     addFile(file: File, replaceFileId?: string): void;
-    addFilesWithSource(files: LocalFileWithSource[]): void;
+    addFilesWithSource(files: LocalFileWithSource[], featureFlags?: MediaFeatureFlags): void;
     cancel(id?: string): void;
     on<E extends keyof UploadServiceEventPayloadTypes>(event: E, listener: UploadServiceEventListener<E>): void;
     off<E extends keyof UploadServiceEventPayloadTypes>(event: E, listener: UploadServiceEventListener<E>): void;

package/dist/types/util/analytics.d.ts

@@ -1,7 +1,5 @@
 import { RequestMetadata } from '@atlaskit/media-client';
 import { PackageAttributes } from '@atlaskit/media-common';
 export declare type ComponentName = 'browser' | 'clipboard' | 'dropzone';
-export declare const LOGGED_FEATURE_FLAGS: (keyof import("@atlaskit/media-common").MediaFeatureFlags)[];
-export declare const LOGGED_FEATURE_FLAG_KEYS: string[];
 export declare function getPackageAttributes(componentName: ComponentName): PackageAttributes;
 export declare function getRequestMetadata(error?: Error): RequestMetadata | undefined;

package/example-helpers/mainWrapper.tsx

@@ -1,13 +1,12 @@
 import React, { ReactNode } from 'react';
 import { FeatureFlagsWrapper } from '@atlaskit/media-test-helpers';
-import { LOGGED_FEATURE_FLAGS } from '../src/util/analytics';
 
 import { UfoLoggerWrapper } from './UfoWrapper';
 import { IntlProvider } from 'react-intl-next';
 
 export const MainWrapper = ({ children }: { children: ReactNode }) => (
   <UfoLoggerWrapper>
-    <FeatureFlagsWrapper filterFlags={LOGGED_FEATURE_FLAGS}>
+    <FeatureFlagsWrapper>
       <IntlProvider locale={'en'}>{children}</IntlProvider>
     </FeatureFlagsWrapper>
   </UfoLoggerWrapper>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/media-picker",
-  "version": "64.2.2",
+  "version": "64.2.4",
   "description": "Library for handling file uploads",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -27,8 +27,8 @@
   },
   "dependencies": {
     "@atlaskit/analytics-next": "^9.0.0",
-    "@atlaskit/media-client": "^20.1.0",
-    "@atlaskit/media-common": "^3.0.0",
+    "@atlaskit/media-client": "^20.2.0",
+    "@atlaskit/media-common": "^4.0.0",
     "@atlaskit/media-ui": "^22.3.0",
     "@atlaskit/ufo": "^0.1.0",
     "@babel/runtime": "^7.0.0",
@@ -49,12 +49,12 @@
   "devDependencies": {
     "@atlaskit/analytics-listeners": "^8.5.0",
     "@atlaskit/analytics-namespaced-context": "^6.6.0",
-    "@atlaskit/button": "^16.5.0",
+    "@atlaskit/button": "^16.6.0",
     "@atlaskit/docs": "*",
     "@atlaskit/dropdown-menu": "^11.7.0",
     "@atlaskit/media-card": "^74.7.0",
     "@atlaskit/media-core": "^34.0.0",
-    "@atlaskit/media-test-helpers": "^30.1.0",
+    "@atlaskit/media-test-helpers": "^31.0.0",
     "@atlaskit/spinner": "^15.4.0",
     "@atlaskit/ssr": "*",
     "@atlaskit/toggle": "^12.5.0",