@atlaskit/media-viewer 54.0.0 → 54.1.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/media-viewer
 
+## 54.1.0
+
+### Minor Changes
+
+- [`19773530cd51c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/19773530cd51c) -
+  Add fallbackMediaNameFetcher support to MediaCard (FileCard) and MediaViewer (header display),
+  gated behind the platform_editor_media_name_fallback_viewer_card experiment
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 54.0.0
 
 ### Major Changes

package/dist/cjs/analytics/index.js

@@ -10,7 +10,7 @@ exports.packageVersion = exports.packageName = void 0;
 var _analytics = require("@atlaskit/media-common/analytics");
 var componentName = exports.component = exports.componentName = 'mediaViewer';
 var packageName = exports.packageName = "@atlaskit/media-viewer";
-var packageVersion = exports.packageVersion = "53.2.5";
+var packageVersion = exports.packageVersion = "54.0.0";
 function getFileAttributes(fileState) {
   if (!fileState) {
     return {

package/dist/cjs/analytics/ufoExperiences.js

@@ -13,7 +13,7 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 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/media-viewer";
-var packageVersion = "53.2.5";
+var packageVersion = "54.0.0";
 var ufoExperience;
 var getExperience = function getExperience() {
   if (!ufoExperience) {

package/dist/cjs/components/media-viewer.js

@@ -48,7 +48,8 @@ var MediaViewerBase = exports.MediaViewerBase = function MediaViewerBase(_ref) {
     items = _ref.items,
     extensions = _ref.extensions,
     contextId = _ref.contextId,
-    viewerOptions = _ref.viewerOptions;
+    viewerOptions = _ref.viewerOptions,
+    fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
   var _useMemo = (0, _react.useMemo)(function () {
       return normaliseItems(items, selectedItem, collectionName);
     }, [items, selectedItem, collectionName]),
@@ -82,7 +83,8 @@ var MediaViewerBase = exports.MediaViewerBase = function MediaViewerBase(_ref) {
     featureFlags: featureFlags,
     extensions: extensions,
     contextId: contextId,
-    viewerOptions: viewerOptions
+    viewerOptions: viewerOptions,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   });
 };
 

package/dist/cjs/header.js

@@ -19,6 +19,7 @@ var _mediaClientReact = require("@atlaskit/media-client-react");
 var _mimeTypeIcon = require("@atlaskit/media-ui/mime-type-icon");
 var _util = require("./viewers/codeViewer/util");
 var _errors = require("./errors");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 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 Header = exports.Header = function Header(_ref) {
   var _extensions$headerAct;
@@ -30,12 +31,19 @@ var Header = exports.Header = function Header(_ref) {
     identifier = _ref.identifier,
     onClose = _ref.onClose,
     onSetArchiveSideBarVisible = _ref.onSetArchiveSideBarVisible,
-    traceContext = _ref.traceContext;
+    traceContext = _ref.traceContext,
+    fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
   // States
   var _useState = (0, _react.useState)(_domain.Outcome.pending()),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     item = _useState2[0],
     setItem = _useState2[1];
+  var _useState3 = (0, _react.useState)(),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    fallbackMediaName = _useState4[0],
+    setFallbackMediaName = _useState4[1];
+  var fallbackMediaNameFetchAttempted = (0, _react.useRef)(false);
+  var lastFetchedFileId = (0, _react.useRef)();
 
   // Refs and Hooks
   var mediaClient = (0, _mediaClientReact.useMediaClient)();
@@ -81,6 +89,23 @@ var Header = exports.Header = function Header(_ref) {
       setItem(_domain.Outcome.failed(new _errors.MediaViewerError('header-fetch-metadata', (0, _mediaClient.toCommonMediaClientError)(fileState))));
     }
   }, [fileState, identifier]);
+  (0, _react.useEffect)(function () {
+    // Reset fetch state when the file identity changes (e.g. navigating in viewer)
+    var currentId = (fileState === null || fileState === void 0 ? void 0 : fileState.status) !== 'error' ? fileState === null || fileState === void 0 ? void 0 : fileState.id : undefined;
+    if (currentId && currentId !== lastFetchedFileId.current && (0, _expValEquals.expValEquals)('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true)) {
+      fallbackMediaNameFetchAttempted.current = false;
+      setFallbackMediaName(undefined);
+      lastFetchedFileId.current = currentId;
+    }
+    if (fileState && fileState.status !== 'error' && !fileState.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current && (0, _expValEquals.expValEquals)('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true)) {
+      fallbackMediaNameFetchAttempted.current = true;
+      fallbackMediaNameFetcher(fileState.id).then(function (name) {
+        setFallbackMediaName(name);
+      }, function () {
+        // Silently ignore fetch failures
+      });
+    }
+  }, [fileState, fallbackMediaNameFetcher]);
   var renderFileTypeText = function renderFileTypeText(item) {
     // render appropriate header if its a code/email item and the feature flag is enabled
     if ((0, _codeViewer.isCodeViewerItem)(item.name, item.mimeType)) {
@@ -128,7 +153,7 @@ var Header = exports.Header = function Header(_ref) {
         name: item.name
       })), /*#__PURE__*/_react.default.createElement(_styleWrappers.MedatadataTextWrapper, null, /*#__PURE__*/_react.default.createElement(_styleWrappers.MetadataFileName, {
         "data-testid": "media-viewer-file-name"
-      }, item.name || /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, _mediaUi.messages.unknown)), /*#__PURE__*/_react.default.createElement(_styleWrappers.MetadataSubText, {
+      }, item.name || (0, _expValEquals.expValEquals)('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true) && fallbackMediaName || /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, _mediaUi.messages.unknown)), /*#__PURE__*/_react.default.createElement(_styleWrappers.MetadataSubText, {
         "data-testid": "media-viewer-file-metadata-text"
       }, /*#__PURE__*/_react.default.createElement(_styleWrappers.FormattedMessageWrapper, null, renderFileTypeText(item)), item.size ? ' · ' + (0, _mediaUi.toHumanReadableMediaSize)(item.size) : '')));
     },

package/dist/cjs/list.js

@@ -26,7 +26,8 @@ var List = exports.List = function List(_ref) {
     isSidebarVisible = _ref.isSidebarVisible,
     onNavigationChange = _ref.onNavigationChange,
     items = _ref.items,
-    viewerOptions = _ref.viewerOptions;
+    viewerOptions = _ref.viewerOptions,
+    fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
   var _useState = (0, _react.useState)(defaultSelectedItem),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     selectedItem = _useState2[0],
@@ -56,7 +57,8 @@ var List = exports.List = function List(_ref) {
     isArchiveSideBarVisible: isArchiveSideBarVisible,
     featureFlags: featureFlags,
     onSetArchiveSideBarVisible: setIsArchiveSideBarVisible,
-    traceContext: traceContext.current
+    traceContext: traceContext.current,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   })), /*#__PURE__*/_react.default.createElement(_itemViewer.ItemViewer, {
     identifier: selectedItem,
     showControls: showControls,

package/dist/cjs/media-viewer.js

@@ -32,7 +32,8 @@ var MediaViewerComponent = function MediaViewerComponent(_ref) {
     _onClose = _ref.onClose,
     selectedItem = _ref.selectedItem,
     intl = _ref.intl,
-    viewerOptions = _ref.viewerOptions;
+    viewerOptions = _ref.viewerOptions,
+    fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     isSidebarVisible = _useState2[0],
@@ -96,7 +97,8 @@ var MediaViewerComponent = function MediaViewerComponent(_ref) {
     isSidebarVisible: isSidebarVisible,
     contextId: contextId,
     featureFlags: featureFlags,
-    viewerOptions: viewerOptions
+    viewerOptions: viewerOptions,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   })), renderSidebar()));
   return intl ? content : /*#__PURE__*/_react.default.createElement(_reactIntl.IntlProvider, {
     locale: "en"

package/dist/es2019/analytics/index.js

@@ -1,7 +1,7 @@
 import { ANALYTICS_MEDIA_CHANNEL, sanitiseAnalyticsPayload } from '@atlaskit/media-common/analytics';
 const componentName = 'mediaViewer';
 const packageName = "@atlaskit/media-viewer";
-const packageVersion = "53.2.5";
+const packageVersion = "54.0.0";
 export { packageName, packageVersion, componentName, componentName as component };
 export function getFileAttributes(fileState) {
   if (!fileState) {

package/dist/es2019/analytics/ufoExperiences.js

@@ -3,7 +3,7 @@ import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 import { getFeatureFlagKeysAllProducts } from '@atlaskit/media-common';
 import { fg } from '@atlaskit/platform-feature-flags';
 const packageName = "@atlaskit/media-viewer";
-const packageVersion = "53.2.5";
+const packageVersion = "54.0.0";
 let ufoExperience;
 const getExperience = () => {
   if (!ufoExperience) {

package/dist/es2019/components/media-viewer.js

@@ -34,7 +34,8 @@ export const MediaViewerBase = ({
   items,
   extensions,
   contextId,
-  viewerOptions
+  viewerOptions,
+  fallbackMediaNameFetcher
 }) => {
   const {
     items: normalisedItems,
@@ -68,7 +69,8 @@ export const MediaViewerBase = ({
     featureFlags: featureFlags,
     extensions: extensions,
     contextId: contextId,
-    viewerOptions: viewerOptions
+    viewerOptions: viewerOptions,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   });
 };
 

package/dist/es2019/header.js

@@ -10,6 +10,7 @@ import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
 import { MimeTypeIcon } from '@atlaskit/media-ui/mime-type-icon';
 import { getFormat } from './viewers/codeViewer/util';
 import { MediaViewerError } from './errors';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export const Header = ({
   isArchiveSideBarVisible = false,
   extensions,
@@ -18,11 +19,15 @@ export const Header = ({
   identifier,
   onClose,
   onSetArchiveSideBarVisible,
-  traceContext
+  traceContext,
+  fallbackMediaNameFetcher
 }) => {
   var _extensions$headerAct;
   // States
   const [item, setItem] = useState(Outcome.pending());
+  const [fallbackMediaName, setFallbackMediaName] = useState();
+  const fallbackMediaNameFetchAttempted = useRef(false);
+  const lastFetchedFileId = useRef();
 
   // Refs and Hooks
   const mediaClient = useMediaClient();
@@ -71,6 +76,23 @@ export const Header = ({
       setItem(Outcome.failed(new MediaViewerError('header-fetch-metadata', toCommonMediaClientError(fileState))));
     }
   }, [fileState, identifier]);
+  useEffect(() => {
+    // Reset fetch state when the file identity changes (e.g. navigating in viewer)
+    const currentId = (fileState === null || fileState === void 0 ? void 0 : fileState.status) !== 'error' ? fileState === null || fileState === void 0 ? void 0 : fileState.id : undefined;
+    if (currentId && currentId !== lastFetchedFileId.current && expValEquals('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true)) {
+      fallbackMediaNameFetchAttempted.current = false;
+      setFallbackMediaName(undefined);
+      lastFetchedFileId.current = currentId;
+    }
+    if (fileState && fileState.status !== 'error' && !fileState.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current && expValEquals('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true)) {
+      fallbackMediaNameFetchAttempted.current = true;
+      fallbackMediaNameFetcher(fileState.id).then(name => {
+        setFallbackMediaName(name);
+      }, () => {
+        // Silently ignore fetch failures
+      });
+    }
+  }, [fileState, fallbackMediaNameFetcher]);
   const renderFileTypeText = item => {
     // render appropriate header if its a code/email item and the feature flag is enabled
     if (isCodeViewerItem(item.name, item.mimeType)) {
@@ -119,7 +141,7 @@ export const Header = ({
       name: item.name
     })), /*#__PURE__*/React.createElement(MedatadataTextWrapper, null, /*#__PURE__*/React.createElement(MetadataFileName, {
       "data-testid": "media-viewer-file-name"
-    }, item.name || /*#__PURE__*/React.createElement(FormattedMessage, messages.unknown)), /*#__PURE__*/React.createElement(MetadataSubText, {
+    }, item.name || expValEquals('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true) && fallbackMediaName || /*#__PURE__*/React.createElement(FormattedMessage, messages.unknown)), /*#__PURE__*/React.createElement(MetadataSubText, {
       "data-testid": "media-viewer-file-metadata-text"
     }, /*#__PURE__*/React.createElement(FormattedMessageWrapper, null, renderFileTypeText(item)), item.size ? ' · ' + toHumanReadableMediaSize(item.size) : ''))),
     pending: () => null,

package/dist/es2019/list.js

@@ -16,7 +16,8 @@ export const List = ({
   isSidebarVisible,
   onNavigationChange,
   items,
-  viewerOptions
+  viewerOptions,
+  fallbackMediaNameFetcher
 }) => {
   const [selectedItem, setSelectedItem] = useState(defaultSelectedItem);
   const [previewCount, setPreviewCount] = useState(0);
@@ -38,7 +39,8 @@ export const List = ({
     isArchiveSideBarVisible: isArchiveSideBarVisible,
     featureFlags: featureFlags,
     onSetArchiveSideBarVisible: setIsArchiveSideBarVisible,
-    traceContext: traceContext.current
+    traceContext: traceContext.current,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   })), /*#__PURE__*/React.createElement(ItemViewer, {
     identifier: selectedItem,
     showControls: showControls,

package/dist/es2019/media-viewer.js

@@ -22,7 +22,8 @@ const MediaViewerComponent = ({
   onClose,
   selectedItem,
   intl,
-  viewerOptions
+  viewerOptions,
+  fallbackMediaNameFetcher
 }) => {
   const [isSidebarVisible, setIsSidebarVisible] = useState(false);
   const [selectedIdentifier, setSelectedIdentifier] = useState();
@@ -78,7 +79,8 @@ const MediaViewerComponent = ({
     isSidebarVisible: isSidebarVisible,
     contextId: contextId,
     featureFlags: featureFlags,
-    viewerOptions: viewerOptions
+    viewerOptions: viewerOptions,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   })), renderSidebar()));
   return intl ? content : /*#__PURE__*/React.createElement(IntlProvider, {
     locale: "en"

package/dist/esm/analytics/index.js

@@ -1,7 +1,7 @@
 import { ANALYTICS_MEDIA_CHANNEL, sanitiseAnalyticsPayload } from '@atlaskit/media-common/analytics';
 var componentName = 'mediaViewer';
 var packageName = "@atlaskit/media-viewer";
-var packageVersion = "53.2.5";
+var packageVersion = "54.0.0";
 export { packageName, packageVersion, componentName, componentName as component };
 export function getFileAttributes(fileState) {
   if (!fileState) {

package/dist/esm/analytics/ufoExperiences.js

@@ -6,7 +6,7 @@ import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 import { getFeatureFlagKeysAllProducts } from '@atlaskit/media-common';
 import { fg } from '@atlaskit/platform-feature-flags';
 var packageName = "@atlaskit/media-viewer";
-var packageVersion = "53.2.5";
+var packageVersion = "54.0.0";
 var ufoExperience;
 var getExperience = function getExperience() {
   if (!ufoExperience) {

package/dist/esm/components/media-viewer.js

@@ -39,7 +39,8 @@ export var MediaViewerBase = function MediaViewerBase(_ref) {
     items = _ref.items,
     extensions = _ref.extensions,
     contextId = _ref.contextId,
-    viewerOptions = _ref.viewerOptions;
+    viewerOptions = _ref.viewerOptions,
+    fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
   var _useMemo = useMemo(function () {
       return normaliseItems(items, selectedItem, collectionName);
     }, [items, selectedItem, collectionName]),
@@ -73,7 +74,8 @@ export var MediaViewerBase = function MediaViewerBase(_ref) {
     featureFlags: featureFlags,
     extensions: extensions,
     contextId: contextId,
-    viewerOptions: viewerOptions
+    viewerOptions: viewerOptions,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   });
 };
 

package/dist/esm/header.js

@@ -11,6 +11,7 @@ import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
 import { MimeTypeIcon } from '@atlaskit/media-ui/mime-type-icon';
 import { getFormat } from './viewers/codeViewer/util';
 import { MediaViewerError } from './errors';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export var Header = function Header(_ref) {
   var _extensions$headerAct;
   var _ref$isArchiveSideBar = _ref.isArchiveSideBarVisible,
@@ -21,12 +22,19 @@ export var Header = function Header(_ref) {
     identifier = _ref.identifier,
     onClose = _ref.onClose,
     onSetArchiveSideBarVisible = _ref.onSetArchiveSideBarVisible,
-    traceContext = _ref.traceContext;
+    traceContext = _ref.traceContext,
+    fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
   // States
   var _useState = useState(Outcome.pending()),
     _useState2 = _slicedToArray(_useState, 2),
     item = _useState2[0],
     setItem = _useState2[1];
+  var _useState3 = useState(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    fallbackMediaName = _useState4[0],
+    setFallbackMediaName = _useState4[1];
+  var fallbackMediaNameFetchAttempted = useRef(false);
+  var lastFetchedFileId = useRef();
 
   // Refs and Hooks
   var mediaClient = useMediaClient();
@@ -72,6 +80,23 @@ export var Header = function Header(_ref) {
       setItem(Outcome.failed(new MediaViewerError('header-fetch-metadata', toCommonMediaClientError(fileState))));
     }
   }, [fileState, identifier]);
+  useEffect(function () {
+    // Reset fetch state when the file identity changes (e.g. navigating in viewer)
+    var currentId = (fileState === null || fileState === void 0 ? void 0 : fileState.status) !== 'error' ? fileState === null || fileState === void 0 ? void 0 : fileState.id : undefined;
+    if (currentId && currentId !== lastFetchedFileId.current && expValEquals('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true)) {
+      fallbackMediaNameFetchAttempted.current = false;
+      setFallbackMediaName(undefined);
+      lastFetchedFileId.current = currentId;
+    }
+    if (fileState && fileState.status !== 'error' && !fileState.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current && expValEquals('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true)) {
+      fallbackMediaNameFetchAttempted.current = true;
+      fallbackMediaNameFetcher(fileState.id).then(function (name) {
+        setFallbackMediaName(name);
+      }, function () {
+        // Silently ignore fetch failures
+      });
+    }
+  }, [fileState, fallbackMediaNameFetcher]);
   var renderFileTypeText = function renderFileTypeText(item) {
     // render appropriate header if its a code/email item and the feature flag is enabled
     if (isCodeViewerItem(item.name, item.mimeType)) {
@@ -119,7 +144,7 @@ export var Header = function Header(_ref) {
         name: item.name
       })), /*#__PURE__*/React.createElement(MedatadataTextWrapper, null, /*#__PURE__*/React.createElement(MetadataFileName, {
         "data-testid": "media-viewer-file-name"
-      }, item.name || /*#__PURE__*/React.createElement(FormattedMessage, messages.unknown)), /*#__PURE__*/React.createElement(MetadataSubText, {
+      }, item.name || expValEquals('platform_editor_media_name_fallback_viewer_card', 'isEnabled', true) && fallbackMediaName || /*#__PURE__*/React.createElement(FormattedMessage, messages.unknown)), /*#__PURE__*/React.createElement(MetadataSubText, {
         "data-testid": "media-viewer-file-metadata-text"
       }, /*#__PURE__*/React.createElement(FormattedMessageWrapper, null, renderFileTypeText(item)), item.size ? ' · ' + toHumanReadableMediaSize(item.size) : '')));
     },

package/dist/esm/list.js

@@ -17,7 +17,8 @@ export var List = function List(_ref) {
     isSidebarVisible = _ref.isSidebarVisible,
     onNavigationChange = _ref.onNavigationChange,
     items = _ref.items,
-    viewerOptions = _ref.viewerOptions;
+    viewerOptions = _ref.viewerOptions,
+    fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
   var _useState = useState(defaultSelectedItem),
     _useState2 = _slicedToArray(_useState, 2),
     selectedItem = _useState2[0],
@@ -47,7 +48,8 @@ export var List = function List(_ref) {
     isArchiveSideBarVisible: isArchiveSideBarVisible,
     featureFlags: featureFlags,
     onSetArchiveSideBarVisible: setIsArchiveSideBarVisible,
-    traceContext: traceContext.current
+    traceContext: traceContext.current,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   })), /*#__PURE__*/React.createElement(ItemViewer, {
     identifier: selectedItem,
     showControls: showControls,

package/dist/esm/media-viewer.js

@@ -23,7 +23,8 @@ var MediaViewerComponent = function MediaViewerComponent(_ref) {
     _onClose = _ref.onClose,
     selectedItem = _ref.selectedItem,
     intl = _ref.intl,
-    viewerOptions = _ref.viewerOptions;
+    viewerOptions = _ref.viewerOptions,
+    fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isSidebarVisible = _useState2[0],
@@ -87,7 +88,8 @@ var MediaViewerComponent = function MediaViewerComponent(_ref) {
     isSidebarVisible: isSidebarVisible,
     contextId: contextId,
     featureFlags: featureFlags,
-    viewerOptions: viewerOptions
+    viewerOptions: viewerOptions,
+    fallbackMediaNameFetcher: fallbackMediaNameFetcher
   })), renderSidebar()));
   return intl ? content : /*#__PURE__*/React.createElement(IntlProvider, {
     locale: "en"

package/dist/types/components/media-viewer.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { type MediaViewerProps } from './types';
 import type { MediaViewerWithMediaClientConfigProps } from './types';
-export declare const MediaViewerBase: ({ featureFlags, onClose, selectedItem, collectionName, items, extensions, contextId, viewerOptions, }: MediaViewerProps) => React.JSX.Element;
+export declare const MediaViewerBase: ({ featureFlags, onClose, selectedItem, collectionName, items, extensions, contextId, viewerOptions, fallbackMediaNameFetcher, }: MediaViewerProps) => React.JSX.Element;
 export declare const MediaViewerWithMediaClient: (props: MediaViewerWithMediaClientConfigProps) => React.JSX.Element;

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

@@ -37,6 +37,7 @@ export interface MediaViewerProps {
     readonly extensions?: MediaViewerExtensions;
     readonly contextId?: string;
     readonly viewerOptions?: ViewerOptionsProps;
+    readonly fallbackMediaNameFetcher?: (id: string) => Promise<string>;
 }
 export type MediaMessage = {
     source: 'media';

package/dist/types/header.d.ts

@@ -13,7 +13,8 @@ export type Props = {
     readonly onSetArchiveSideBarVisible?: (isVisible: boolean) => void;
     readonly isArchiveSideBarVisible?: boolean;
     traceContext: MediaTraceContext;
+    readonly fallbackMediaNameFetcher?: (id: string) => Promise<string>;
 };
-export declare const Header: ({ isArchiveSideBarVisible, extensions, isSidebarVisible, onSidebarButtonClick, identifier, onClose, onSetArchiveSideBarVisible, traceContext, }: Props & WrappedComponentProps) => React.JSX.Element;
+export declare const Header: ({ isArchiveSideBarVisible, extensions, isSidebarVisible, onSidebarButtonClick, identifier, onClose, onSetArchiveSideBarVisible, traceContext, fallbackMediaNameFetcher, }: Props & WrappedComponentProps) => React.JSX.Element;
 declare const _default: React.FC<Props>;
 export default _default;

package/dist/types/list.d.ts

@@ -15,10 +15,11 @@ export type Props = Readonly<{
     contextId?: string;
     featureFlags?: MediaFeatureFlags;
     viewerOptions?: ViewerOptionsProps;
+    fallbackMediaNameFetcher?: (id: string) => Promise<string>;
 } & WithShowControlMethodProp>;
 export type State = {
     selectedItem: Identifier;
     previewCount: number;
     isArchiveSideBarVisible: boolean;
 };
-export declare const List: ({ defaultSelectedItem, onClose, showControls, extensions, onSidebarButtonClick, contextId, featureFlags, isSidebarVisible, onNavigationChange, items, viewerOptions, }: Props) => React.JSX.Element;
+export declare const List: ({ defaultSelectedItem, onClose, showControls, extensions, onSidebarButtonClick, contextId, featureFlags, isSidebarVisible, onNavigationChange, items, viewerOptions, fallbackMediaNameFetcher, }: Props) => React.JSX.Element;

package/dist/types/media-viewer.d.ts

@@ -12,5 +12,6 @@ export type Props = {
     contextId?: string;
     innerRef?: React.Ref<HTMLDivElement>;
     viewerOptions?: ViewerOptionsProps;
+    fallbackMediaNameFetcher?: (id: string) => Promise<string>;
 };
 export declare const MediaViewer: React.ComponentType<Props>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-viewer",
-	"version": "54.0.0",
+	"version": "54.1.0",
 	"description": "MediaViewer is Atlassian's powerful solution for viewing files on the web. It's both powerful and extendable yet easy-to-integrate",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -31,7 +31,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/analytics-next": "^12.0.0",
-		"@atlaskit/button": "^24.0.0",
+		"@atlaskit/button": "^24.1.0",
 		"@atlaskit/code": "^18.0.0",
 		"@atlaskit/css": "^1.0.0",
 		"@atlaskit/form": "^16.0.0",
@@ -44,7 +44,7 @@
 		"@atlaskit/media-common": "^14.0.0",
 		"@atlaskit/media-document-viewer": "^1.0.0",
 		"@atlaskit/media-svg": "^3.0.0",
-		"@atlaskit/media-ui": "^30.0.0",
+		"@atlaskit/media-ui": "^30.1.0",
 		"@atlaskit/platform-feature-flags": "^2.0.0",
 		"@atlaskit/portal": "^6.0.0",
 		"@atlaskit/primitives": "^20.0.0",
@@ -52,6 +52,7 @@
 		"@atlaskit/spinner": "^20.0.0",
 		"@atlaskit/textfield": "^9.0.0",
 		"@atlaskit/theme": "^26.0.0",
+		"@atlaskit/tmp-editor-statsig": "^108.3.0",
 		"@atlaskit/tokens": "^14.0.0",
 		"@atlaskit/tooltip": "^23.0.0",
 		"@atlaskit/ufo": "^1.0.0",