@atlaskit/media-file-preview 0.2.1 → 0.3.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/media-file-preview
 
+## 0.3.1
+
+### Patch Changes
+
+- [#70361](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/70361) [`6bcee8c57dac`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/6bcee8c57dac) - Support for files failed to process
+
+## 0.3.0
+
+### Minor Changes
+
+- [#70034](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/70034) [`0cf829b2ca1f`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0cf829b2ca1f) - Breaking: renamed return value from getScriptProps to getSsrScriptProps
+
 ## 0.2.1
 
 ### Patch Changes

package/dist/cjs/useFilePreview.js

@@ -114,10 +114,13 @@ var useFilePreview = exports.useFilePreview = function useFilePreview(_ref) {
   }, [identifier]);
   (0, _react.useEffect)(function () {
     if (status !== 'error') {
-      if (!preview && (!fileState || fileState.status === 'processing' || fileState.status === 'uploading')) {
-        setStatus('loading');
-      } else {
+      if (preview || fileState && fileState.status === 'processed' && !(0, _mediaClient.isImageRepresentationReady)(fileState)) {
         setStatus('complete');
+      } else if (!preview && fileState && fileState.status === 'failed-processing' && !(0, _mediaClient.isImageRepresentationReady)(fileState)) {
+        setStatus('error');
+        setError(new _errors.MediaFilePreviewError('failed-processing'));
+      } else {
+        setStatus('loading');
       }
     }
   }, [preview, status, fileState]);
@@ -264,10 +267,10 @@ var useFilePreview = exports.useFilePreview = function useFilePreview(_ref) {
   }, [preview === null || preview === void 0 ? void 0 : preview.dataURI]);
 
   // FOR SSR
-  var getScriptProps = function getScriptProps() {
+  var getSsrScriptProps = ssr === 'server' ? function () {
     var _ssrReliabilityRef$cu;
     return (0, _globalScope.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);
-  };
+  } : undefined;
 
   // CXP-2723 TODO: should consider simplifying our analytics, and how
   // we might get rid of ssrReliabiltyRef from our hook
@@ -279,7 +282,7 @@ var useFilePreview = exports.useFilePreview = function useFilePreview(_ref) {
     ssrReliabilityRef: ssrReliabilityRef,
     onImageError: onImageError,
     onImageLoad: onImageLoad,
-    getScriptProps: getScriptProps
+    getSsrScriptProps: getSsrScriptProps
   };
 };
 var initialSsrReliability = {

package/dist/es2019/useFilePreview.js

@@ -3,7 +3,7 @@ import { isImageRepresentationReady } from '@atlaskit/media-client';
 import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
 import { isMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
 import { extractErrorInfo } from './analytics';
-import { ensureMediaFilePreviewError, ImageLoadError } from './errors';
+import { ensureMediaFilePreviewError, ImageLoadError, MediaFilePreviewError } from './errors';
 import { getAndCacheLocalPreview, getAndCacheRemotePreview, getSSRPreview, isLocalPreview, isSSRClientPreview, isSSRDataPreview, isSSRPreview, isSupportedLocalPreview, mediaFilePreviewCache } from './getPreview';
 import { generateScriptProps, getSSRData } from './globalScope';
 import { createRequestDimensions, isBigger, useCurrentValueRef } from './helpers';
@@ -15,6 +15,7 @@ export const useFilePreview = ({
   traceContext,
   skipRemote,
   mediaBlobUrlAttrs,
+  // TODO: mediaBlobUrlAttrs can be missing several values contained in the file details. The preview hook is not updating the params in the preview after the file details are available.
   allowAnimated = true,
   upscale,
   maxAge
@@ -90,10 +91,13 @@ export const useFilePreview = ({
   }, [identifier]);
   useEffect(() => {
     if (status !== 'error') {
-      if (!preview && (!fileState || fileState.status === 'processing' || fileState.status === 'uploading')) {
-        setStatus('loading');
-      } else {
+      if (preview || fileState && fileState.status === 'processed' && !isImageRepresentationReady(fileState)) {
         setStatus('complete');
+      } else if (!preview && fileState && fileState.status === 'failed-processing' && !isImageRepresentationReady(fileState)) {
+        setStatus('error');
+        setError(new MediaFilePreviewError('failed-processing'));
+      } else {
+        setStatus('loading');
       }
     }
   }, [preview, status, fileState]);
@@ -243,10 +247,10 @@ export const useFilePreview = ({
   }, [preview === null || preview === void 0 ? void 0 : preview.dataURI]);
 
   // FOR SSR
-  const getScriptProps = () => {
+  const getSsrScriptProps = ssr === 'server' ? () => {
     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);
-  };
+  } : undefined;
 
   // CXP-2723 TODO: should consider simplifying our analytics, and how
   // we might get rid of ssrReliabiltyRef from our hook
@@ -258,7 +262,7 @@ export const useFilePreview = ({
     ssrReliabilityRef,
     onImageError,
     onImageLoad,
-    getScriptProps
+    getSsrScriptProps
   };
 };
 const initialSsrReliability = {

package/dist/esm/useFilePreview.js

@@ -7,7 +7,7 @@ import { isImageRepresentationReady } from '@atlaskit/media-client';
 import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
 import { isMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
 import { extractErrorInfo } from './analytics';
-import { ensureMediaFilePreviewError, ImageLoadError } from './errors';
+import { ensureMediaFilePreviewError, ImageLoadError, MediaFilePreviewError } from './errors';
 import { getAndCacheLocalPreview, getAndCacheRemotePreview, getSSRPreview, isLocalPreview, isSSRClientPreview, isSSRDataPreview, isSSRPreview, isSupportedLocalPreview, mediaFilePreviewCache } from './getPreview';
 import { generateScriptProps, getSSRData } from './globalScope';
 import { createRequestDimensions, isBigger, useCurrentValueRef } from './helpers';
@@ -107,10 +107,13 @@ export var useFilePreview = function useFilePreview(_ref) {
   }, [identifier]);
   useEffect(function () {
     if (status !== 'error') {
-      if (!preview && (!fileState || fileState.status === 'processing' || fileState.status === 'uploading')) {
-        setStatus('loading');
-      } else {
+      if (preview || fileState && fileState.status === 'processed' && !isImageRepresentationReady(fileState)) {
         setStatus('complete');
+      } else if (!preview && fileState && fileState.status === 'failed-processing' && !isImageRepresentationReady(fileState)) {
+        setStatus('error');
+        setError(new MediaFilePreviewError('failed-processing'));
+      } else {
+        setStatus('loading');
       }
     }
   }, [preview, status, fileState]);
@@ -257,10 +260,10 @@ export var useFilePreview = function useFilePreview(_ref) {
   }, [preview === null || preview === void 0 ? void 0 : preview.dataURI]);
 
   // FOR SSR
-  var getScriptProps = function getScriptProps() {
+  var getSsrScriptProps = ssr === 'server' ? function () {
     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);
-  };
+  } : undefined;
 
   // CXP-2723 TODO: should consider simplifying our analytics, and how
   // we might get rid of ssrReliabiltyRef from our hook
@@ -272,7 +275,7 @@ export var useFilePreview = function useFilePreview(_ref) {
     ssrReliabilityRef: ssrReliabilityRef,
     onImageError: onImageError,
     onImageLoad: onImageLoad,
-    getScriptProps: getScriptProps
+    getSsrScriptProps: getSsrScriptProps
   };
 };
 var initialSsrReliability = {

package/dist/types/errors.d.ts

@@ -5,7 +5,7 @@ import { MediaFilePreview } from './types';
  * Primary reason is logged through Data Portal.
  * Make sure all the values are whitelisted in Measure -> Event Regitry -> "mediaCardRender failed" event
  */
-export type MediaFilePreviewErrorPrimaryReason = 'upload' | 'metadata-fetch' | 'error-file-state' | RemotePreviewPrimaryReason | LocalPreviewPrimaryReason | ImageLoadPrimaryReason | SsrPreviewPrimaryReason | 'missing-error-data' | 'preview-fetch';
+export type MediaFilePreviewErrorPrimaryReason = 'upload' | 'metadata-fetch' | 'error-file-state' | 'failed-processing' | RemotePreviewPrimaryReason | LocalPreviewPrimaryReason | ImageLoadPrimaryReason | SsrPreviewPrimaryReason | 'missing-error-data' | 'preview-fetch';
 export type ImageLoadPrimaryReason = 'cache-remote-uri' | 'cache-local-uri' | 'local-uri' | 'remote-uri' | 'external-uri' | 'unknown-uri';
 export type RemotePreviewPrimaryReason = 'remote-preview-fetch' | 'remote-preview-not-ready' | 'remote-preview-fetch-ssr';
 export type LocalPreviewPrimaryReason = 'local-preview-get' | 'local-preview-unsupported' | 'local-preview-rejected' | 'local-preview-image' | 'local-preview-video';

package/dist/types/useFilePreview.d.ts

@@ -35,5 +35,5 @@ export declare const useFilePreview: ({ resizeMode, identifier, ssr, dimensions,
     ssrReliabilityRef: import("react").MutableRefObject<SSRStatus>;
     onImageError: (newPreview?: MediaFilePreview) => void;
     onImageLoad: (newPreview?: MediaFilePreview) => void;
-    getScriptProps: () => import("react").ScriptHTMLAttributes<HTMLScriptElement>;
+    getSsrScriptProps: (() => import("react").ScriptHTMLAttributes<HTMLScriptElement>) | undefined;
 };

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

@@ -5,7 +5,7 @@ import { MediaFilePreview } from './types';
  * Primary reason is logged through Data Portal.
  * Make sure all the values are whitelisted in Measure -> Event Regitry -> "mediaCardRender failed" event
  */
-export type MediaFilePreviewErrorPrimaryReason = 'upload' | 'metadata-fetch' | 'error-file-state' | RemotePreviewPrimaryReason | LocalPreviewPrimaryReason | ImageLoadPrimaryReason | SsrPreviewPrimaryReason | 'missing-error-data' | 'preview-fetch';
+export type MediaFilePreviewErrorPrimaryReason = 'upload' | 'metadata-fetch' | 'error-file-state' | 'failed-processing' | RemotePreviewPrimaryReason | LocalPreviewPrimaryReason | ImageLoadPrimaryReason | SsrPreviewPrimaryReason | 'missing-error-data' | 'preview-fetch';
 export type ImageLoadPrimaryReason = 'cache-remote-uri' | 'cache-local-uri' | 'local-uri' | 'remote-uri' | 'external-uri' | 'unknown-uri';
 export type RemotePreviewPrimaryReason = 'remote-preview-fetch' | 'remote-preview-not-ready' | 'remote-preview-fetch-ssr';
 export type LocalPreviewPrimaryReason = 'local-preview-get' | 'local-preview-unsupported' | 'local-preview-rejected' | 'local-preview-image' | 'local-preview-video';

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

@@ -35,5 +35,5 @@ export declare const useFilePreview: ({ resizeMode, identifier, ssr, dimensions,
     ssrReliabilityRef: import("react").MutableRefObject<SSRStatus>;
     onImageError: (newPreview?: MediaFilePreview) => void;
     onImageLoad: (newPreview?: MediaFilePreview) => void;
-    getScriptProps: () => import("react").ScriptHTMLAttributes<HTMLScriptElement>;
+    getSsrScriptProps: (() => import("react").ScriptHTMLAttributes<HTMLScriptElement>) | undefined;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/media-file-preview",
-  "version": "0.2.1",
+  "version": "0.3.1",
   "description": "A React Hook to fetch and render file previews. It's overloaded with fancy features like SSR, lazy loading, memory cache and local preview.",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -50,7 +50,7 @@
     "@af/integration-testing": "*",
     "@af/visual-regression": "*",
     "@atlaskit/media-state": "^1.0.3",
-    "@atlaskit/media-test-data": "^1.1.1",
+    "@atlaskit/media-test-data": "^1.2.0",
     "@atlaskit/section-message": "^6.4.17",
     "@atlaskit/ssr": "*",
     "@atlaskit/visual-regression": "*",