@maestro_io/maestro-web-sdk 5.0.0 → 5.1.0

package/dist/src/modules/espn/stats/view-model/StatsViewModel.js

@@ -0,0 +1,1416 @@
+import { Observable } from '../../../../helpers/Observable';
+import { ViewModel } from '../../../../view-models/ViewModel';
+import { MOCK_STATS_API_PRE_GAME_RESPONSE } from '../mocks';
+import { isTabbedStatisticsArray, isTeamStatistic, isHockeyScoringSummary, isMlbScoringSummary, } from '../interfaces/IStats';
+import StatsService from '../services/StatsService';
+import { formatLastPlayMarquee, parseDriveDescription, } from '../utils/driveSummaryUtils';
+import { setImageDimensions } from '@/helpers/url';
+import SDK from '@/index';
+import { captureException } from '@/sentry';
+import { stringHashCode } from '@/helpers/strings';
+const STATS_ERROR_STATE = {
+    NONE: 'none',
+    TAB_LOAD_FAILURE: 'tabLoadFailure',
+};
+// Constants for configuration
+const DEFAULT_POLLING_INTERVAL = 10000; // 10 seconds
+const SMART_POLLING_DELAY = 1000; // 1 second delay after smart polling immediate call
+// The interval for polling stats data (in milliseconds)
+const STATS_ITEM_TYPE_CARD_MAP = {
+    activeAthletes: 'activeAthletes',
+    driveSummary: 'drives',
+    gameLeaders: 'leaders',
+    headerTeam: 'header',
+    matchPredictor: 'predictor',
+    playerSeasonStats: 'playerStats',
+    promotion: 'promotion',
+    recentGames: 'previousGames',
+    scoringSummary: 'scoringSummary',
+    teamStats: 'entities',
+    winProbability: 'winProbability',
+    careerMatchup: 'careerMatchup',
+    penalties: 'penaltySummary',
+};
+export class StatsViewModel extends ViewModel {
+    constructor(eventId, delegate, analyticsService, options = {}) {
+        super();
+        Object.defineProperty(this, "isDataLoading", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable(true)
+        });
+        Object.defineProperty(this, "hasEverSuccessfullyLoaded", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable(false)
+        });
+        Object.defineProperty(this, "eventId", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "statsItems", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable([])
+        });
+        Object.defineProperty(this, "errorState", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable('none')
+        });
+        Object.defineProperty(this, "currentGameState", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable('')
+        });
+        Object.defineProperty(this, "statsService", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "analyticsService", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        // Properties
+        Object.defineProperty(this, "useMockData", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        Object.defineProperty(this, "lastResponseHash", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        // Enhanced timecode-related properties
+        Object.defineProperty(this, "currentPlayerTimeCode", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "timecodePollingTask", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "smartPollingTimeout", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "timecodePollingState", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {
+                isActive: false,
+                currentUrl: null,
+                lastUpdateTime: 0,
+            }
+        });
+        Object.defineProperty(this, "onEngage", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (type) => {
+                this.analyticsService.panelClick({
+                    type: 'espnStats',
+                    name: 'stats_item_clicked',
+                    metadata: {
+                        card: [STATS_ITEM_TYPE_CARD_MAP[type]],
+                        game_state: [this.currentGameState.value],
+                    },
+                });
+            }
+        });
+        this.eventId = eventId;
+        this.useMockData = options.useMockData || false;
+        this.statsService = new StatsService(delegate);
+        this.analyticsService = analyticsService;
+    }
+    /**
+     * Sets panel-specific data configuration
+     * @param panelData - Object containing panel configuration
+     */
+    setDataToPanel(panelData) {
+        if ('overrideUrl' in panelData) {
+            const overrideUrl = panelData.overrideUrl;
+            if (typeof overrideUrl === 'string' && overrideUrl.length > 0) {
+                console.log('[StatsViewModel] Setting overrideUrl:', overrideUrl);
+                this.statsService.overrideUrl = overrideUrl;
+            }
+        }
+    }
+    /**
+     * Initialize the ViewModel and start data fetching
+     */
+    async init() {
+        if (this.useMockData) {
+            await this.fetchMockData();
+        }
+        else {
+            // Get the current timecode from MaestroEventViewModel instead of defaulting to null
+            // This ensures we don't override the current timecode when switching tabs
+            const currentTimeCode = this.getCurrentTimeCode();
+            this.onUpdatePlayerTimeCode(currentTimeCode);
+            this.analyticsService.panelView('espnStats');
+        }
+    }
+    /**
+     * Get the current timecode from the MaestroEventViewModel
+     * This prevents the stats panel from always defaulting to real-time data
+     */
+    getCurrentTimeCode() {
+        try {
+            // Access the MaestroEventViewModel through the imported SDK to get current timecode
+            const maestroEventViewModel = SDK.getMaestroEventViewModel();
+            if (maestroEventViewModel &&
+                typeof maestroEventViewModel.getPlayerTimeCode === 'function') {
+                return maestroEventViewModel.getPlayerTimeCode();
+            }
+        }
+        catch (error) {
+            captureException(error, {
+                context: 'StatsViewModel.getCurrentTimeCode',
+            });
+            console.warn('Could not get current timecode from MaestroEventViewModel:', error);
+        }
+        // Fallback to null (real-time) if we can't get the current timecode
+        return null;
+    }
+    /**
+     * Clean up resources when the ViewModel is no longer needed
+     */
+    cleanup() {
+        this.stopTimecodePolling();
+        this.clearSmartPollingTimeout();
+        this.resetTimecodePollingState();
+    }
+    /**
+     * Handle player timecode updates with enhanced logging and validation
+     *
+     * @param playerTimeCode - The timecode in milliseconds, or null for live
+     */
+    onUpdatePlayerTimeCode(playerTimeCode) {
+        this.currentPlayerTimeCode = playerTimeCode;
+        if (this.useMockData) {
+            return;
+        }
+        try {
+            this.performSmartPolling(playerTimeCode);
+        }
+        catch (error) {
+            captureException(error, {
+                context: 'StatsViewModel.onUpdatePlayerTimeCode',
+            });
+            console.error('Error handling player timecode update:', error);
+            this.handleTimecodeError('Error handling player timecode update', error);
+        }
+    }
+    clearTabLoadFailure() {
+        this.errorState.value = 'none';
+        const currentTimeCode = this.getCurrentTimeCode();
+        this.onUpdatePlayerTimeCode(currentTimeCode);
+    }
+    /**
+     * Implement smart polling strategy: immediate API call + delayed polling resumption
+     *
+     * @param playerTimeCode - The timecode in milliseconds, or null
+     */
+    async performSmartPolling(playerTimeCode) {
+        this.clearSmartPollingTimeout();
+        this.stopTimecodePolling();
+        try {
+            const immediateStats = await this.statsService.getStatsByUrl(playerTimeCode);
+            if (!immediateStats) {
+                throw new Error('API returned undefined or null response');
+            }
+            this.processPolledData(immediateStats);
+            this.smartPollingTimeout = window.setTimeout(() => {
+                this.startTimecodePolling(playerTimeCode);
+                this.smartPollingTimeout = null;
+            }, SMART_POLLING_DELAY);
+        }
+        catch (error) {
+            captureException(error, {
+                context: 'StatsViewModel.performSmartPolling',
+            });
+            console.error('Error during smart polling immediate call:', error);
+            this.handleTimecodeError('Error during smart polling immediate call', error);
+            this.stopTimecodePolling();
+            this.startTimecodePolling(playerTimeCode);
+        }
+    }
+    /**
+     * Enhanced error handling for timecode-related operations
+     *
+     * @param context - Description of where the error occurred
+     * @param error - The error that occurred
+     */
+    handleTimecodeError(context, error) {
+        const errorDetails = {
+            context,
+            errorType: error?.constructor?.name || 'Unknown',
+            errorMessage: error instanceof Error ? error.message : String(error),
+            timestamp: new Date().toISOString(),
+            currentTimecode: this.currentPlayerTimeCode,
+            hasExistingData: this.statsItems.value.length > 0,
+            lastResponseHash: this.lastResponseHash,
+            url: this.timecodePollingState.currentUrl,
+        };
+        console.error(`${context}:`, errorDetails);
+        if (!this.hasEverSuccessfullyLoaded.value) {
+            this.errorState.value = 'tabLoadFailure';
+        }
+    }
+    /**
+     * Clear any pending smart polling timeout
+     */
+    clearSmartPollingTimeout() {
+        if (this.smartPollingTimeout) {
+            clearTimeout(this.smartPollingTimeout);
+            this.smartPollingTimeout = null;
+        }
+    }
+    /**
+     * Reset timecode polling state
+     */
+    resetTimecodePollingState() {
+        this.timecodePollingState = {
+            isActive: false,
+            currentUrl: null,
+            lastUpdateTime: 0,
+        };
+    }
+    /**
+     * Start timecode-based polling with enhanced logging
+     *
+     * @param playerTimeCode - The timecode in milliseconds, or null
+     */
+    startTimecodePolling(playerTimeCode) {
+        this.stopTimecodePolling();
+        try {
+            this.timecodePollingTask = this.statsService.pollStatsByUrl(playerTimeCode, DEFAULT_POLLING_INTERVAL, (data) => {
+                this.processPolledData(data);
+            }, (error) => {
+                console.error('Timecode polling error:', error);
+                this.handleTimecodeError('Timecode polling error', error);
+            });
+            this.timecodePollingState.isActive = true;
+        }
+        catch (error) {
+            captureException(error, {
+                context: 'StatsViewModel.startTimecodePolling',
+            });
+            console.error('Error setting up timecode-based Stats polling:', error);
+            this.handleTimecodeError('Error setting up timecode-based Stats polling', error);
+        }
+    }
+    /**
+     * Stop timecode-based polling with enhanced logging
+     */
+    stopTimecodePolling() {
+        if (this.timecodePollingTask) {
+            this.timecodePollingTask.stop();
+            this.timecodePollingTask = null;
+        }
+        this.timecodePollingState.isActive = false;
+    }
+    /**
+     * Fetch mock data for testing
+     */
+    async fetchMockData() {
+        this.processData(MOCK_STATS_API_PRE_GAME_RESPONSE);
+        this.hasEverSuccessfullyLoaded.value = true;
+        this.isDataLoading.value = false;
+    }
+    /**
+     * Process polled data with hash comparison to avoid unnecessary re-renders
+     * Enhanced with comprehensive logging to show data changes
+     *
+     * @param data - The stats data received from the API
+     */
+    processPolledData(data) {
+        const responseString = JSON.stringify(data);
+        const currentHash = stringHashCode(responseString);
+        if (this.hasEverSuccessfullyLoaded.value &&
+            currentHash === this.lastResponseHash) {
+            return;
+        }
+        this.lastResponseHash = currentHash;
+        this.hasEverSuccessfullyLoaded.value = true;
+        this.errorState.value = 'none';
+        this.processData(data);
+        if (data.gameState === 'post') {
+            this.stopTimecodePolling();
+        }
+    }
+    processData(data) {
+        const statsItems = [];
+        const headerTeam = this.parseHeaderTeams(data);
+        if (headerTeam) {
+            statsItems.push(headerTeam);
+        }
+        const matchPredictor = this.parseMatchPredictor(data);
+        if (matchPredictor) {
+            statsItems.push(matchPredictor);
+        }
+        const careerMatchup = this.parseCareerMatchup(data);
+        if (careerMatchup) {
+            statsItems.push(careerMatchup);
+        }
+        const playerSeasonStats = this.parsePlayerSeasonStats(data);
+        if (playerSeasonStats) {
+            statsItems.push(playerSeasonStats);
+        }
+        const scoringSummary = this.parseScoringSummary(data);
+        if (scoringSummary) {
+            statsItems.push(scoringSummary);
+        }
+        const winProbability = this.parseWinProbability(data);
+        if (winProbability) {
+            statsItems.push(winProbability);
+        }
+        // Team Stats (prefer season stats when available; fallback to game stats)
+        const teamStats = this.parseTeamSeasonStatistics(data) || this.parseTeamsStatistics(data);
+        if (teamStats) {
+            statsItems.push(teamStats);
+        }
+        const driveSummary = this.parseDriveSummary(data);
+        if (driveSummary.length > 0) {
+            statsItems.push(...driveSummary);
+        }
+        const penalties = this.parsePenalties(data);
+        if (penalties) {
+            statsItems.push(penalties);
+        }
+        const activeAthletes = this.parseActiveAthletes(data);
+        if (activeAthletes) {
+            statsItems.push(activeAthletes);
+        }
+        const gameLeaders = this.parseGameLeaders(data);
+        if (gameLeaders) {
+            statsItems.push(gameLeaders);
+        }
+        const recentGames = this.parseRecentGames(data);
+        if (recentGames) {
+            statsItems.push(recentGames);
+        }
+        const promotion = this.parsePromotion(data);
+        if (promotion) {
+            statsItems.push(promotion);
+        }
+        // Update the stats items observable
+        this.statsItems.value = statsItems;
+        this.currentGameState.value = data.gameState;
+    }
+    parseDriveSummary(data) {
+        const teams = data.entities?.teams;
+        const drives = data.drives;
+        if (!teams || !drives || drives.length === 0) {
+            return [];
+        }
+        const result = [];
+        for (const drive of drives) {
+            if (!drive?.team?.$key) {
+                continue;
+            }
+            const plays = [...(drive.plays || [])].reverse();
+            const lastPlay = plays[plays.length - 1] || null;
+            let lastPlayMarquee = '';
+            if (lastPlay) {
+                lastPlayMarquee = formatLastPlayMarquee(lastPlay);
+            }
+            const { plays: playsQuantity, time, yards } = parseDriveDescription(drive.description || '');
+            const team = teams[drive.team.$key];
+            if (!team) {
+                continue;
+            }
+            result.push({
+                id: drive.id,
+                lastPlayMarquee,
+                plays,
+                playsQuantity,
+                team,
+                time,
+                type: 'driveSummary',
+                yards,
+            });
+        }
+        return result;
+    }
+    parseTeamsStatistics(data) {
+        const teams = data.entities?.teams;
+        if (!teams) {
+            return null;
+        }
+        const awayTeam = Object.values(teams).find((team) => team.homeAway === 'away');
+        const homeTeam = Object.values(teams).find((team) => team.homeAway === 'home');
+        if (!awayTeam || !homeTeam) {
+            return null;
+        }
+        // Ensure both teams have statistics
+        if (!awayTeam.statistics || !homeTeam.statistics) {
+            return null;
+        }
+        const statistics = [];
+        for (let i = 0; i < awayTeam.statistics.length; i++) {
+            const awayStat = awayTeam.statistics[i];
+            const homeStat = homeTeam.statistics[i];
+            if (isTeamStatistic(awayStat) && isTeamStatistic(homeStat)) {
+                statistics.push({
+                    awayTeamDisplayValue: awayStat?.displayValue || '0',
+                    displayName: awayStat.displayName || '',
+                    homeTeamDisplayValue: homeStat?.displayValue || '0',
+                    awayTeamValue: awayStat?.value || 0,
+                    homeTeamValue: homeStat?.value || 0,
+                });
+            }
+        }
+        if (!statistics.length) {
+            return null;
+        }
+        return {
+            type: 'teamStats',
+            title: 'Team Stats',
+            awayTeam: {
+                logo: awayTeam.logo,
+                displayName: awayTeam.displayName || '',
+                color: awayTeam.color || '',
+                abbreviation: awayTeam.abbreviation || '',
+            },
+            homeTeam: {
+                logo: homeTeam.logo,
+                displayName: homeTeam.displayName || '',
+                color: homeTeam.color || '',
+                abbreviation: homeTeam.abbreviation || '',
+            },
+            statistics,
+        };
+    }
+    parseTeamSeasonStatistics(data) {
+        const teams = data.entities?.teams || {};
+        if (!Object.keys(teams).length ||
+            !data.statTeams ||
+            !data.statTeams.title ||
+            !data.statTeams.sections?.length ||
+            !data.statTeams.teams?.length) {
+            return null;
+        }
+        const awayTeamKey = data.statTeams.teams[0]?.$key;
+        const homeTeamKey = data.statTeams.teams[1]?.$key;
+        if (!awayTeamKey || !homeTeamKey) {
+            return null;
+        }
+        const awayTeam = teams[awayTeamKey];
+        const homeTeam = teams[homeTeamKey];
+        if (!homeTeam || !awayTeam) {
+            return null;
+        }
+        const tabbedStatistics = {};
+        data.statTeams.sections.forEach((section) => {
+            if (!!section.$key && !!section.title) {
+                const sectionKeyStatistics = [];
+                if (isTabbedStatisticsArray(homeTeam.statistics) &&
+                    isTabbedStatisticsArray(awayTeam.statistics)) {
+                    const homeSectionStats = homeTeam.statistics.find((st) => st.$key === section.$key);
+                    const awaySectionStats = awayTeam.statistics.find((st) => st.$key === section.$key);
+                    if (homeSectionStats &&
+                        awaySectionStats &&
+                        awaySectionStats.stats?.length &&
+                        homeSectionStats.stats?.length) {
+                        for (let i = 0; i < awaySectionStats.stats.length; i++) {
+                            const awayStat = awaySectionStats.stats[i];
+                            const homeStat = homeSectionStats.stats[i];
+                            sectionKeyStatistics.push({
+                                awayTeamDisplayValue: awayStat?.displayValue || '0',
+                                displayName: awayStat.displayName || '',
+                                homeTeamDisplayValue: homeStat?.displayValue || '0',
+                                awayTeamValue: awayStat?.displayValue
+                                    ? Number(awayStat.displayValue)
+                                    : 0,
+                                homeTeamValue: homeStat?.displayValue
+                                    ? Number(homeStat.displayValue)
+                                    : 0,
+                            });
+                        }
+                        tabbedStatistics[section.$key] = {
+                            title: section.title,
+                            entries: sectionKeyStatistics,
+                        };
+                    }
+                }
+            }
+        });
+        return {
+            type: 'teamStats',
+            title: data.statTeams.title,
+            awayTeam: {
+                abbreviation: awayTeam.abbreviation,
+                displayName: awayTeam.displayName || '',
+                color: awayTeam.color || '',
+                logo: awayTeam.logo,
+            },
+            homeTeam: {
+                abbreviation: homeTeam.abbreviation,
+                displayName: homeTeam.displayName || '',
+                color: homeTeam.color || '',
+                logo: homeTeam.logo,
+            },
+            tabbedStatistics,
+        };
+    }
+    parseMatchPredictor(data) {
+        const teams = data.entities?.teams;
+        const predictor = data.predictor;
+        if (!teams || !predictor || !predictor.homeTeam || !predictor.awayTeam) {
+            return null;
+        }
+        // Get team data
+        const homeTeam = teams[predictor.homeTeam.team.$key];
+        const awayTeam = teams[predictor.awayTeam.team.$key];
+        if (!homeTeam || !awayTeam) {
+            return null;
+        }
+        // Parse percentages
+        const homePercentage = parseFloat(predictor.homeTeam.gameProjection);
+        const awayPercentage = parseFloat(predictor.awayTeam.gameProjection);
+        return {
+            type: 'matchPredictor',
+            header: predictor.header,
+            imageUrl: predictor.imageUrl,
+            awayTeam: {
+                percentage: awayPercentage,
+                abbreviation: awayTeam.abbreviation,
+                logo: awayTeam.logo,
+                displayName: awayTeam.displayName || '',
+            },
+            homeTeam: {
+                percentage: homePercentage,
+                abbreviation: homeTeam.abbreviation,
+                logo: homeTeam.logo,
+                displayName: homeTeam.displayName || '',
+            },
+        };
+    }
+    parsePromotion(response) {
+        const promotion = response.promotion;
+        if (!promotion) {
+            return null;
+        }
+        return {
+            type: 'promotion',
+            title: promotion.title || '',
+            description: promotion.description || '',
+            logo: promotion.logo || '',
+            qrCode: promotion.qrCode || '',
+            backgroundImage: promotion.backgroundImage || '',
+        };
+    }
+    parseCareerMatchup(response) {
+        const careerMatchup = response.careerMatchup;
+        const athletes = response.entities?.athletes;
+        if (!careerMatchup || !careerMatchup.sections) {
+            return null;
+        }
+        const toText = (value) => {
+            if (typeof value === 'string')
+                return value;
+            if (value && typeof value === 'object') {
+                const maybeDisplayName = value
+                    .displayName;
+                if (typeof maybeDisplayName === 'string')
+                    return maybeDisplayName;
+            }
+            return '';
+        };
+        const sections = careerMatchup.sections
+            .filter((section) => !!section)
+            .map((section) => {
+            const items = (section.items || [])
+                .filter((item) => !!item)
+                .map((item) => {
+                const athleteKey = item.athlete?.$key;
+                const athlete = athletes && athleteKey ? athletes[athleteKey] : undefined;
+                // Determine if this item should be highlighted (e.g. warning color)
+                // This abstraction allows the View to be sport-agnostic.
+                // Currently only "On Deck" in MLB triggers this.
+                const statusText = toText(item.status);
+                const isHighlighted = statusText === 'On Deck';
+                return {
+                    status: statusText,
+                    type: toText(item.type) || '',
+                    displayName: toText(item.displayName) || '',
+                    athlete,
+                    isHighlighted,
+                };
+            });
+            const statistics = (section.statistics || [])
+                .filter((stat) => !!stat)
+                .map((stat) => ({
+                abbreviation: stat.abbreviation || '',
+                displayValue: stat.displayValue || '',
+            }));
+            return {
+                items,
+                statistics,
+            };
+        });
+        return {
+            type: 'careerMatchup',
+            title: careerMatchup.title || '',
+            sections,
+        };
+    }
+    parseHeaderTeams(response) {
+        return (this.parseHeaderTeamsFromTeamHeader(response) ||
+            this.parseHeaderTeamsFromHeader(response));
+    }
+    parseHeaderTeamsFromHeader(response) {
+        const headerTeams = response.header?.teams ||
+            [];
+        if (headerTeams.length === 0) {
+            return null;
+        }
+        return this.buildHeaderTeamsItem({
+            response,
+            headerTeams,
+            linescoresHeader: response.header?.linescoresHeader || [],
+            linescoresRowHeader: undefined,
+            isLiveFromHeaderSource: false,
+        });
+    }
+    parseHeaderTeamsFromTeamHeader(response) {
+        const headerTeams = response.header?.teams ||
+            [];
+        const teamHeaderTeams = response.teamHeader?.teams || [];
+        if (teamHeaderTeams.length === 0) {
+            return null;
+        }
+        const teamHeaderHasLinescores = teamHeaderTeams.some((t) => Array.isArray(t.linescores) && t.linescores.length > 0);
+        const teamHeaderHasLinescoresHeader = (response.teamHeader?.linescoresHeader?.length || 0) > 0;
+        if (!teamHeaderHasLinescores &&
+            !teamHeaderHasLinescoresHeader &&
+            headerTeams.length > 0) {
+            return null;
+        }
+        const linescoresRowHeader = response.teamHeader?.style?.linescores?.rowHeader === 'teamLogo'
+            ? 'teamLogo'
+            : undefined;
+        return this.buildHeaderTeamsItem({
+            response,
+            headerTeams: teamHeaderTeams,
+            linescoresHeader: response.teamHeader?.linescoresHeader || [],
+            linescoresRowHeader,
+            isLiveFromHeaderSource: teamHeaderHasLinescores || teamHeaderHasLinescoresHeader,
+        });
+    }
+    buildHeaderTeamsItem(params) {
+        const { response, headerTeams, linescoresHeader: rawLinescoresHeader, linescoresRowHeader, isLiveFromHeaderSource, } = params;
+        const teams = response.entities?.teams;
+        if (!teams || headerTeams.length === 0) {
+            return null;
+        }
+        const homeTeamHeader = headerTeams.find((t) => {
+            const team = teams[t.$key];
+            return team && team.homeAway === 'home';
+        });
+        const awayTeamHeader = headerTeams.find((t) => {
+            const team = teams[t.$key];
+            return team && team.homeAway === 'away';
+        });
+        // If home/away isn't provided, fall back to list order.
+        const fallbackAwayTeamHeader = headerTeams[0];
+        const fallbackHomeTeamHeader = headerTeams[1];
+        const resolvedHomeTeamHeader = homeTeamHeader || fallbackHomeTeamHeader;
+        const resolvedAwayTeamHeader = awayTeamHeader || fallbackAwayTeamHeader;
+        if (!resolvedHomeTeamHeader || !resolvedAwayTeamHeader) {
+            return null;
+        }
+        const homeTeam = teams[resolvedHomeTeamHeader.$key];
+        const awayTeam = teams[resolvedAwayTeamHeader.$key];
+        if (!homeTeam || !awayTeam) {
+            return null;
+        }
+        const statistics = [];
+        const statisticsSet = new Set();
+        const rawAwayStats = awayTeam.statistics || [];
+        const rawHomeStats = homeTeam.statistics || [];
+        const awayStatistics = rawAwayStats.filter(isTeamStatistic);
+        const homeStatistics = rawHomeStats.filter(isTeamStatistic);
+        [...awayStatistics, ...homeStatistics].forEach((st) => {
+            statisticsSet.add(st.$key);
+        });
+        // Ensure all statistics from both teams are included
+        statisticsSet.forEach((statKey) => {
+            const awayStat = awayStatistics.find((st) => st.$key === statKey);
+            const homeStat = homeStatistics.find((st) => st.$key === statKey);
+            if (!awayStat || !homeStat) {
+                return;
+            }
+            statistics.push({
+                displayName: awayStat?.displayName || homeStat?.displayName || '',
+                awayTeamValue: awayStat?.value || 0,
+                homeTeamValue: homeStat?.value || 0,
+                awayTeamDisplayValue: awayStat?.displayValue || '0',
+                homeTeamDisplayValue: homeStat?.displayValue || '0',
+            });
+        });
+        const buildLinescores = (t) => {
+            if (t.linescores && t.linescores.length > 0) {
+                return t.linescores.map((l) => l.displayValue);
+            }
+            if (typeof t.score === 'string' && t.score.length > 0) {
+                return [t.score];
+            }
+            return [];
+        };
+        const maybeDetails = (t) => {
+            if (Array.isArray(t.details) && t.details.filter(Boolean).length > 0) {
+                return t.details.filter(Boolean);
+            }
+            return undefined;
+        };
+        const awayDetails = maybeDetails(resolvedAwayTeamHeader);
+        const homeDetails = maybeDetails(resolvedHomeTeamHeader);
+        let linescoresHeader = rawLinescoresHeader;
+        let awayTeamLinescores = buildLinescores(resolvedAwayTeamHeader);
+        let homeTeamLinescores = buildLinescores(resolvedHomeTeamHeader);
+        // If more than 9 innings are present, show only the last 9 innings plus R, H, E
+        const hasLinescoresAndHeader = linescoresHeader.length > 0 &&
+            (awayTeamLinescores.length > 0 || homeTeamLinescores.length > 0);
+        if (hasLinescoresAndHeader && linescoresRowHeader === 'teamLogo') {
+            const lastThreeHeaders = linescoresHeader.slice(-3);
+            const isMlbFormat = lastThreeHeaders.includes('R') ||
+                lastThreeHeaders.includes('H') ||
+                lastThreeHeaders.includes('E');
+            if (isMlbFormat && linescoresHeader.length > 12) {
+                // More than 9 innings + 3 stats (R, H, E)
+                const statsCount = 3; // R, H, E
+                const inningsCount = linescoresHeader.length - statsCount;
+                const maxInningsToShow = 9;
+                if (inningsCount > maxInningsToShow) {
+                    const inningsToRemove = inningsCount - maxInningsToShow;
+                    // Slice header to keep last 9 innings + stats (R, H, E)
+                    linescoresHeader = linescoresHeader.slice(inningsToRemove);
+                    // Apply same slicing to team linescores
+                    awayTeamLinescores = awayTeamLinescores.slice(inningsToRemove);
+                    homeTeamLinescores = homeTeamLinescores.slice(inningsToRemove);
+                }
+            }
+        }
+        const isLive = response.gameState === 'in' ||
+            response.gameState === 'post' ||
+            isLiveFromHeaderSource;
+        return {
+            type: 'headerTeam',
+            linescoresHeader,
+            linescoresRowHeader,
+            isLive,
+            statistics,
+            awayTeam: {
+                abbreviation: awayTeam.abbreviation,
+                color: awayTeam.color,
+                id: awayTeam.id,
+                linescores: awayTeamLinescores,
+                logo: awayTeam.logo,
+                name: awayTeam.name,
+                record: awayTeam.record,
+                ...(awayDetails ? { details: awayDetails } : {}),
+            },
+            homeTeam: {
+                abbreviation: homeTeam.abbreviation,
+                color: homeTeam.color,
+                id: homeTeam.id,
+                linescores: homeTeamLinescores,
+                logo: homeTeam.logo,
+                name: homeTeam.name,
+                record: homeTeam.record,
+                ...(homeDetails ? { details: homeDetails } : {}),
+            },
+        };
+    }
+    parseRecentGames(response) {
+        const teams = response.entities?.teams;
+        const previousGames = response.previousGames;
+        if (!teams || !previousGames || previousGames.length === 0) {
+            return null;
+        }
+        const awayTeamPreviousGame = previousGames.find((game) => game?.displayOrder === 1);
+        const homeTeamPreviousGame = previousGames.find((game) => game?.displayOrder === 2);
+        if (!awayTeamPreviousGame || !homeTeamPreviousGame) {
+            return null;
+        }
+        if (!awayTeamPreviousGame.events || !homeTeamPreviousGame.events) {
+            return null;
+        }
+        if (!awayTeamPreviousGame.team?.$key || !homeTeamPreviousGame.team?.$key) {
+            return null;
+        }
+        const awayTeam = teams[awayTeamPreviousGame.team.$key];
+        const homeTeam = teams[homeTeamPreviousGame.team.$key];
+        if (!awayTeam || !homeTeam) {
+            return null;
+        }
+        const previousGame = {
+            type: 'recentGames',
+            awayTeam: {
+                events: [...awayTeamPreviousGame.events]
+                    .reverse()
+                    .filter((event) => event?.team?.$key)
+                    .map((event) => {
+                    const eventTeam = teams[event.team.$key];
+                    return {
+                        gameResult: event.gameResult,
+                        homeAway: event.team.homeAway,
+                        score: event.score,
+                        teamLogo: eventTeam?.logo,
+                    };
+                }),
+                logo: awayTeam.logo,
+                name: awayTeam.shortDisplayName,
+            },
+            homeTeam: {
+                events: [...homeTeamPreviousGame.events]
+                    .reverse()
+                    .filter((event) => event?.team?.$key)
+                    .map((event) => {
+                    const eventTeam = teams[event.team.$key];
+                    return {
+                        gameResult: event.gameResult,
+                        homeAway: event.team.homeAway,
+                        score: event.score,
+                        teamLogo: eventTeam?.logo,
+                    };
+                }),
+                logo: homeTeam.logo,
+                name: homeTeam.shortDisplayName,
+            },
+        };
+        return previousGame;
+    }
+    parseWinProbability(response) {
+        const winProbability = response.winProbability;
+        if (!winProbability ||
+            !winProbability.homeTeam ||
+            !winProbability.awayTeam) {
+            return null;
+        }
+        const teams = response.entities?.teams;
+        if (!teams) {
+            return null;
+        }
+        const homeTeam = teams[winProbability.homeTeam.team.$key];
+        const awayTeam = teams[winProbability.awayTeam.team.$key];
+        if (!homeTeam || !awayTeam) {
+            return null;
+        }
+        return {
+            type: 'winProbability',
+            chartImageUrl: winProbability.imageUrl,
+            awayTeam: {
+                id: awayTeam.id,
+                abbreviation: awayTeam.abbreviation,
+                logo: awayTeam.logo,
+                winPercentage: winProbability.awayTeam.winPercentage,
+            },
+            homeTeam: {
+                id: homeTeam.id,
+                abbreviation: homeTeam.abbreviation,
+                logo: homeTeam.logo,
+                winPercentage: winProbability.homeTeam.winPercentage,
+            },
+        };
+    }
+    parseGameLeaders(response) {
+        if (!response.entities?.athletes || !response.entities?.teams) {
+            return null;
+        }
+        const leaders = response.leaders;
+        const isPre = response.gameState === 'pre';
+        if (!leaders || leaders.length === 0) {
+            return null;
+        }
+        const items = [];
+        for (const leader of leaders) {
+            if (!leader.away || !leader.home) {
+                continue;
+            }
+            if (!leader.away?.athlete?.$key || !leader.home?.athlete?.$key) {
+                continue;
+            }
+            const awayAthlete = response.entities.athletes[leader.away.athlete.$key];
+            const homeAthlete = response.entities.athletes[leader.home.athlete.$key];
+            if (!awayAthlete || !homeAthlete) {
+                continue;
+            }
+            const awayAthleteStatistics = leader.away.athlete.statistics || [];
+            const homeAthleteStatistics = leader.home.athlete.statistics || [];
+            const value = {
+                displayName: leader.displayName,
+                awayAthlete: {
+                    id: awayAthlete.id,
+                    displayName: awayAthlete.displayName,
+                    headshot: awayAthlete.headshot
+                        ? setImageDimensions(awayAthlete.headshot, 256, 144)
+                        : '',
+                    position: awayAthlete.position?.abbreviation || '-',
+                    shortName: awayAthlete.shortName,
+                    jersey: awayAthlete.jersey,
+                    statistics: awayAthleteStatistics,
+                },
+                homeAthlete: {
+                    id: homeAthlete.id,
+                    displayName: homeAthlete.displayName,
+                    headshot: homeAthlete.headshot
+                        ? setImageDimensions(homeAthlete.headshot, 256, 144)
+                        : '',
+                    position: homeAthlete.position?.abbreviation || '-',
+                    shortName: homeAthlete.shortName,
+                    jersey: homeAthlete.jersey,
+                    statistics: homeAthleteStatistics,
+                },
+            };
+            items.push(value);
+        }
+        if (!items.length) {
+            return null;
+        }
+        return {
+            type: 'gameLeaders',
+            items,
+            displayText: isPre ? 'Season Leaders' : 'Game Leaders',
+        };
+    }
+    parseActiveAthletes(response) {
+        const activeAthletes = response.activeAthletes;
+        const { awayTeam, homeTeam } = this.getActiveAthletesTeamInfo(response);
+        const athletes = [];
+        if (!response.entities?.athletes ||
+            !activeAthletes ||
+            awayTeam.index === -1 ||
+            homeTeam.index === -1) {
+            return null;
+        }
+        for (let i = 0; i < activeAthletes.teams[awayTeam.index].athletes.length; i++) {
+            const awayAthlete = activeAthletes.teams[awayTeam.index].athletes[i];
+            const homeAthlete = activeAthletes.teams[homeTeam.index].athletes[i];
+            if (!awayAthlete?.$key || !homeAthlete?.$key) {
+                continue;
+            }
+            const awayAthleteInfo = response.entities.athletes[awayAthlete.$key];
+            const homeAthleteInfo = response.entities.athletes[homeAthlete.$key];
+            if (!awayAthleteInfo || !homeAthleteInfo) {
+                continue;
+            }
+            const awayAthleteStatistics = [];
+            const homeAthleteStatistics = [];
+            const awayStatLine = awayAthlete.statLine || '';
+            const homeStatLine = homeAthlete.statLine || '';
+            awayStatLine
+                .trim()
+                .split(',')
+                .forEach((st, index) => {
+                const [awayDisplayValue, awayAbbreviation] = st.trim().split(' ');
+                const homeStats = homeStatLine.trim().split(',')[index];
+                if (!homeStats) {
+                    return;
+                }
+                const [homeDisplayValue, homeAbbreviation] = homeStats
+                    .trim()
+                    .split(' ');
+                awayAthleteStatistics.push({
+                    displayValue: awayDisplayValue || '0',
+                    abbreviation: awayAbbreviation || '-',
+                    value: parseFloat(awayDisplayValue) || 0,
+                });
+                homeAthleteStatistics.push({
+                    displayValue: homeDisplayValue || '0',
+                    abbreviation: homeAbbreviation || '-',
+                    value: parseFloat(homeDisplayValue) || 0,
+                });
+            });
+            athletes.push({
+                awayAthlete: {
+                    id: awayAthleteInfo.id,
+                    displayName: awayAthleteInfo.displayName,
+                    headshot: awayAthleteInfo.headshot
+                        ? setImageDimensions(awayAthleteInfo.headshot, 256, 144)
+                        : '',
+                    position: awayAthleteInfo.position?.abbreviation || '-',
+                    shortName: awayAthleteInfo.shortName,
+                    jersey: awayAthleteInfo.jersey,
+                    statistics: awayAthleteStatistics,
+                    minifiedStatistics: awayAthlete.statLine,
+                },
+                homeAthlete: {
+                    id: homeAthleteInfo.id,
+                    displayName: homeAthleteInfo.displayName,
+                    headshot: homeAthleteInfo.headshot
+                        ? setImageDimensions(homeAthleteInfo.headshot, 256, 144)
+                        : '',
+                    position: homeAthleteInfo.position?.abbreviation || '-',
+                    shortName: homeAthleteInfo.shortName,
+                    jersey: homeAthleteInfo.jersey,
+                    statistics: homeAthleteStatistics,
+                    minifiedStatistics: homeAthlete.statLine,
+                },
+            });
+        }
+        if (!athletes.length) {
+            return null;
+        }
+        return {
+            type: 'activeAthletes',
+            awayTeam,
+            homeTeam,
+            athletes,
+            displayText: activeAthletes.displayText,
+        };
+    }
+    getActiveAthletesTeamInfo(data) {
+        const teams = data.activeAthletes?.teams || [];
+        let awayTeam = {
+            index: -1,
+            id: '',
+            logo: '',
+            name: '-',
+        };
+        let homeTeam = {
+            index: -1,
+            id: '',
+            logo: '',
+            name: '-',
+        };
+        const entitiesTeams = data.entities?.teams;
+        if (!entitiesTeams) {
+            return { awayTeam, homeTeam };
+        }
+        for (let i = 0; i < teams.length; i++) {
+            const teamInfo = teams[i];
+            const team = entitiesTeams[teamInfo.team.$key];
+            if (!team) {
+                continue;
+            }
+            if (team.homeAway === 'away') {
+                awayTeam = {
+                    index: i,
+                    id: team.id,
+                    logo: team.logo,
+                    name: team.name || '-',
+                };
+            }
+            else if (team.homeAway === 'home') {
+                homeTeam = {
+                    index: i,
+                    id: team.id,
+                    logo: team.logo,
+                    name: team.name || '-',
+                };
+            }
+        }
+        return { awayTeam, homeTeam };
+    }
+    parseScoringSummary(data) {
+        const scoringSummary = data.scoringSummary;
+        if (!scoringSummary || !scoringSummary.sections) {
+            return null;
+        }
+        const teams = data.entities?.teams;
+        const athletes = data.entities?.athletes;
+        // Handle MLB Scoring Summary
+        if (isMlbScoringSummary(scoringSummary)) {
+            const sections = [];
+            for (const section of scoringSummary.sections) {
+                if (!section.title || !section.items?.length) {
+                    continue;
+                }
+                const items = [];
+                for (const item of section.items) {
+                    if (!item?.team?.$key || !item?.athlete?.$key) {
+                        continue;
+                    }
+                    const team = teams?.[item.team.$key];
+                    const athlete = athletes?.[item.athlete.$key];
+                    const athleteNumber = `#${athlete?.jersey || ''}`;
+                    const athleteName = athlete?.shortName || '';
+                    if (!team || !athlete) {
+                        continue;
+                    }
+                    const textParts = [];
+                    if (athleteNumber) {
+                        textParts.push({
+                            featured: false,
+                            title: athleteNumber,
+                        });
+                    }
+                    if (athleteName) {
+                        textParts.push({
+                            featured: true,
+                            title: athleteName,
+                        });
+                    }
+                    items.push({
+                        teamLogo: team?.logo || '',
+                        teamName: team?.abbreviation,
+                        headshot: athlete?.headshot
+                            ? setImageDimensions(athlete.headshot, 200, 144)
+                            : undefined,
+                        athleteShortName: athlete?.shortName || '',
+                        athleteJersey: athlete?.jersey || '',
+                        athletePosition: athlete?.position?.abbreviation || '',
+                        text: item?.text || '',
+                        shortText: textParts,
+                        header: (item?.header || []).map((h, index) => ({
+                            featured: h.featured ?? false,
+                            title: `${h.title ?? ''}${index === 0 ? ',' : ''}`,
+                        })),
+                    });
+                }
+                if (items.length > 0) {
+                    sections.push({
+                        title: section.title,
+                        items,
+                    });
+                }
+            }
+            if (sections.length === 0) {
+                return null;
+            }
+            return {
+                type: 'scoringSummary',
+                tag: 'mlb',
+                title: scoringSummary.title || 'Scoring Summary',
+                sections,
+            };
+        }
+        // Handle Hockey Scoring Summary - transform to unified format
+        else if (isHockeyScoringSummary(scoringSummary)) {
+            const hockeySummary = scoringSummary;
+            const sections = [];
+            for (const section of hockeySummary.sections || []) {
+                const items = [];
+                for (const item of section.items || []) {
+                    if (!item?.team?.$key || !item?.athlete?.$key || !item?.title) {
+                        continue;
+                    }
+                    const team = item.team && item.team.$key ? teams?.[item.team.$key] : undefined;
+                    const atheleteKey = item.athlete?.$key || '';
+                    const athlete = athletes?.[atheleteKey];
+                    const itemTitle = item.title || '';
+                    const [athleteNumber, ...athleteNameWithAssists] = itemTitle.split(' ');
+                    let athleteAssists = '';
+                    let athleteName = '';
+                    if (athleteNameWithAssists.length > 0) {
+                        athleteAssists =
+                            athleteNameWithAssists[athleteNameWithAssists.length - 1];
+                        athleteName = athleteNameWithAssists.slice(0, -1).join(' ');
+                    }
+                    const header = [];
+                    if (item.clock) {
+                        header.push({ featured: true, title: item.clock });
+                    }
+                    if (team?.abbreviation) {
+                        header.push({ featured: false, title: team.abbreviation });
+                    }
+                    const textParts = [];
+                    if (athleteNumber) {
+                        textParts.push({ featured: false, title: athleteNumber });
+                    }
+                    if (athleteName) {
+                        textParts.push({ featured: true, title: athleteName });
+                    }
+                    if (athleteAssists) {
+                        textParts.push({ featured: false, title: athleteAssists });
+                    }
+                    items.push({
+                        teamLogo: team?.logo || '',
+                        teamName: team?.abbreviation || '',
+                        header,
+                        text: item?.description || '',
+                        shortText: textParts,
+                        headshot: athlete?.headshot
+                            ? setImageDimensions(athlete.headshot, 200, 144)
+                            : undefined,
+                        athleteShortName: athleteName,
+                        athletePosition: athlete?.position?.abbreviation || '',
+                        athleteJersey: athleteNumber,
+                    });
+                }
+                if (items.length > 0) {
+                    sections.push({
+                        title: section?.title || '',
+                        items,
+                    });
+                }
+            }
+            if (sections.length === 0) {
+                return null;
+            }
+            return {
+                type: 'scoringSummary',
+                tag: 'hockey',
+                title: hockeySummary.title || 'Scoring Summary',
+                sections,
+            };
+        }
+        return null;
+    }
+    parsePenalties(data) {
+        const penalties = data.penaltySummary;
+        if (!penalties || !penalties.sections) {
+            return null;
+        }
+        const teams = data.entities?.teams;
+        const athletes = data.entities?.athletes;
+        const sections = penalties.sections.map((section) => {
+            const items = section.items
+                .filter((item) => item?.team?.$key && item?.athlete?.$key)
+                .map((item) => {
+                const team = teams?.[item.team.$key];
+                const athlete = athletes?.[item.athlete.$key];
+                const [athleteNumber, ...athleteName] = item.title.split(' ');
+                const athleteDisplayName = (athleteName ?? []).join(' ') || '';
+                const textParts = [];
+                if (athleteNumber) {
+                    textParts.push({
+                        featured: false,
+                        title: athleteNumber,
+                    });
+                }
+                if (athleteDisplayName) {
+                    textParts.push({
+                        featured: true,
+                        title: athleteDisplayName,
+                    });
+                }
+                return {
+                    teamLogo: team?.logo || '',
+                    teamName: team?.abbreviation || '',
+                    header: [{ title: item.clock || '', featured: false }],
+                    text: item.description || '',
+                    shortText: textParts,
+                    headshot: athlete?.headshot
+                        ? setImageDimensions(athlete.headshot, 200, 144)
+                        : undefined,
+                    athleteShortName: athleteName.join(' '),
+                    athletePosition: athlete?.position?.abbreviation || '',
+                    athleteJersey: athleteNumber || '',
+                };
+            });
+            return {
+                title: section.title,
+                items,
+            };
+        });
+        if (!sections.length || sections.every((s) => s.items.length === 0)) {
+            return null;
+        }
+        return {
+            type: 'penalties',
+            tag: 'penalties',
+            title: penalties.title,
+            sections,
+        };
+    }
+    parsePlayerSeasonStats(data) {
+        const playerStats = data.playerStats;
+        const teams = data.entities?.teams;
+        const athletes = data.entities?.athletes;
+        if (!playerStats?.teams?.length || !teams) {
+            return null;
+        }
+        const parsedTeams = [];
+        for (const playerStatsTeam of playerStats.teams) {
+            if (!playerStatsTeam.$key) {
+                continue;
+            }
+            const team = teams[playerStatsTeam.$key];
+            if (!team) {
+                continue;
+            }
+            const sections = [];
+            for (const section of playerStatsTeam.sections || []) {
+                if (!section.title || !section.items?.length) {
+                    continue;
+                }
+                const items = [];
+                for (const item of section.items) {
+                    if (!item.title) {
+                        continue;
+                    }
+                    const athleteKey = item.athlete?.$key;
+                    const athlete = athleteKey
+                        ? athletes?.[athleteKey]
+                        : undefined;
+                    const statistics = item.athlete?.statistics || [];
+                    const featuredStat = statistics.find((s) => s.featured);
+                    items.push({
+                        title: item.title,
+                        headshot: athlete?.headshot
+                            ? setImageDimensions(athlete.headshot, 256, 144)
+                            : '',
+                        position: athlete?.position?.abbreviation || '',
+                        jersey: athlete?.jersey || '',
+                        featuredStat: featuredStat
+                            ? {
+                                displayValue: featuredStat.displayValue || '',
+                                label: featuredStat.label || '',
+                            }
+                            : null,
+                        statistics: statistics
+                            .filter((s) => !s.featured)
+                            .map((s) => ({
+                            displayValue: s.displayValue || '',
+                            label: s.label || '',
+                        })),
+                        playerStatus: item?.status
+                            ? {
+                                displayName: item.status.displayName ?? '',
+                                type: item.status.type ?? '',
+                            }
+                            : null,
+                    });
+                }
+                if (items.length > 0) {
+                    sections.push({
+                        title: section.title,
+                        items,
+                    });
+                }
+            }
+            if (sections.length > 0) {
+                parsedTeams.push({
+                    teamKey: playerStatsTeam.$key,
+                    shortDisplayName: team.shortDisplayName || team.displayName || '',
+                    color: team.color || '',
+                    sections,
+                });
+            }
+        }
+        if (parsedTeams.length === 0) {
+            return null;
+        }
+        return {
+            type: 'playerSeasonStats',
+            teams: parsedTeams,
+        };
+    }
+}
+export default StatsViewModel;