feat: add useError hook and use it in UiContainer#117
Conversation
Add a reusable useError hook that exposes the current player error, updating automatically on PlayerEventType.ERROR events and clearing when a new source is loaded (SOURCE_CHANGE or LOAD_START). This makes error state accessible to custom UI components, similar to existing hooks like usePaused, useEnded, etc. Co-Authored-By: tom.vanlaerhoven <tom.vanlaerhoven@dolby.com>
🤖 Devin AI EngineerI'll be helping with this pull request! Here's what you should know: ✅ I will automatically:
Note: I can only respond to comments from users who have write access to this repository. ⚙️ Control Options:
|
|
![devin-ai-integration[bot]](https://avatars.githubusercontent.com/in/811515?s=60&v=4){kind=small}
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
Replace inline error state management in UiContainer with the new useError hook. Since UiContainer provides PlayerContext and useError consumes it, the error-conditional rendering is extracted into an ErrorGate child component rendered inside the provider. Co-Authored-By: tom.vanlaerhoven <tom.vanlaerhoven@dolby.com>
devin-ai-integration
Bot
changed the title
| export const useError = (): PlayerError | undefined => { | ||
| const [error, setError] = useState<PlayerError | undefined>(undefined); | ||
| const { player } = useContext(PlayerContext); | ||
|
|
||
| useEffect(() => { | ||
| if (!player) return; | ||
| const onEvent = (event: { type: ErrorChangeEventType }) => { | ||
| if (event.type === PlayerEventType.ERROR) { | ||
| setError((event as ErrorEvent).error); | ||
| } else { | ||
| setError(undefined); | ||
| } | ||
| }; | ||
|
|
||
| player.addEventListener(ERROR_CHANGE_EVENTS, onEvent); | ||
| return () => { | ||
| player.removeEventListener(ERROR_CHANGE_EVENTS, onEvent); | ||
| }; | ||
| }, [player]); |
There was a problem hiding this comment.
🚩 Error state persists across player prop changes in useError hook
When the player prop changes, the useEffect in useError at src/ui/hooks/useError.ts:22-36 re-runs to register new listeners, but the error state (line 19) is never explicitly reset. If the previous player had an error, it will persist until a LOAD_START or SOURCE_CHANGE event fires on the new player. This was the same behavior in the old code (the error useState in UiContainer also persisted across player changes), so this is not a regression. However, for a public hook, consumers may find it surprising.
Was this helpful? React with 👍 or 👎 to provide feedback.
There was a problem hiding this comment.
Not a regression — matches the previous UiContainer behavior exactly (as the review notes). In practice, the player instance doesn't change during a session's lifetime, so this edge case doesn't arise. If needed in the future, a setError(undefined) at the top of the effect would handle it.
1 participant
Summary
Adds a
useErrorhook that exposes the currentPlayerError | undefined, following the same pattern asusePaused,useEnded, etc. RefactorsUiContainerto use it instead of inline error state management.Since
UiContainerprovidesPlayerContextanduseErrorconsumes it, the error-conditional rendering is extracted into anErrorGatechild component rendered inside the provider:Usage for custom components:
Companion PR in react-native-theoplayer (#857) ensures
contentprotectionerrorevents from the web SDK are forwarded asPlayerEventType.ERROR.Link to Devin session: https://dolby.devinenterprise.com/sessions/4f3f8d74c30b45dfb651a76c65693a83
Requested by: @tvanlaerhoven