@mottosports/motto-video-player 1.0.1-rc.21 → 1.0.1-rc.23

package/dist/index.d.mts

@@ -112,10 +112,6 @@ interface PlayerProps extends Omit<HTMLAttributes<HTMLVideoElement>, 'src' | 'on
      * The source URL of the video (DASH, HLS, or regular MP4)
      */
     src: string;
-    /**
-     * The name of the player (used for Mux analytics. For example, 'Web' or 'Mobile App')
-     */
-    playerName?: string;
     /**
      * Whether the video should autoplay
      */
@@ -397,7 +393,6 @@ declare enum CreativeWorksSortDirection {
 interface VideoProps extends Omit<PlayerProps, 'src'> {
     videoId?: string;
     publicKey?: string;
-    mottoToken?: string;
     videoData?: VideoData;
     refetchInterval?: number;
     playerName?: string;
@@ -415,6 +410,13 @@ interface VideoProps extends Omit<PlayerProps, 'src'> {
     };
     children?: React.ReactNode;
     className?: string;
+    auth?: {
+        mottoToken?: string;
+        userId?: string;
+    };
+    settings?: {
+        backgroundImageUrl?: string;
+    };
     queryOptions?: {
         enabled?: boolean;
         staleTime?: number;

package/dist/index.d.ts

@@ -112,10 +112,6 @@ interface PlayerProps extends Omit<HTMLAttributes<HTMLVideoElement>, 'src' | 'on
      * The source URL of the video (DASH, HLS, or regular MP4)
      */
     src: string;
-    /**
-     * The name of the player (used for Mux analytics. For example, 'Web' or 'Mobile App')
-     */
-    playerName?: string;
     /**
      * Whether the video should autoplay
      */
@@ -397,7 +393,6 @@ declare enum CreativeWorksSortDirection {
 interface VideoProps extends Omit<PlayerProps, 'src'> {
     videoId?: string;
     publicKey?: string;
-    mottoToken?: string;
     videoData?: VideoData;
     refetchInterval?: number;
     playerName?: string;
@@ -415,6 +410,13 @@ interface VideoProps extends Omit<PlayerProps, 'src'> {
     };
     children?: React.ReactNode;
     className?: string;
+    auth?: {
+        mottoToken?: string;
+        userId?: string;
+    };
+    settings?: {
+        backgroundImageUrl?: string;
+    };
     queryOptions?: {
         enabled?: boolean;
         staleTime?: number;

package/dist/index.js

@@ -1336,10 +1336,10 @@ var import_mux_data_shakaplayer = __toESM(require("@mux/mux-data-shakaplayer"));
 var import_shaka_player2 = __toESM(require("shaka-player/dist/shaka-player.ui"));
 
 // package.json
-var version = "1.0.1-rc.21";
+var version = "1.0.1-rc.23";
 
 // src/hooks/useMuxAnalytics.ts
-var useMuxAnalytics = (playerRef, muxConfig, onMuxReady, onMuxDataUpdate, playerName) => {
+var useMuxAnalytics = (playerRef, muxConfig, onMuxReady, onMuxDataUpdate) => {
   const shakaPlayerMuxRef = (0, import_react4.useRef)(null);
   const initializeMux = (0, import_react4.useCallback)(() => {
     if (!muxConfig || !playerRef.current) return;
@@ -1354,9 +1354,12 @@ var useMuxAnalytics = (playerRef, muxConfig, onMuxReady, onMuxDataUpdate, player
         ...muxConfig.errorTranslator && { errorTranslator: muxConfig.errorTranslator },
         data: {
           env_key: muxConfig.envKey,
-          player_name: playerName,
+          player_name: muxConfig?.metadata?.player_name,
           player_version: version,
           player_init_time: playerInitTime,
+          video_title: muxConfig?.metadata?.video_title ?? "",
+          video_id: muxConfig?.metadata?.video_id ?? "",
+          viewer_user_id: muxConfig?.metadata?.viewer_user_id ?? "",
           ...muxConfig.metadata
         }
       };
@@ -3232,7 +3235,6 @@ var Player = (0, import_react12.forwardRef)(
     iconSizes,
     events,
     containerClassName,
-    playerName,
     ...videoProps
   }, ref) => {
     const videoRef = (0, import_react12.useRef)(null);
@@ -3268,7 +3270,7 @@ var Player = (0, import_react12.forwardRef)(
       updateMuxData,
       handleMuxError,
       destroyMux
-    } = useMuxAnalytics(playerRef, muxConfig, events?.onMuxReady, events?.onMuxDataUpdate, playerName);
+    } = useMuxAnalytics(playerRef, muxConfig, events?.onMuxReady, events?.onMuxDataUpdate);
     const { setupEventListeners, cleanupEventListeners } = useEventHandlers(videoRef, {
       onPlay: events?.onPlay,
       onPause: events?.onPause,
@@ -3936,7 +3938,6 @@ var import_jsx_runtime9 = require("react/jsx-runtime");
 var Video = ({
   videoId,
   publicKey,
-  mottoToken,
   videoData: providedVideoData,
   refetchInterval = 0,
   playerName,
@@ -3944,6 +3945,8 @@ var Video = ({
   events,
   children,
   className,
+  auth,
+  settings,
   queryOptions = {},
   ...props
 }) => {
@@ -3953,8 +3956,8 @@ var Video = ({
     error,
     refetch
   } = (0, import_react_query.useQuery)({
-    queryKey: ["video", videoId, publicKey, mottoToken],
-    queryFn: () => fetchVideoData(videoId, publicKey, mottoToken),
+    queryKey: ["video", videoId, publicKey, auth?.mottoToken],
+    queryFn: () => fetchVideoData(videoId, publicKey, auth?.mottoToken),
     enabled: !!videoId && !!publicKey && !providedVideoData,
     refetchInterval: refetchInterval > 0 ? refetchInterval : false,
     staleTime: queryOptions.staleTime ?? 5 * 60 * 1e3,
@@ -4004,7 +4007,6 @@ var Video = ({
       children
     ] }) });
   }
-  console.log("hlsUrl", hlsUrl);
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: (0, import_tailwind_merge3.twMerge)("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "relative w-full h-full", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     Player,
     {
@@ -4119,8 +4121,13 @@ var Event = ({
   const [loadingPlaylist, setLoadingPlaylist] = (0, import_react15.useState)(true);
   const videosDataError = videosData?.some((video) => !!video.error);
   (0, import_react15.useEffect)(() => {
-    if (eventError || videosError || videosDataError) {
-      const errorObj = eventError || videosError || videosData?.find((video) => !!video.error)?.error && new Error(videosData?.find((video) => !!video.error)?.error) || new Error("default");
+    if (isEventLoading || videosIsLoading || loadingApisState) {
+      return;
+    }
+    const hasPlayablePlaylist = Boolean(activePlaylist);
+    if (eventError || videosError || videosDataError && !hasPlayablePlaylist) {
+      const firstVideoError = videosData?.find((video) => !!video.error)?.error;
+      const errorObj = eventError || videosError || firstVideoError && new Error(firstVideoError) || new Error("default");
       setError(errorObj);
       if (events?.onError) {
         events.onError(errorObj);
@@ -4128,7 +4135,17 @@ var Event = ({
     } else {
       setError(null);
     }
-  }, [eventError, videosError, videosDataError, videosData, events]);
+  }, [
+    eventError,
+    videosError,
+    videosDataError,
+    videosData,
+    events,
+    activePlaylist,
+    isEventLoading,
+    videosIsLoading,
+    loadingApisState
+  ]);
   (0, import_react15.useEffect)(() => {
     const eventLoadedWithNoVideos = !isEventLoading && eventData && eventData.videoIds && (!eventData.videoIds || eventData?.videoIds?.length === 0) && !loadingApisState;
     const allApisLoadedWithPotentialVideos = !isEventLoading && !videosIsLoading && eventData && !loadingApisState;