sanity-plugin-mux-input 3.0.5 → 4.0.1

package/dist/index.js

@@ -2,7 +2,7 @@ import { useClient as useClient$1, createHookFromObservableFactory, useDocumentS
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { ErrorOutlineIcon, InfoOutlineIcon, RetryIcon, CheckmarkCircleIcon, RetrieveIcon, ChevronLeftIcon, ChevronRightIcon, SyncIcon, SortIcon, UploadIcon, TranslateIcon, DownloadIcon, AddIcon, ChevronUpIcon, ChevronDownIcon, TrashIcon, EditIcon, WarningOutlineIcon, PublishIcon, DocumentIcon, RevertIcon, SearchIcon, ClockIcon, CropIcon, CalendarIcon, TagIcon, CheckmarkIcon, LockIcon, PlayIcon, PlugIcon, EllipsisHorizontalIcon, ImageIcon, ResetIcon, WarningFilledIcon, DocumentVideoIcon } from "@sanity/icons";
 import { Dialog, Stack, Card, Text, Button, useTheme_v2, Flex, Box, TextInput, Checkbox, Code, Inline, Spinner, Heading, Label as Label$1, Radio, MenuButton, Menu, MenuItem, useToast, Autocomplete, Tooltip, TabList, Tab, TabPanel, Grid, useClickOutsideEvent, Popover, MenuDivider, rem } from "@sanity/ui";
-import React, { createContext, useState, useCallback, useMemo, useContext, useReducer, useId, memo, useRef, useEffect, Suspense, isValidElement, PureComponent, forwardRef } from "react";
+import { createContext, useState, useCallback, useMemo, useContext, useReducer, useId, memo, useRef, useEffect, Suspense, isValidElement, forwardRef } from "react";
 import compact from "lodash/compact.js";
 import toLower from "lodash/toLower.js";
 import trim from "lodash/trim.js";
@@ -22,6 +22,7 @@ import isString from "lodash/isString.js";
 import { useObservable } from "react-rx";
 import useSWR from "swr";
 import scrollIntoView from "scroll-into-view-if-needed";
+import { useErrorBoundary } from "use-error-boundary";
 import { UpChunk } from "@mux/upchunk";
 import { isValidElementType } from "react-is";
 const ToolIcon = () => /* @__PURE__ */ jsx("svg", { stroke: "currentColor", fill: "currentColor", strokeWidth: "0", viewBox: "0 0 24 24", height: "1em", width: "1em", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M21 3H3c-1.11 0-2 .89-2 2v12c0 1.1.89 2 2 2h5v2h8v-2h5c1.1 0 1.99-.9 1.99-2L23 5c0-1.11-.9-2-2-2zm0 14H3V5h18v12zm-5-6l-7 4V7z" }) }), LOCAL_STORAGE_HAS_SHOWN_WARNING_KEY = "mux-plugin-has-shown-drm-playback-warning", DrmPlaybackWarningContext = createContext({
@@ -141,7 +142,7 @@ function useDialogState() {
 const PLUGIN_VERSION_QUERY = {
   sanityVersion: (
     // @ts-expect-error - this constant is search/replaced so must be exact, not accessed with an index signature
-    "3.0.5"
+    "4.0.1"
   )
 };
 function saveSecrets(client, token, secretKey, enableSignedUrls, signingKeyId, signingKeyPrivate, drmConfigId) {
@@ -663,7 +664,7 @@ function accumulateIntermediateState(currentState, pageResult) {
     validAssets,
     skippedInThisPage
   } = newAssets.reduce((acc, asset) => {
-    const hasPlaybackIds = asset.playback_ids && asset.playback_ids.length > 0, isDuplicate = currentData.some((a2) => a2.id === asset.id);
+    const hasPlaybackIds = asset.playback_ids && asset.playback_ids.length > 0, isDuplicate = currentData.some((a) => a.id === asset.id);
     return hasPlaybackIds || (acc.skippedInThisPage = !0), hasPlaybackIds && !isDuplicate && acc.validAssets.push(asset), acc;
   }, {
     validAssets: [],
@@ -721,7 +722,7 @@ function useImportMuxAssets() {
   }), [assetsInSanity, assetsInSanityLoading] = useAssetsInSanity(documentStore), hasSecrets = !!useSecretsDocumentValues().value.secrets?.secretKey, [importError, setImportError] = useState(), [importState, setImportState] = useState("closed"), dialogOpen = importState !== "closed", muxAssets = useMuxAssets({
     client,
     enabled: hasSecrets && dialogOpen
-  }), missingAssets = useMemo(() => assetsInSanity && muxAssets.data ? muxAssets.data.filter((a2) => !assetExistsInSanity(a2, assetsInSanity)) : void 0, [assetsInSanity, muxAssets.data]), [selectedAssets, setSelectedAssets] = useState([]), closeDialog = () => {
+  }), missingAssets = useMemo(() => assetsInSanity && muxAssets.data ? muxAssets.data.filter((a) => !assetExistsInSanity(a, assetsInSanity)) : void 0, [assetsInSanity, muxAssets.data]), [selectedAssets, setSelectedAssets] = useState([]), closeDialog = () => {
     importState !== "importing" && setImportState("closed");
   }, openDialog = () => {
     importState === "closed" && setImportState("idle");
@@ -1097,8 +1098,8 @@ function ImportVideosDialog(props) {
         /* @__PURE__ */ jsx(Box, { flex: 1, paddingLeft: 3, as: "label", htmlFor: "import-all", children: /* @__PURE__ */ jsx(Text, { children: "Import all" }) })
       ] }),
       props.missingAssets.map((asset) => /* @__PURE__ */ jsx(MissingAsset, { asset, selectAsset: (selected) => {
-        selected ? props.setSelectedAssets([...props.selectedAssets, asset]) : props.setSelectedAssets(props.selectedAssets.filter((a2) => a2.id !== asset.id));
-      }, selected: props.selectedAssets.some((a2) => a2.id === asset.id) }, asset.id))
+        selected ? props.setSelectedAssets([...props.selectedAssets, asset]) : props.setSelectedAssets(props.selectedAssets.filter((a) => a.id !== asset.id));
+      }, selected: props.selectedAssets.some((a) => a.id === asset.id) }, asset.id))
     ] })
   ] }) });
 }
@@ -2258,16 +2259,16 @@ function TextTracksManager({
     }, 3e3);
     return () => clearInterval(interval);
   }, [allTracks, asset, resyncAsset]);
-  const visibleTracks = allTracks.filter((track) => track.status === "ready" || track.status === "preparing" || track.status === "errored").sort((a2, b) => {
-    const orderA = trackActivityOrder.get(a2.id) || 0, orderB = trackActivityOrder.get(b.id) || 0;
+  const visibleTracks = allTracks.filter((track) => track.status === "ready" || track.status === "preparing" || track.status === "errored").sort((a, b) => {
+    const orderA = trackActivityOrder.get(a.id) || 0, orderB = trackActivityOrder.get(b.id) || 0;
     if (orderA > 0 && orderB > 0)
       return orderB - orderA;
     if (orderA > 0) return -1;
     if (orderB > 0) return 1;
-    const aIsPreparing = a2.status === "preparing", bIsPreparing = b.status === "preparing";
+    const aIsPreparing = a.status === "preparing", bIsPreparing = b.status === "preparing";
     if (aIsPreparing && !bIsPreparing) return -1;
     if (!aIsPreparing && bIsPreparing) return 1;
-    const aIsAutogenerated = a2.id && a2.id.startsWith("generating-") || a2.id && autogeneratedTrackIds.has(a2.id), bIsAutogenerated = b.id && b.id.startsWith("generating-") || b.id && autogeneratedTrackIds.has(b.id);
+    const aIsAutogenerated = a.id && a.id.startsWith("generating-") || a.id && autogeneratedTrackIds.has(a.id), bIsAutogenerated = b.id && b.id.startsWith("generating-") || b.id && autogeneratedTrackIds.has(b.id);
     return aIsAutogenerated && !bIsAutogenerated ? -1 : !aIsAutogenerated && bIsAutogenerated ? 1 : 0;
   }), handleDownload = async (track) => {
     if (track.id) {
@@ -2559,7 +2560,7 @@ function VideoPlayer({
           /* @__PURE__ */ jsx(MuxPlayer, { poster: isAudio ? void 0 : poster, ref: muxPlayer, ...props, playsInline: !0, playbackId, tokens, preload: "metadata", crossOrigin: "anonymous", metadata: {
             player_name: "Sanity Admin Dashboard",
             // @ts-expect-error - this constant is search/replaced so must be exact, not accessed with an index signature
-            player_version: "3.0.5",
+            player_version: "4.0.1",
             page_type: "Preview Player"
           }, audio: isAudio, _hlsConfig: hlsConfig, style: {
             ...!isAudio && {
@@ -2913,7 +2914,7 @@ const AssetInput = (props) => /* @__PURE__ */ jsx(FormField, { title: props.labe
     saveChanges,
     handleResync,
     isResyncing
-  } = useVideoDetails(props), isSaving = state === "saving", [containerHeight, setContainerHeight] = useState(null), contentsRef = React.useRef(null);
+  } = useVideoDetails(props), isSaving = state === "saving", [containerHeight, setContainerHeight] = useState(null), contentsRef = useRef(null);
   return useEffect(() => {
     !contentsRef.current || !("getBoundingClientRect" in contentsRef.current) || setContainerHeight(contentsRef.current.getBoundingClientRect().height);
   }, []), /* @__PURE__ */ jsxs(Dialog, { animate: !0, header: displayInfo.title, zOffset: DIALOGS_Z_INDEX, id: "video-details-dialog", onClose: handleClose, onClickOutside: handleClose, width: 2, position: "fixed", footer: /* @__PURE__ */ jsx(Card, { padding: 3, children: /* @__PURE__ */ jsxs(Flex, { justify: "space-between", align: "center", children: [
@@ -3011,7 +3012,7 @@ function VideoInBrowser({
   onEdit,
   asset
 }) {
-  const [renderVideo, setRenderVideo] = useState(!1), select = React.useCallback(() => onSelect?.(asset), [onSelect, asset]), edit = React.useCallback(() => onEdit?.(asset), [onEdit, asset]), {
+  const [renderVideo, setRenderVideo] = useState(!1), select = useCallback(() => onSelect?.(asset), [onSelect, asset]), edit = useCallback(() => onEdit?.(asset), [onEdit, asset]), {
     hasShownWarning
   } = useDrmPlaybackWarningContext();
   if (!asset)
@@ -3082,7 +3083,7 @@ function VideosBrowser({
     setSearchQuery,
     setSort,
     sort
-  } = useAssets(), [page, setPage] = useState(0), pageLimit = 20, pageTotal = Math.floor(assets.length / pageLimit) + 1, [editedAsset, setEditedAsset] = useState(null), freshEditedAsset = useMemo(() => assets.find((a2) => a2._id === editedAsset?._id) || editedAsset, [editedAsset, assets]), pageStart = page * pageLimit, pageEnd = pageStart + pageLimit;
+  } = useAssets(), [page, setPage] = useState(0), pageLimit = 20, pageTotal = Math.floor(assets.length / pageLimit) + 1, [editedAsset, setEditedAsset] = useState(null), freshEditedAsset = useMemo(() => assets.find((a) => a._id === editedAsset?._id) || editedAsset, [editedAsset, assets]), pageStart = page * pageLimit, pageEnd = pageStart + pageLimit;
   return /* @__PURE__ */ jsxs(DrmPlaybackWarningContextProvider, { config, children: [
     /* @__PURE__ */ jsxs(Stack, { padding: 4, space: 4, style: {
       minHeight: "50vh"
@@ -3163,79 +3164,6 @@ const useAccessControl = (config) => {
     dedupingInterval: 1e3
   });
 };
-var c = (function(r) {
-  var t, e;
-  function n(t2) {
-    var e2;
-    return (e2 = r.call(this, t2) || this).state = {
-      hasError: !1,
-      error: null
-    }, e2;
-  }
-  e = r, (t = n).prototype = Object.create(e.prototype), t.prototype.constructor = t, t.__proto__ = e, n.getDerivedStateFromError = function(r2) {
-    return {
-      hasError: !0,
-      error: r2
-    };
-  };
-  var o = n.prototype;
-  return o.componentDidCatch = function(r2, t2) {
-    return this.props.onDidCatch(r2, t2);
-  }, o.render = function() {
-    var r2 = this.state, t2 = this.props, e2 = t2.render, n2 = t2.children, o2 = t2.renderError;
-    return r2.hasError ? o2 ? o2({
-      error: r2.error
-    }) : null : e2 ? e2() : n2 || null;
-  }, n;
-})(PureComponent), u = function(r, t) {
-  switch (t.type) {
-    case "catch":
-      return {
-        didCatch: !0,
-        error: t.error
-      };
-    case "reset":
-      return {
-        didCatch: !1,
-        error: null
-      };
-    default:
-      return r;
-  }
-};
-function a(t) {
-  var a2 = useReducer(u, {
-    didCatch: !1,
-    error: null
-  }), i = a2[0], d = a2[1], h = useRef(null);
-  function l() {
-    return e = function(r, e2) {
-      d({
-        type: "catch",
-        error: r
-      }), t && t.onDidCatch && t.onDidCatch(r, e2);
-    }, function(t2) {
-      return React.createElement(c, {
-        onDidCatch: e,
-        children: t2.children,
-        render: t2.render,
-        renderError: t2.renderError
-      });
-    };
-    var e;
-  }
-  var p, s = useCallback(function() {
-    h.current = l(), d({
-      type: "reset"
-    });
-  }, []);
-  return {
-    ErrorBoundary: (p = h.current, p !== null ? p : (h.current = l(), h.current)),
-    didCatch: i.didCatch,
-    error: i.error,
-    reset: s
-  };
-}
 function ErrorBoundaryCard$1(props) {
   const {
     children,
@@ -3247,7 +3175,7 @@ function ErrorBoundaryCard$1(props) {
     didCatch,
     error,
     reset
-  } = a({
+  } = useErrorBoundary({
     // oxlint-disable-next-line no-unstable-nested-components
     onDidCatch: (err, errorInfo) => {
       console.group(err.toString()), console.groupCollapsed("console.error"), console.error(err), console.groupEnd(), err.stack && (console.groupCollapsed("error.stack"), console.log(err.stack), console.groupEnd()), errorInfo?.componentStack && (console.groupCollapsed("errorInfo.componentStack"), console.log(errorInfo.componentStack), console.groupEnd()), console.groupEnd(), pushToast({
@@ -3946,12 +3874,12 @@ function formatBytes(bytes, si = !1, dp = 1) {
   if (Math.abs(bytes) < thresh)
     return bytes + " B";
   const units = si ? ["kB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"] : ["KiB", "MiB", "GiB", "TiB", "PiB", "EiB", "ZiB", "YiB"];
-  let u2 = -1;
+  let u = -1;
   const r = 10 ** dp;
   do
-    bytes /= thresh, ++u2;
-  while (Math.round(Math.abs(bytes) * r) / r >= thresh && u2 < units.length - 1);
-  return bytes.toFixed(dp) + " " + units[u2];
+    bytes /= thresh, ++u;
+  while (Math.round(Math.abs(bytes) * r) / r >= thresh && u < units.length - 1);
+  return bytes.toFixed(dp) + " " + units[u];
 }
 const RangeInput = styled.input.withConfig({
   displayName: "RangeInput",