feat(samples): effects changes in samples

[meta-dipanshu-sharma]

NOTE: This PR is converted to draft as there are new blocking changes with WCME 3.0 refactor.

COMPLETES #< SPARK-430467>

This pull request addresses

As part of V3 work, SDK now have ability to create media effects which are Virtual Background and Background Noise Reduction. Epic link: https://jira-eng-gpk2.cisco.com/jira/browse/SPARK-428051

As part of this PR, we have to update samples with following changes:

1. Have a separate track management section where we can play with Audio and Video tracks. Developers will be able to create a track outside a meeting context, apply effects on them and play around with it. Same track can be used in meeting and after leaving a meeting as well in another meeting.

2. Add same available track while joining a meeting or create new tracks if not already available.

3. Have a status bar on the tracks which tells the current state of the tab which can be published or unpublished.

4. Have a separate screen sharing section where user can start screen sharing without a meeting context and have the ability to publish/unpublish it in the meeting.

by making the following changes

Updated the samples app with all the above points. There are more changes required for the samples app which will be covered in a separate story. Link: https://jira-eng-gpk2.cisco.com/jira/browse/SPARK-436949

There's a separate wiki created which tells how new track APIs and media effects work together. Link: https://confluence-eng-gpk2.cisco.com/conf/display/WSDK/Tracks+and+Effects#

Change Type

• [ ] Bug fix (non-breaking change which fixes an issue)
• [x] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to change)
• [ ] Documentation update
• [ ] Tooling change
• [ ] Internal code refactor

The following scenarios where tested

< ENUMERATE TESTS PERFORMED, WHETHER MANUAL OR AUTOMATED >

I certified that

• [x] I have read and followed contributing guidelines

• [x] I discussed changes with code owners prior to submitting this pull request

• [x] I have not skipped any automated checks

• [x] All existing and new tests passed

• [x] I have updated the documentation accordingly

---

Make sure to have followed the contributing guidelines before submitting.

[aws-amplify-us-east-2[bot]]

This pull request is automatically being deployed by Amplify Hosting (learn more).

Access this pull request here: https://pr-2944.d3m3l2kee0btzx.amplifyapp.com

[meta-dipanshu-sharma]

I haven't looked at the code, just played a bit with the sample app from this PR and I've found these issues:

1. changing of camera or microphone is broken - after I choose a new camera and press "publish video" button I stop sending any video (same for mic)
2. clicking "load camera" button again while in the meeting breaks things - now if you click "enable vbg" it gets enabled in the local view, but remote side doesn't see vbg
3. if you have VBG enabled and click "load camera" again the local view now has no vbg, but the button still says "disable vbg" and clicking it throws errors: "TypeError: Cannot read properties of undefined (reading 'disable')"
4. for screen share, the publish button is enabled even if we're not in any meeting, clicking it then throws an error
5. for screen share, the "stop/unpublish" button doesn't work if you've started a share outside of a meeting
6. pressing "enable vbg" the first time takes quite long - maybe the button should be disabled or show "loading" or something during that time?
7. I've seen sometimes an error in the console: "Uncaught (in promise) OverconstrainedError: Mixing ImageCapture and non-ImageCapture constraints is not currently supported" when clicking the VBG button
8. the placement of the track published labels for video and for screen share seems wrong:

1. Fixed the logic for publishing different audio/video sources in a meeting.
2. Asked you 1:1 that what behaviour we expect here?
3. depends on point 2.
4. disabled it until an active meeting is not there.
5. same as above.
6. yeah added a disabled text while effect is applied.
7. I was not able to reproduce this. Might need exact case.
8. Fixed it. If it fails for more smaller resolutions then might need to update the placement completely.

[sreenara]

No longer a relevant PR