Components moved to 'containers' or 'presentation' folders.

Extracted some components from Message component to have less logic in component.

.vscode/launch.json

@@ -0,0 +1,41 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Debug Android",
+      "program": "${workspaceRoot}/.vscode/launchReactNative.js",
+      "type": "reactnative",
+      "request": "launch",
+      "platform": "android",
+      "sourceMaps": true,
+      "outDir": "${workspaceRoot}/.vscode/.react"
+    },
+    {
+      "name": "Debug iOS",
+      "program": "${workspaceRoot}/.vscode/launchReactNative.js",
+      "type": "reactnative",
+      "request": "launch",
+      "platform": "ios",
+      "target": "iPhone 6s",
+      "sourceMaps": true,
+      "outDir": "${workspaceRoot}/.vscode/.react"
+    },
+    {
+      "name": "Attach to packager",
+      "program": "${workspaceRoot}/.vscode/launchReactNative.js",
+      "type": "reactnative",
+      "request": "attach",
+      "sourceMaps": true,
+      "outDir": "${workspaceRoot}/.vscode/.react"
+    },
+    {
+      "name": "Debug in Exponent",
+      "program": "${workspaceRoot}/.vscode/launchReactNative.js",
+      "type": "reactnative",
+      "request": "launch",
+      "platform": "exponent",
+      "sourceMaps": true,
+      "outDir": "${workspaceRoot}/.vscode/.react"
+    }
+  ]
+}

app/containers/Message.js

@@ -1,13 +1,12 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { View, Text, StyleSheet } from 'react-native';
+import { View, StyleSheet } from 'react-native';
-import { CachedImage } from 'react-native-img-cache';
 import { emojify } from 'react-emojione';
 import Markdown from 'react-native-easy-markdown';
-import moment from 'moment';
 
-import avatarInitialsAndColor from '../utils/avatarInitialsAndColor';
 import Card from './message/card';
+import Avatar from './message/Avatar';
+import User from './message/User';
 
 const styles = StyleSheet.create({
 	content: {
@@ -72,9 +71,11 @@ export default class Message extends React.PureComponent {
 		baseUrl: PropTypes.string.isRequired,
 		Message_TimeFormat: PropTypes.string.isRequired
 	}
+
 	attachments() {
 		return this.props.item.attachments.length ? <Card data={this.props.item.attachments[0]} /> : null;
 	}
+
 	render() {
 		const { item } = this.props;
 
@@ -85,36 +86,15 @@ export default class Message extends React.PureComponent {
 
 		const msg = emojify(item.msg, { output: 'unicode' });
 
-		const username = item.alias || item.u.username;
-
-		let { initials, color } = avatarInitialsAndColor(username);
-
-		const avatar = item.avatar || `${ this.props.baseUrl }/avatar/${ item.u.username }`;
-		if (item.avatar) {
-			initials = '';
-			color = 'transparent';
-		}
-
-		let aliasUsername;
-		if (item.alias) {
-			aliasUsername = <Text style={styles.alias}>@{item.u.username}</Text>;
-		}
-
-		const time = moment(item.ts).format(this.props.Message_TimeFormat);
-
 		return (
 			<View style={[styles.message, extraStyle]}>
-				<View style={[styles.avatarContainer, { backgroundColor: color }]}>
+				<Avatar item={item} baseUrl={this.props.baseUrl} />
-					<Text style={styles.avatarInitials}>{initials}</Text>
-					<CachedImage style={styles.avatar} source={{ uri: avatar }} />
-				</View>
 				<View style={[styles.content]}>
-					<View style={styles.usernameView}>
+					<User
-						<Text onPress={this._onPress} style={styles.username}>
+						onPress={this._onPress}
-							{username}
+						item={item}
-						</Text>
+						Message_TimeFormat={this.props.Message_TimeFormat}
-						{aliasUsername}<Text style={styles.time}>{time}</Text>
+					/>
-					</View>
 					{this.attachments()}
 					<Markdown>
 						{msg}

app/containers/message/Avatar.js

@@ -0,0 +1,55 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { View, Text, StyleSheet } from 'react-native';
+import { CachedImage } from 'react-native-img-cache';
+
+import avatarInitialsAndColor from '../../utils/avatarInitialsAndColor';
+
+const styles = StyleSheet.create({
+	avatarContainer: {
+		backgroundColor: '#eee',
+		width: 40,
+		height: 40,
+		marginRight: 10,
+		borderRadius: 5
+	},
+	avatar: {
+		width: 40,
+		height: 40,
+		borderRadius: 5,
+		position: 'absolute'
+	},
+	avatarInitials: {
+		margin: 2,
+		textAlign: 'center',
+		lineHeight: 36,
+		fontSize: 22,
+		color: '#ffffff'
+	}
+});
+
+export default class Message extends React.PureComponent {
+	static propTypes = {
+		item: PropTypes.object.isRequired,
+		baseUrl: PropTypes.string
+	}
+
+	render() {
+		const { item } = this.props;
+
+		const username = item.alias || item.u.username;
+
+		const { initials, color } = avatarInitialsAndColor(username);
+
+		const avatar = item.avatar || `${ this.props.baseUrl }/avatar/${ item.u.username }`;
+		const avatarInitials = item.avatar ? '' : initials;
+		const avatarColor = item.avatar ? 'transparent' : color;
+
+		return (
+			<View style={[styles.avatarContainer, { backgroundColor: avatarColor }]}>
+				<Text style={styles.avatarInitials}>{avatarInitials}</Text>
+				<CachedImage style={styles.avatar} source={{ uri: avatar }} />
+			</View>
+		);
+	}
+}

app/containers/message/User.js

@@ -0,0 +1,55 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { View, Text, StyleSheet } from 'react-native';
+import moment from 'moment';
+
+const styles = StyleSheet.create({
+	username: {
+		fontWeight: 'bold'
+	},
+	usernameView: {
+		flexDirection: 'row',
+		alignItems: 'center',
+		marginBottom: 2
+	},
+	alias: {
+		fontSize: 10,
+		color: '#888',
+		paddingLeft: 5
+	},
+	time: {
+		fontSize: 10,
+		color: '#888',
+		paddingLeft: 5
+	}
+});
+
+export default class Message extends React.PureComponent {
+	static propTypes = {
+		item: PropTypes.object.isRequired,
+		Message_TimeFormat: PropTypes.string.isRequired,
+		onPress: PropTypes.func
+	}
+
+	render() {
+		const { item } = this.props;
+
+		const extraStyle = {};
+		if (item.temp) {
+			extraStyle.opacity = 0.3;
+		}
+
+		const username = item.alias || item.u.username;
+		const aliasUsername = item.alias ? (<Text style={styles.alias}>@{item.u.username}</Text>) : null;
+		const time = moment(item.ts).format(this.props.Message_TimeFormat);
+
+		return (
+			<View style={styles.usernameView}>
+				<Text onPress={this.props.onPress} style={styles.username}>
+					{username}
+				</Text>
+				{aliasUsername}<Text style={styles.time}>{time}</Text>
+			</View>
+		);
+	}
+}

app/containers/message/card.js

@@ -40,6 +40,7 @@ export default class Cards extends React.PureComponent {
 		data: PropTypes.object.isRequired,
 		base: PropTypes.string
 	}
+
 	constructor() {
 		super();
 		const user = Meteor.user();
@@ -48,6 +49,32 @@ export default class Cards extends React.PureComponent {
 			this.setState({ img: `${ this.props.base }${ this.props.data.image_url }?rc_uid=${ user._id }&rc_token=${ token }` });
 		});
 	}
+
+	getImage() {
+		return (
+			<TouchableOpacity onPress={() => this._onPressButton()}>
+				<Card>
+					<CardImage style={{ width: 256, height: 256 }}>
+						<CachedImage
+							style={{ width: 256, height: 256 }}
+							source={{ uri: encodeURI(this.state.img) }}
+						/>
+					</CardImage>
+					<CardContent>
+						<Text style={[{ fontSize: 12, alignSelf: 'center', fontStyle: 'italic' }]}>{this.props.data.title}</Text>
+						<Text style={{ alignSelf: 'center', fontWeight: 'bold' }}>{this.props.data.description}</Text>
+					</CardContent>
+				</Card>
+			</TouchableOpacity>
+		);
+	}
+
+	getOther() {
+		return (
+			<Text style={[{ fontSize: 12, alignSelf: 'center', fontStyle: 'italic' }]}>{this.props.data.title}</Text>
+		);
+	}
+
 	_onPressButton() {
 		Navigation.showModal({
 			screen: 'Photo',
@@ -66,23 +93,8 @@ export default class Cards extends React.PureComponent {
 			animationType: 'slide-up' // 'none' / 'slide-up' , appear animation for the modal (optional, default 'slide-up')
 		});
 	}
+
 	render() {
-		return this.state.img ? (
+		return this.state.img ? this.getImage() : this.getOther();
-			<TouchableOpacity onPress={() => this._onPressButton()}>
-				<Card>
-					<CardImage style={{ width: 256, height: 256 }}>
-						<CachedImage
-							style={{ width: 256, height: 256 }}
-							source={{ uri: encodeURI(this.state.img) }}
-						/>
-					</CardImage>
-					<CardContent>
-						<Text style={[{ fontSize: 12, alignSelf: 'center', fontStyle: 'italic' }]}>{this.props.data.title}</Text>
-						<Text style={{ alignSelf: 'center', fontWeight: 'bold' }}>{this.props.data.description}</Text>
-					</CardContent>
-				</Card>
-			</TouchableOpacity>
-		) :
-			<Text style={[{ fontSize: 12, alignSelf: 'center', fontStyle: 'italic' }]}>{this.props.data.title}</Text>;
 	}
 }

app/presentation/RoomItem.js

@@ -80,8 +80,9 @@ export default class RoomItem extends React.PureComponent {
 			return null;
 		}
 
-		if (type === 'd') {
 		const { initials, color } = avatarInitialsAndColor(name);
+
+		if (type === 'd') {
 			return (
 				<View style={[styles.iconContainer, { backgroundColor: color }]}>
 					<Text style={styles.avatarInitials}>{initials}</Text>
@@ -90,8 +91,6 @@ export default class RoomItem extends React.PureComponent {
 			);
 		}
 
-		const { color } = avatarInitialsAndColor(name);
-
 		return (
 			<View style={[styles.iconContainer, { backgroundColor: color }]}>
 				<MaterialCommunityIcons name={icon} style={styles.icon} />

app/views/login.js

@@ -8,7 +8,7 @@ import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 // import * as actions from '../actions';
 import * as loginActions from '../actions/login';
-import KeyboardView from '../components/KeyboardView';
+import KeyboardView from '../presentation/KeyboardView';
 // import { Keyboard } from 'react-native'
 
 const styles = StyleSheet.create({

app/views/room.js

@@ -10,9 +10,9 @@ import { messagesRequest } from '../actions/messages';
 import realm from '../lib/realm';
 import RocketChat from '../lib/rocketchat';
 import debounce from '../utils/throttle';
-import Message from '../components/Message';
+import Message from '../containers/Message';
-import MessageBox from '../components/MessageBox';
+import MessageBox from '../containers/MessageBox';
-import KeyboardView from '../components/KeyboardView';
+import KeyboardView from '../presentation/KeyboardView';
 
 const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
 const styles = StyleSheet.create({

app/views/roomsList.js

@@ -9,8 +9,8 @@ import * as actions from '../actions';
 import * as server from '../actions/connect';
 import realm from '../lib/realm';
 import RocketChat from '../lib/rocketchat';
-import RoomItem from '../components/RoomItem';
+import RoomItem from '../presentation/RoomItem';
-import Banner from '../components/banner';
+import Banner from '../containers/Banner';
 
 const styles = StyleSheet.create({
 	container: {

app/views/serverList.js

@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 import { setServer } from '../actions/server';
 import realm from '../lib/realm';
 import Fade from '../animations/fade';
-import Banner from '../components/banner';
+import Banner from '../containers/Banner';
 
 const styles = StyleSheet.create({
 	view: {

app/views/serverNew.js

@@ -5,7 +5,7 @@ import { Text, TextInput, View, StyleSheet } from 'react-native';
 import _ from 'underscore';
 import realm from '../lib/realm';
 
-import KeyboardView from '../components/KeyboardView';
+import KeyboardView from '../presentation/KeyboardView';
 
 const styles = StyleSheet.create({
 	view: {

yarn.lock

@@ -19,6 +19,15 @@
   dependencies:
     "@storybook/addons" "^3.2.0"
 
+"@storybook/addon-storyshots@^3.2.6":
+  version "3.2.8"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-storyshots/-/addon-storyshots-3.2.8.tgz#f6e9aa6c99a9f437042da49123c0dc75fe51b90f"
+  dependencies:
+    babel-runtime "^6.23.0"
+    global "^4.3.2"
+    prop-types "^15.5.10"
+    read-pkg-up "^2.0.0"
+
 "@storybook/addons@^3.2.0":
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-3.2.0.tgz#e1446cc5613af179701673276267cee71859bf41"
@@ -214,7 +223,7 @@ amdefine@>=0.0.4:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5"
 
-ansi-escapes@^1.4.0:
+ansi-escapes@^1.1.0, ansi-escapes@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-1.4.0.tgz#d3a8a83b319aa67793662b13e761c7911422306e"
 
@@ -278,6 +287,10 @@ argparse@^1.0.7:
   dependencies:
     sprintf-js "~1.0.2"
 
+argv@0.0.2:
+  version "0.0.2"
+  resolved "https://registry.yarnpkg.com/argv/-/argv-0.0.2.tgz#ecbd16f8949b157183711b1bda334f37840185ab"
+
 aria-query@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-0.7.0.tgz#4af10a1e61573ddea0cf3b99b51c52c05b424d24"
@@ -1072,7 +1085,15 @@ babel-plugin-transform-strict-mode@^6.24.1:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-polyfill@^6.20.0, babel-polyfill@^6.23.0:
+babel-polyfill@6.23.0:
+  version "6.23.0"
+  resolved "https://registry.yarnpkg.com/babel-polyfill/-/babel-polyfill-6.23.0.tgz#8364ca62df8eafb830499f699177466c3b03499d"
+  dependencies:
+    babel-runtime "^6.22.0"
+    core-js "^2.4.0"
+    regenerator-runtime "^0.10.0"
+
+babel-polyfill@^6.20.0, babel-polyfill@^6.23.0, babel-polyfill@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz#379937abc67d7895970adc621f284cd966cf2153"
   dependencies:
@@ -1684,7 +1705,7 @@ chain-function@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/chain-function/-/chain-function-1.0.0.tgz#0d4ab37e7e18ead0bdc47b920764118ce58733dc"
 
-chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3:
+chalk@1.1.3, chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
   dependencies:
@@ -1794,6 +1815,14 @@ code-point-at@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77"
 
+codecov@^2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/codecov/-/codecov-2.3.0.tgz#ad25a2c6e0442d13740d9d4ddbb9a3e2714330f4"
+  dependencies:
+    argv "0.0.2"
+    request "2.81.0"
+    urlgrey "0.4.4"
+
 color-convert@^1.3.0, color-convert@^1.9.0:
   version "1.9.0"
   resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.0.tgz#1accf97dd739b983bf994d56fec8f95853641b7a"
@@ -2819,7 +2848,7 @@ extend@~3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.1.tgz#a755ea7bc1adfcc5a31ce7e762dbaadc5e636444"
 
-external-editor@^2.0.4:
+external-editor@^2.0.1, external-editor@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/external-editor/-/external-editor-2.0.4.tgz#1ed9199da9cbfe2ef2f7a31b2fde8b0d12368972"
   dependencies:
@@ -3495,6 +3524,24 @@ inline-style-prefixer@^3.0.6:
     bowser "^1.6.0"
     css-in-js-utils "^1.0.3"
 
+inquirer@3.0.6:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-3.0.6.tgz#e04aaa9d05b7a3cb9b0f407d04375f0447190347"
+  dependencies:
+    ansi-escapes "^1.1.0"
+    chalk "^1.0.0"
+    cli-cursor "^2.1.0"
+    cli-width "^2.0.0"
+    external-editor "^2.0.1"
+    figures "^2.0.0"
+    lodash "^4.3.0"
+    mute-stream "0.0.7"
+    run-async "^2.2.0"
+    rx "^4.1.0"
+    string-width "^2.0.0"
+    strip-ansi "^3.0.0"
+    through "^2.3.6"
+
 inquirer@^3.0.6:
   version "3.2.1"
   resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-3.2.1.tgz#06ceb0f540f45ca548c17d6840959878265fa175"
@@ -4275,6 +4322,10 @@ lodash.isarray@^3.0.0:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/lodash.isarray/-/lodash.isarray-3.0.4.tgz#79e4eb88c36a8122af86f844aa9bcd851b5fbb55"
 
+lodash.isequal@^4.5.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
+
 lodash.keys@^3.0.0, lodash.keys@^3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/lodash.keys/-/lodash.keys-3.1.2.tgz#4dbc0472b156be50a0b286855d1bd0b0c656098a"
@@ -4557,7 +4608,7 @@ minimist@0.0.8:
   version "0.0.8"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
 
-minimist@^1.1.0, minimist@^1.1.1, minimist@^1.2.0:
+minimist@1.2.0, minimist@^1.1.0, minimist@^1.1.1, minimist@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
 
@@ -4585,10 +4636,20 @@ mkdirp@0.5.0:
   dependencies:
     minimist "0.0.8"
 
+mobx-react@^4.2.1:
+  version "4.2.2"
+  resolved "https://registry.yarnpkg.com/mobx-react/-/mobx-react-4.2.2.tgz#db9cc3cafefbd830d0584c1149af5aae67829201"
+  dependencies:
+    hoist-non-react-statics "^1.2.0"
+
 mobx@^2.3.4:
   version "2.7.0"
   resolved "https://registry.yarnpkg.com/mobx/-/mobx-2.7.0.tgz#cf3d82d18c0ca7f458d8f2a240817b3dc7e54a01"
 
+mobx@^3.1.16:
+  version "3.2.2"
+  resolved "https://registry.yarnpkg.com/mobx/-/mobx-3.2.2.tgz#aa671459bededfd9880c948889a3f62bce09279c"
+
 moment@^2.18.1:
   version "2.18.1"
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.18.1.tgz#c36193dd3ce1c2eed2adb7c802dbbc77a81b1c0f"
@@ -4648,6 +4709,13 @@ negotiator@0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.1.tgz#2b327184e8992101177b28563fb5e7102acd0ca9"
 
+node-fetch@1.6.3:
+  version "1.6.3"
+  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.6.3.tgz#dc234edd6489982d58e8f0db4f695029abcd8c04"
+  dependencies:
+    encoding "^0.1.11"
+    is-stream "^1.0.1"
+
 node-fetch@^1.0.1, node-fetch@^1.3.3, node-fetch@^1.6.3:
   version "1.7.2"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.2.tgz#c54e9aac57e432875233525f3c891c4159ffefd7"
@@ -4825,6 +4893,24 @@ onetime@^2.0.0:
   dependencies:
     mimic-fn "^1.0.0"
 
+opencollective@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/opencollective/-/opencollective-1.0.3.tgz#aee6372bc28144583690c3ca8daecfc120dd0ef1"
+  dependencies:
+    babel-polyfill "6.23.0"
+    chalk "1.1.3"
+    inquirer "3.0.6"
+    minimist "1.2.0"
+    node-fetch "1.6.3"
+    opn "4.0.2"
+
+opn@4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/opn/-/opn-4.0.2.tgz#7abc22e644dff63b0a96d5ab7f2790c0f01abc95"
+  dependencies:
+    object-assign "^4.0.1"
+    pinkie-promise "^2.0.0"
+
 opn@^3.0.2:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/opn/-/opn-3.0.3.tgz#b6d99e7399f78d65c3baaffef1fb288e9b85243a"
@@ -5649,6 +5735,12 @@ react-native-autogrow-textinput@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/react-native-autogrow-textinput/-/react-native-autogrow-textinput-4.1.0.tgz#a7e5b17eb3c16ab08e31bbfb88d92488ed87f276"
 
+react-native-button@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/react-native-button/-/react-native-button-2.1.0.tgz#a39e23292922afeea4f7be141dd43e18f1b51876"
+  dependencies:
+    prop-types "^15.5.10"
+
 react-native-card-view@0.0.3:
   version "0.0.3"
   resolved "https://registry.yarnpkg.com/react-native-card-view/-/react-native-card-view-0.0.3.tgz#8db9ac4a3f01d08f8bd9f79343082d87fdf09907"
@@ -5704,6 +5796,14 @@ react-native-img-cache@^1.4.0:
   dependencies:
     crypto-js "^3.1.9-1"
 
+react-native-loader@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/react-native-loader/-/react-native-loader-1.1.0.tgz#9e87e88d5b0a03a26b28591b23da73408a189e47"
+
+react-native-loading-spinner-overlay@^0.5.1:
+  version "0.5.2"
+  resolved "https://registry.yarnpkg.com/react-native-loading-spinner-overlay/-/react-native-loading-spinner-overlay-0.5.2.tgz#b7bcd277476d596615fd7feee601789f9bdc7acc"
+
 react-native-meteor@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/react-native-meteor/-/react-native-meteor-1.1.0.tgz#55a91efe2d466d3a8cceb5b5419799aeedcd6756"
@@ -5729,6 +5829,18 @@ react-native-optimized-flatlist@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/react-native-optimized-flatlist/-/react-native-optimized-flatlist-1.0.1.tgz#dbee82f208b48bef23c6cb26f1d5f3ac58e675b2"
 
+react-native-router-flux@^4.0.0-beta.18:
+  version "4.0.0-beta.21"
+  resolved "https://registry.yarnpkg.com/react-native-router-flux/-/react-native-router-flux-4.0.0-beta.21.tgz#cdbb3cec5b18fab0ffdb8abf38ce790749f625d0"
+  dependencies:
+    lodash.isequal "^4.5.0"
+    mobx "^3.1.16"
+    mobx-react "^4.2.1"
+    opencollective "^1.0.3"
+    prop-types "^15.5.10"
+    react-native-button "^2.0.0"
+    react-navigation "^1.0.0-beta.11"
+
 react-native-svg-image@^1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/react-native-svg-image/-/react-native-svg-image-1.1.4.tgz#4c7af4edb5ec5146e1e47c5d2af211dd0528415c"
@@ -6064,9 +6176,9 @@ redux-logger@^3.0.6:
   dependencies:
     deep-diff "^0.3.5"
 
-redux-thunk@^2.2.0:
+redux-saga@^0.15.6:
-  version "2.2.0"
+  version "0.15.6"
-  resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.2.0.tgz#e615a16e16b47a19a515766133d1e3e99b7852e5"
+  resolved "https://registry.yarnpkg.com/redux-saga/-/redux-saga-0.15.6.tgz#8638dc522de6c6c0a496fe8b2b5466287ac2dc4d"
 
 redux@^3.6.0, redux@^3.7.2:
   version "3.7.2"
@@ -6081,7 +6193,7 @@ regenerate@^1.2.1:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.3.2.tgz#d1941c67bad437e1be76433add5b385f95b19260"
 
-regenerator-runtime@^0.10.5:
+regenerator-runtime@^0.10.0, regenerator-runtime@^0.10.5:
   version "0.10.5"
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz#336c3efc1220adcedda2c9fab67b5a7955a33658"
 
@@ -6156,7 +6268,7 @@ replace-ext@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/replace-ext/-/replace-ext-0.0.1.tgz#29bbd92078a739f0bcce2b4ee41e837953522924"
 
-request@^2.78.0, request@^2.79.0, request@^2.81.0:
+request@2.81.0, request@^2.78.0, request@^2.79.0, request@^2.81.0:
   version "2.81.0"
   resolved "https://registry.yarnpkg.com/request/-/request-2.81.0.tgz#c6928946a0e06c5f8d6f8a9333469ffda46298a0"
   dependencies:
@@ -6277,6 +6389,10 @@ rx-lite@*, rx-lite@^4.0.8:
   version "4.0.8"
   resolved "https://registry.yarnpkg.com/rx-lite/-/rx-lite-4.0.8.tgz#0b1e11af8bc44836f04a6407e92da42467b79444"
 
+rx@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/rx/-/rx-4.1.0.tgz#a5f13ff79ef3b740fe30aa803fb09f98805d4782"
+
 safe-buffer@^5.0.1, safe-buffer@^5.1.0, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.1.tgz#893312af69b2123def71f57889001671eeb2c853"
@@ -7001,6 +7117,10 @@ url@^0.11.0:
     punycode "1.3.2"
     querystring "0.2.0"
 
+urlgrey@0.4.4:
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/urlgrey/-/urlgrey-0.4.4.tgz#892fe95960805e85519f1cd4389f2cb4cbb7652f"
+
 util-deprecate@1.0.2, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"