feat(circle-flow-eslint): first atempt add circle, add flow, eslint a…

…nd prettier

.eslintrc

@@ -0,0 +1,68 @@
+{
+  "parser": "babel-eslint",
+  "env": {
+    "browser": true,
+    "node": true,
+    "jest": true,
+    "es6": true,
+  },
+  "plugins": [
+    "react",
+    "react-native",
+    "flowtype",
+    "import"
+  ],
+  "parserOptions": {
+    "ecmaVersion": 6,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "modules": true
+    }
+  },
+  "extends": [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:import/errors"
+  ],
+  "rules": {
+    "comma-dangle": [2, "always-multiline"],
+    "quotes": [2, "single", { "allowTemplateLiterals": true }],
+    "react/prop-types": 0,
+    "no-case-declarations": 0,
+    "react/jsx-no-bind": 0,
+    "react/display-name": 0,
+    "new-cap": 0,
+    "react-native/no-unused-styles": 2,
+    "react-native/split-platform-components": 0,
+    "react-native/no-inline-styles": 0,
+    "react-native/no-color-literals": 0,
+    "no-unexpected-multiline": 0,
+    "no-class-assign": 1,
+    "no-console": 2,
+    "object-curly-spacing": [1, "always"],
+    "flowtype/define-flow-type": 1,
+    "flowtype/use-flow-type": 1,
+    "import/first": 2,
+    "import/default": 0,
+    "no-unused-vars": ["error", { "ignoreRestSiblings": true }],
+    "import/named": 0,
+    "import/namespace": [2, { "allowComputed": true }],
+    "no-extra-boolean-cast": 0,
+    "import/no-duplicates": 2
+  },
+  "settings": {
+    "import/resolver": {
+      "node": {
+        "extensions":[
+          ".js",
+          ".android.js",
+          ".ios.js",
+          ".json"
+        ]
+      }
+    }
+  },
+  "globals": {
+    "__DEV__": true
+  }
+}

.flowconfig

@@ -0,0 +1,12 @@
+[ignore]
+.*/node_modules/.*
+
+[include]
+
+[libs]
+
+[lints]
+
+[options]
+
+[strict]

changelog.js

@@ -0,0 +1,33 @@
+#!/usr/bin/env node
+
+const git = require('simple-git');
+const changelog = require('generate-changelog');
+const fs = require('fs');
+const idx = require('idx');
+const argv = require('minimist')(process.argv.slice(1));
+
+git().tags((err, tags) => {
+  const currentChangelog = fs.readFileSync('./CHANGELOG.md');
+  const matched = tags.latest.match(/v\d+.\d+.\d+-(\d+)/);
+  const build = (idx(matched, _ => Number(_[1])) || 0) + 1;
+
+  changelog
+    .generate({
+      major: argv.major,
+      minor: argv.minor,
+      patch: argv.patch,
+    })
+    .then(function(changelog) {
+      const rxVersion = /\d+\.\d+\.\d+/;
+      const newVersion = argv.version || idx(changelog.match(rxVersion), _ => _[0]) + `-${build}`;
+
+      changelog = changelog.replace(rxVersion, newVersion) + currentChangelog;
+      fs.writeFileSync('./CHANGELOG.md', changelog);
+
+      const addFile = c => git().add('CHANGELOG.md', c);
+      const commit = c => git().commit(`build(change-log): v${newVersion}`, c);
+      const addTag = c => git().addAnnotatedTag(`v${newVersion}`, `build(tag): v${newVersion}`, c);
+
+      addFile(() => commit(() => addTag()));
+    });
+});

commitlint.config.js

@@ -0,0 +1,30 @@
+module.exports = {
+  rules: {
+    'body-leading-blank': [1, 'always'],
+    'footer-leading-blank': [1, 'always'],
+    'header-max-length': [2, 'always', 80],
+    'scope-case': [2, 'always', 'lower-case'],
+    'subject-case': [2, 'never', ['sentence-case', 'start-case', 'pascal-case', 'upper-case']],
+    'subject-empty': [2, 'never'],
+    'subject-full-stop': [2, 'never', '.'],
+    'type-case': [2, 'always', 'lower-case'],
+    'type-empty': [2, 'never'],
+    'type-enum': [
+      2,
+      'always',
+      [
+        'build',
+        'chore',
+        'ci',
+        'docs',
+        'feat',
+        'fix',
+        'perf',
+        'refactor',
+        'revert',
+        'style',
+        'test',
+      ],
+    ],
+  },
+};

components/Button.js

@@ -1,35 +1,34 @@
+// @flow
+
 import React from 'react';
-import {StyleSheet, Text, TouchableOpacity, Image} from 'react-native';
+import { StyleSheet, Text, TouchableOpacity, Image } from 'react-native';
 
 const styles = StyleSheet.create({
   buttonText: {
     color: '#2c2c2c',
     textAlign: 'left',
     fontSize: 16,
     fontWeight: 'bold',
-    textAlignVertical: 'center'
+    textAlignVertical: 'center',
   },
   button: {
     height: 50,
     backgroundColor: 'white',
     padding: 10,
-    flexDirection: 'row'
+    flexDirection: 'row',
   },
   icon: {
     width: 28,
     height: 28,
     marginLeft: 10,
-    marginRight: 30
-  }
+    marginRight: 30,
+  },
 });
 
-export default ({buttonStyle, onPress, iconSrc, textStyle, children}) =>
-  <TouchableOpacity
-    activeOpacity={0.5}
-    style={[styles.button, buttonStyle]}
-    onPress={onPress}>
+// TODO - improve flow
+export default ({ buttonStyle, onPress, iconSrc, textStyle, children }: any) => (
+  <TouchableOpacity activeOpacity={0.5} style={[styles.button, buttonStyle]} onPress={onPress}>
     <Image style={styles.icon} source={iconSrc} />
-    <Text style={[styles.buttonText, textStyle]}>
-      {children}
-    </Text>
-  </TouchableOpacity>;
+    <Text style={[styles.buttonText, textStyle]}>{children}</Text>
+  </TouchableOpacity>
+);

components/Overlay.js

@@ -1,5 +1,7 @@
+// @flow
+
 import React from 'react';
-import {Animated, StyleSheet, TouchableHighlight} from 'react-native';
+import { Animated, StyleSheet } from 'react-native';
 
 const DEFAULT_ANIMATE_TIME = 300;
 const styles = StyleSheet.create({
@@ -9,42 +11,54 @@ const styles = StyleSheet.create({
     left: 0,
     right: 0,
     backgroundColor: 'transparent',
-    position: 'absolute'
+    position: 'absolute',
   },
   emptyOverlay: {
     width: 0,
     height: 0,
     backgroundColor: 'transparent',
-    position: 'absolute'
-  }
+    position: 'absolute',
+  },
 });
 
-export default class extends React.Component {
+type Props = {
+  visible: boolean,
+  onCancel: () => void,
+  children: React.Node,
+};
+
+type State = {
+  fadeAnim: Object,
+  overlayStyle: Object,
+};
+
+class Overlay extends React.Component<Props, State> {
   state = {
     fadeAnim: new Animated.Value(0),
-    overlayStyle: styles.emptyOverlay
+    overlayStyle: styles.emptyOverlay,
   };
 
   onAnimatedEnd() {
     if (!this.props.visible) {
-      this.setState({overlayStyle: styles.emptyOverlay});
+      this.setState({ overlayStyle: styles.emptyOverlay });
     }
   }
-  componentWillReceiveProps(newProps) {
+  UNSAFE_componentWillReceiveProps(newProps: Props) {
     if (newProps.visible) {
-      this.setState({overlayStyle: styles.fullOverlay});
+      this.setState({ overlayStyle: styles.fullOverlay });
     }
     return Animated.timing(this.state.fadeAnim, {
       toValue: newProps.visible ? 1 : 0,
-      duration: DEFAULT_ANIMATE_TIME
+      duration: DEFAULT_ANIMATE_TIME,
     }).start(this.onAnimatedEnd.bind(this));
   }
   render() {
     return (
-      <Animated.View
-        style={[this.state.overlayStyle, {opacity: this.state.fadeAnim}]}>
+      <Animated.View style={[this.state.overlayStyle, { opacity: this.state.fadeAnim }]}>
         {this.props.children}
       </Animated.View>
     );
   }
 }
+
+export default Overlay;

components/Sheet.js

@@ -1,26 +1,34 @@
+// @flow
+
 import React from 'react';
-import {Animated} from 'react-native';
+import { Animated } from 'react-native';
 
 const DEFAULT_BOTTOM = -300;
 const DEFAULT_ANIMATE_TIME = 300;
 
-export default class extends React.Component {
+type Props = {
+  visible: boolean,
+};
+
+type State = {
+  bottom: Object,
+};
+
+export default class extends React.Component<Props, State> {
   state = {
-    bottom: new Animated.Value(DEFAULT_BOTTOM)
+    bottom: new Animated.Value(DEFAULT_BOTTOM),
   };
 
-  componentWillReceiveProps(newProps) {
+  UNSAFE_componentWillReceiveProps(newProps: Props) {
     return Animated.timing(this.state.bottom, {
       toValue: newProps.visible ? 0 : DEFAULT_BOTTOM,
-      duration: DEFAULT_ANIMATE_TIME
+      duration: DEFAULT_ANIMATE_TIME,
     }).start();
   }
 
   render() {
     return (
-      <Animated.View style={{bottom: this.state.bottom}}>
-        {this.props.children}
-      </Animated.View>
+      <Animated.View style={{ bottom: this.state.bottom }}>{this.props.children}</Animated.View>
     );
   }
 }

config.yml

@@ -0,0 +1,37 @@
+version: 2
+executorType: docker
+jobs:
+  build:
+    resource_class: large
+    environment:
+      - GRADLE_OPTS: '-Dorg.gradle.jvmargs="-Xmx2048m -XX:+HeapDumpOnOutOfMemoryError"'
+      - REACT_NATIVE_MAX_WORKERS: 2
+      - ANDROID_BUILD_TOOLS_VERSION: "26.0.2"
+    working_directory: ~/app
+    docker:
+      - image: entria/react-native-android:0.1.72
+    steps:
+      - checkout
+      - restore_cache:
+          keys:
+            - v1-npm-{{ .Branch }}-{{ checksum "yarn.lock" }}
+            - v1-npm
+      - run:
+          name: Install Dependencies
+          command: yarn install
+      - run:
+          name: Lint
+          command: yarn lint
+      - run:
+          name: Run Checks
+          command: |
+            cd android
+            chmod +x ./gradlew && ./gradlew check
+      - save_cache:
+          key: v1-npm
+          paths:
+            - node_modules/
+      - save_cache:
+          key: v1-npm-{{ .Branch }}-{{ checksum "yarn.lock" }}
+          paths:
+            - node_modules/