Upgrade to react-player v3.3.3

[masenf]

This is a breaking change as many props and event handlers have changed name and signature. Some care has been taken to maintain a compatible API for Reflex users of rx.video.

The previous react-player wasn't playing recent youtube videos anymore.

[greptile-apps]

Greptile Overview

Summary

Upgrades react-player from v2.16.0 to v3.3.3, introducing breaking changes to props and event handlers while maintaining backward compatibility through deprecated prop mapping.

Key changes:

• Updated library version from react-player@2.16.0 to react-player@3.3.3
• Renamed core prop url to src with support for string, array of strings, or array of objects
• Added new config prop for player-specific configuration parameters
• Refactored event handlers with new names: on_duration → on_duration_change, on_seek → on_seeked, on_buffer → on_waiting, etc.
• Implemented sophisticated event signature functions to extract data from the new react-player v3 event structure
• Added deprecation warnings and automatic prop mapping to maintain backward compatibility for existing Reflex users
• Enhanced Progress TypedDict with duration field

Confidence Score: 4/5

• This PR is safe to merge with low risk due to good backward compatibility handling
• Score reflects thorough handling of breaking changes with deprecation warnings and automatic prop mapping. The only issue is a minor typo that doesn't affect functionality.
• Pay attention to react_player.py for the typo fix on line 190

Important Files Changed

File Analysis

Filename	Score	Overview
reflex/components/react_player/react_player.py	4/5	Major upgrade to react-player v3.3.3 with breaking changes handled via deprecation mapping and warning system - one minor typo found

Sequence Diagram

sequenceDiagram
    participant User as Reflex User
    participant RP as ReactPlayer Component
    participant Dep as Deprecation Handler
    participant RPLib as react-player@3.3.3
    participant Event as Event Handler

    User->>RP: Create component with props (url, on_duration, etc.)
    RP->>Dep: Check for deprecated props
    
    alt Deprecated prop found
        Dep-->>User: console.warn("prop deprecated")
        Dep->>RP: Map old prop to new prop (url->src, on_duration->on_duration_change)
    end
    
    RP->>RPLib: Initialize with updated props
    RPLib->>Event: Trigger media events (on_progress, on_time_update)
    Event->>RP: Extract event data via signature functions
    RP->>Event: Format data (Progress, float values)
    Event-->>User: Deliver formatted event data

Loading

_{2 files reviewed, 1 comment}

_{Edit Code Review Bot Settings | Greptile}

[codspeed-hq]

CodSpeed Performance Report

Merging #5818 will not alter performance

_{Comparing masenf/react-player-3 (6a1f83a) with main (a21414d)}

Summary

✅ 8 untouched

[adhami3310]

greptile caught a type 🤭

[adhami3310]

react player no longer requires NoSSRComponent as far as i can see