[VBLOCKS-1830] Audio device selection

[mhuynh5757]

Submission Checklist

• [x] The CHANGELOG.md reflects any feature, bug fixes, or known issues made in the source code
• [x] New unit tests and integration tests have beed added
• [x] Code coverage is more or equal to the previous coverage
• [x] A visual inspection of the Files changed tab was made prior to submitting the pull request ensuring the style guide was followed
• [x] CI pipeline is green
• [x] Included screenshot if necessary

Description

This PR implements the store actions and components for proper audio device selection during a call.

Breakdown

• Add audio device store actions.
• Adjust store to reflect new actions.
• Add components to the active call screen to perform and consume said store changes and actions.
• Adjust hooks for those components.
• Add unit tests for the store and components.

Validation

• New component and store tests.
• Manual testing.

Additional Notes

Figma link: https://www.figma.com/file/IFiFQzWEp1xyM2nuqJCkC2/2022-Q2-React-Voice-SDK?type=design&node-id=629-19201&mode=design&t=xDdnuaT6Fub1wU2Y-0

iPhone - Earpiece selected (no bluetooth device connected to iPhone at all)

iPhone - Speaker selected (with or without bluetooth device connected to iPhone)

iPhone - Bluetooth selected (with bluetooth device connected to iPhone)

Android - Earpiece selected

Android - Speaker selected

Note: unable to select earpiece on iPhone when bluetooth device is connected. Is this an iOS limitation? I can select the speaker when there is a bluetooth device, but not earpiece. Calling .select() on the earpiece will have the native layer do something and report an audio devices changed event, but the selected device is still bluetooth in that event and indeed the bluetooth device is still relaying audio.

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.

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

[charliesantos]

@mhuynh5757 can you please attach some screenshots for each UI state for both platforms?

[charliesantos]

@mhuynh5757 do we have figma link handy?

[charliesantos]

@mhuynh5757 , can we get our Android and iOS members to verify the behavior? Android feels correct to me, but iOS seems odd. Looking at the iOS phone app, it should allow us to select earpiece properly even with bluetooth device connected.