[RN] Make react-native-img-cache optional at bundle time

react/features/base/participants/components/Avatar.native.js

@@ -74,8 +74,9 @@ export default class Avatar extends Component {
         // uri
         const prevURI = this.props && this.props.uri;
         const nextURI = nextProps && nextProps.uri;
+        const assignState = !this.state;
 
-        if (prevURI !== nextURI || !this.state) {
+        if (prevURI !== nextURI || assignState) {
             const nextState = {
                 backgroundColor: this._getBackgroundColor(nextProps),
 
@@ -92,10 +93,10 @@ export default class Avatar extends Component {
                 source: _DEFAULT_SOURCE
             };
 
-            if (this.state) {
+            if (assignState) {
-                this.setState(nextState);
-            } else {
                 this.state = nextState;
+            } else {
+                this.setState(nextState);
             }
 
             // XXX @lyubomir: My logic for the character # bellow is as follows:
@@ -113,11 +114,7 @@ export default class Avatar extends Component {
             // an image retrieval action.
             if (nextURI && !nextURI.startsWith('#')) {
                 const nextSource = { uri: nextURI };
-
+                const observer = () => {
-                // Wait for the source/URI to load.
-                ImageCache.get().on(
-                    nextSource,
-                    /* observer */ () => {
                     this._unmounted || this.setState((prevState, props) => {
                         if (props.uri === nextURI
                                 && (!prevState.source
@@ -127,8 +124,22 @@ export default class Avatar extends Component {
 
                         return {};
                     });
-                    },
+                };
+
+                // Wait for the source/URI to load.
+                if (ImageCache) {
+                    ImageCache.get().on(
+                        nextSource,
+                        observer,
                         /* immutable */ true);
+                } else if (assignState) {
+                    this.state = {
+                        ...this.state,
+                        source: nextSource
+                    };
+                } else {
+                    observer();
+                }
             }
         }
     }

react/features/mobile/image-cache/functions.js

@@ -27,5 +27,5 @@ function _onLoad() {
  * @returns {void}
  */
 export function prefetch(source) {
-    ImageCache.get().on(source, /* observer */ _onLoad, /* immutable */ true);
+    ImageCache && ImageCache.get().on(source, _onLoad, /* immutable */ true);
 }

react/features/mobile/image-cache/middleware.js

@@ -39,7 +39,7 @@ MiddlewareRegistry.register(({ getState }) => next => action => {
     case APP_WILL_MOUNT:
     case CONFERENCE_FAILED:
     case CONFERENCE_LEFT:
-        ImageCache.get().clear();
+        ImageCache && ImageCache.get().clear();
         break;
 
     case PARTICIPANT_ID_CHANGED:

react/features/mobile/image-cache/react-native-img-cache.no.js

@@ -0,0 +1,16 @@
+// XXX The third-party react-native modules react-native-fetch-blob utilizes the
+// same HTTP library as react-native i.e. okhttp. Unfortunately, that means that
+// the versions of okhttp on which react-native and react-native-fetch-blob
+// depend may have incompatible APIs. Such an incompatibility will be made
+// apparent at compile time and the developer doing the compilation may choose
+// to not compile react-native-fetch-blob's source code.
+
+// XXX The choice between the use of react-native-img-cache could've been done
+// at runtime based on whether NativeModules.RNFetchBlob is defined if only
+// react-native-fetch-blob would've completely protected itself. At the time of
+// this writing its source code appears to be attempting to protect itself from
+// missing native binaries but that protection is incomplete and there's a
+// TypeError.
+
+import { Image } from 'react-native';
+export { Image as CachedImage, undefined as ImageCache };