sanity-plugin-mux-input 2.10.1 → 2.11.0

package/dist/index.mjs

@@ -1488,14 +1488,18 @@ function VideoPlayer({
   children,
   ...props
 }) {
-  const client = useClient(), { dialogState } = useDialogStateContext(), isAudio = assetIsAudio(asset), muxPlayer = useRef(null), thumbnail = getPosterSrc({ asset, client, width: thumbnailWidth }), { src: videoSrc, error } = useMemo(() => {
+  const client = useClient(), { dialogState } = useDialogStateContext(), isAudio = assetIsAudio(asset), muxPlayer = useRef(null), {
+    src: videoSrc,
+    thumbnail: thumbnailSrc,
+    error
+  } = useMemo(() => {
     try {
-      const src = asset?.playbackId && getVideoSrc({ client, asset });
-      return src ? { src } : { error: new TypeError("Asset has no playback ID") };
+      const thumbnail = getPosterSrc({ asset, client, width: thumbnailWidth }), src = asset?.playbackId && getVideoSrc({ client, asset });
+      return src ? { src, thumbnail } : { error: new TypeError("Asset has no playback ID") };
     } catch (error2) {
       return { error: error2 };
     }
-  }, [asset, client]), signedToken = useMemo(() => {
+  }, [asset, client, thumbnailWidth]), signedToken = useMemo(() => {
     try {
       return new URL(videoSrc).searchParams.get("token");
     } catch {
@@ -1512,7 +1516,7 @@ function VideoPlayer({
         /* @__PURE__ */ jsx(
           MuxPlayer,
           {
-            poster: thumbnail,
+            poster: thumbnailSrc,
             ref: muxPlayer,
             ...props,
             playsInline: !0,
@@ -1522,7 +1526,7 @@ function VideoPlayer({
             crossOrigin: "anonymous",
             metadata: {
               player_name: "Sanity Admin Dashboard",
-              player_version: "2.10.1",
+              player_version: "2.11.0",
               page_type: "Preview Player"
             },
             audio: isAudio,
@@ -2899,25 +2903,29 @@ const TopControls = styled.div`
   onCancel,
   filename,
   text = "Uploading"
-}) => /* @__PURE__ */ jsx(CardWrapper, { tone: "primary", padding: 4, border: !0, height: "fill", children: /* @__PURE__ */ jsxs(FlexWrapper, { align: "center", justify: "space-between", height: "fill", direction: "row", gap: 2, children: [
-  /* @__PURE__ */ jsxs(LeftSection, { children: [
-    /* @__PURE__ */ jsx(Flex, { justify: "center", gap: [3, 3, 2, 2], direction: ["column", "column", "row"], children: /* @__PURE__ */ jsx(Text, { size: 1, children: /* @__PURE__ */ jsxs(Inline, { space: 2, children: [
-      text,
-      /* @__PURE__ */ jsx(CodeWrapper, { size: 1, children: filename || "..." })
-    ] }) }) }),
-    /* @__PURE__ */ jsx(Card, { marginTop: 3, radius: 5, shadow: 1, children: /* @__PURE__ */ jsx(LinearProgress, { value: progress }) })
-  ] }),
-  onCancel ? /* @__PURE__ */ jsx(
-    Button,
-    {
-      fontSize: 2,
-      text: "Cancel upload",
-      mode: "ghost",
-      tone: "critical",
-      onClick: onCancel
-    }
-  ) : null
-] }) }), Player = ({ asset, buttons, readOnly, onChange }) => {
+}) => {
+  const isCancelDisabled = progress >= 90;
+  return /* @__PURE__ */ jsx(CardWrapper, { tone: "primary", padding: 4, border: !0, height: "fill", children: /* @__PURE__ */ jsxs(FlexWrapper, { align: "center", justify: "space-between", height: "fill", direction: "row", gap: 2, children: [
+    /* @__PURE__ */ jsxs(LeftSection, { children: [
+      /* @__PURE__ */ jsx(Flex, { justify: "center", gap: [3, 3, 2, 2], direction: ["column", "column", "row"], children: /* @__PURE__ */ jsx(Text, { size: 1, children: /* @__PURE__ */ jsxs(Inline, { space: 2, children: [
+        text,
+        /* @__PURE__ */ jsx(CodeWrapper, { size: 1, children: filename || "..." })
+      ] }) }) }),
+      /* @__PURE__ */ jsx(Card, { marginTop: 3, radius: 5, shadow: 1, children: /* @__PURE__ */ jsx(LinearProgress, { value: progress }) })
+    ] }),
+    onCancel ? /* @__PURE__ */ jsx(
+      Button,
+      {
+        fontSize: 2,
+        text: "Cancel upload",
+        mode: "ghost",
+        tone: "critical",
+        onClick: onCancel,
+        disabled: isCancelDisabled
+      }
+    ) : null
+  ] }) });
+}, Player = ({ asset, buttons, readOnly, onChange }) => {
   const isLoading = useMemo(() => asset?.status === "preparing" ? "Preparing the video" : asset?.status === "waiting_for_upload" ? "Waiting for upload to start" : asset?.status === "waiting" ? "Processing upload" : !(asset?.status === "ready" || typeof asset?.status > "u"), [asset]), isPreparingStaticRenditions = useMemo(() => asset?.data?.static_renditions?.status === "preparing", [asset?.data?.static_renditions?.status]), playRef = useRef(null), muteRef = useRef(null), handleCancelUpload = useCancelUpload(asset, onChange);
   return useEffect(() => {
     const style = document.createElement("style");
@@ -3414,7 +3422,7 @@ function UploadConfiguration({
       max_resolution_tier: pluginConfig.max_resolution_tier,
       mp4_support: pluginConfig.mp4_support,
       signed_policy: secrets.enableSignedUrls && pluginConfig.defaultSigned,
-      public_policy: !0,
+      public_policy: pluginConfig.defaultPublic,
       normalize_audio: pluginConfig.normalize_audio,
       text_tracks: autoTextTracks
     }
@@ -3784,7 +3792,7 @@ function Uploader(props) {
         handleClick: (event) => events$.next(event)
       };
     })()
-  ).current, uploadRef = useRef(null), [state, dispatch] = useReducer(
+  ).current, uploadRef = useRef(null), uploadingDocumentId = useRef(null), [state, dispatch] = useReducer(
     (prev, action) => {
       switch (action.action) {
         case "stageUpload":
@@ -3810,9 +3818,9 @@ function Uploader(props) {
           });
         case "reset":
         case "complete":
-          return uploadRef.current?.unsubscribe(), uploadRef.current = null, INITIAL_STATE;
+          return uploadRef.current?.unsubscribe(), uploadRef.current = null, uploadingDocumentId.current = null, INITIAL_STATE;
         case "error":
-          return uploadRef.current?.unsubscribe(), uploadRef.current = null, Object.assign({}, INITIAL_STATE, { error: action.error });
+          return uploadRef.current?.unsubscribe(), uploadRef.current = null, uploadingDocumentId.current = null, Object.assign({}, INITIAL_STATE, { error: action.error });
         default:
           return prev;
       }
@@ -3823,9 +3831,21 @@ function Uploader(props) {
       error: null
     }
   );
-  useEffect(() => () => {
-    uploadRef.current && !uploadRef.current.closed && uploadRef.current.unsubscribe();
-  }, []);
+  useEffect(() => {
+    const cleanup = () => {
+      if (uploadRef.current && !uploadRef.current.closed && uploadRef.current.unsubscribe(), uploadingDocumentId.current && props.asset?._id !== uploadingDocumentId.current) {
+        const docId = uploadingDocumentId.current;
+        uploadingDocumentId.current = null, props.client.delete(docId).catch((err) => {
+          console.warn("Failed to cleanup orphaned upload document:", err);
+        });
+      }
+    }, handleBeforeUnload = () => {
+      cleanup();
+    };
+    return window.addEventListener("beforeunload", handleBeforeUnload), window.addEventListener("pagehide", handleBeforeUnload), () => {
+      window.removeEventListener("beforeunload", handleBeforeUnload), window.removeEventListener("pagehide", handleBeforeUnload), cleanup();
+    };
+  }, [props.client, props.asset?._id]);
   const startUpload = (settings) => {
     const { stagedUpload } = state;
     if (!stagedUpload || uploadRef.current) return;
@@ -3848,7 +3868,7 @@ function Uploader(props) {
           takeUntil(
             cancelUploadButton.observable.pipe(
               tap(() => {
-                state.uploadStatus?.uuid && props.client.delete(state.uploadStatus.uuid);
+                uploadingDocumentId.current && (props.client.delete(uploadingDocumentId.current), uploadingDocumentId.current = null);
               })
             )
           )
@@ -3859,6 +3879,8 @@ function Uploader(props) {
       next: (event) => {
         switch (event.type) {
           case "uuid":
+            uploadingDocumentId.current = event.uuid, dispatch({ action: "progressInfo", ...event });
+            break;
           case "file":
           case "url":
             dispatch({ action: "progressInfo", ...event });
@@ -3867,7 +3889,7 @@ function Uploader(props) {
             dispatch({ action: "progress", percent: event.percent });
             break;
           case "success":
-            dispatch({ action: "progress", percent: 100 }), props.onChange(
+            dispatch({ action: "progress", percent: 100 }), uploadingDocumentId.current = null, props.onChange(
               PatchEvent.from([
                 setIfMissing({ asset: {} }),
                 set({ _type: "reference", _weak: !0, _ref: event.asset._id }, ["asset"])
@@ -4232,6 +4254,7 @@ const muxVideoSchema = {
   video_quality: "plus",
   max_resolution_tier: "1080p",
   normalize_audio: !1,
+  defaultPublic: !0,
   defaultSigned: !1,
   tool: DEFAULT_TOOL_CONFIG,
   allowedRolesForConfiguration: []