[RN] Make react-native-img-cache optional at bundle time
This commit is contained in:
parent
131e5af01e
commit
2818520c8f
|
@ -74,8 +74,9 @@ export default class Avatar extends Component {
|
||||||
// uri
|
// uri
|
||||||
const prevURI = this.props && this.props.uri;
|
const prevURI = this.props && this.props.uri;
|
||||||
const nextURI = nextProps && nextProps.uri;
|
const nextURI = nextProps && nextProps.uri;
|
||||||
|
const assignState = !this.state;
|
||||||
|
|
||||||
if (prevURI !== nextURI || !this.state) {
|
if (prevURI !== nextURI || assignState) {
|
||||||
const nextState = {
|
const nextState = {
|
||||||
backgroundColor: this._getBackgroundColor(nextProps),
|
backgroundColor: this._getBackgroundColor(nextProps),
|
||||||
|
|
||||||
|
@ -92,10 +93,10 @@ export default class Avatar extends Component {
|
||||||
source: _DEFAULT_SOURCE
|
source: _DEFAULT_SOURCE
|
||||||
};
|
};
|
||||||
|
|
||||||
if (this.state) {
|
if (assignState) {
|
||||||
this.setState(nextState);
|
|
||||||
} else {
|
|
||||||
this.state = nextState;
|
this.state = nextState;
|
||||||
|
} else {
|
||||||
|
this.setState(nextState);
|
||||||
}
|
}
|
||||||
|
|
||||||
// XXX @lyubomir: My logic for the character # bellow is as follows:
|
// XXX @lyubomir: My logic for the character # bellow is as follows:
|
||||||
|
@ -113,22 +114,32 @@ export default class Avatar extends Component {
|
||||||
// an image retrieval action.
|
// an image retrieval action.
|
||||||
if (nextURI && !nextURI.startsWith('#')) {
|
if (nextURI && !nextURI.startsWith('#')) {
|
||||||
const nextSource = { uri: nextURI };
|
const nextSource = { uri: nextURI };
|
||||||
|
const observer = () => {
|
||||||
|
this._unmounted || this.setState((prevState, props) => {
|
||||||
|
if (props.uri === nextURI
|
||||||
|
&& (!prevState.source
|
||||||
|
|| prevState.source.uri !== nextURI)) {
|
||||||
|
return { source: nextSource };
|
||||||
|
}
|
||||||
|
|
||||||
|
return {};
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
// Wait for the source/URI to load.
|
// Wait for the source/URI to load.
|
||||||
ImageCache.get().on(
|
if (ImageCache) {
|
||||||
nextSource,
|
ImageCache.get().on(
|
||||||
/* observer */ () => {
|
nextSource,
|
||||||
this._unmounted || this.setState((prevState, props) => {
|
observer,
|
||||||
if (props.uri === nextURI
|
/* immutable */ true);
|
||||||
&& (!prevState.source
|
} else if (assignState) {
|
||||||
|| prevState.source.uri !== nextURI)) {
|
this.state = {
|
||||||
return { source: nextSource };
|
...this.state,
|
||||||
}
|
source: nextSource
|
||||||
|
};
|
||||||
return {};
|
} else {
|
||||||
});
|
observer();
|
||||||
},
|
}
|
||||||
/* immutable */ true);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -27,5 +27,5 @@ function _onLoad() {
|
||||||
* @returns {void}
|
* @returns {void}
|
||||||
*/
|
*/
|
||||||
export function prefetch(source) {
|
export function prefetch(source) {
|
||||||
ImageCache.get().on(source, /* observer */ _onLoad, /* immutable */ true);
|
ImageCache && ImageCache.get().on(source, _onLoad, /* immutable */ true);
|
||||||
}
|
}
|
||||||
|
|
|
@ -39,7 +39,7 @@ MiddlewareRegistry.register(({ getState }) => next => action => {
|
||||||
case APP_WILL_MOUNT:
|
case APP_WILL_MOUNT:
|
||||||
case CONFERENCE_FAILED:
|
case CONFERENCE_FAILED:
|
||||||
case CONFERENCE_LEFT:
|
case CONFERENCE_LEFT:
|
||||||
ImageCache.get().clear();
|
ImageCache && ImageCache.get().clear();
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case PARTICIPANT_ID_CHANGED:
|
case PARTICIPANT_ID_CHANGED:
|
||||||
|
|
|
@ -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 };
|
Loading…
Reference in New Issue