@maestro_io/maestro-web-sdk 5.1.2 → 5.2.0

package/dist/src/modules/fox/multi-view/view/components/curated-multiview-card/CuratedMultiviewCard.d.ts

@@ -0,0 +1,101 @@
+/// <reference types="prop-types" />
+import React from 'react';
+import './CuratedMultiviewCard.style.css';
+import { WithFocusableProps } from '@/external/spatial-navigation';
+import { CuratedMultiviewListing } from '../../../types';
+export type CuratedMultiviewCardProps = {
+    listings: CuratedMultiviewListing[];
+    selected: boolean;
+};
+declare const _default: {
+    new (props: (CuratedMultiviewCardProps & WithFocusableProps) | Readonly<CuratedMultiviewCardProps & WithFocusableProps>): {
+        state: import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState;
+        navigation: import("../../../../../../external/spatial-navigation/spatialNavigation").default;
+        getChildContext(): {
+            parentFocusKey: string;
+        };
+        setFocus: (focusKey: string) => void;
+        navigateByDirection: (direction: import("../../../../../../external/spatial-navigation/utils").Direction, details?: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onClickPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onEnterReleaseHandler: () => void;
+        onBackPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onArrowPressHandler: (direction: import("../../../../../../external/spatial-navigation/utils").Direction, details: import("../../../../../../external/spatial-navigation/utils").Details) => boolean | void;
+        onBecameFocusedHandler: (layout: import("../../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onBecameBlurredHandler: (layout: import("../../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        componentWillUnmount(): void;
+        render(): React.ReactElement<CuratedMultiviewCardProps & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<CuratedMultiviewCardProps & WithFocusableProps>) => import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<CuratedMultiviewCardProps & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, prevState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    new (props: CuratedMultiviewCardProps & WithFocusableProps, context: any): {
+        state: import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState;
+        navigation: import("../../../../../../external/spatial-navigation/spatialNavigation").default;
+        getChildContext(): {
+            parentFocusKey: string;
+        };
+        setFocus: (focusKey: string) => void;
+        navigateByDirection: (direction: import("../../../../../../external/spatial-navigation/utils").Direction, details?: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onClickPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onEnterReleaseHandler: () => void;
+        onBackPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onArrowPressHandler: (direction: import("../../../../../../external/spatial-navigation/utils").Direction, details: import("../../../../../../external/spatial-navigation/utils").Details) => boolean | void;
+        onBecameFocusedHandler: (layout: import("../../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onBecameBlurredHandler: (layout: import("../../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        componentWillUnmount(): void;
+        render(): React.ReactElement<CuratedMultiviewCardProps & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<CuratedMultiviewCardProps & WithFocusableProps>) => import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<CuratedMultiviewCardProps & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, prevState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    contextTypes: {
+        parentFocusKey: import("prop-types").Requireable<string>;
+    };
+    childContextTypes: {
+        parentFocusKey: import("prop-types").Requireable<string>;
+    };
+    contextType?: React.Context<any> | undefined;
+};
+export default _default;

package/dist/src/modules/fox/multi-view/view/components/curated-multiview-card/CuratedMultiviewCard.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import './CuratedMultiviewCard.style.css';
+import { withFocusable, } from '@/external/spatial-navigation';
+import Icon from '@/components/atoms/SvgIcon';
+const StreamScreen = ({ listing }) => {
+    const { backgroundImage, description } = listing;
+    return (React.createElement("div", { className: "curated-multiview-screen", style: {
+            backgroundImage: `url(${backgroundImage})`,
+        } },
+        React.createElement("span", { className: "curated-multiview-screen-title FONT_BOLD" }, description)));
+};
+const CuratedMultiviewCard = (props) => {
+    const { listings, selected, focused } = props;
+    return (React.createElement("div", { className: "curated-multiview-card focus-ring", "data-focused": focused },
+        React.createElement("div", { className: "curated-multiview-card-row" },
+            React.createElement("div", { className: "curated-multiview-card-cell curated-multiview-card-cell-screens" },
+                React.createElement("div", { className: "curated-multiview-screens-container" }, listings.slice(0, 2).map((listing) => (React.createElement(StreamScreen, { key: listing.id, listing: listing }))))),
+            React.createElement("div", { className: "curated-multiview-card-cell curated-multiview-card-cell-radio" },
+                React.createElement("div", { className: "curated-multiview-radio", "data-selected": selected }, selected && React.createElement(Icon, { iconName: "checkmark", width: 22.5, height: 22 }))))));
+};
+export default withFocusable()(CuratedMultiviewCard);

package/dist/src/modules/fox/multi-view/view/components/curated-multiview-card/index.d.ts

@@ -0,0 +1,2 @@
+import CuratedMultiviewCard from './CuratedMultiviewCard';
+export default CuratedMultiviewCard;

package/dist/src/modules/fox/multi-view/view/components/curated-multiview-card/index.js

@@ -0,0 +1,2 @@
+import CuratedMultiviewCard from './CuratedMultiviewCard';
+export default CuratedMultiviewCard;

package/dist/src/modules/fox/multi-view/view-model/MultiViewViewModel.d.ts

@@ -0,0 +1,63 @@
+import { ViewModel } from '@/view-models/ViewModel';
+import { Observable } from '@/helpers/Observable';
+import { CuratedMultiviewListing, MultiViewLayout } from '../types';
+import IMaestroEventDelegate from '@/interfaces/IMaestroEventDelegate';
+import { CuratedMultiviewResponse, MultiViewListingRequest } from '../services/MultiViewService';
+import AnalyticsService from '@/services/AnalyticsService/AnalyticsService';
+export type CuratedMultiviewItem = {
+    id: string;
+    isSelected: boolean;
+    listings: CuratedMultiviewListing[];
+};
+export type CuratedMultiviewsItem = {
+    type: 'curated-multiviews';
+    items: CuratedMultiviewItem[];
+};
+export type MultiviewItem = CuratedMultiviewsItem;
+export declare class MultiViewViewModel extends ViewModel {
+    private _layouts;
+    private _isPolling;
+    private service;
+    private delegate;
+    private eventId;
+    private analyticsService;
+    isDataLoading: Observable<boolean>;
+    private pollingTask;
+    items: Observable<CuratedMultiviewsItem[]>;
+    private hasEverSuccessfullyLoaded;
+    private onAuthError?;
+    constructor(eventId: string, delegate: IMaestroEventDelegate, analyticsService: AnalyticsService);
+    getLayouts(): MultiViewLayout[];
+    getIsPolling(): Observable<boolean>;
+    getIsDataLoading(): Observable<boolean>;
+    getEventId(): string;
+    /**
+     * Notify client app about a Product API auth error.
+     * Uses configured callback first, and falls back to onPanelEvent.
+     */
+    private notifyProductAPIUnauthorized;
+    private trackPanelView;
+    init(): Promise<void>;
+    fetchLayouts(): Promise<void>;
+    setDataToPanel(data: Record<string, any>): Promise<void>;
+    onSelectCustomMultiview(params: MultiViewListingRequest): Promise<void>;
+    /**
+     * Clean up resources when the ViewModel is no longer needed
+     */
+    cleanup(): void;
+    /**
+     * Called when a curated multiview is selected. Notifies the client via onPanelEvent
+     * so the app can switch the video player to the selected multiview.
+     */
+    onSelectCuratedMultiview(item: CuratedMultiviewItem): void;
+    /**
+     * Stop polling for bet data
+     */
+    stopPolling(): void;
+    /**
+     * Refresh polling for curated multiviews
+     */
+    refreshPolling(): void;
+    processCuratedMultiviewData(data: CuratedMultiviewResponse): void;
+    clearTabLoadFailure(): Promise<void>;
+}

package/dist/src/modules/fox/multi-view/view-model/MultiViewViewModel.js

@@ -0,0 +1,328 @@
+import { ViewModel } from '@/view-models/ViewModel';
+import { Observable } from '@/helpers/Observable';
+import { DEFAULT_LAYOUTS_BY_LISTINGS_QUANTITY, } from '../types';
+import MultiViewService, { isProductAPIValid, } from '../services/MultiViewService';
+import { AuthError } from '@/services/NetworkManager/errors';
+import { captureException } from '@/sentry';
+export class MultiViewViewModel extends ViewModel {
+    constructor(eventId, delegate, analyticsService) {
+        super();
+        Object.defineProperty(this, "_layouts", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable([])
+        });
+        Object.defineProperty(this, "_isPolling", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable(false)
+        });
+        Object.defineProperty(this, "service", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "delegate", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "eventId", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "analyticsService", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "isDataLoading", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable(false)
+        });
+        Object.defineProperty(this, "pollingTask", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "items", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable([])
+        });
+        Object.defineProperty(this, "hasEverSuccessfullyLoaded", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable(false)
+        });
+        Object.defineProperty(this, "onAuthError", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.eventId = eventId;
+        this.delegate = delegate;
+        this.analyticsService = analyticsService;
+        this.service = new MultiViewService();
+    }
+    getLayouts() {
+        return this._layouts.value;
+    }
+    getIsPolling() {
+        return this._isPolling;
+    }
+    getIsDataLoading() {
+        return this.isDataLoading;
+    }
+    getEventId() {
+        return this.eventId;
+    }
+    /**
+     * Notify client app about a Product API auth error.
+     * Uses configured callback first, and falls back to onPanelEvent.
+     */
+    notifyProductAPIUnauthorized(error) {
+        if (error.statusCode !== 401) {
+            return;
+        }
+        const payload = {
+            code: error.statusCode,
+            message: error.message || 'Not authorized',
+            success: false,
+            data: error.data,
+        };
+        if (this.onAuthError) {
+            this.onAuthError(payload);
+        }
+    }
+    async trackPanelView() {
+        try {
+            await this.analyticsService.panelView('foxMultiView');
+        }
+        catch (error) {
+            captureException(error, {
+                context: 'MultiViewViewModel.trackPanelView',
+            });
+            console.error('[MULTIVIEW] Error tracking panel view:', error);
+        }
+    }
+    async init() {
+        try {
+            await this.trackPanelView();
+            await this.fetchLayouts();
+            this.refreshPolling();
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error
+                ? error.message
+                : 'Failed to initialize MultiView';
+            this.setError(errorMessage);
+            console.error('[MultiViewViewModel] Initialization error:', error);
+        }
+    }
+    async fetchLayouts() {
+        if (this.getLayouts().length) {
+            return;
+        }
+        try {
+            this.isDataLoading.value = true;
+            const layouts = await this.service.getLayouts();
+            if (layouts) {
+                this._layouts.value = layouts;
+            }
+        }
+        catch (error) {
+            console.log('[MultiViewViewModel] Error fetching layouts:', error);
+            if (error instanceof AuthError) {
+                this.notifyProductAPIUnauthorized(error);
+                return;
+            }
+            const errorMessage = error instanceof Error ? error.message : 'Failed to fetch layouts';
+            if (!this.hasEverSuccessfullyLoaded.value) {
+                this.setError(errorMessage);
+            }
+        }
+        finally {
+            this.isDataLoading.value = false;
+        }
+    }
+    async setDataToPanel(data) {
+        try {
+            const callback = typeof data.callback === 'function' ? data.callback : undefined;
+            if (isProductAPIValid(data)) {
+                this.onAuthError = callback;
+                this.service.setProductAPIData(data);
+                await this.fetchLayouts();
+                this.refreshPolling();
+            }
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error ? error.message : 'Failed to set panel data';
+            console.error('[MultiViewViewModel] Error setting panel data:', error);
+            if (!this.hasEverSuccessfullyLoaded.value) {
+                this.setError(errorMessage);
+            }
+        }
+    }
+    async onSelectCustomMultiview(params) {
+        try {
+            this.setLoading(true);
+            this.setError(null);
+            const response = await this.service.getOrCreateCustomMultiview(params);
+            if (this.delegate) {
+                this.delegate.onPanelEvent({
+                    type: 'fox-multiview:custom-multiview',
+                    payload: response.multiviewId,
+                });
+            }
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error
+                ? error.message
+                : 'Failed to select custom multiview';
+            this.setError(errorMessage);
+            console.error('[MultiViewViewModel] Error selecting multiview:', error);
+            throw error;
+        }
+        finally {
+            this.setLoading(false);
+        }
+    }
+    /**
+     * Clean up resources when the ViewModel is no longer needed
+     */
+    cleanup() {
+        this.stopPolling();
+        this.hasEverSuccessfullyLoaded.value = false;
+    }
+    /**
+     * Called when a curated multiview is selected. Notifies the client via onPanelEvent
+     * so the app can switch the video player to the selected multiview.
+     */
+    onSelectCuratedMultiview(item) {
+        if (item.isSelected) {
+            return;
+        }
+        const layout = DEFAULT_LAYOUTS_BY_LISTINGS_QUANTITY[item.listings.length];
+        if (!layout) {
+            return;
+        }
+        const payload = {
+            childListings: item.listings.map((l, listingIndex) => ({
+                callsign: l.type,
+                listingId: l.id,
+                position: layout.positions[layout.positionsOrder[listingIndex]],
+            })),
+            multiviewID: item.id,
+        };
+        this.delegate.onPanelEvent({
+            type: 'fox-multiview:new-multiview',
+            payload,
+        });
+    }
+    /**
+     * Stop polling for bet data
+     */
+    stopPolling() {
+        if (this.pollingTask) {
+            this.pollingTask.stop();
+            this.pollingTask = null;
+        }
+        if (this.isDataLoading.value) {
+            this.isDataLoading.value = false;
+        }
+    }
+    /**
+     * Refresh polling for curated multiviews
+     */
+    refreshPolling() {
+        // First stop any existing polling
+        this.stopPolling();
+        // Start the poll loop
+        this.pollingTask = this.service.pollCuratedMultiviews(30000, this.processCuratedMultiviewData.bind(this), (error) => {
+            console.error('[MultiViewViewModel] Error polling data:', error);
+            if (error instanceof AuthError) {
+                this.notifyProductAPIUnauthorized(error);
+            }
+        });
+    }
+    processCuratedMultiviewData(data) {
+        if (!data || !data.status || !data.data) {
+            return;
+        }
+        if (!Array.isArray(data.data.items)) {
+            return;
+        }
+        const curatedMultiviewItem = [];
+        for (const item of data.data.items) {
+            const listings = [];
+            if (!item.is_multiview) {
+                continue;
+            }
+            if (item.multiview_metadata && Array.isArray(item.multiview_metadata)) {
+                for (const mv of item.multiview_metadata) {
+                    listings.push({
+                        id: mv.entity_id || '',
+                        description: mv.is_sportingevent && mv.left_team && mv.right_team
+                            ? `${mv.left_team.abbreviation} vs ${mv.right_team.abbreviation}`
+                            : item.title || '',
+                        backgroundImage: 'https://placedog.net/640/480',
+                        type: mv.type || 'unknown',
+                    });
+                }
+            }
+            else {
+                listings.push({
+                    id: item.entity_id || '',
+                    description: item.title || '',
+                    backgroundImage: item.images?.still || '',
+                    type: item.type || 'unknown',
+                });
+            }
+            curatedMultiviewItem.push({
+                id: item.entity_id || '',
+                isSelected: this.eventId === item.entity_id,
+                listings,
+            });
+        }
+        const newItems = [...this.items.value];
+        const existingCuratedMultiviewIndex = newItems.findIndex((i) => i.type === 'curated-multiviews');
+        if (existingCuratedMultiviewIndex !== -1) {
+            newItems[existingCuratedMultiviewIndex] = {
+                type: 'curated-multiviews',
+                items: curatedMultiviewItem,
+            };
+        }
+        else {
+            newItems.unshift({
+                type: 'curated-multiviews',
+                items: curatedMultiviewItem,
+            });
+        }
+        this.items.value = newItems;
+        if (!this.hasEverSuccessfullyLoaded.value) {
+            this.hasEverSuccessfullyLoaded.value = true;
+            if (this.error.value) {
+                this.setError(null);
+            }
+        }
+    }
+    async clearTabLoadFailure() {
+        this.setError(null);
+        await this.fetchLayouts();
+        this.refreshPolling();
+    }
+}

package/dist/src/modules/fox/multi-view/view-model/index.d.ts

@@ -0,0 +1 @@
+export { MultiViewViewModel } from './MultiViewViewModel';

package/dist/src/modules/fox/multi-view/view-model/index.js

@@ -0,0 +1 @@
+export { MultiViewViewModel } from './MultiViewViewModel';

package/dist/src/services/NetworkManager/NetworkManager.js

@@ -120,7 +120,7 @@ class NetworkManager {
             const status = error.response.status;
             const message = error.response.data?.message || error.message;
             if (status === 401 || status === 403) {
-                throw new AuthError(message);
+                throw new AuthError(status, message, error.response.data);
             }
             else if (status === 404) {
                 throw new NotFoundError(message);

package/dist/src/services/NetworkManager/errors.d.ts

@@ -2,7 +2,9 @@ export declare class NetworkError extends Error {
     constructor(message: string);
 }
 export declare class AuthError extends Error {
-    constructor(message: string);
+    statusCode: number;
+    data?: unknown;
+    constructor(statusCode: number, message: string, data?: unknown);
 }
 export declare class NotFoundError extends Error {
     constructor(message: string);

package/dist/src/services/NetworkManager/errors.js

@@ -6,9 +6,23 @@ export class NetworkError extends Error {
     }
 }
 export class AuthError extends Error {
-    constructor(message) {
+    constructor(statusCode, message, data) {
         super(message);
+        Object.defineProperty(this, "statusCode", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "data", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
         this.name = 'AuthError';
+        this.statusCode = statusCode;
+        this.data = data;
     }
 }
 export class NotFoundError extends Error {

package/dist/src/services/StaticService/StaticService.js

@@ -5,6 +5,7 @@ import NetworkManager from '../NetworkManager/NetworkManager';
 const SITE_ID_STATIC_BASE_URL_MAP = {
     '664b9c57d59a7a431542d814': 'https://static-prod.us-central1-espn-prod.gcp.maestro.io',
     '6930c214fcb9633b5484de81': 'https://static-prod.us-central1-espn-prod.gcp.maestro.io',
+    '695c05610f99e7584a1b7407': 'https://static-prod.us-central1-fox-prod.gcp.maestro.io', // fox
 };
 export default class StaticService {
     constructor(siteId) {

package/dist/src/view-models/MaestroEventViewModel.d.ts

@@ -14,6 +14,7 @@ import { IStatsViewModel } from '../modules/espn/stats/interfaces/IStatsViewMode
 import { IFantasyViewModel } from '@/modules/espn/fantasy/types';
 import { IShopViewModel } from '@/modules/espn/shop/types';
 import { BuilderPanelViewModel } from '@/modules/maestro/builder/view-model/BuilderPanelViewModel';
+import { IMultiViewViewModel } from '@/modules/fox/multi-view/interfaces/IMultiViewViewModel';
 export declare class MaestroEventViewModel extends ViewModel implements IMaestroEvent {
     private _eventId;
     private _pageId;
@@ -29,6 +30,7 @@ export declare class MaestroEventViewModel extends ViewModel implements IMaestro
     statsViewModel: IStatsViewModel | null;
     shopViewModel: IShopViewModel | null;
     builderPanelViewModel: BuilderPanelViewModel | null;
+    multiViewViewModel: IMultiViewViewModel | null;
     panelManagerViewModel: PanelManagerViewModel;
     navigation: SpatialNavigation;
     constructor(eventId: string | undefined, pageId: string | undefined, delegate: IMaestroEventDelegate, analyticsService: AnalyticsService);

package/dist/src/view-models/MaestroEventViewModel.js

@@ -92,6 +92,12 @@ export class MaestroEventViewModel extends ViewModel {
             writable: true,
             value: null
         });
+        Object.defineProperty(this, "multiViewViewModel", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
         Object.defineProperty(this, "panelManagerViewModel", {
             enumerable: true,
             configurable: true,
@@ -187,6 +193,15 @@ export class MaestroEventViewModel extends ViewModel {
                 console.warn('Failed to load ShopViewModel:', err);
             }));
         }
+        if (StaticService.isPanelAvailable(pageConfig, 'foxMultiView')) {
+            loadPromises.push(import('@/modules/fox/multi-view/view-model/MultiViewViewModel')
+                .then(({ MultiViewViewModel }) => {
+                this.multiViewViewModel = new MultiViewViewModel(this._eventId.value, this.delegate, this.analyticsService);
+            })
+                .catch((err) => {
+                console.warn('Failed to load MultiViewViewModel:', err);
+            }));
+        }
         if (StaticService.isPanelAvailable(pageConfig, 'builderBlockPanel')) {
             const builderPanel = pageConfig?.panels?.find((p) => p.panel_type === 'builderBlockPanel');
             if (builderPanel) {
@@ -239,7 +254,7 @@ export class MaestroEventViewModel extends ViewModel {
             espnShop: this.shopViewModel,
             builderBlockPanel: this.builderPanelViewModel,
             foxKeyPlays: null,
-            foxMultiview: null,
+            foxMultiView: this.multiViewViewModel,
             foxStats: null,
             helloWorld: null,
         };
@@ -266,6 +281,7 @@ export class MaestroEventViewModel extends ViewModel {
         this.fantasyViewModel?.cleanup();
         this.shopViewModel?.cleanup();
         this.builderPanelViewModel?.cleanup();
+        this.multiViewViewModel?.cleanup();
         this.navigation.destroy();
         try {
             await this.didHidePanel();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maestro_io/maestro-web-sdk",
   "private": false,
-  "version": "5.1.2",
+  "version": "5.2.0",
   "type": "commonjs",
   "license": "MIT",
   "main": "dist/maestro-web-sdk.umd.js",