ali322/CNodeRN

View on GitHub
app/module/mine/screen/update.js

Summary

Maintainability
A
3 hrs
Test Coverage
import React from 'react'
import { View, TouchableOpacity, Text } from 'react-native'
import Icon from 'react-native-vector-icons/FontAwesome'
import { connected } from 'redux-container'
import CodePush from 'react-native-code-push'
import * as Progress from 'react-native-progress'
import { Header, Toast } from '../../../component/'
import defaultStyles from '../stylesheet/update'
import preferredThemer from '../../../theme/'

@connected(state => ({ ...state.userPrefsReducer }))
@preferredThemer(defaultStyles)
class Update extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      syncMessage: ''
    }
  }
  componentDidMount() {
    CodePush.notifyApplicationReady()
  }
  async _updateFromCodePush() {
    const self = this
    try {
      return await CodePush.sync(
        {
          installMode: CodePush.InstallMode.IMMEDIATE
        },
        syncStatus => {
          switch (syncStatus) {
            case CodePush.SyncStatus.CHECKING_FOR_UPDATE:
              self.setState({
                syncMessage: '检查更新中...'
              })
              break
            case CodePush.SyncStatus.DOWNLOADING_PACKAGE:
              self.setState({
                syncMessage: '更新包下载中...'
              })
              break
            case CodePush.SyncStatus.AWAITING_USER_ACTION:
              self.setState({
                syncMessage: '等待中...'
              })
              break
            case CodePush.SyncStatus.INSTALLING_UPDATE:
              self.setState({
                syncMessage: '安装更新包...'
              })
              break
            case CodePush.SyncStatus.UP_TO_DATE:
              self.setState({
                syncMessage: '已是最新版本',
                progress: false
              })
              break
            case CodePush.SyncStatus.UPDATE_IGNORED:
              self.setState({
                syncMessage: '更新已暂停',
                progress: false
              })
              break
            case CodePush.SyncStatus.UPDATE_INSTALLED:
              self.setState({
                syncMessage: '更新安装成功,下次重启更新生效',
                progress: false
              })
              break
            case CodePush.SyncStatus.UNKNOWN_ERROR:
              self.setState({
                syncMessage: '未知的错误',
                progress: false
              })
              break
          }
        },
        progress => {
          this.setState({ progress })
        }
      )
    } catch (e) {
      CodePush.log(e)
      this._toast.show('更新服务器异常')
    }
  }
  renderProgress() {
    const { progress } = this.state
    if (!progress) {
      return null
    }
    const scale = progress.receivedBytes / progress.totalBytes
    return (
      <Progress.Bar
        progress={scale}
        width={200}
        color="#666"
        borderColor="#666"
      />
    )
  }
  render() {
    const { styles } = this.props
    const { goBack } = this.props.navigation
    return (
      <View style={styles.container}>
        <Header title="更新" onLeftButtonClick={() => goBack(null)} />
        <View style={styles.updaterContainer}>
          <View style={styles.updaterBreif}>
            {this.state.progress ? (
              this.renderProgress()
            ) : (
              <Text style={styles.updaterBreifText}>
                {this.state.syncMessage}
              </Text>
            )}
          </View>
          <View style={styles.updaterButtons}>
            <TouchableOpacity
              style={styles.updaterButton}
              onPress={this._updateFromCodePush.bind(this)}
            >
              <Text style={styles.updaterButtonText}>检查更新</Text>
            </TouchableOpacity>
          </View>
        </View>
        <Toast ref={view => (this._toast = view)} />
      </View>
    )
  }
}
export default Update