@atlaskit/media-file-preview 0.0.1

package/dist/es2019/getPreview/objectURLCache.js

@@ -0,0 +1,44 @@
+import { EventEmitter2 } from 'eventemitter2';
+import { LRUMap } from 'lru_map';
+export const PREVIEW_CACHE_LRU_SIZE = 50;
+class ExtendedLRUCache extends LRUMap {
+  constructor(limit) {
+    super(limit);
+    this.eventEmitter = new EventEmitter2();
+  }
+  shift() {
+    const entry = super.shift();
+    this.eventEmitter.emit('shift', entry);
+    return entry;
+  }
+  on(event, callback) {
+    this.eventEmitter.on(event, callback);
+  }
+}
+export class ObjectURLCache {
+  constructor(size) {
+    this.cache = new ExtendedLRUCache(size);
+    this.cache.on('shift', entry => {
+      if (entry && entry[1].dataURI) {
+        URL.revokeObjectURL(entry[1].dataURI);
+      }
+    });
+  }
+  has(key) {
+    return !!this.cache.find(key);
+  }
+  get(key) {
+    return this.cache.get(key);
+  }
+  set(key, value) {
+    this.cache.set(key, value);
+  }
+  remove(key) {
+    const removed = this.cache.delete(key);
+    removed && URL.revokeObjectURL(removed.dataURI);
+  }
+  clear() {
+    this.cache.clear();
+  }
+}
+export const createObjectURLCache = () => new ObjectURLCache(PREVIEW_CACHE_LRU_SIZE);

package/dist/es2019/getPreview/videoSnapshot.js

@@ -0,0 +1,41 @@
+export const takeSnapshot = async blob => {
+  return new Promise((resolve, reject) => {
+    const url = URL.createObjectURL(blob);
+    const video = document.createElement('video');
+    video.preload = 'metadata';
+    video.src = url;
+    video.muted = true;
+    video.play().catch(() => {
+      return reject(new Error('failed to play video'));
+    });
+
+    // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
+    video.addEventListener('timeupdate', function timeUpdateHandler() {
+      // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
+      video.removeEventListener('timeupdate', timeUpdateHandler);
+      video.pause();
+      URL.revokeObjectURL(url);
+      //create canvas to draw our first frame on.
+
+      if (!video.videoWidth && !video.videoHeight) {
+        return reject(new Error('error retrieving video dimensions'));
+      }
+      const canvas = document.createElement('canvas');
+      canvas.width = video.videoWidth;
+      canvas.height = video.videoHeight;
+      const context = canvas.getContext('2d');
+      if (!context) {
+        return reject(new Error('error creating canvas context'));
+      }
+      context.drawImage(video, 0, 0, canvas.width, canvas.height);
+      const dataURL = canvas.toDataURL('image/jpeg', 0.85);
+      resolve(dataURL);
+    });
+
+    // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
+    video.addEventListener('error', () => {
+      reject(new Error('failed to load video'));
+      URL.revokeObjectURL(url);
+    });
+  });
+};

package/dist/es2019/globalScope/getSSRData.js

@@ -0,0 +1,8 @@
+import { getKey, getMediaCardSSR } from './globalScope';
+export const getSSRData = identifier => {
+  const mediaCardSsr = getMediaCardSSR();
+  if (!mediaCardSsr) {
+    return;
+  }
+  return mediaCardSsr[getKey(identifier)];
+};

package/dist/es2019/globalScope/globalScope.js

@@ -0,0 +1,48 @@
+import { printFunctionCall, printScript } from './printScript';
+// ----- WARNING -----
+// This is a very sensitive fraction of code.
+// Any changes to this file must be tested directly in product before merging.
+// The scripts printed here might differ from what we observe in our internal tests
+// due to minimification, for example.
+export const GLOBAL_MEDIA_CARD_SSR = 'mediaCardSsr';
+export const GLOBAL_MEDIA_NAMESPACE = '__MEDIA_INTERNAL';
+export function getMediaGlobalScope(globalScope = window) {
+  // Must match GLOBAL_MEDIA_NAMESPACE. Can't reference the constant from here.
+  const namespace = '__MEDIA_INTERNAL';
+  if (!globalScope[namespace]) {
+    globalScope[namespace] = {};
+  }
+  return globalScope[namespace];
+}
+export function getMediaCardSSR(globalScope = window) {
+  const globalMedia = getMediaGlobalScope(globalScope);
+  // Must match GLOBAL_MEDIA_CARD_SSR. Can't reference the constant from here.
+  const key = 'mediaCardSsr';
+  if (!globalMedia[key]) {
+    globalMedia[key] = {};
+  }
+  return globalMedia[key];
+}
+const dashed = param => param ? `-${param}` : '';
+export const getKey = ({
+  id,
+  collectionName,
+  occurrenceKey
+}) => `${id}${dashed(collectionName)}${dashed(occurrenceKey)}`;
+export const storeDataURI = (key, dataURI, dimensions, error, globalScope = window) => {
+  const mediaCardSsr = getMediaCardSSR(globalScope);
+  mediaCardSsr[key] = {
+    dataURI,
+    dimensions,
+    error
+  };
+};
+const generateScript = (identifier, dataURI, dimensions, error) => {
+  const functionCall = printFunctionCall(storeDataURI, getKey(identifier), dataURI, dimensions, error);
+  return printScript([getMediaCardSSR.toString(), getMediaGlobalScope.toString(), functionCall]);
+};
+export const generateScriptProps = (identifier, dataURI, dimensions, error) => ({
+  dangerouslySetInnerHTML: {
+    __html: generateScript(identifier, dataURI, dimensions, error)
+  }
+});

package/dist/es2019/globalScope/index.js

@@ -0,0 +1,2 @@
+export { GLOBAL_MEDIA_NAMESPACE, GLOBAL_MEDIA_CARD_SSR, generateScriptProps, getKey } from './globalScope';
+export { getSSRData } from './getSSRData';

package/dist/es2019/globalScope/printScript.js

@@ -0,0 +1,16 @@
+const printParam = param => {
+  if (typeof param === 'string') {
+    return `'${param}'`;
+  } else if (typeof param === 'object') {
+    return JSON.stringify(param);
+  } else if (param === undefined) {
+    return 'undefined';
+  }
+  return param;
+};
+const printParams = args => args.map(arg => printParam(arg)).join(',');
+export const printFunctionCall = (fn, ...args) => `(${fn.toString()})(${printParams(args)});`;
+export const printScript = statements => `(function(){
+  ${statements.join(';')}
+})();
+`;

package/dist/es2019/globalScope/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/helpers.js

@@ -0,0 +1,53 @@
+import { useRef } from 'react';
+/**
+ * Checks if at least one of next dimensions is bigger than current
+ * If a single dimension is undefined, returns false
+ */
+export const isBigger = (current, next) => {
+  const {
+    width: currentWidth,
+    height: currentHeight
+  } = current || {};
+  const {
+    width: nextWidth,
+    height: nextHeight
+  } = next || {};
+  if (!!currentWidth && !!currentHeight && !!nextWidth && !!nextHeight) {
+    const nextIsWider = currentWidth < nextWidth;
+    const nextIsHigher = currentHeight < nextHeight;
+    return nextIsHigher || nextIsWider;
+  } else {
+    return false;
+  }
+};
+
+/** Verifies if the current screen is retina display */
+function isRetina() {
+  const mediaQuery = '(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-resolution: 1.5dppx)';
+  return window.devicePixelRatio > 1 || window.matchMedia && window.matchMedia(mediaQuery).matches;
+}
+export const createRequestDimensions = dimensions => {
+  if (!dimensions) {
+    return;
+  }
+  const retinaFactor = isRetina() ? 2 : 1;
+  const {
+    width,
+    height
+  } = dimensions;
+  const result = {};
+  if (width) {
+    result.width = width * retinaFactor;
+  }
+  if (height) {
+    result.height = height * retinaFactor;
+  }
+  return result;
+};
+
+/** Stores the provided value in a ref object to avoid "component rerenders" when the value is used as a hook dependency */
+export function useCurrentValueRef(value) {
+  const ref = useRef(value);
+  ref.current = value;
+  return ref;
+}

package/dist/es2019/index.js

@@ -0,0 +1 @@
+export { useFilePreview } from './useFilePreview';

package/dist/es2019/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/useFilePreview.js

@@ -0,0 +1,333 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { imageResizeModeToFileImageMode, isImageRepresentationReady } from '@atlaskit/media-client';
+import { MediaFileStateError, useFileState, useMediaClient } from '@atlaskit/media-client-react';
+import { isMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
+import { extractErrorInfo } from './analytics';
+import { ensureMediaFilePreviewError, ImageLoadError, MediaFilePreviewError } from './errors';
+import { getAndCacheLocalPreview, getAndCacheRemotePreview, getSSRPreview, isLocalPreview, isSSRClientPreview, isSSRDataPreview, isSupportedLocalPreview, mediaFilePreviewCache } from './getPreview';
+import { generateScriptProps, getSSRData } from './globalScope';
+import { createRequestDimensions, isBigger, useCurrentValueRef } from './helpers';
+export const useFilePreview = ({
+  resizeMode = 'crop',
+  identifier,
+  ssr,
+  dimensions,
+  traceContext,
+  previewDidRender,
+  skipRemote,
+  mediaBlobUrlAttrs
+}) => {
+  const mediaClient = useMediaClient();
+  const [status, setStatus] = useState('loading');
+  const [error, setError] = useState();
+  const [nonCriticalError, setNonCriticalError] = useState();
+  const [isBannedLocalPreview, setIsBannedLocalPreview] = useState(false);
+  const wasResolvedUpfrontPreviewRef = useRef(false);
+  const ssrReliabilityRef = useRef(initialSsrReliability);
+  const requestDimensions = useMemo(() => dimensions ? createRequestDimensions(dimensions) : undefined, [dimensions]);
+  const requestDimensionsRef = useCurrentValueRef(requestDimensions);
+  const imageURLParams = useMemo(() => ({
+    collection: identifier.collectionName,
+    mode: resizeMode === 'stretchy-fit' ? 'full-fit' : resizeMode,
+    ...requestDimensions,
+    allowAnimated: true
+  }), [requestDimensions, identifier.collectionName, resizeMode]);
+  const previewInitializer = () => {
+    const fileImageMode = imageResizeModeToFileImageMode(resizeMode);
+    const preview = mediaFilePreviewCache.get(identifier.id, fileImageMode);
+    if (preview) {
+      return preview;
+    }
+    if (ssr) {
+      const ssrData = getSSRData(identifier);
+      if (ssrData !== null && ssrData !== void 0 && ssrData.error) {
+        ssrReliabilityRef.current.server = {
+          status: 'fail',
+          ...ssrData.error
+        };
+      }
+      if (!(ssrData !== null && ssrData !== void 0 && ssrData.dataURI)) {
+        try {
+          return getSSRPreview(ssr, mediaClient, identifier.id, imageURLParams, mediaBlobUrlAttrs);
+        } catch (e) {
+          ssrReliabilityRef.current[ssr] = {
+            status: 'fail',
+            ...extractErrorInfo(e)
+          };
+        }
+      } else {
+        const {
+          dimensions,
+          dataURI
+        } = ssrData;
+        return {
+          dataURI,
+          dimensions,
+          source: 'ssr-data'
+        };
+      }
+    }
+  };
+  const [preview, setPreview] = useState(previewInitializer);
+  const {
+    fileState
+  } = useFileState(identifier.id, {
+    skipRemote,
+    collectionName: identifier.collectionName,
+    occurrenceKey: identifier.occurrenceKey
+  });
+
+  //----------------------------------------------------------------
+  // Update status
+  //----------------------------------------------------------------
+
+  // TOOD: make a full hook reset (remount) on New identifier or client
+  useEffect(() => {
+    setStatus('loading');
+  }, [identifier]);
+  const updateFileStateRef = useCurrentValueRef(() => {
+    if (fileState) {
+      // do not update the status if the status is final
+      if (['complete', 'error', 'failed-processing'].includes(status)) {
+        return;
+      }
+      if (fileState.status !== 'error') {
+        const mediaType = 'mediaType' in fileState ? fileState.mediaType : undefined;
+        const isPreviewable = !!mediaType && ['audio', 'video', 'image', 'doc'].indexOf(mediaType) > -1;
+        const isPreviewableFileState = !!fileState.preview;
+        const isSupportedLocalPreview = mediaType === 'image' || mediaType === 'video';
+        const hasLocalPreview = !isBannedLocalPreview && isPreviewableFileState && isSupportedLocalPreview && !!fileState.mimeType && isMimeTypeSupportedByBrowser(fileState.mimeType);
+        const hasRemotePreview = isImageRepresentationReady(fileState);
+        const hasPreview = hasLocalPreview || hasRemotePreview;
+        let newStatus;
+        switch (fileState.status) {
+          case 'uploading':
+          case 'failed-processing':
+          case 'processing':
+            newStatus = fileState.status;
+            break;
+          case 'processed':
+            if (!isPreviewable || !hasPreview) {
+              newStatus = 'complete';
+              break;
+            }
+            newStatus = 'loading-preview';
+            break;
+          default:
+            newStatus = 'loading';
+        }
+        setStatus(newStatus);
+      } else {
+        const e = new MediaFileStateError(fileState.id, fileState.reason, fileState.message, fileState.details);
+        const errorReason = status === 'uploading' ? 'upload' : 'metadata-fetch';
+        setError(new MediaFilePreviewError(errorReason, e));
+        setStatus('error');
+      }
+    }
+  });
+  useEffect(() => {
+    updateFileStateRef.current();
+  }, [fileState, updateFileStateRef]);
+  useEffect(() => {
+    if (previewDidRender &&
+    // We should't complete if status is uploading
+    ['loading-preview', 'processing'].includes(status)) {
+      setStatus('complete');
+      // TODO MEX-788: add test for "do not remove the preview when unsubscribing".
+      setIsBannedLocalPreview(false); // CXP-2723 TODO: we might be able to remove this??
+    }
+  }, [previewDidRender, status]);
+
+  // CXP-2723 TODO: Create test cases for banning local preview after status is complete
+
+  //----------------------------------------------------------------
+  // Preview Fetch Helper
+  //----------------------------------------------------------------
+  const getAndCacheRemotePreviewRef = useCurrentValueRef(() => {
+    return getAndCacheRemotePreview(mediaClient, identifier.id, requestDimensions || {}, imageURLParams, mediaBlobUrlAttrs, traceContext);
+  });
+
+  //----------------------------------------------------------------
+  // Cache SSR Preview
+  //----------------------------------------------------------------
+  useEffect(() => {
+    if (!skipRemote && ssr && !!preview && isSSRClientPreview(preview)) {
+      // Since the SSR preview brings the token in the query params,
+      // We need to fetch the remote preview to be able to cache it,
+      getAndCacheRemotePreviewRef.current().catch(() => {
+        // No need to log this error.
+        // If preview fails, it will be refetched later
+        //TODO: test this catch
+        // https://product-fabric.atlassian.net/browse/MEX-1071
+      });
+    }
+  }, [getAndCacheRemotePreviewRef, preview, skipRemote, ssr]);
+
+  //----------------------------------------------------------------
+  // Refetch SRR Preview if dimensions from Server have changed and are bigger,
+  //----------------------------------------------------------------
+  useEffect(() => {
+    // CXP-2813 TODO: This is called too many times if the refetch failed. Should be called only once
+    if (preview && !skipRemote && isSSRDataPreview(preview) && isBigger(preview.dimensions, requestDimensions)) {
+      getAndCacheRemotePreviewRef.current().then(setPreview).catch(e => {
+        const wrappedError = ensureMediaFilePreviewError('remote-preview-fetch-ssr', e, true);
+        setNonCriticalError(wrappedError);
+      });
+    }
+  }, [getAndCacheRemotePreviewRef, preview, requestDimensions, skipRemote]);
+
+  //----------------------------------------------------------------
+  // Upfront Preview
+  //----------------------------------------------------------------
+  useEffect(() => {
+    if (!preview && !wasResolvedUpfrontPreviewRef.current && !skipRemote) {
+      // We block any possible future call to this method regardless of the outcome (success or fail)
+      // If it fails, the normal preview fetch should occur after the file state is fetched anyways
+      wasResolvedUpfrontPreviewRef.current = true;
+      const fetchedDimensions = {
+        ...requestDimensions
+      };
+      getAndCacheRemotePreviewRef.current().then(newPreview => {
+        // If there are new and bigger dimensions in the props, and the upfront preview is still resolving,
+        // the fetched preview is no longer valid, and thus, we dismiss it
+        if (!isBigger(fetchedDimensions, requestDimensionsRef.current)) {
+          setPreview(newPreview);
+        }
+      }).catch(() => {
+        // NO need to log error. If this call fails, a refetch will happen after
+      });
+    }
+  }, [getAndCacheRemotePreviewRef, preview, requestDimensions, requestDimensionsRef, skipRemote]);
+
+  //----------------------------------------------------------------
+  // Cache, Local & Remote Preview
+  //----------------------------------------------------------------
+
+  useEffect(() => {
+    const cachedPreview = mediaFilePreviewCache.get(identifier.id, imageURLParams.mode);
+
+    // Cached Preview ----------------------------------------------------------------
+    if (!preview && cachedPreview && !isBigger(cachedPreview === null || cachedPreview === void 0 ? void 0 : cachedPreview.dimensions, requestDimensions)) {
+      setPreview(cachedPreview);
+    }
+    // Local Preview ----------------------------------------------------------------
+    else if (!preview && !isBannedLocalPreview && !!fileState && 'preview' in fileState && !!fileState.preview && isSupportedLocalPreview(fileState.mediaType) && isMimeTypeSupportedByBrowser(fileState.mimeType)) {
+      // Local preview is available only if it's supported by browser and supported by Media Card (isSupportedLocalPreview)
+      // For example, SVGs are mime type NOT supported by browser but media type supported by Media Card (image)
+      // Then, local Preview NOT available
+
+      getAndCacheLocalPreview(identifier.id, fileState.preview, requestDimensions || {}, imageURLParams.mode, mediaBlobUrlAttrs).then(setPreview).catch(e => {
+        setIsBannedLocalPreview(true);
+        // CXP-2723 TODO: We might have to wrap this error in MediaCardError
+        setNonCriticalError(e);
+      });
+    }
+    // Remote Preview ----------------------------------------------------------------
+    else if ((!preview || isBigger(preview.dimensions, requestDimensions)) && !skipRemote && wasResolvedUpfrontPreviewRef.current && !!fileState && isImageRepresentationReady(fileState)) {
+      getAndCacheRemotePreviewRef.current().then(setPreview).catch(e => {
+        setStatus('error');
+        setError(ensureMediaFilePreviewError('preview-fetch', e));
+      });
+    }
+  }, [fileState, getAndCacheRemotePreviewRef, identifier.id, imageURLParams.mode, isBannedLocalPreview, mediaBlobUrlAttrs, preview, requestDimensions, skipRemote]);
+
+  //----------------------------------------------------------------
+  // RETURN
+  //----------------------------------------------------------------
+
+  const onImageError = useCallback(newPreview => {
+    if (newPreview) {
+      const failedSSRObject = {
+        status: 'fail',
+        ...extractErrorInfo(new ImageLoadError(newPreview.source))
+      };
+      if (isSSRClientPreview(newPreview)) {
+        ssrReliabilityRef.current.client = failedSSRObject;
+      }
+
+      /*
+      If the preview failed and it comes from server (global scope / ssrData), it means that we have reused it in client and the error counts for both: server & client.
+      */
+
+      if (isSSRDataPreview(newPreview)) {
+        ssrReliabilityRef.current.server = failedSSRObject;
+        ssrReliabilityRef.current.client = failedSSRObject;
+      }
+    }
+
+    // If the dataURI has been replaced, we can dismiss this error
+    if ((newPreview === null || newPreview === void 0 ? void 0 : newPreview.dataURI) !== (preview === null || preview === void 0 ? void 0 : preview.dataURI)) {
+      return;
+    }
+    const error = new ImageLoadError(newPreview === null || newPreview === void 0 ? void 0 : newPreview.source);
+    const isLocal = newPreview && isLocalPreview(newPreview);
+    const isSSR = newPreview && (isSSRClientPreview(newPreview) || isSSRDataPreview(newPreview));
+    if (isLocal || isSSR) {
+      if (isLocal) {
+        setIsBannedLocalPreview(true);
+        setNonCriticalError(error);
+      }
+      const fileImageMode = imageResizeModeToFileImageMode(resizeMode);
+      mediaFilePreviewCache.remove(identifier.id, fileImageMode);
+      setPreview(undefined);
+    } else {
+      if (!['complete', 'error', 'failed-processing'].includes(status)) {
+        setStatus('error');
+        setError(error);
+      }
+    }
+  }, [identifier.id, preview === null || preview === void 0 ? void 0 : preview.dataURI, resizeMode, status]);
+  const onImageLoad = useCallback(newPreview => {
+    if (newPreview) {
+      if (isSSRClientPreview(newPreview) && ssrReliabilityRef.current.client.status === 'unknown') {
+        ssrReliabilityRef.current.client = {
+          status: 'success'
+        };
+      }
+
+      /*
+      If the image loads successfully and it comes from server (global scope / ssrData), it means that we have reused it in client and the success counts for both: server & client.
+      */
+
+      if (isSSRDataPreview(newPreview) && ssrReliabilityRef.current.server.status === 'unknown') {
+        ssrReliabilityRef.current.server = {
+          status: 'success'
+        };
+        ssrReliabilityRef.current.client = {
+          status: 'success'
+        };
+      }
+    }
+
+    // If the dataURI has been replaced, we can dismiss this callback
+    if ((newPreview === null || newPreview === void 0 ? void 0 : newPreview.dataURI) !== (preview === null || preview === void 0 ? void 0 : preview.dataURI)) {
+      return;
+    }
+  }, [preview === null || preview === void 0 ? void 0 : preview.dataURI]);
+
+  // FOR SSR
+  const getScriptProps = () => {
+    var _ssrReliabilityRef$cu;
+    return generateScriptProps(identifier, preview === null || preview === void 0 ? void 0 : preview.dataURI, requestDimensions, ((_ssrReliabilityRef$cu = ssrReliabilityRef.current.server) === null || _ssrReliabilityRef$cu === void 0 ? void 0 : _ssrReliabilityRef$cu.status) === 'fail' ? ssrReliabilityRef.current.server : undefined);
+  };
+
+  // CXP-2723 TODO: should consider simplifying our analytics, and how
+  // we might get rid of ssrReliabiltyRef from our hook
+  return {
+    preview,
+    error,
+    nonCriticalError,
+    ssrReliabilityRef,
+    onImageError,
+    onImageLoad,
+    getScriptProps
+  };
+};
+const initialSsrReliability = {
+  server: {
+    status: 'unknown'
+  },
+  client: {
+    status: 'unknown'
+  }
+};

package/dist/esm/analytics.js

@@ -0,0 +1,44 @@
+import { getMediaClientErrorReason, isRequestError } from '@atlaskit/media-client';
+import { getFileStateErrorReason, isMediaFilePreviewError, isMediaFileStateError } from './errors';
+export var getErrorTraceContext = function getErrorTraceContext(error) {
+  if (isMediaFilePreviewError(error) && !!error.secondaryError) {
+    if (isRequestError(error.secondaryError)) {
+      var _error$secondaryError;
+      return (_error$secondaryError = error.secondaryError.metadata) === null || _error$secondaryError === void 0 ? void 0 : _error$secondaryError.traceContext;
+    } else if (isMediaFileStateError(error.secondaryError)) {
+      var _error$secondaryError2;
+      return (_error$secondaryError2 = error.secondaryError.details) === null || _error$secondaryError2 === void 0 || (_error$secondaryError2 = _error$secondaryError2.metadata) === null || _error$secondaryError2 === void 0 ? void 0 : _error$secondaryError2.traceContext;
+    }
+  }
+};
+export var getRenderErrorFailReason = function getRenderErrorFailReason(error) {
+  if (isMediaFilePreviewError(error)) {
+    return error.primaryReason;
+  } else {
+    return 'nativeError';
+  }
+};
+export var getRenderErrorErrorReason = function getRenderErrorErrorReason(error) {
+  if (isMediaFilePreviewError(error) && error.secondaryError) {
+    var mediaClientReason = isMediaFileStateError(error.secondaryError) ? getFileStateErrorReason(error.secondaryError) : getMediaClientErrorReason(error.secondaryError);
+    if (mediaClientReason !== 'unknown') {
+      return mediaClientReason;
+    }
+  }
+  return 'nativeError';
+};
+export var getRenderErrorErrorDetail = function getRenderErrorErrorDetail(error) {
+  if (isMediaFilePreviewError(error) && error.secondaryError) {
+    return error.secondaryError.message;
+  } else {
+    return error.message;
+  }
+};
+export var extractErrorInfo = function extractErrorInfo(error, metadataTraceContext) {
+  return {
+    failReason: getRenderErrorFailReason(error),
+    error: getRenderErrorErrorReason(error),
+    errorDetail: getRenderErrorErrorDetail(error),
+    metadataTraceContext: metadataTraceContext !== null && metadataTraceContext !== void 0 ? metadataTraceContext : getErrorTraceContext(error)
+  };
+};