sanity-plugin-mux-input 2.15.0 → 2.16.0

package/dist/index.js

@@ -1322,6 +1322,26 @@ const PageSelector = (props) => {
     )
   ] });
 };
+function addKeysToMuxData(data) {
+  return {
+    ...data,
+    tracks: data.tracks?.map((track) => ({
+      ...track,
+      _key: uuid.uuid()
+    })),
+    playback_ids: data.playback_ids?.map((playbackId) => ({
+      ...playbackId,
+      _key: uuid.uuid()
+    })),
+    static_renditions: data.static_renditions ? {
+      ...data.static_renditions,
+      files: data.static_renditions.files?.map((file) => ({
+        ...file,
+        _key: uuid.uuid()
+      }))
+    } : void 0
+  };
+}
 function useResyncMuxMetadata() {
   const documentStore = sanity.useDocumentStore(), client = sanity.useClient({
     apiVersion: SANITY_API_VERSION
@@ -1370,6 +1390,27 @@ function useResyncMuxMetadata() {
       }
     }
   }
+  async function syncFullData() {
+    if (matchedAssets) {
+      setResyncState("syncing");
+      try {
+        const tx = client.transaction();
+        matchedAssets.forEach((matched) => {
+          if (!matched.muxAsset) return;
+          const dataWithKeys = addKeysToMuxData(matched.muxAsset);
+          tx.patch(matched.sanityDoc._id, {
+            set: {
+              filename: matched.muxTitle || matched.currentTitle || "",
+              status: matched.muxAsset.status,
+              data: dataWithKeys
+            }
+          });
+        }), await tx.commit({ returnDocuments: !1 }), setResyncState("done");
+      } catch (error) {
+        setResyncState("error"), setResyncError(error);
+      }
+    }
+  }
   return {
     sanityAssetsLoading,
     closeDialog,
@@ -1379,6 +1420,7 @@ function useResyncMuxMetadata() {
     hasSecrets,
     syncAllVideos,
     syncOnlyEmpty,
+    syncFullData,
     matchedAssets,
     muxAssets,
     openDialog
@@ -1394,22 +1436,78 @@ const useSanityAssets = sanity.createHookFromObservableFactory(
     }
   )
 );
+function OptionCard({
+  id,
+  selected,
+  onSelect,
+  title,
+  count,
+  description,
+  disabled
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ui.Card,
+    {
+      as: "label",
+      padding: 3,
+      radius: 2,
+      border: !0,
+      tone: selected ? "primary" : "default",
+      style: {
+        cursor: disabled ? "not-allowed" : "pointer",
+        opacity: disabled ? 0.5 : 1
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 3, align: "flex-start", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { paddingTop: 1, children: /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Radio,
+          {
+            checked: selected,
+            onChange: () => onSelect(id),
+            disabled,
+            name: "sync-option"
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, flex: 1, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { align: "center", gap: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 2, weight: "semibold", children: [
+            title,
+            " (",
+            count,
+            ")"
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: description })
+        ] })
+      ] })
+    }
+  );
+}
 function ResyncMetadataDialog(props) {
-  const { resyncState } = props, canTriggerResync = resyncState === "idle" || resyncState === "error", isResyncing = resyncState === "syncing", isDone = resyncState === "done", videosToUpdate = props.matchedAssets?.filter((m) => m.muxAsset).length || 0, videosWithEmptyOrPlaceholder = props.matchedAssets?.filter(
+  const { resyncState } = props, videosToUpdate = props.matchedAssets?.filter((m) => m.muxAsset).length || 0, videosWithEmptyOrPlaceholder = props.matchedAssets?.filter(
     (m) => m.muxAsset && m.muxTitle && isEmptyOrPlaceholderTitle(m.currentTitle, m.muxAsset.id)
-  ).length || 0;
+  ).length || 0, hasEmptyTitles = videosWithEmptyOrPlaceholder > 0, defaultOption = hasEmptyTitles ? "fillEmpty" : "syncTitles", [selectedOption, setSelectedOption] = React.useState(defaultOption), canTriggerResync = resyncState === "idle" || resyncState === "error", isResyncing = resyncState === "syncing", isDone = resyncState === "done", isLoading = props.muxAssets.loading || props.sanityAssetsLoading, handleSync = () => {
+    switch (selectedOption) {
+      case "fillEmpty":
+        props.syncOnlyEmpty();
+        break;
+      case "syncTitles":
+        props.syncAllVideos();
+        break;
+      case "fullResync":
+        props.syncFullData();
+        break;
+    }
+  };
   return /* @__PURE__ */ jsxRuntime.jsx(
     ui.Dialog,
     {
       animate: !0,
-      header: "Resync Metadata from Mux",
+      header: "Sync with Mux",
       zOffset: DIALOGS_Z_INDEX,
       id: "resync-metadata-dialog",
       onClose: props.closeDialog,
       onClickOutside: props.closeDialog,
       width: 1,
       position: "fixed",
-      footer: !isDone && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { justify: "space-between", align: "center", children: [
+      footer: !isDone && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { justify: "flex-end", gap: 2, children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           ui.Button,
           {
@@ -1417,97 +1515,104 @@ function ResyncMetadataDialog(props) {
             padding: 3,
             mode: "ghost",
             text: "Cancel",
-            tone: "critical",
             onClick: props.closeDialog,
             disabled: isResyncing
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, children: [
-          videosWithEmptyOrPlaceholder > 0 && /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Button,
-            {
-              fontSize: 2,
-              padding: 3,
-              mode: "ghost",
-              text: `Update empty (${videosWithEmptyOrPlaceholder})`,
-              tone: "caution",
-              onClick: props.syncOnlyEmpty,
-              disabled: isResyncing || !canTriggerResync
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Button,
-            {
-              icon: icons.SyncIcon,
-              fontSize: 2,
-              padding: 3,
-              mode: "ghost",
-              text: `Update all (${videosToUpdate})`,
-              tone: "positive",
-              onClick: props.syncAllVideos,
-              iconRight: isResyncing && ui.Spinner,
-              disabled: !canTriggerResync
-            }
-          )
-        ] })
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Button,
+          {
+            icon: icons.SyncIcon,
+            fontSize: 2,
+            padding: 3,
+            text: "Run sync",
+            tone: "primary",
+            onClick: handleSync,
+            iconRight: isResyncing && ui.Spinner,
+            disabled: !canTriggerResync || isLoading
+          }
+        )
       ] }) }),
       children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { padding: 4, children: [
-        (props.muxAssets.loading || props.sanityAssetsLoading) && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone: "primary", marginBottom: 5, padding: 3, border: !0, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 4, children: [
+        isLoading && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone: "primary", marginBottom: 4, padding: 3, border: !0, radius: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 4, children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.Spinner, { muted: !0, size: 4 }),
           /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
             /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, weight: "semibold", children: "Loading assets from Mux" }),
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, children: "This may take a while." })
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: "This may take a while." })
           ] })
         ] }) }),
-        props.muxAssets.error && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone: "critical", marginBottom: 5, padding: 3, border: !0, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, children: [
+        props.muxAssets.error && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone: "critical", marginBottom: 4, padding: 3, border: !0, radius: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, children: [
           /* @__PURE__ */ jsxRuntime.jsx(icons.ErrorOutlineIcon, { fontSize: 36 }),
           /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
             /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, weight: "semibold", children: "There was an error getting data from Mux" }),
             /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, children: "Please try again or contact a developer for help." })
           ] })
         ] }) }),
-        resyncState === "syncing" && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone: "primary", marginBottom: 5, padding: 3, border: !0, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 4, children: [
+        resyncState === "syncing" && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone: "primary", marginBottom: 4, padding: 3, border: !0, radius: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 4, children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.Spinner, { muted: !0, size: 4 }),
           /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, weight: "semibold", children: "Updating video metadata" }),
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, children: "Syncing titles from Mux..." })
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, weight: "semibold", children: "Syncing metadata" }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: "Updating videos from Mux..." })
           ] })
         ] }) }),
-        resyncState === "error" && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone: "critical", marginBottom: 5, padding: 3, border: !0, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, children: [
+        resyncState === "error" && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone: "critical", marginBottom: 4, padding: 3, border: !0, radius: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, children: [
           /* @__PURE__ */ jsxRuntime.jsx(icons.ErrorOutlineIcon, { fontSize: 36 }),
           /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
             /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, weight: "semibold", children: "There was an error syncing metadata" }),
             /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, children: props.resyncError ? `Error: ${props.resyncError}` : "Please try again or contact a developer for help." })
           ] })
         ] }) }),
-        resyncState === "done" && /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { paddingY: 5, marginBottom: 4, space: 3, style: { textAlign: "center" }, children: [
+        resyncState === "done" && /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { paddingY: 5, space: 3, style: { textAlign: "center" }, children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(icons.CheckmarkCircleIcon, { fontSize: 48 }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { size: 2, children: "Metadata synced successfully" }),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, children: "All video titles have been updated from Mux." })
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { size: 2, children: "Sync completed" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, muted: !0, children: "Videos have been updated from Mux." })
         ] }),
-        resyncState === "idle" && !props.muxAssets.loading && !props.sanityAssetsLoading && /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 4, children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(ui.Heading, { size: 1, children: [
-            "There ",
-            videosToUpdate === 1 ? "is" : "are",
-            " ",
+        !isDone && !isLoading && !props.muxAssets.error && /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 4, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 1, muted: !0, children: [
+            "Found ",
             videosToUpdate,
             " video",
             videosToUpdate === 1 ? "" : "s",
-            " with Mux metadata"
+            " linked to Mux."
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, children: "This will update video titles in Sanity to match those in Mux. No new videos will be created." }),
-          videosWithEmptyOrPlaceholder > 0 && /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { padding: 3, tone: "caution", border: !0, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "flex-start", gap: 2, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(icons.ErrorOutlineIcon, {}) }),
-            /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
-              /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, weight: "semibold", children: "Videos with empty or placeholder titles" }),
-              /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 1, muted: !0, children: [
-                videosWithEmptyOrPlaceholder,
-                " video",
-                videosWithEmptyOrPlaceholder === 1 ? "" : "s",
-                ' without titles or with placeholder titles (e.g., "Asset #123") can be updated selectively.'
-              ] })
-            ] })
-          ] }) })
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
+            hasEmptyTitles && /* @__PURE__ */ jsxRuntime.jsx(
+              OptionCard,
+              {
+                id: "fillEmpty",
+                selected: selectedOption === "fillEmpty",
+                onSelect: setSelectedOption,
+                title: "Fill missing titles only",
+                count: videosWithEmptyOrPlaceholder,
+                description: "Updates only videos without a title or with placeholder titles (e.g., 'Asset #123') using the title from Mux.",
+                disabled: isResyncing
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              OptionCard,
+              {
+                id: "syncTitles",
+                selected: selectedOption === "syncTitles",
+                onSelect: setSelectedOption,
+                title: "Sync all titles",
+                count: videosToUpdate,
+                description: "Replaces the title in Sanity with the title from Mux for all videos.",
+                disabled: isResyncing
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              OptionCard,
+              {
+                id: "fullResync",
+                selected: selectedOption === "fullResync",
+                onSelect: setSelectedOption,
+                title: "Full resync",
+                count: videosToUpdate,
+                description: "Updates all fields from Mux including status, duration, tracks, captions, and renditions.",
+                disabled: isResyncing
+              }
+            )
+          ] })
         ] })
       ] })
     }
@@ -1516,7 +1621,7 @@ function ResyncMetadataDialog(props) {
 function ResyncMetadata() {
   const resyncMetadata = useResyncMuxMetadata();
   if (resyncMetadata.hasSecrets)
-    return resyncMetadata.dialogOpen ? /* @__PURE__ */ jsxRuntime.jsx(ResyncMetadataDialog, { ...resyncMetadata }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { mode: "bleed", text: "Resync Metadata", onClick: resyncMetadata.openDialog });
+    return resyncMetadata.dialogOpen ? /* @__PURE__ */ jsxRuntime.jsx(ResyncMetadataDialog, { ...resyncMetadata }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { mode: "bleed", text: "Sync with Mux", onClick: resyncMetadata.openDialog });
 }
 const CONTEXT_MENU_POPOVER_PROPS = {
   constrainSize: !0,
@@ -1597,6 +1702,55 @@ function StopWatchIcon(props) {
     }
   );
 }
+function useResyncAsset(options) {
+  const client = useClient(), toast = ui.useToast(), [resyncState, setResyncState] = React.useState("idle"), [resyncError, setResyncError] = React.useState(null), showToast = options?.showToast ?? !1, resyncAsset = React.useCallback(
+    async (asset) => {
+      if (!asset.assetId) {
+        showToast && toast.push({
+          title: "Cannot resync",
+          description: "Asset has no Mux ID",
+          status: "error"
+        }), options?.onError?.(new Error("Asset has no Mux ID"));
+        return;
+      }
+      if (!asset._id) {
+        showToast && toast.push({
+          title: "Cannot resync",
+          description: "Asset has no document ID",
+          status: "error"
+        }), options?.onError?.(new Error("Asset has no document ID"));
+        return;
+      }
+      setResyncState("syncing"), setResyncError(null);
+      try {
+        const muxData = (await getAsset(client, asset.assetId)).data, dataWithKeys = addKeysToMuxData(muxData);
+        return await client.patch(asset._id).set({
+          status: muxData.status,
+          data: dataWithKeys,
+          ...muxData.meta?.title && { filename: muxData.meta.title }
+        }).commit({ returnDocuments: !1 }), setResyncState("success"), showToast && toast.push({
+          title: "Asset synced",
+          description: "Data has been updated from Mux",
+          status: "success"
+        }), options?.onSuccess?.(muxData), muxData;
+      } catch (error) {
+        setResyncState("error"), setResyncError(error), console.error("Failed to refresh asset data:", error), showToast && toast.push({
+          title: "Sync failed",
+          description: "Could not sync asset from Mux",
+          status: "error"
+        }), options?.onError?.(error);
+        return;
+      }
+    },
+    [client, toast, options, showToast]
+  );
+  return {
+    resyncState,
+    resyncError,
+    resyncAsset,
+    isResyncing: resyncState === "syncing"
+  };
+}
 function extractErrorMessage(error, defaultMessage = "Failed to process request") {
   let message = "";
   if (error && typeof error == "object") {
@@ -2499,20 +2653,7 @@ function TextTracksManager({
   tracks: propTracks,
   collapseTracks = !1
 }) {
-  const client = useClient(), toast = ui.useToast(), dialogId = `DeleteCaptionDialog${React.useId()}`, [downloadingTrackId, setDownloadingTrackId] = React.useState(null), [deletingTrackId, setDeletingTrackId] = React.useState(null), [addedTracks, setAddedTracks] = React.useState([]), [updatedTracks, setUpdatedTracks] = React.useState(/* @__PURE__ */ new Map()), [trackActivityOrder, setTrackActivityOrder] = React.useState(/* @__PURE__ */ new Map()), [autogeneratedTrackIds, setAutogeneratedTrackIds] = React.useState(/* @__PURE__ */ new Set()), [trackToDelete, setTrackToDelete] = React.useState(null), [trackToEdit, setTrackToEdit] = React.useState(null), [showAddDialog, setShowAddDialog] = React.useState(!1), [isExpanded, setIsExpanded] = React.useState(!1), MAX_VISIBLE_TRACKS = 4;
-  React.useEffect(() => {
-    if (!asset.assetId || !asset._id) return;
-    const assetId = asset.assetId, documentId = asset._id;
-    (async () => {
-      try {
-        const response = await getAsset(client, assetId);
-        await client.patch(documentId).set({ data: response.data, status: response.data.status }).commit();
-      } catch (error) {
-        console.error("Failed to refresh asset data:", error);
-      }
-    })();
-  }, [asset.assetId, asset._id, client]);
-  const activeTracks = (propTracks || asset.data?.tracks?.filter((track) => track.type === "text") || []).filter(
+  const client = useClient(), toast = ui.useToast(), dialogId = `DeleteCaptionDialog${React.useId()}`, { resyncAsset } = useResyncAsset(), [downloadingTrackId, setDownloadingTrackId] = React.useState(null), [deletingTrackId, setDeletingTrackId] = React.useState(null), [addedTracks, setAddedTracks] = React.useState([]), [updatedTracks, setUpdatedTracks] = React.useState(/* @__PURE__ */ new Map()), [trackActivityOrder, setTrackActivityOrder] = React.useState(/* @__PURE__ */ new Map()), [autogeneratedTrackIds, setAutogeneratedTrackIds] = React.useState(/* @__PURE__ */ new Set()), [trackToDelete, setTrackToDelete] = React.useState(null), [trackToEdit, setTrackToEdit] = React.useState(null), [showAddDialog, setShowAddDialog] = React.useState(!1), [isExpanded, setIsExpanded] = React.useState(!1), MAX_VISIBLE_TRACKS = 4, activeTracks = (propTracks || asset.data?.tracks?.filter((track) => track.type === "text") || []).filter(
     (track) => track.id && (track.status === "ready" || track.status === "preparing" || track.status === "errored")
   ), allTracks = React.useMemo(() => {
     const tracksWithUpdates = activeTracks.map((track) => updatedTracks.get(track.id) || track), isMockTrackReplaced = (mockTrack, realTracksList) => !mockTrack.id || !mockTrack.id.startsWith("generating-") ? !1 : realTracksList.some((realTrack) => {
@@ -2543,11 +2684,11 @@ function TextTracksManager({
   }, [activeTracks, addedTracks]), React.useEffect(() => {
     if (allTracks.filter((track) => track.status === "preparing").length === 0 || !asset.assetId || !asset._id)
       return;
-    const assetId = asset.assetId, documentId = asset._id, interval = setInterval(async () => {
+    const interval = setInterval(async () => {
       try {
-        const response = await getAsset(client, assetId);
-        await client.patch(documentId).set({ data: response.data, status: response.data.status }).commit();
-        const fetchedTracks = response.data.tracks?.filter((track) => track.type === "text") || [], isMockTrackReplaced = (mockTrack, fetchedTracksList) => !mockTrack.id || !mockTrack.id.startsWith("generating-") ? !1 : fetchedTracksList.some((realTrack) => {
+        const muxData = await resyncAsset(asset);
+        if (!muxData) return;
+        const fetchedTracks = muxData.tracks?.filter((track) => track.type === "text") || [], isMockTrackReplaced = (mockTrack, fetchedTracksList) => !mockTrack.id || !mockTrack.id.startsWith("generating-") ? !1 : fetchedTracksList.some((realTrack) => {
           const nameMatches = realTrack.name === mockTrack.name, languageMatches = realTrack.language_code === mockTrack.language_code;
           return !nameMatches || !languageMatches ? !1 : realTrack.status === "ready" ? realTrack.text_source === "generated_live" || realTrack.text_source === "generated_live_final" || realTrack.text_source === "generated_vod" : realTrack.status === "preparing";
         }), newAutogeneratedIds = /* @__PURE__ */ new Set();
@@ -2584,7 +2725,7 @@ function TextTracksManager({
       }
     }, 3e3);
     return () => clearInterval(interval);
-  }, [allTracks, asset.assetId, asset._id, client]);
+  }, [allTracks, asset, resyncAsset]);
   const visibleTracks = allTracks.filter(
     (track) => track.status === "ready" || track.status === "preparing" || track.status === "errored"
   ).sort((a2, b) => {
@@ -2620,14 +2761,7 @@ function TextTracksManager({
     try {
       if (!asset.assetId)
         throw new Error("Asset ID is required");
-      if (await deleteTextTrack(client, asset.assetId, track.id), asset._id)
-        try {
-          const response = await getAsset(client, asset.assetId);
-          await client.patch(asset._id).set({ data: response.data, status: response.data.status }).commit();
-        } catch (refreshError) {
-          console.error("Failed to refresh asset data:", refreshError);
-        }
-      toast.push({
+      await deleteTextTrack(client, asset.assetId, track.id), await resyncAsset(asset), toast.push({
         title: "Successfully deleted caption track",
         status: "success"
       }), setAddedTracks((prev) => prev.filter((t) => t.id !== track.id)), setUpdatedTracks((prev) => {
@@ -2655,7 +2789,7 @@ function TextTracksManager({
       return newMap.set(track.id, prev.size + 1), newMap;
     }), setShowAddDialog(!1);
   }, handleUpdateTrack = async (updatedTrack, oldTrackId) => {
-    if (oldTrackId && (setAddedTracks((prev) => prev.filter((t) => t.id !== oldTrackId)), setUpdatedTracks((prev) => {
+    oldTrackId && (setAddedTracks((prev) => prev.filter((t) => t.id !== oldTrackId)), setUpdatedTracks((prev) => {
       const newMap = new Map(prev);
       return newMap.delete(oldTrackId), newMap;
     }), setTrackActivityOrder((prev) => {
@@ -2670,13 +2804,7 @@ function TextTracksManager({
     }), setTrackActivityOrder((prev) => {
       const newMap = new Map(prev);
       return newMap.set(updatedTrack.id, prev.size + 1), newMap;
-    }), setTrackToEdit(null), asset._id && asset.assetId)
-      try {
-        const response = await getAsset(client, asset.assetId);
-        await client.patch(asset._id).set({ data: response.data, status: response.data.status }).commit();
-      } catch (refreshError) {
-        console.error("Failed to refresh asset data:", refreshError);
-      }
+    }), setTrackToEdit(null), await resyncAsset(asset);
   }, getTrackSourceLabel = (track) => track.id && track.id.startsWith("generating-") || track.id && autogeneratedTrackIds.has(track.id) || track.text_source === "generated_live_final" || track.text_source === "generated_live" || track.text_source === "generated_vod" ? "Auto-generated" : track.text_source === "uploaded" ? "Uploaded" : "Custom";
   if (visibleTracks.length === 0 && !showAddDialog)
     return /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
@@ -3026,7 +3154,7 @@ function VideoPlayer({
                   crossOrigin: "anonymous",
                   metadata: {
                     player_name: "Sanity Admin Dashboard",
-                    player_version: "2.15.0",
+                    player_version: "2.16.0",
                     page_type: "Preview Player"
                   },
                   audio: isAudio,
@@ -3343,7 +3471,10 @@ function getVideoMetadata(doc) {
 function useVideoDetails(props) {
   const documentStore = sanity.useDocumentStore(), toast = ui.useToast(), client = useClient(), [references, referencesLoading] = useDocReferences(
     React.useMemo(() => ({ documentStore, id: props.asset._id }), [documentStore, props.asset._id])
-  ), [originalAsset, setOriginalAsset] = React.useState(() => props.asset), [filename, setFilename] = React.useState(props.asset.filename), modified = filename !== originalAsset.filename, displayInfo = getVideoMetadata({ ...props.asset, filename }), [state, setState] = React.useState("idle");
+  ), [originalAsset, setOriginalAsset] = React.useState(() => props.asset), [filename, setFilename] = React.useState(props.asset.filename), modified = filename !== originalAsset.filename, displayInfo = getVideoMetadata({ ...props.asset, filename }), [state, setState] = React.useState("idle"), { resyncAsset, isResyncing } = useResyncAsset({ showToast: !0 });
+  async function handleResync() {
+    state === "idle" && (setState("resyncing"), await resyncAsset(props.asset), setState("idle"));
+  }
   function handleClose() {
     if (state === "idle") {
       if (modified) {
@@ -3386,7 +3517,9 @@ function useVideoDetails(props) {
     setState,
     handleClose,
     confirmClose,
-    saveChanges
+    saveChanges,
+    handleResync,
+    isResyncing
   };
 }
 const AssetInput = (props) => /* @__PURE__ */ jsxRuntime.jsx(FormField$1, { title: props.label, description: props.description, inputId: props.label, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -3410,7 +3543,9 @@ const AssetInput = (props) => /* @__PURE__ */ jsxRuntime.jsx(FormField$1, { titl
     setState,
     handleClose,
     confirmClose,
-    saveChanges
+    saveChanges,
+    handleResync,
+    isResyncing
   } = useVideoDetails(props), isSaving = state === "saving", [containerHeight, setContainerHeight] = React.useState(null), contentsRef = React__default.default.useRef(null);
   return React.useEffect(() => {
     !contentsRef.current || !("getBoundingClientRect" in contentsRef.current) || setContainerHeight(contentsRef.current.getBoundingClientRect().height);
@@ -3426,19 +3561,35 @@ const AssetInput = (props) => /* @__PURE__ */ jsxRuntime.jsx(FormField$1, { titl
       width: 2,
       position: "fixed",
       footer: /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { justify: "space-between", align: "center", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            icon: icons.TrashIcon,
-            fontSize: 2,
-            padding: 3,
-            mode: "bleed",
-            text: "Delete",
-            tone: "critical",
-            onClick: () => setState("deleting"),
-            disabled: isSaving
-          }
-        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Button,
+            {
+              icon: icons.TrashIcon,
+              fontSize: 2,
+              padding: 3,
+              mode: "bleed",
+              text: "Delete",
+              tone: "critical",
+              onClick: () => setState("deleting"),
+              disabled: isSaving || isResyncing
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Button,
+            {
+              icon: icons.SyncIcon,
+              fontSize: 2,
+              padding: 3,
+              mode: "bleed",
+              text: "Resync",
+              tone: "primary",
+              onClick: handleResync,
+              disabled: isSaving || isResyncing,
+              iconRight: isResyncing && ui.Spinner
+            }
+          )
+        ] }),
         modified && /* @__PURE__ */ jsxRuntime.jsx(
           ui.Button,
           {
@@ -3450,7 +3601,7 @@ const AssetInput = (props) => /* @__PURE__ */ jsxRuntime.jsx(FormField$1, { titl
             tone: "positive",
             onClick: saveChanges,
             iconRight: isSaving && ui.Spinner,
-            disabled: isSaving
+            disabled: isSaving || isResyncing
           }
         )
       ] }) }),
@@ -4644,7 +4795,9 @@ const FileButton = styledComponents.styled(ui.MenuItem)(({ theme }) => {
   color: white;
 `, isVideoAsset = (asset) => asset._type === "mux.videoAsset";
 function PlayerActionsMenu(props) {
-  const { asset, readOnly, dialogState, setDialogState, onChange, onSelect, accept } = props, [open, setOpen] = React.useState(!1), [menuElement, setMenuRef] = React.useState(null), isSigned = React.useMemo(() => getPlaybackPolicy(asset)?.policy === "signed", [asset]), { hasConfigAccess } = useAccessControl(props.config), onReset = React.useCallback(() => onChange(sanity.PatchEvent.from(sanity.unset([]))), [onChange]);
+  const { asset, readOnly, dialogState, setDialogState, onChange, onSelect, accept } = props, [open, setOpen] = React.useState(!1), [menuElement, setMenuRef] = React.useState(null), isSigned = React.useMemo(() => getPlaybackPolicy(asset)?.policy === "signed", [asset]), { hasConfigAccess } = useAccessControl(props.config), { resyncAsset, isResyncing } = useResyncAsset({ showToast: !0 }), onReset = React.useCallback(() => onChange(sanity.PatchEvent.from(sanity.unset([]))), [onChange]), handleResync = React.useCallback(async () => {
+    setOpen(!1), await resyncAsset(asset);
+  }, [resyncAsset, asset]);
   return React.useEffect(() => {
     open && dialogState && setOpen(!1);
   }, [dialogState, open]), ui.useClickOutsideEvent(
@@ -4702,6 +4855,15 @@ function PlayerActionsMenu(props) {
                 text: "Captions",
                 onClick: () => setDialogState("edit-captions")
               }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.MenuItem,
+              {
+                icon: icons.SyncIcon,
+                text: "Resync from Mux",
+                onClick: handleResync,
+                disabled: readOnly || isResyncing
+              }
             )
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx(ui.MenuDivider, {}),
@@ -6052,7 +6214,12 @@ const muxVideoSchema = {
     { type: "number", name: "max_width" },
     { type: "number", name: "max_frame_rate" },
     { type: "number", name: "duration" },
-    { type: "number", name: "max_height" }
+    { type: "number", name: "max_height" },
+    { type: "string", name: "language_code" },
+    { type: "string", name: "name" },
+    { type: "string", name: "status" },
+    { type: "string", name: "text_source" },
+    { type: "string", name: "text_type" }
   ]
 }, muxPlaybackId = {
   name: "mux.playbackId",