Skip to content

Video 4893 show network for main participant#499

Merged
olipyskoty merged 8 commits into
masterfrom
VIDEO-4893-show-network-for-main-participant
Apr 22, 2021
Merged

Video 4893 show network for main participant#499
olipyskoty merged 8 commits into
masterfrom
VIDEO-4893-show-network-for-main-participant

Conversation

@olipyskoty
Copy link
Copy Markdown
Contributor

@olipyskoty olipyskoty commented Apr 20, 2021

Contributing to Twilio

All third party contributors acknowledge that any contributions they provide will be made under the same open source license that the open source project is provided under.

  • I acknowledge that all my contributions will be made under the project's license.

Pull Request Details

JIRA link(s):

Description

This PR adds the network quality indicator to the main participant. This is the same network quality indicator that is used by the <ParticipantInfo /> component. We decided to move the styling to the <NetworkQualityLevel /> in order to remove the empty boxes from the participant thumbnails in P2P rooms.

GitHub issue: #490

Screenshots:
Main participant === localParticipant:
Screen Shot 2021-04-20 at 7 07 48 PM

Main participant !== localParticipant:
Screen Shot 2021-04-20 at 7 07 14 PM

Burndown

Before review

  • Updated CHANGELOG.md if necessary
  • Added unit tests if necessary
  • Updated affected documentation
  • Verified locally with npm test
  • Manually sanity tested running locally
  • Included screenshot as PR comment (if needed)
  • Ready for review

Before merge

  • Got one or more +1s
  • Re-tested if necessary

@olipyskoty
Copy link
Copy Markdown
Contributor Author

@timmydoza I didn't think any unit tests needed to be updated for the <MainParticipantInfo /> as there doesn't appear to be anything related to the network quality in the <ParticipantInfo /> unit tests, but please let me know if I should add some.

@olipyskoty olipyskoty requested a review from timmydoza April 20, 2021 23:42
Copy link
Copy Markdown
Contributor

@timmydoza timmydoza left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good! I think that's it. Just one tiny change request.

'& svg': {
marginLeft: '0.3em',
},
marginRight: '0.4em',
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the network container increased the height of the identity div just a little bit, which is totally fine. But it looks like things aren't centered vertically now. Let's add align-items: 'center', to the identity class.

Before:
image

After:
image

@olipyskoty olipyskoty requested a review from timmydoza April 22, 2021 18:55
@olipyskoty olipyskoty merged commit 3e6fe63 into master Apr 22, 2021
@olipyskoty olipyskoty deleted the VIDEO-4893-show-network-for-main-participant branch April 22, 2021 20:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants