Merge pull request #21 from co2-git/feature/16

Fix #16

Author: co2-git

.flowconfig

@@ -13,6 +13,8 @@
 ./flow/app.js.flow
 ./app/components/App/App.js.flow
 ./app/components/App/AppBar.js.flow
+./app/components/Base/Animated.js.flow
+./app/components/FlexBox/Flex.js.flow
 ./app/components/Layout/AppCard.js.flow
 ./app/components/Layout/Header.js.flow
 ./app/components/Layout/Home.js.flow
@@ -23,6 +25,7 @@
 ./app/components/Layout/Router.js.flow
 ./app/components/ReactNative/Info.js.flow
 ./app/components/Terminal/Console.js.flow
+./app/lib/exec.js.flow
 
 [options]
 emoji=true

app/App.js

@@ -12,9 +12,13 @@ const Loading = () => (
   <div>Loading</div>
 );
 
+const persistor = persistStore(store);
+
+// persistor.purge();
+
 const App = () => (
   <Provider store={store}>
-    <PersistGate loading={<Loading />} persistor={persistStore(store)}>
+    <PersistGate loading={<Loading />} persistor={persistor}>
       <Layout />
     </PersistGate>
   </Provider>

app/components/Base/Animated.js

@@ -1,3 +1,4 @@
+// @flow
 import React from 'react';
 import omit from 'lodash/omit';
 
@@ -80,7 +81,7 @@ const effects = [
   'slideOutUp',
 ];
 
-const Animated = (props) => {
+const Animated = (props: $AnimatedProps) => {
   const names = ['animated'];
   const remove = [];
   for (const effect of effects) {

app/components/Base/Animated.js.flow

@@ -0,0 +1,8 @@
+// @flow
+
+declare type $AnimatedReactProps = {
+  +children?: any,
+};
+
+declare type $AnimatedProps =
+  & $AnimatedReactProps;

app/components/FlexBox/Flex.js

@@ -1,9 +1,6 @@
+// @flow
 import React from 'react';
 
-type $FlexProps = {
-  children: any,
-};
-
 const makeStyle = (props: $FlexProps) => {
   const {style: propsStyle = {}} = props;
   const style = {...propsStyle, display: 'flex', flexDirection: 'row'};

app/components/FlexBox/Flex.js.flow

@@ -0,0 +1,8 @@
+// @flow
+
+declare type $FlexReactProps = {
+  children: any,
+};
+
+declare type $FlexProps =
+  & $FlexReactProps;

app/components/Layout/Init.js

@@ -67,7 +67,7 @@ class Init extends PureComponent<$InitProps, $InitState> {
   };
   onToggle = (
     event: SyntheticInputEvent<HTMLInputElement>,
-    isInputChecked: boolean
+    isInputChecked: boolean,
   ) => this.setState({expo: isInputChecked});
   onChangeName = (event: SyntheticInputEvent<HTMLInputElement>) => this.setState({
     name: event.target.value,

app/components/Layout/Page.js

@@ -1,3 +1,4 @@
+// @flow
 import React from 'react';
 
 import {pageStyle} from '../../styles/main';

app/components/Terminal/Console.js

@@ -1,16 +1,17 @@
 // @flow
-import map from 'lodash/map';
-import React, {PureComponent} from 'react';
 import {Card, CardHeader, CardActions} from 'material-ui/Card';
-import Chip from 'material-ui/Chip';
+import {green800, redA700} from 'material-ui/styles/colors';
 import Avatar from 'material-ui/Avatar';
-import OpenFolderIcon from 'material-ui/svg-icons/file/folder-open';
-import TermIcon from 'material-ui/svg-icons/action/code';
-import stripAnsi from 'strip-ansi';
+import Chip from 'material-ui/Chip';
 import DoneIcon from 'material-ui/svg-icons/action/done';
 import ErrorIcon from 'material-ui/svg-icons/alert/error';
-import {green800, redA700} from 'material-ui/styles/colors';
+import map from 'lodash/map';
+import OpenFolderIcon from 'material-ui/svg-icons/file/folder-open';
+import React, {PureComponent} from 'react';
+import stripAnsi from 'strip-ansi';
+import TermIcon from 'material-ui/svg-icons/action/code';
 
+import {consoleStyle} from '../../styles/main';
 import exec from '../../lib/exec';
 import Row from '../FlexBox/Row';
 
@@ -96,7 +97,7 @@ class Terminal extends PureComponent<$TerminalProps, $TerminalState> {
             {this.props.cwd}
           </Chip>
         </Row>
-        <div style={styles.console} id="terminal">
+        <div style={consoleStyle} id="terminal">
           {map(this.state.output, (output, index) => {
             const lines = stripAnsi(output.message).split('\n');
             return (
@@ -113,16 +114,3 @@ class Terminal extends PureComponent<$TerminalProps, $TerminalState> {
 }
 
 export default Terminal;
-
-const styles = {
-  console: {
-    backgroundColor: '#000',
-    borderRadius: 8,
-    boxShadow: '1px 1px 2px 2px rgba(0, 0, 0, 0.25)',
-    color: '#fff',
-    marginTop: 12,
-    maxHeight: 300,
-    overflow: 'auto',
-    padding: 10,
-  },
-};