Skip to content

Commit 82ca3ab

Browse files
co2-gitco2-git
authored
Merge pull request #65 from co2-git/feature/27
feature/27
2 parents d3d82bc + f06f1d5 commit 82ca3ab

File tree

11 files changed

+6868
-49
lines changed

11 files changed

+6868
-49
lines changed

‎app/components/App/AppBar.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
// @flow
22
import IconButton from 'material-ui/IconButton';
3+
import FlatButton from 'material-ui/FlatButton';
34
import MaterialUIAppBar from 'material-ui/AppBar';
45
import NavigationBack from 'material-ui/svg-icons/navigation/arrow-back';
6+
import DoneIcon from 'material-ui/svg-icons/action/done';
57
import path from 'path';
68
import React from 'react';
79

@@ -16,6 +18,12 @@ const AppBar = ({app}: $AppBarProps) => (
1618
</IconButton>
1719
)}
1820
onLeftIconButtonClick={() => switchRoute(0)}
21+
iconElementRight={app.isExpo ? (
22+
<FlatButton
23+
label="Expo App"
24+
icon={<DoneIcon />}
25+
/>
26+
) : <div />}
1927
/>
2028
);
2129

‎app/components/Layout/Open.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ class Open extends PureComponent<$OpenProps, $OpenState> {
3131
label="Open"
3232
primary
3333
style={{margin: 12}}
34-
onClick={() => appsActions.openApp(null)}
34+
onClick={() => appsActions.openApp()}
3535
/>
3636
<RaisedButton
3737
label="Init"

‎app/components/Platform/Home.js

Lines changed: 29 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -17,25 +17,29 @@ import APKs from '../Android/APKs';
1717
const PlatformHome = ({app, index, platform}: $PlatformHomeProps) => (
1818
<div style={{margin: 12}}>
1919
<div>
20-
<BottomNavigation selectedIndex={index} style={{marginBottom: 12}}>
21-
<BottomNavigationItem
22-
label="Run"
23-
onClick={() => switchPlatformRoute(platform, app, 0)}
24-
icon={<PlayIcon />}
25-
/>
26-
<BottomNavigationItem
27-
label="Logs"
28-
onClick={() => switchPlatformRoute(platform, app, 1)}
29-
icon={<LogIcon />}
30-
/>
31-
{platform === 'android' && (
20+
{!app.isExpo && (
21+
<BottomNavigation selectedIndex={index} style={{marginBottom: 12}}>
3222
<BottomNavigationItem
33-
label="APKs"
34-
onClick={() => switchPlatformRoute(platform, app, 2)}
35-
icon={<PackageIcon />}
23+
label="Run"
24+
onClick={() => switchPlatformRoute(platform, app, 0)}
25+
icon={<PlayIcon />}
3626
/>
37-
)}
38-
</BottomNavigation>
27+
{!app.isExpo && (
28+
<BottomNavigationItem
29+
label="Logs"
30+
onClick={() => switchPlatformRoute(platform, app, 1)}
31+
icon={<LogIcon />}
32+
/>
33+
)}
34+
{platform === 'android' && (
35+
<BottomNavigationItem
36+
label="APKs"
37+
onClick={() => switchPlatformRoute(platform, app, 2)}
38+
icon={<PackageIcon />}
39+
/>
40+
)}
41+
</BottomNavigation>
42+
)}
3943
</div>
4044
<div>
4145
<XRouter index={index}>
@@ -44,12 +48,14 @@ const PlatformHome = ({app, index, platform}: $PlatformHomeProps) => (
4448
component={Run}
4549
componentProps={{app, platform}}
4650
/>
47-
<XRoute
48-
routeIndex={1}
49-
component={Logs}
50-
componentProps={{app, platform}}
51-
/>
52-
{platform === 'android' && (
51+
{!app.isExpo && (
52+
<XRoute
53+
routeIndex={1}
54+
component={Logs}
55+
componentProps={{app, platform}}
56+
/>
57+
)}
58+
{platform === 'android' && !app.isExpo && (
5359
<XRoute
5460
routeIndex={2}
5561
component={APKs}

‎app/components/Platform/Run.js

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -29,9 +29,12 @@ class RunPlatform extends PureComponent<$RunPlatformProps, $RunPlatformState> {
2929
<i className="icon-apple" style={{fontSize: 24, color: '#777'}} />
3030
)}
3131
showExpandableButton
32-
subtitle={`Install your app on ${this.props.platform} device (or ${
33-
this.props.platform === 'android' ? 'emulator' : 'simulator'
34-
})`}
32+
subtitle={
33+
this.props.app.isExpo ? `Launch expo app for ${this.props.platform}` :
34+
`Install and run your app on ${this.props.platform} device (or ${
35+
this.props.platform === 'android' ? 'emulator' : 'simulator'
36+
})`
37+
}
3538
title={`Run ${this.props.platform}`}
3639
/>
3740
<CardText expandable>
@@ -114,7 +117,9 @@ class RunPlatform extends PureComponent<$RunPlatformProps, $RunPlatformState> {
114117
resolve();
115118
});
116119
makeCommand = (): string => {
117-
const cmd = `react-native run-${this.props.platform}`;
120+
const cmd = this.props.app.isExpo ?
121+
`npm run ${this.props.platform}` :
122+
`react-native run-${this.props.platform}`;
118123
const options = [];
119124
for (const option in this.state.options) {
120125
if (typeof this.state.options[option] === 'boolean') {

‎app/components/Terminal/Console.js

Lines changed: 63 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,13 @@ import Chip from 'material-ui/Chip';
66
import DoneIcon from 'material-ui/svg-icons/action/done';
77
import ErrorIcon from 'material-ui/svg-icons/alert/error';
88
import map from 'lodash/map';
9+
import filter from 'lodash/filter';
910
import OpenFolderIcon from 'material-ui/svg-icons/file/folder-open';
1011
import React, {PureComponent} from 'react';
1112
import stripAnsi from 'strip-ansi';
1213
import TermIcon from 'material-ui/svg-icons/action/code';
1314
import TextField from 'material-ui/TextField';
15+
import anser from 'anser';
1416

1517
import {consoleStyle} from '../../styles/main';
1618
import exec from '../../lib/exec';
@@ -91,14 +93,7 @@ class Terminal extends PureComponent<$TerminalProps, $TerminalState> {
9193
</CardActions>
9294
<CardText expandable>
9395
<div style={consoleStyle} id="terminal">
94-
{map(this.state.output, (output, index) => {
95-
const lines = stripAnsi(output.message).split('\n');
96-
return (
97-
<div key={index}>
98-
{map(lines, (line, lineIndex) => <div key={lineIndex}>{line}</div>)}
99-
</div>
100-
);
101-
})}
96+
{this.renderOutput()}
10297
</div>
10398
<TextField
10499
hintText="Run command"
@@ -190,6 +185,66 @@ class Terminal extends PureComponent<$TerminalProps, $TerminalState> {
190185
message += ')';
191186
return message;
192187
}
188+
renderOutput = () => {
189+
const output = map(this.state.output, 'message').join('');
190+
const lines = output.split(/\n/);
191+
const blocks = map(lines, line => anser.ansiToJson(line));
192+
let isQR = false;
193+
let startQR = false;
194+
let endQR = false;
195+
return map(blocks, (block, blockIndex) => {
196+
const style = {whiteSpace: 'pre-wrap'};
197+
const lineStyle = {};
198+
if (
199+
lines[blockIndex].trim() === "You'll find the QR scanner on the Projects tab of the app."
200+
) {
201+
isQR = true;
202+
startQR = true;
203+
} else {
204+
startQR = false;
205+
}
206+
if (
207+
lines[blockIndex].trim() === "Or enter this address in the Expo app's search bar:"
208+
) {
209+
isQR = false;
210+
endQR = true;
211+
} else {
212+
endQR = false;
213+
}
214+
if (isQR && !startQR) {
215+
lineStyle.lineHeight = 0.5;
216+
lineStyle.padding = 0;
217+
}
218+
if (startQR) {
219+
lineStyle.marginBottom = '1em';
220+
}
221+
if (endQR) {
222+
lineStyle.marginTop = '1em';
223+
}
224+
return (
225+
<div key={blockIndex} style={lineStyle}>
226+
{map(block, (content, contentIndex) => (
227+
<span
228+
key={contentIndex}
229+
style={{...style, backgroundColor: `rgb(${content.bg})`}}>
230+
{content.content}
231+
</span>
232+
))}
233+
</div>
234+
);
235+
});
236+
// map(
237+
// filter(
238+
// anser.ansiToJson(map(this.state.output, 'message').join('')),
239+
// 'was_processed',
240+
// ),
241+
// (block, index) => (
242+
// <div key={index} style={{color: block.fg || 'white'}}>
243+
// {block.content}
244+
// </div>
245+
// ),
246+
// )
247+
}
193248
stop = () => {
194249
if (!this.state.done) {
195250
this.ps.emit('kill');

‎app/redux/actions/appsActions.js

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import find from 'lodash/find';
66
import store from '../store';
77
import * as types from '../types';
88

9-
export const openApp = async (appPath, cb) => {
9+
export const openApp = async (appPath) => {
1010
try {
1111
let path;
1212
if (appPath) {
@@ -20,18 +20,16 @@ export const openApp = async (appPath, cb) => {
2020
}
2121
}
2222
if (path) {
23-
if (cb) {
24-
const unsub = store.subscribe(() => {
25-
const state = store.getState();
26-
if (state.selected.app === path && find(state.apps, {path})) {
27-
unsub();
28-
setTimeout(() => cb(path));
29-
}
30-
});
31-
}
3223
try {
3324
const info = await import(`${path}/package.json`);
34-
store.dispatch({type: types.OPEN_APP, payload: {path, info}});
25+
store.dispatch({
26+
type: types.OPEN_APP,
27+
payload: {
28+
path,
29+
info,
30+
isExpo: ('expo' in info.dependencies && 'react-native-scripts' in info.devDependencies),
31+
},
32+
});
3533
} catch (error) {
3634
store.dispatch({
3735
type: types.ERROR,

‎app/redux/reducers/appsReducer.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ const initialState = [];
77

88
const reducer = (state = initialState, action) => {
99
if (action.type === types.OPEN_APP) {
10-
return uniqBy([...state, {path: action.payload.path}], 'path');
10+
return uniqBy([...state, action.payload], 'path');
1111
}
1212
if (action.type === types.CLOSE_APP) {
1313
return reject(state, {path: action.payload.app.path});

‎app/styles/main.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,10 @@ export const consoleStyle = {
1818
boxShadow: '1px 1px 2px 2px rgba(0, 0, 0, 0.25)',
1919
color: '#fff',
2020
marginTop: 12,
21-
maxHeight: 300,
21+
maxHeight: 350,
2222
overflow: 'auto',
2323
padding: 10,
24+
lineHeight: 1.5,
2425
};
2526

2627
export const linkStyle = {

0 commit comments

Comments
 (0)