-
Notifications
You must be signed in to change notification settings - Fork 729
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Update useDimensionsChanged hook so that it causes re-render #387
Conversation
The track.dimensions object remains the same throughout the lifespan of the track, but its values are updated. This means that the setter always receives the same object and therefore doesn't result in the state actually changing. By copying the dimension values into a new object, we ensure that consumers of this hook are always kept up to date with the new dimensions.
@@ -10,7 +10,10 @@ export default function useVideoTrackDimensions(track?: TrackType) { | |||
setDimensions(track?.dimensions); | |||
|
|||
if (track) { | |||
const handleDimensionsChanged = (track: TrackType) => setDimensions(track?.dimensions); | |||
const handleDimensionsChanged = (track: TrackType) => setDimensions({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do we still need the ?
postfix operator on track
here? We could also do something like setDimensions({ ...track?.dimensions })
so we get all of the properties like we used to, just in case something relied on any other track
properties.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If you need the null coaslescing, the types are wrong, so change those rather than reinstating what appears to be a redundant operator.
You're probably right about cloning the track dimensions to keep other properties, although you might have other deeply-nested objects that will suffer from the 'same reference' problem.
It might be better to specify exactly the return shape of this hook, rather than have it infer it from elsewhere.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do we still need the ? postfix operator on track here?
No - it isn't needed inside the if (track) {
block.
if (track) {
// track will never be undefined in here
}
We could also do something like setDimensions({ ...track?.dimensions }) so we get all of the properties like we used to, just in case something relied on any other track properties.
We could, but width
and height
are the only properties on this object, so I think the code is fine as is. https://media.twiliocdn.com/sdk/js/video/releases/2.10.0/docs/VideoTrack.html#.Dimensions
Contributing to Twilio
Pull Request Details
JIRA link(s):
Description
This pull request contains a bugfix submitted by Github user @tomhicks. I've pulled his changes into a new PR so that the Circle CI tests can run on it. Here is the original PR: #376
This PR fixes an issue found in the
useDimensionsChanged
hook, where thehandleDimensionsChanged
function would set the same object reference as the one already stored in the hook's state. This means that component that use this hook would not re-render when a track's dimensions have changed.handleDimensionsChanged
now returns a new object reference when a track's dimensions have changed, which will correctly cause components to re-render.Burndown
Before review
npm test
Before merge