Search code examples
react-nativecode-pushreact-native-code-push

Code-push check for update


I'm trying to update my app with code-push. My code is as follows:

export default class codePushTest extends Component {
    constructor(props) {
        super(props);
        this.state = {
            updateAvailable: false,
            downloadingUpdate: null,
            installingUpdate: null,
            downloadProgress: null,
        }
    }

    componentDidMount() {
        let self = this;
        codePush.checkForUpdate().then(update => {
            if (!update) {
                self.setState({updateAvailable: false})
            }else{
                self.setState({updateAvailable: true})
            }
        })
    }

    handleUpdate() {
        let self = this;
        const checkUpdateStatus = (status) => {
            switch (status) {
                case codePush.SyncStatus.DOWNLOADING_PACKAGE:
                    self.setState({downloadingUpdate: true});
                    break;
                case codePush.SyncStatus.INSTALLING_UPDATE:
                    self.setState({installingUpdate: true, downloadingUpdate: false});
                    break;
                case codePush.SyncStatus.UPDATE_INSTALLED:
                    self.setState({installingUpdate: false, downloadingUpdate: false, updateInstalled: true});
                    break;
            }
        };

        const downloadProgress = (downloadedBytes, totalBytes) => {
            self.setState({downloadProgress: (downloadedBytes / totalBytes) * 100})
        };

        codePush.sync({updateDialog: false, installMode: codePush.InstallMode.IMMEDIATE}, checkUpdateStatus, downloadProgress)
    }

    renderButton(){
        if (this.state.updateAvailable){
            return (
                <View style={{marginTop: 40}}>
                    <TouchableHighlight onPress={this.handleUpdate.bind(this)}>
                        <Text>An update is available.</Text>
                    </TouchableHighlight>
                </View>
            )
        }

    }

    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.welcome}>Welcome message. </Text>
                {this.renderButton()}
            </View>
        )
    }
}

Thus, what I'm trying is to check if there is an update available in componentDidMount and if it is, then update the state and depending on that state show update button.

But the problem is, when I push the code, and it is the newest code in the app, it still shows the button An update available.

If I change the content of my app and sent it to the code-push server with code-push release-react AppName ios, the button shows again, that is good. If I click on it the new content is shown and the button disappears an that is good.

But the problem is if I refresh the app I get again the old content and the button is shown again. And if I click on it again, nothing happens.

Any idea what am I doing wrong?


Solution

  • The component needs to be wrapped with codepush. I haven't seen it in the docs. Here is the link.

    Thus:

    Instead of

    export default Item;
    

    it must be

    let codePushOptions = { checkFrequency: codePush.CheckFrequency.MANUAL };
    MainApp = codePush(codePushOptions)(Item);
    export default MainApp;