|
| 1 | +// @flow |
| 2 | +import ActionAndroid from 'material-ui/svg-icons/action/android'; |
| 3 | +import RemoveIcon from 'material-ui/svg-icons/navigation/more-vert'; |
| 4 | +import CircularProgress from 'material-ui/CircularProgress'; |
| 5 | +import RaisedButton from 'material-ui/RaisedButton'; |
| 6 | +import React, {PureComponent} from 'react'; |
| 7 | +import Subheader from 'material-ui/Subheader'; |
| 8 | +import {Card, CardText, CardHeader, CardActions} from 'material-ui/Card'; |
| 9 | +import path from 'path'; |
| 10 | + |
| 11 | +import {dragAPK} from '../../redux/actions/androidActions'; |
| 12 | +import {roundUp} from '../../helpers/mathHelpers'; |
| 13 | +import {dangerBackgroundColor, dangerColor} from '../../styles/vars/colors'; |
| 14 | +import Terminal from '../Terminal/Console'; |
| 15 | + |
| 16 | +class APK extends PureComponent<$APKProps, $APKState> { |
| 17 | + state = {showTerminal: false, showFailMessage: false}; |
| 18 | + render = () => ( |
| 19 | + <Card style={{marginBottom: 12}}> |
| 20 | + <CardHeader |
| 21 | + title={this.props.title} |
| 22 | + subtitle={this.props.subtitle} |
| 23 | + /> |
| 24 | + <CardActions> |
| 25 | + {this.props.loading && ( |
| 26 | + <CircularProgress /> |
| 27 | + )} |
| 28 | + {!this.props.loading && !this.props.data && ( |
| 29 | + <Subheader style={{color: dangerColor}}>No APK found</Subheader> |
| 30 | + )} |
| 31 | + {!this.props.loading && !this.props.data && ( |
| 32 | + <div> |
| 33 | + <RaisedButton |
| 34 | + label="Look again" |
| 35 | + onClick={this.props.lookAgain} |
| 36 | + /> |
| 37 | + <RemoveIcon /> |
| 38 | + <RaisedButton |
| 39 | + label="Generate APK" |
| 40 | + secondary |
| 41 | + onClick={() => { |
| 42 | + if (this.state.showTerminal) { |
| 43 | + this.setState({showTerminal: false, showFailMessage: false}, () => { |
| 44 | + setTimeout(() => this.setState({showTerminal: true}), 750); |
| 45 | + }); |
| 46 | + } else { |
| 47 | + this.setState({showTerminal: true}); |
| 48 | + } |
| 49 | + }} |
| 50 | + /> |
| 51 | + </div> |
| 52 | + )} |
| 53 | + {!this.props.loading && this.props.data && ( |
| 54 | + <div> |
| 55 | + <span |
| 56 | + draggable |
| 57 | + onDragStart={() => { |
| 58 | + const {data} = this.props; |
| 59 | + if (data) { |
| 60 | + dragAPK(data.path); |
| 61 | + } |
| 62 | + }} |
| 63 | + > |
| 64 | + <RaisedButton |
| 65 | + label={`${this.props.title} (${roundUp(this.props.data.size)} MB)`} |
| 66 | + primary |
| 67 | + icon={<ActionAndroid />} |
| 68 | + /> |
| 69 | + </span> |
| 70 | + <RemoveIcon /> |
| 71 | + <RaisedButton |
| 72 | + label="Generate APK" |
| 73 | + secondary |
| 74 | + onClick={this.props.lookAgain} |
| 75 | + /> |
| 76 | + </div> |
| 77 | + )} |
| 78 | + <CardText expandable> |
| 79 | + {this.state.showTerminal && ( |
| 80 | + <div> |
| 81 | + {this.props.title === 'Release' && this.state.showFailMessage && ( |
| 82 | + <div |
| 83 | + style={{ |
| 84 | + padding: 12, |
| 85 | + color: dangerColor, |
| 86 | + fontWeight: 'bold', |
| 87 | + border: `2px solid ${dangerColor}`, |
| 88 | + borderRadius: 4, |
| 89 | + backgroundColor: dangerBackgroundColor, |
| 90 | + marginBottom: 12, |
| 91 | + }} |
| 92 | + > |
| 93 | + Build failed! Are you sure you read the <a |
| 94 | + href="https://facebook.github.io/react-native/docs/signed-apk-android.html" |
| 95 | + target="_blank" |
| 96 | + rel="noopener noreferrer" |
| 97 | + >doc</a>? |
| 98 | + </div> |
| 99 | + )} |
| 100 | + <Terminal |
| 101 | + command={`${ |
| 102 | + path.join(this.props.app.path, 'android', 'gradlew') |
| 103 | + } assemble${this.props.title}`} |
| 104 | + cwd={path.join(this.props.app.path, 'android')} |
| 105 | + onDone={this.props.lookAgain} |
| 106 | + onFail={() => this.setState({showFailMessage: true})} |
| 107 | + /> |
| 108 | + </div> |
| 109 | + )} |
| 110 | + </CardText> |
| 111 | + </CardActions> |
| 112 | + </Card> |
| 113 | + ); |
| 114 | +} |
| 115 | + |
| 116 | +export default APK; |
0 commit comments