[RN] Fix toggling camera

When a new local video track is created an associated video capturer is created
for it. The cause for the freezes seems to be creating mutliple tracks (which
come with a video capturer each). Fix this by first disposing of the previous
video track before creating the new one.

Ref:
https://github.com/oney/react-native-webrtc/issues/209#issuecomment-281482869

react/features/base/tracks/actions.js

@@ -179,10 +179,10 @@ function _addTracks(tracks) {
  * Disposes passed tracks and signals them to be removed.
  *
  * @param {(JitsiLocalTrack|JitsiRemoteTrack)[]} tracks - List of tracks.
- * @private
+ * @protected
  * @returns {Function}
  */
-function _disposeAndRemoveTracks(tracks) {
+export function _disposeAndRemoveTracks(tracks) {
     return dispatch =>
         Promise.all(
             tracks.map(t =>

react/features/base/tracks/middleware.js

@@ -11,7 +11,11 @@ import {
 } from '../media';
 import { MiddlewareRegistry } from '../redux';
 
-import { createLocalTracks, destroyLocalTracks } from './actions';
+import {
+    _disposeAndRemoveTracks,
+    createLocalTracks,
+    destroyLocalTracks
+} from './actions';
 import { TRACK_UPDATED } from './actionTypes';
 import { getLocalTrack, setTrackMuted } from './functions';
 
@@ -37,7 +41,16 @@ MiddlewareRegistry.register(store => next => action => {
         _setMuted(store, action, MEDIA_TYPE.AUDIO);
         break;
 
-    case SET_CAMERA_FACING_MODE:
+    case SET_CAMERA_FACING_MODE: {
+        // XXX Destroy the local video track before creating a new one or
+        // react-native-webrtc may be slow or get stuck when opening a (video)
+        // capturer twice.
+        const localTrack = _getLocalTrack(store, MEDIA_TYPE.VIDEO);
+
+        if (localTrack) {
+            store.dispatch(_disposeAndRemoveTracks([ localTrack.jitsiTrack ]));
+        }
+
         store.dispatch(
             createLocalTracks({
                 devices: [ MEDIA_TYPE.VIDEO ],
@@ -45,6 +58,7 @@ MiddlewareRegistry.register(store => next => action => {
             })
         );
         break;
+    }
 
     case SET_VIDEO_MUTED:
         _setMuted(store, action, MEDIA_TYPE.VIDEO);

react/features/toolbox/components/Toolbox.native.js

@@ -184,21 +184,12 @@ class Toolbox extends Component {
 
         return (
             <View style = { styles.secondaryToolbar }>
-                {/* FIXME There are multiple issues with the toggling of the
-                  * camera facing more. For example, switching from the user
-                  * facing camera to the environment facing camera on iOS may be
-                  * very slow or may not work at all. On Android the toggling
-                  * either works or does not. The causes of the various problems
-                  * have been identified to lie within either
-                  * react-native-webrtc or Google's native WebRTC API.
-                  *
                 <ToolbarButton
                     iconName = 'switch-camera'
                     iconStyle = { iconStyle }
                     onClick = { this.props._onToggleCameraFacingMode }
                     style = { style }
                     underlayColor = { underlayColor } />
-                  */}
                 <ToolbarButton
                     iconName = {
                         this.props._locked ? 'security-locked' : 'security'