sanity-plugin-mux-input 2.15.0 → 2.16.0

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import { useClient as useClient$1, createHookFromObservableFactory, useDocumentStore, collate, useDocumentValues, truncateString, useFormattedDuration, SanityDefaultPreview, useTimeAgo, TextWithTone, isRecord, getPreviewStateObservable, getPreviewValueWithFallback, DocumentPreviewPresence, useDocumentPreviewStore, useSchema, useDocumentPresence, PreviewCard, useCurrentUser, isReference, useProjectId, useDataset, PatchEvent, unset, setIfMissing, set, LinearProgress, FormField as FormField$2, definePlugin } from "sanity";
 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, MenuButton, Menu, MenuItem, useToast, Autocomplete, Tooltip, TabList, Tab, TabPanel, Grid, useClickOutsideEvent, Popover, MenuDivider, Radio, rem } from "@sanity/ui";
+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, useContext, useState, useMemo, useCallback, useReducer, useId, memo, useRef, useEffect, Suspense, isValidElement, PureComponent, createElement, forwardRef } from "react";
 import compact from "lodash/compact.js";
 import toLower from "lodash/toLower.js";
@@ -1321,6 +1321,26 @@ const PageSelector = (props) => {
     )
   ] });
 };
+function addKeysToMuxData(data) {
+  return {
+    ...data,
+    tracks: data.tracks?.map((track) => ({
+      ...track,
+      _key: uuid()
+    })),
+    playback_ids: data.playback_ids?.map((playbackId) => ({
+      ...playbackId,
+      _key: uuid()
+    })),
+    static_renditions: data.static_renditions ? {
+      ...data.static_renditions,
+      files: data.static_renditions.files?.map((file) => ({
+        ...file,
+        _key: uuid()
+      }))
+    } : void 0
+  };
+}
 function useResyncMuxMetadata() {
   const documentStore = useDocumentStore(), client = useClient$1({
     apiVersion: SANITY_API_VERSION
@@ -1369,6 +1389,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,
@@ -1378,6 +1419,7 @@ function useResyncMuxMetadata() {
     hasSecrets,
     syncAllVideos,
     syncOnlyEmpty,
+    syncFullData,
     matchedAssets,
     muxAssets,
     openDialog
@@ -1393,22 +1435,78 @@ const useSanityAssets = createHookFromObservableFactory(
     }
   )
 );
+function OptionCard({
+  id,
+  selected,
+  onSelect,
+  title,
+  count,
+  description,
+  disabled
+}) {
+  return /* @__PURE__ */ jsx(
+    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__ */ jsxs(Flex, { gap: 3, align: "flex-start", children: [
+        /* @__PURE__ */ jsx(Box, { paddingTop: 1, children: /* @__PURE__ */ jsx(
+          Radio,
+          {
+            checked: selected,
+            onChange: () => onSelect(id),
+            disabled,
+            name: "sync-option"
+          }
+        ) }),
+        /* @__PURE__ */ jsxs(Stack, { space: 2, flex: 1, children: [
+          /* @__PURE__ */ jsx(Flex, { align: "center", gap: 2, children: /* @__PURE__ */ jsxs(Text, { size: 2, weight: "semibold", children: [
+            title,
+            " (",
+            count,
+            ")"
+          ] }) }),
+          /* @__PURE__ */ jsx(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] = 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__ */ jsx(
     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__ */ jsx(Card, { padding: 3, children: /* @__PURE__ */ jsxs(Flex, { justify: "space-between", align: "center", children: [
+      footer: !isDone && /* @__PURE__ */ jsx(Card, { padding: 3, children: /* @__PURE__ */ jsxs(Flex, { justify: "flex-end", gap: 2, children: [
         /* @__PURE__ */ jsx(
           Button,
           {
@@ -1416,97 +1514,104 @@ function ResyncMetadataDialog(props) {
             padding: 3,
             mode: "ghost",
             text: "Cancel",
-            tone: "critical",
             onClick: props.closeDialog,
             disabled: isResyncing
           }
         ),
-        /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
-          videosWithEmptyOrPlaceholder > 0 && /* @__PURE__ */ jsx(
-            Button,
-            {
-              fontSize: 2,
-              padding: 3,
-              mode: "ghost",
-              text: `Update empty (${videosWithEmptyOrPlaceholder})`,
-              tone: "caution",
-              onClick: props.syncOnlyEmpty,
-              disabled: isResyncing || !canTriggerResync
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              icon: SyncIcon,
-              fontSize: 2,
-              padding: 3,
-              mode: "ghost",
-              text: `Update all (${videosToUpdate})`,
-              tone: "positive",
-              onClick: props.syncAllVideos,
-              iconRight: isResyncing && Spinner,
-              disabled: !canTriggerResync
-            }
-          )
-        ] })
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            icon: SyncIcon,
+            fontSize: 2,
+            padding: 3,
+            text: "Run sync",
+            tone: "primary",
+            onClick: handleSync,
+            iconRight: isResyncing && Spinner,
+            disabled: !canTriggerResync || isLoading
+          }
+        )
       ] }) }),
       children: /* @__PURE__ */ jsxs(Box, { padding: 4, children: [
-        (props.muxAssets.loading || props.sanityAssetsLoading) && /* @__PURE__ */ jsx(Card, { tone: "primary", marginBottom: 5, padding: 3, border: !0, children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 4, children: [
+        isLoading && /* @__PURE__ */ jsx(Card, { tone: "primary", marginBottom: 4, padding: 3, border: !0, radius: 2, children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 4, children: [
           /* @__PURE__ */ jsx(Spinner, { muted: !0, size: 4 }),
           /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
             /* @__PURE__ */ jsx(Text, { size: 2, weight: "semibold", children: "Loading assets from Mux" }),
-            /* @__PURE__ */ jsx(Text, { size: 1, children: "This may take a while." })
+            /* @__PURE__ */ jsx(Text, { size: 1, muted: !0, children: "This may take a while." })
           ] })
         ] }) }),
-        props.muxAssets.error && /* @__PURE__ */ jsx(Card, { tone: "critical", marginBottom: 5, padding: 3, border: !0, children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [
+        props.muxAssets.error && /* @__PURE__ */ jsx(Card, { tone: "critical", marginBottom: 4, padding: 3, border: !0, radius: 2, children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [
           /* @__PURE__ */ jsx(ErrorOutlineIcon, { fontSize: 36 }),
           /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
             /* @__PURE__ */ jsx(Text, { size: 2, weight: "semibold", children: "There was an error getting data from Mux" }),
             /* @__PURE__ */ jsx(Text, { size: 1, children: "Please try again or contact a developer for help." })
           ] })
         ] }) }),
-        resyncState === "syncing" && /* @__PURE__ */ jsx(Card, { tone: "primary", marginBottom: 5, padding: 3, border: !0, children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 4, children: [
+        resyncState === "syncing" && /* @__PURE__ */ jsx(Card, { tone: "primary", marginBottom: 4, padding: 3, border: !0, radius: 2, children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 4, children: [
           /* @__PURE__ */ jsx(Spinner, { muted: !0, size: 4 }),
           /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
-            /* @__PURE__ */ jsx(Text, { size: 2, weight: "semibold", children: "Updating video metadata" }),
-            /* @__PURE__ */ jsx(Text, { size: 1, children: "Syncing titles from Mux..." })
+            /* @__PURE__ */ jsx(Text, { size: 2, weight: "semibold", children: "Syncing metadata" }),
+            /* @__PURE__ */ jsx(Text, { size: 1, muted: !0, children: "Updating videos from Mux..." })
           ] })
         ] }) }),
-        resyncState === "error" && /* @__PURE__ */ jsx(Card, { tone: "critical", marginBottom: 5, padding: 3, border: !0, children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [
+        resyncState === "error" && /* @__PURE__ */ jsx(Card, { tone: "critical", marginBottom: 4, padding: 3, border: !0, radius: 2, children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [
           /* @__PURE__ */ jsx(ErrorOutlineIcon, { fontSize: 36 }),
           /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
             /* @__PURE__ */ jsx(Text, { size: 2, weight: "semibold", children: "There was an error syncing metadata" }),
             /* @__PURE__ */ jsx(Text, { size: 1, children: props.resyncError ? `Error: ${props.resyncError}` : "Please try again or contact a developer for help." })
           ] })
         ] }) }),
-        resyncState === "done" && /* @__PURE__ */ jsxs(Stack, { paddingY: 5, marginBottom: 4, space: 3, style: { textAlign: "center" }, children: [
+        resyncState === "done" && /* @__PURE__ */ jsxs(Stack, { paddingY: 5, space: 3, style: { textAlign: "center" }, children: [
           /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(CheckmarkCircleIcon, { fontSize: 48 }) }),
-          /* @__PURE__ */ jsx(Heading, { size: 2, children: "Metadata synced successfully" }),
-          /* @__PURE__ */ jsx(Text, { size: 2, children: "All video titles have been updated from Mux." })
+          /* @__PURE__ */ jsx(Heading, { size: 2, children: "Sync completed" }),
+          /* @__PURE__ */ jsx(Text, { size: 2, muted: !0, children: "Videos have been updated from Mux." })
         ] }),
-        resyncState === "idle" && !props.muxAssets.loading && !props.sanityAssetsLoading && /* @__PURE__ */ jsxs(Stack, { space: 4, children: [
-          /* @__PURE__ */ jsxs(Heading, { size: 1, children: [
-            "There ",
-            videosToUpdate === 1 ? "is" : "are",
-            " ",
+        !isDone && !isLoading && !props.muxAssets.error && /* @__PURE__ */ jsxs(Stack, { space: 4, children: [
+          /* @__PURE__ */ jsxs(Text, { size: 1, muted: !0, children: [
+            "Found ",
             videosToUpdate,
             " video",
             videosToUpdate === 1 ? "" : "s",
-            " with Mux metadata"
+            " linked to Mux."
           ] }),
-          /* @__PURE__ */ jsx(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__ */ jsx(Card, { padding: 3, tone: "caution", border: !0, children: /* @__PURE__ */ jsxs(Flex, { align: "flex-start", gap: 2, children: [
-            /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(ErrorOutlineIcon, {}) }),
-            /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
-              /* @__PURE__ */ jsx(Text, { size: 2, weight: "semibold", children: "Videos with empty or placeholder titles" }),
-              /* @__PURE__ */ jsxs(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__ */ jsxs(Stack, { space: 3, children: [
+            hasEmptyTitles && /* @__PURE__ */ 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__ */ 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__ */ 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
+              }
+            )
+          ] })
         ] })
       ] })
     }
@@ -1515,7 +1620,7 @@ function ResyncMetadataDialog(props) {
 function ResyncMetadata() {
   const resyncMetadata = useResyncMuxMetadata();
   if (resyncMetadata.hasSecrets)
-    return resyncMetadata.dialogOpen ? /* @__PURE__ */ jsx(ResyncMetadataDialog, { ...resyncMetadata }) : /* @__PURE__ */ jsx(Button, { mode: "bleed", text: "Resync Metadata", onClick: resyncMetadata.openDialog });
+    return resyncMetadata.dialogOpen ? /* @__PURE__ */ jsx(ResyncMetadataDialog, { ...resyncMetadata }) : /* @__PURE__ */ jsx(Button, { mode: "bleed", text: "Sync with Mux", onClick: resyncMetadata.openDialog });
 }
 const CONTEXT_MENU_POPOVER_PROPS = {
   constrainSize: !0,
@@ -1596,6 +1701,55 @@ function StopWatchIcon(props) {
     }
   );
 }
+function useResyncAsset(options) {
+  const client = useClient(), toast = useToast(), [resyncState, setResyncState] = useState("idle"), [resyncError, setResyncError] = useState(null), showToast = options?.showToast ?? !1, resyncAsset = 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") {
@@ -2498,20 +2652,7 @@ function TextTracksManager({
   tracks: propTracks,
   collapseTracks = !1
 }) {
-  const client = useClient(), toast = useToast(), dialogId = `DeleteCaptionDialog${useId()}`, [downloadingTrackId, setDownloadingTrackId] = useState(null), [deletingTrackId, setDeletingTrackId] = useState(null), [addedTracks, setAddedTracks] = useState([]), [updatedTracks, setUpdatedTracks] = useState(/* @__PURE__ */ new Map()), [trackActivityOrder, setTrackActivityOrder] = useState(/* @__PURE__ */ new Map()), [autogeneratedTrackIds, setAutogeneratedTrackIds] = useState(/* @__PURE__ */ new Set()), [trackToDelete, setTrackToDelete] = useState(null), [trackToEdit, setTrackToEdit] = useState(null), [showAddDialog, setShowAddDialog] = useState(!1), [isExpanded, setIsExpanded] = useState(!1), MAX_VISIBLE_TRACKS = 4;
-  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 = useToast(), dialogId = `DeleteCaptionDialog${useId()}`, { resyncAsset } = useResyncAsset(), [downloadingTrackId, setDownloadingTrackId] = useState(null), [deletingTrackId, setDeletingTrackId] = useState(null), [addedTracks, setAddedTracks] = useState([]), [updatedTracks, setUpdatedTracks] = useState(/* @__PURE__ */ new Map()), [trackActivityOrder, setTrackActivityOrder] = useState(/* @__PURE__ */ new Map()), [autogeneratedTrackIds, setAutogeneratedTrackIds] = useState(/* @__PURE__ */ new Set()), [trackToDelete, setTrackToDelete] = useState(null), [trackToEdit, setTrackToEdit] = useState(null), [showAddDialog, setShowAddDialog] = useState(!1), [isExpanded, setIsExpanded] = 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 = useMemo(() => {
     const tracksWithUpdates = activeTracks.map((track) => updatedTracks.get(track.id) || track), isMockTrackReplaced = (mockTrack, realTracksList) => !mockTrack.id || !mockTrack.id.startsWith("generating-") ? !1 : realTracksList.some((realTrack) => {
@@ -2542,11 +2683,11 @@ function TextTracksManager({
   }, [activeTracks, addedTracks]), 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();
@@ -2583,7 +2724,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) => {
@@ -2619,14 +2760,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) => {
@@ -2654,7 +2788,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) => {
@@ -2669,13 +2803,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__ */ jsxs(Stack, { space: 3, children: [
@@ -3025,7 +3153,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,
@@ -3342,7 +3470,10 @@ function getVideoMetadata(doc) {
 function useVideoDetails(props) {
   const documentStore = useDocumentStore(), toast = useToast(), client = useClient(), [references, referencesLoading] = useDocReferences(
     useMemo(() => ({ documentStore, id: props.asset._id }), [documentStore, props.asset._id])
-  ), [originalAsset, setOriginalAsset] = useState(() => props.asset), [filename, setFilename] = useState(props.asset.filename), modified = filename !== originalAsset.filename, displayInfo = getVideoMetadata({ ...props.asset, filename }), [state, setState] = useState("idle");
+  ), [originalAsset, setOriginalAsset] = useState(() => props.asset), [filename, setFilename] = useState(props.asset.filename), modified = filename !== originalAsset.filename, displayInfo = getVideoMetadata({ ...props.asset, filename }), [state, setState] = 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) {
@@ -3385,7 +3516,9 @@ function useVideoDetails(props) {
     setState,
     handleClose,
     confirmClose,
-    saveChanges
+    saveChanges,
+    handleResync,
+    isResyncing
   };
 }
 const AssetInput = (props) => /* @__PURE__ */ jsx(FormField$1, { title: props.label, description: props.description, inputId: props.label, children: /* @__PURE__ */ jsx(
@@ -3409,7 +3542,9 @@ const AssetInput = (props) => /* @__PURE__ */ jsx(FormField$1, { title: props.la
     setState,
     handleClose,
     confirmClose,
-    saveChanges
+    saveChanges,
+    handleResync,
+    isResyncing
   } = useVideoDetails(props), isSaving = state === "saving", [containerHeight, setContainerHeight] = useState(null), contentsRef = React.useRef(null);
   return useEffect(() => {
     !contentsRef.current || !("getBoundingClientRect" in contentsRef.current) || setContainerHeight(contentsRef.current.getBoundingClientRect().height);
@@ -3425,19 +3560,35 @@ const AssetInput = (props) => /* @__PURE__ */ jsx(FormField$1, { title: props.la
       width: 2,
       position: "fixed",
       footer: /* @__PURE__ */ jsx(Card, { padding: 3, children: /* @__PURE__ */ jsxs(Flex, { justify: "space-between", align: "center", children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            icon: TrashIcon,
-            fontSize: 2,
-            padding: 3,
-            mode: "bleed",
-            text: "Delete",
-            tone: "critical",
-            onClick: () => setState("deleting"),
-            disabled: isSaving
-          }
-        ),
+        /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              icon: TrashIcon,
+              fontSize: 2,
+              padding: 3,
+              mode: "bleed",
+              text: "Delete",
+              tone: "critical",
+              onClick: () => setState("deleting"),
+              disabled: isSaving || isResyncing
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              icon: SyncIcon,
+              fontSize: 2,
+              padding: 3,
+              mode: "bleed",
+              text: "Resync",
+              tone: "primary",
+              onClick: handleResync,
+              disabled: isSaving || isResyncing,
+              iconRight: isResyncing && Spinner
+            }
+          )
+        ] }),
         modified && /* @__PURE__ */ jsx(
           Button,
           {
@@ -3449,7 +3600,7 @@ const AssetInput = (props) => /* @__PURE__ */ jsx(FormField$1, { title: props.la
             tone: "positive",
             onClick: saveChanges,
             iconRight: isSaving && Spinner,
-            disabled: isSaving
+            disabled: isSaving || isResyncing
           }
         )
       ] }) }),
@@ -4643,7 +4794,9 @@ const FileButton = styled(MenuItem)(({ theme }) => {
   color: white;
 `, isVideoAsset = (asset) => asset._type === "mux.videoAsset";
 function PlayerActionsMenu(props) {
-  const { asset, readOnly, dialogState, setDialogState, onChange, onSelect, accept } = props, [open, setOpen] = useState(!1), [menuElement, setMenuRef] = useState(null), isSigned = useMemo(() => getPlaybackPolicy(asset)?.policy === "signed", [asset]), { hasConfigAccess } = useAccessControl(props.config), onReset = useCallback(() => onChange(PatchEvent.from(unset([]))), [onChange]);
+  const { asset, readOnly, dialogState, setDialogState, onChange, onSelect, accept } = props, [open, setOpen] = useState(!1), [menuElement, setMenuRef] = useState(null), isSigned = useMemo(() => getPlaybackPolicy(asset)?.policy === "signed", [asset]), { hasConfigAccess } = useAccessControl(props.config), { resyncAsset, isResyncing } = useResyncAsset({ showToast: !0 }), onReset = useCallback(() => onChange(PatchEvent.from(unset([]))), [onChange]), handleResync = useCallback(async () => {
+    setOpen(!1), await resyncAsset(asset);
+  }, [resyncAsset, asset]);
   return useEffect(() => {
     open && dialogState && setOpen(!1);
   }, [dialogState, open]), useClickOutsideEvent(
@@ -4701,6 +4854,15 @@ function PlayerActionsMenu(props) {
                 text: "Captions",
                 onClick: () => setDialogState("edit-captions")
               }
+            ),
+            /* @__PURE__ */ jsx(
+              MenuItem,
+              {
+                icon: SyncIcon,
+                text: "Resync from Mux",
+                onClick: handleResync,
+                disabled: readOnly || isResyncing
+              }
             )
           ] }),
           /* @__PURE__ */ jsx(MenuDivider, {}),
@@ -6051,7 +6213,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",