@atlaskit/editor-plugin-media 2.6.7 → 2.7.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-media
 
+## 2.7.0
+
+### Minor Changes
+
+- [#143009](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/143009)
+  [`6711c20c022e4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6711c20c022e4) -
+  [UX-3339] Adds a configuration for media insert to only allow for external links.
+
 ## 2.6.7
 
 ### Patch Changes

package/dist/cjs/nodeviews/mediaNodeUpdater.js

@@ -254,41 +254,47 @@ var MediaNodeUpdater = exports.MediaNodeUpdater = /*#__PURE__*/function () {
     })));
     (0, _defineProperty2.default)(this, "uploadExternalMedia", /*#__PURE__*/function () {
       var _ref8 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee7(getPos) {
-        var node, mediaProvider, uploadMediaClientConfig, mediaClient, collection, uploader, uploadableFileUpfrontIds, dimensions, pos;
+        var _this$props, node, mediaOptions, mediaProvider, uploadMediaClientConfig, mediaClient, collection, uploader, uploadableFileUpfrontIds, dimensions, pos;
         return _regenerator.default.wrap(function _callee7$(_context7) {
           while (1) switch (_context7.prev = _context7.next) {
             case 0:
-              node = _this.props.node;
-              _context7.next = 3;
-              return _this.props.mediaProvider;
+              _this$props = _this.props, node = _this$props.node, mediaOptions = _this$props.mediaOptions;
+              if (!(mediaOptions !== null && mediaOptions !== void 0 && mediaOptions.isExternalMediaUploadDisabled)) {
+                _context7.next = 3;
+                break;
+              }
+              return _context7.abrupt("return");
             case 3:
+              _context7.next = 5;
+              return _this.props.mediaProvider;
+            case 5:
               mediaProvider = _context7.sent;
               if (!(node && mediaProvider)) {
-                _context7.next = 24;
+                _context7.next = 26;
                 break;
               }
               uploadMediaClientConfig = mediaProvider.uploadMediaClientConfig;
               if (!(!uploadMediaClientConfig || !node.attrs.url)) {
-                _context7.next = 8;
+                _context7.next = 10;
                 break;
               }
               return _context7.abrupt("return");
-            case 8:
+            case 10:
               mediaClient = (0, _mediaClientReact.getMediaClient)(uploadMediaClientConfig);
               collection = mediaProvider.uploadParams && mediaProvider.uploadParams.collection;
-              _context7.prev = 10;
-              _context7.next = 13;
+              _context7.prev = 12;
+              _context7.next = 15;
               return mediaClient.file.uploadExternal(node.attrs.url, collection);
-            case 13:
+            case 15:
               uploader = _context7.sent;
               uploadableFileUpfrontIds = uploader.uploadableFileUpfrontIds, dimensions = uploader.dimensions;
               pos = getPos();
               if (!(typeof pos !== 'number')) {
-                _context7.next = 18;
+                _context7.next = 20;
                 break;
               }
               return _context7.abrupt("return");
-            case 18:
+            case 20:
               (0, _helpers.replaceExternalMedia)(pos + 1, {
                 id: uploadableFileUpfrontIds.id,
                 collection: collection,
@@ -296,11 +302,11 @@ var MediaNodeUpdater = exports.MediaNodeUpdater = /*#__PURE__*/function () {
                 width: dimensions.width,
                 occurrenceKey: uploadableFileUpfrontIds.occurrenceKey
               })(_this.props.view.state, _this.props.view.dispatch);
-              _context7.next = 24;
+              _context7.next = 26;
               break;
-            case 21:
-              _context7.prev = 21;
-              _context7.t0 = _context7["catch"](10);
+            case 23:
+              _context7.prev = 23;
+              _context7.t0 = _context7["catch"](12);
               //keep it as external media
               if (_this.props.dispatchAnalyticsEvent) {
                 _this.props.dispatchAnalyticsEvent({
@@ -309,11 +315,11 @@ var MediaNodeUpdater = exports.MediaNodeUpdater = /*#__PURE__*/function () {
                   eventType: _analytics.EVENT_TYPE.OPERATIONAL
                 });
               }
-            case 24:
+            case 26:
             case "end":
               return _context7.stop();
           }
-        }, _callee7, null, [[10, 21]]);
+        }, _callee7, null, [[12, 23]]);
       }));
       return function (_x3) {
         return _ref8.apply(this, arguments);

package/dist/cjs/nodeviews/mediaSingle.js

@@ -568,7 +568,7 @@ var MediaSingleNodeWrapper = function MediaSingleNodeWrapper(_ref6) {
     return mediaState !== null && mediaState !== void 0 && mediaState.mediaProvider ? Promise.resolve(mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider) : undefined;
   }, [mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider]);
   var isSelectedAndInteracted = (0, _react.useCallback)(function () {
-    return Boolean(selected() && hasHadInteraction);
+    return Boolean(selected() && hasHadInteraction !== false);
   }, [hasHadInteraction, selected]);
   if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single') || (0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single_jira')) {
     return (0, _react2.jsx)(_mediaSingleNext.MediaSingleNodeNext, {

package/dist/es2019/nodeviews/mediaNodeUpdater.js

@@ -136,8 +136,12 @@ export class MediaNodeUpdater {
     });
     _defineProperty(this, "uploadExternalMedia", async getPos => {
       const {
-        node
+        node,
+        mediaOptions
       } = this.props;
+      if (mediaOptions !== null && mediaOptions !== void 0 && mediaOptions.isExternalMediaUploadDisabled) {
+        return;
+      }
       const mediaProvider = await this.props.mediaProvider;
       if (node && mediaProvider) {
         const uploadMediaClientConfig = mediaProvider.uploadMediaClientConfig;

package/dist/es2019/nodeviews/mediaSingle.js

@@ -482,7 +482,7 @@ const MediaSingleNodeWrapper = ({
   } = useSharedPluginState(pluginInjectionApi, ['width', 'media', 'annotation', 'editorDisabled', 'editorViewMode']);
   const hasHadInteraction = useSharedPluginStateSelector(pluginInjectionApi, 'interaction.hasHadInteraction');
   const mediaProvider = useMemo(() => mediaState !== null && mediaState !== void 0 && mediaState.mediaProvider ? Promise.resolve(mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider) : undefined, [mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider]);
-  const isSelectedAndInteracted = useCallback(() => Boolean(selected() && hasHadInteraction), [hasHadInteraction, selected]);
+  const isSelectedAndInteracted = useCallback(() => Boolean(selected() && hasHadInteraction !== false), [hasHadInteraction, selected]);
   if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
     return jsx(MediaSingleNodeNext, {
       width: (widthState === null || widthState === void 0 ? void 0 : widthState.width) || 0,

package/dist/esm/nodeviews/mediaNodeUpdater.js

@@ -247,41 +247,47 @@ export var MediaNodeUpdater = /*#__PURE__*/function () {
     })));
     _defineProperty(this, "uploadExternalMedia", /*#__PURE__*/function () {
       var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7(getPos) {
-        var node, mediaProvider, uploadMediaClientConfig, mediaClient, collection, uploader, uploadableFileUpfrontIds, dimensions, pos;
+        var _this$props, node, mediaOptions, mediaProvider, uploadMediaClientConfig, mediaClient, collection, uploader, uploadableFileUpfrontIds, dimensions, pos;
         return _regeneratorRuntime.wrap(function _callee7$(_context7) {
           while (1) switch (_context7.prev = _context7.next) {
             case 0:
-              node = _this.props.node;
-              _context7.next = 3;
-              return _this.props.mediaProvider;
+              _this$props = _this.props, node = _this$props.node, mediaOptions = _this$props.mediaOptions;
+              if (!(mediaOptions !== null && mediaOptions !== void 0 && mediaOptions.isExternalMediaUploadDisabled)) {
+                _context7.next = 3;
+                break;
+              }
+              return _context7.abrupt("return");
             case 3:
+              _context7.next = 5;
+              return _this.props.mediaProvider;
+            case 5:
               mediaProvider = _context7.sent;
               if (!(node && mediaProvider)) {
-                _context7.next = 24;
+                _context7.next = 26;
                 break;
               }
               uploadMediaClientConfig = mediaProvider.uploadMediaClientConfig;
               if (!(!uploadMediaClientConfig || !node.attrs.url)) {
-                _context7.next = 8;
+                _context7.next = 10;
                 break;
               }
               return _context7.abrupt("return");
-            case 8:
+            case 10:
               mediaClient = getMediaClient(uploadMediaClientConfig);
               collection = mediaProvider.uploadParams && mediaProvider.uploadParams.collection;
-              _context7.prev = 10;
-              _context7.next = 13;
+              _context7.prev = 12;
+              _context7.next = 15;
               return mediaClient.file.uploadExternal(node.attrs.url, collection);
-            case 13:
+            case 15:
               uploader = _context7.sent;
               uploadableFileUpfrontIds = uploader.uploadableFileUpfrontIds, dimensions = uploader.dimensions;
               pos = getPos();
               if (!(typeof pos !== 'number')) {
-                _context7.next = 18;
+                _context7.next = 20;
                 break;
               }
               return _context7.abrupt("return");
-            case 18:
+            case 20:
               replaceExternalMedia(pos + 1, {
                 id: uploadableFileUpfrontIds.id,
                 collection: collection,
@@ -289,11 +295,11 @@ export var MediaNodeUpdater = /*#__PURE__*/function () {
                 width: dimensions.width,
                 occurrenceKey: uploadableFileUpfrontIds.occurrenceKey
               })(_this.props.view.state, _this.props.view.dispatch);
-              _context7.next = 24;
+              _context7.next = 26;
               break;
-            case 21:
-              _context7.prev = 21;
-              _context7.t0 = _context7["catch"](10);
+            case 23:
+              _context7.prev = 23;
+              _context7.t0 = _context7["catch"](12);
               //keep it as external media
               if (_this.props.dispatchAnalyticsEvent) {
                 _this.props.dispatchAnalyticsEvent({
@@ -302,11 +308,11 @@ export var MediaNodeUpdater = /*#__PURE__*/function () {
                   eventType: EVENT_TYPE.OPERATIONAL
                 });
               }
-            case 24:
+            case 26:
             case "end":
               return _context7.stop();
           }
-        }, _callee7, null, [[10, 21]]);
+        }, _callee7, null, [[12, 23]]);
       }));
       return function (_x3) {
         return _ref8.apply(this, arguments);

package/dist/esm/nodeviews/mediaSingle.js

@@ -563,7 +563,7 @@ var MediaSingleNodeWrapper = function MediaSingleNodeWrapper(_ref6) {
     return mediaState !== null && mediaState !== void 0 && mediaState.mediaProvider ? Promise.resolve(mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider) : undefined;
   }, [mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider]);
   var isSelectedAndInteracted = useCallback(function () {
-    return Boolean(selected() && hasHadInteraction);
+    return Boolean(selected() && hasHadInteraction !== false);
   }, [hasHadInteraction, selected]);
   if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
     return jsx(MediaSingleNodeNext, {

package/dist/types/types/index.d.ts

@@ -57,6 +57,23 @@ export interface MediaPluginOptions {
     forceHandlePositioning?: HandlePositioning;
     mediaShallowCopyScope?: MediaCopyScope;
     allowPixelResizing?: boolean;
+    /**
+     * Enabling this will prevent this plugin from automatically trying to upload external images to the Media service.
+     * This can be used in conjunction with the `isOnlyExternalLinks` config for `media-insert-plugin` to limit images
+     * to external URLs in the UI as well.
+     *
+     * @example
+     * ```typescript
+     *  createDefaultPreset({ featureFlags: {}, paste: {} })
+     *      .add(listPlugin)
+     *      .add(gridPlugin)
+     *      .add([mediaPlugin, { provider, allowMediaSingle: true, isExternalMediaUploadDisabled: true }])
+     *      .add(insertBlockPlugin)
+     *      .add(contentInsertionPlugin)
+     *      .add([mediaInsertPlugin, { isOnlyExternalLinks: true }])
+     * ```
+     */
+    isExternalMediaUploadDisabled?: boolean;
 }
 /**
  * @private

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

@@ -57,6 +57,23 @@ export interface MediaPluginOptions {
     forceHandlePositioning?: HandlePositioning;
     mediaShallowCopyScope?: MediaCopyScope;
     allowPixelResizing?: boolean;
+    /**
+     * Enabling this will prevent this plugin from automatically trying to upload external images to the Media service.
+     * This can be used in conjunction with the `isOnlyExternalLinks` config for `media-insert-plugin` to limit images
+     * to external URLs in the UI as well.
+     *
+     * @example
+     * ```typescript
+     *  createDefaultPreset({ featureFlags: {}, paste: {} })
+     *      .add(listPlugin)
+     *      .add(gridPlugin)
+     *      .add([mediaPlugin, { provider, allowMediaSingle: true, isExternalMediaUploadDisabled: true }])
+     *      .add(insertBlockPlugin)
+     *      .add(contentInsertionPlugin)
+     *      .add([mediaInsertPlugin, { isOnlyExternalLinks: true }])
+     * ```
+     */
+    isExternalMediaUploadDisabled?: boolean;
 }
 /**
  * @private

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media",
-	"version": "2.6.7",
+	"version": "2.7.0",
 	"description": "Media plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -38,7 +38,7 @@
 		"@atlaskit/analytics-namespaced-context": "^7.0.0",
 		"@atlaskit/analytics-next": "^11.0.0",
 		"@atlaskit/button": "^23.0.0",
-		"@atlaskit/editor-common": "^103.16.0",
+		"@atlaskit/editor-common": "^103.19.0",
 		"@atlaskit/editor-palette": "^2.1.0",
 		"@atlaskit/editor-plugin-analytics": "^2.2.0",
 		"@atlaskit/editor-plugin-annotation": "^2.7.0",
@@ -70,7 +70,7 @@
 		"@atlaskit/primitives": "^14.4.0",
 		"@atlaskit/textfield": "^8.0.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^4.14.0",
+		"@atlaskit/tmp-editor-statsig": "^4.15.0",
 		"@atlaskit/tokens": "^4.8.0",
 		"@atlaskit/tooltip": "^20.0.0",
 		"@babel/runtime": "^7.0.0",