-
Notifications
You must be signed in to change notification settings - Fork 9
VIDSOL-105: Background Replacement Support for Web VERA - Custom Images #201
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
VIDSOL-105: Background Replacement Support for Web VERA - Custom Images #201
Conversation
…with unified management in preview and meeting rooms. Refactored publisher logic, updated user context, and enhanced UI to support and display background selections.
…dded isParentVideoEnabled prop, standardized option sizing, and improved disabled video container styles.
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.
Looks good so far! Just have a few comments/questions. Let me know what you think!
frontend/src/components/BackgroundEffects/BackgroundEffectTabs/BackgroundEffectTabs.spec.tsx
Show resolved
Hide resolved
frontend/src/components/BackgroundEffects/BackgroundEffectTabs/BackgroundEffectTabs.tsx
Outdated
Show resolved
Hide resolved
frontend/src/components/BackgroundEffects/SelectableOption/SelectableOption.tsx
Show resolved
Hide resolved
| mode: 'meeting' | 'waiting'; | ||
| }; | ||
|
|
||
| const BackgroundEffectsLayout = ({ |
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.
Could we add jsdoc for this component?
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.
I believe we're still missing the jsdoc here but the comment was shown as resolved 🙏
frontend/src/components/BackgroundEffects/BackgroundEffectsLayout/BackgroundEffectsLayout.tsx
Show resolved
Hide resolved
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.
LGTM Great job! ![]()
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.
LGTM! great job on this one!
|
Hey @OscarFava, It looks 🤩 BG replacement desktop:
Mobile view:
|
…und-replacement-custom-images
…or viewport handling with custom hook
81fa0d3
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.
great job on this one! left a few more comments. thanks 🙏
...oundEffects/AddBackgroundEffect/AddBackgroundEffectLayout/AddBackgroundEffectLayout.spec.tsx
Outdated
Show resolved
Hide resolved
...nd/src/components/BackgroundEffects/BackgroundEffectsLayout/BackgroundEffectsLayout.spec.tsx
Outdated
Show resolved
Hide resolved
| mode: 'meeting' | 'waiting'; | ||
| }; | ||
|
|
||
| const BackgroundEffectsLayout = ({ |
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.
I believe we're still missing the jsdoc here but the comment was shown as resolved 🙏
frontend/src/components/BackgroundEffects/FileUploader/FileUploader.spec.tsx
Outdated
Show resolved
Hide resolved
frontend/src/components/BackgroundEffects/FileUploader/FileUploader.tsx
Outdated
Show resolved
Hide resolved
frontend/src/components/BackgroundEffects/SelectableOption/SelectableOption.tsx
Outdated
Show resolved
Hide resolved
…age, and enhance component documentation
|
Tested LGTM!! 🚀 |
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.
Looks good so far! Just have a few comments/questions. Let me know what you think!
frontend/src/components/BackgroundEffects/BackgroundGallery/BackgroundGallery.tsx
Show resolved
Hide resolved
...ackgroundEffects/AddBackgroundEffect/AddBackgroundEffectLayout/AddBackgroundEffectLayout.tsx
Show resolved
Hide resolved
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.
LGTM
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.
LGTM
|
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.
LGTM



What is this PR doing?
This PR is adding the capability to add custom images that will be used to replace the background of the publisher.
How should this be manually tested?
1- Enter to waiting room, click "Background Effects" button on the bottom corner.
1.1 - Test tab "backgrounds". Select different backgrounds that will be applied on the publisher. If you "cancel", that background will not be applied to the main publisher, if you click "apply", it will be applied.
1.2 - Click tab "Add Background" and add a custom image. Then, do same as step 1.1 with that custom image.
2- Enter to meeting room and click on the button next to the camera (video devices) and then click "Background Effects".
2.2 - Do the same as 1.1 and 1.2
What are the relevant tickets?
A maintainer will add this ticket number.
Resolves VIDSOL-105
Checklist
[ ] Branch is based on
develop(notmain).[ ] Resolves a
Known Issue.[ ] If yes, did you remove the item from the
docs/KNOWN_ISSUES.md?[ ] Resolves an item reported in
Issues.If yes, which issue? Issue Number?