ably / ably-chat-js

Ably Chat SDK for JavaScript to build chat experiences at scale
https://ably-livestream-chat-demo.vercel.app/
Apache License 2.0
8 stars 0 forks source link

react: ensure we don't show old errors in typing indicators #344

Closed vladvelici closed 1 month ago

vladvelici commented 1 month ago

Context

I've noticed that this error was shown briefly when loading the demo app and started digging:

Error that flashes when loading demo app

This only happens when you are still waiting for something from a room that's been released, which means we update an old state. The room is only released when a parent component of what we see there (ChatRoomProvider) is unmounted.

The existing version of this code was also not setting the unsubscribe from the hook correctly.

This version uses a simple mounted variable to address the problem. Commits in a [previous PR #342] (https://github.com/ably/ably-chat-js/pull/342) attempted 2 different approaches but both turned out be more trouble than worth.

Checklist

Testing Instructions (Optional)

Open demo app - enjoy the absence of the flashing error.

github-actions[bot] commented 1 month ago

Coverage Report

Status Category Percentage Covered / Total
🟢 Lines 94.5% (🎯 92%) 2839 / 3004
🟢 Statements 94.5% (🎯 92%) 2839 / 3004
🟢 Functions 96.36% (🎯 93%) 212 / 220
🟢 Branches 94.47% (🎯 93%) 770 / 815
File Coverage
File Stmts % Branch % Funcs % Lines Uncovered Lines
Changed Files
src/react/hooks/use-typing.ts 98.83% 93.1% 100% 98.83% 85
Generated in workflow #1497