-
Notifications
You must be signed in to change notification settings - Fork 736
Ahoyapps 47 create participant filmstrip #7
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
Ahoyapps 47 create participant filmstrip #7
Conversation
charliesantos
left a comment
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.
Looking good @timmydoza ! Very easy to read!
Just left a few comments.
| '&:not(:last-child)': { | ||
| borderRight: 'none', | ||
| }, | ||
| }, |
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.
Not part of this PR but just a thought. How would we pass custom styles if I want to reuse this component?
src/components/NewtorkQualityLevel/__snapshots__/NetworkQualityLevel.test.tsx.snap
Show resolved
Hide resolved
src/components/ParticipantInfo/__snapshots__/ParticipantInfo.test.tsx.snap
Show resolved
Hide resolved
src/components/ParticipantStrip/__snapshots__/ParticipantStrip.test.tsx.snap
Show resolved
Hide resolved
* Add Participant, publication, and Track components and hooks * Apply basic styles to ParticipantStrip * Add AudioTrack component * Add Network quality states to ParticipantStrip * Style adjustments for network quality * Clean up network quality appearance and code * Fix some bugs in useRoom and useParticipants hooks * Fix network quality level * Fix useRoom tests * Add more testing dependencies * fix networkQuality hook * Add more tests * Add more tests for hooks * Add tests for Participant and Publication * Add test for participantStrip component * Tidy up tests a little * Let Participant component decide if it was passed the localParticipant * Adjust import orders * Restructure participant component * Delete file created on accident * Rename type
…creens Feature/design refresh pre join screens
* Add Participant, publication, and Track components and hooks * Apply basic styles to ParticipantStrip * Add AudioTrack component * Add Network quality states to ParticipantStrip * Style adjustments for network quality * Clean up network quality appearance and code * Fix some bugs in useRoom and useParticipants hooks * Fix network quality level * Fix useRoom tests * Add more testing dependencies * fix networkQuality hook * Add more tests * Add more tests for hooks * Add tests for Participant and Publication * Add test for participantStrip component * Tidy up tests a little * Let Participant component decide if it was passed the localParticipant * Adjust import orders * Restructure participant component * Delete file created on accident * Rename type
* Add Participant, publication, and Track components and hooks * Apply basic styles to ParticipantStrip * Add AudioTrack component * Add Network quality states to ParticipantStrip * Style adjustments for network quality * Clean up network quality appearance and code * Fix some bugs in useRoom and useParticipants hooks * Fix network quality level * Fix useRoom tests * Add more testing dependencies * fix networkQuality hook * Add more tests * Add more tests for hooks * Add tests for Participant and Publication * Add test for participantStrip component * Tidy up tests a little * Let Participant component decide if it was passed the localParticipant * Adjust import orders * Restructure participant component * Delete file created on accident * Rename type
Added background selection UI Co-authored-by: Gabe Espinosa <[email protected]> Co-authored-by: timmydoza <[email protected]>
* Moved more menu to the center of the menu bar * VIDEO-5731 | Added background option to More Menu, selection dialog, and unit tests (#6) Added background option to More Menu, selection dialog, and unit tests Co-authored-by: Gabe Espinosa <[email protected]> * VIDEO-5733 | Added npm script to copy video processor sdk assets to public folder (#8) * Added npm script to copy video processor sdk assets to public folder * added postinstall npm script Co-authored-by: Gabe Espinosa <[email protected]> * added rimraf and copyfiles dependency to package.json * VIDEO-5732 | Added background selection UI (#7) Added background selection UI Co-authored-by: Gabe Espinosa <[email protected]> Co-authored-by: timmydoza <[email protected]> * VIDEO-5734/blur background feature (#550) Implemented blur background feature (useBackgroundSettings hook and tests) Co-authored-by: Gabe Espinosa <[email protected]> * VIDEO-5735/Add virtual background feature (#557) Added virtual background feature and unit tests Co-authored-by: Gabe Espinosa <[email protected]> * VIDEO-5735 | Add isSupported check and unit test (#560) add isSupported check and unit test Co-authored-by: Gabe Espinosa <[email protected]> * VIDEO-6368 | wait to load image before removing processor (#570) * wait to load image before removing processor Co-authored-by: Gabe Espinosa <[email protected]> * updated twilio-video sdk * fixed breaking tests * update package.json version and changelog * update change log, package.json, and revisions * Update CHANGELOG.md Co-authored-by: Gabe Espinosa <[email protected]> Co-authored-by: timmydoza <[email protected]>

This PR creates the sidebar of participant thumbnails.
Contributing to Twilio
Pull Request Details
JIRA link(s):
Description
The pariticipant sidebar (called the ParticipantStrip component after a discussion with Kevin) renders audio and video tracks for all participants, and also displays their name and network quality information. Participants are added or removed to the sidebar as they join or leave the room.
Burndown
Before review
npm testBefore merge