Add servers (#61)

* - Add server from logged session working

app/actions/actionsTypes.js

@@ -40,7 +40,13 @@ export const CREATE_CHANNEL = createRequestTypes('CREATE_CHANNEL', [
 	'RESET'
 ]);
 export const NAVIGATION = createRequestTypes('NAVIGATION', ['SET']);
-export const SERVER = createRequestTypes('SERVER', [...defaultTypes, 'SELECT', 'CHANGED', 'ADD']);
+export const SERVER = createRequestTypes('SERVER', [
+	...defaultTypes,
+	'SELECT',
+	'CHANGED',
+	'ADD',
+	'GOTO_ADD'
+]);
 export const METEOR = createRequestTypes('METEOR_CONNECT', [...defaultTypes, 'DISCONNECT']);
 export const LOGOUT = 'LOGOUT'; // logout is always success
 

app/actions/server.js

@@ -41,3 +41,9 @@ export function changedServer(server) {
 		server
 	};
 }
+
+export function gotoAddServer() {
+	return {
+		type: SERVER.GOTO_ADD
+	};
+}

app/containers/Routes.js

@@ -32,6 +32,7 @@ export default class Routes extends React.Component {
 	componentDidUpdate() {
 		NavigationService.setNavigator(this.navigator);
 	}
+
 	render() {
 		const { login, app } = this.props;
 

app/containers/Sidebar.js

@@ -5,7 +5,7 @@ import { DrawerItems } from 'react-navigation';
 import { connect } from 'react-redux';
 
 import realm from '../lib/realm';
-import { setServer } from '../actions/server';
+import { setServer, gotoAddServer } from '../actions/server';
 import { logout } from '../actions/login';
 
 const styles = StyleSheet.create({
@@ -41,14 +41,16 @@ const styles = StyleSheet.create({
 	server: state.server.server
 }), dispatch => ({
 	selectServer: server => dispatch(setServer(server)),
-	logout: () => dispatch(logout())
+	logout: () => dispatch(logout()),
+	gotoAddServer: () => dispatch(gotoAddServer())
 }))
 export default class Sidebar extends Component {
 	static propTypes = {
 		server: PropTypes.string.isRequired,
 		selectServer: PropTypes.func.isRequired,
 		navigation: PropTypes.object.isRequired,
-		logout: PropTypes.func.isRequired
+		logout: PropTypes.func.isRequired,
+		gotoAddServer: PropTypes.func.isRequired
 	}
 
 	componentWillMount() {
@@ -117,6 +119,15 @@ export default class Sidebar extends Component {
 							</Text>
 						</View>
 					</TouchableHighlight>
+					<TouchableHighlight
+						onPress={() => { this.props.gotoAddServer(); }}
+					>
+						<View style={styles.serverItem}>
+							<Text>
+								Add Server
+							</Text>
+						</View>
+					</TouchableHighlight>
 				</View>
 			</ScrollView>
 		);

app/lib/rocketchat.js

@@ -23,6 +23,8 @@ const call = (method, ...params) => new Promise((resolve, reject) => {
 const TOKEN_KEY = 'reactnativemeteor_usertoken';
 
 const RocketChat = {
+	TOKEN_KEY,
+
 	createChannel({ name, users, type }) {
 		return new Promise((resolve, reject) => {
 			Meteor.call(type ? 'createChannel' : 'createPrivateGroup', name, users, type, (err, res) => (err ? reject(err) : resolve(res)));
@@ -449,6 +451,7 @@ const RocketChat = {
 	},
 	logout({ server }) {
 		Meteor.logout();
+		Meteor.disconnect();
 		AsyncStorage.removeItem(TOKEN_KEY);
 		AsyncStorage.removeItem(`${ TOKEN_KEY }-${ server }`);
 	}

app/sagas/login.js

@@ -19,7 +19,6 @@ import {
 import RocketChat from '../lib/rocketchat';
 import * as NavigationService from '../containers/routes/NavigationService';
 
-const TOKEN_KEY = 'reactnativemeteor_usertoken';
 const getUser = state => state.login;
 const getServer = state => state.server.server;
 const loginCall = args => (args.resume ? RocketChat.login(args) : RocketChat.loginWithPassword(args));
@@ -31,11 +30,11 @@ const forgotPasswordCall = args => RocketChat.forgotPassword(args);
 
 const getToken = function* getToken() {
 	const currentServer = yield select(getServer);
-	const user = yield call([AsyncStorage, 'getItem'], `${ TOKEN_KEY }-${ currentServer }`);
+	const user = yield call([AsyncStorage, 'getItem'], `${ RocketChat.TOKEN_KEY }-${ currentServer }`);
 	if (user) {
 		try {
 			yield put(setToken(JSON.parse(user)));
-			yield call([AsyncStorage, 'setItem'], TOKEN_KEY, JSON.parse(user).token || '');
+			yield call([AsyncStorage, 'setItem'], RocketChat.TOKEN_KEY, JSON.parse(user).token || '');
 			return JSON.parse(user);
 		} catch (e) {
 			console.log('getTokenerr', e);
@@ -61,8 +60,8 @@ const handleLoginWhenServerChanges = function* handleLoginWhenServerChanges() {
 
 const saveToken = function* saveToken() {
 	const [server, user] = yield all([select(getServer), select(getUser)]);
-	yield AsyncStorage.setItem(TOKEN_KEY, user.token);
+	yield AsyncStorage.setItem(RocketChat.TOKEN_KEY, user.token);
-	yield AsyncStorage.setItem(`${ TOKEN_KEY }-${ server }`, JSON.stringify(user));
+	yield AsyncStorage.setItem(`${ RocketChat.TOKEN_KEY }-${ server }`, JSON.stringify(user));
 };
 
 const handleLoginRequest = function* handleLoginRequest({ credentials }) {

app/sagas/selectServer.js

@@ -1,12 +1,13 @@
 import { put, takeEvery, call, takeLatest, race, take } from 'redux-saga/effects';
 import { delay } from 'redux-saga';
 import { AsyncStorage } from 'react-native';
-// import { Navigation } from 'react-native-navigation';
 import { SERVER } from '../actions/actionsTypes';
 import { connectRequest, disconnect } from '../actions/connect';
-import { changedServer, serverSuccess, serverFailure, serverRequest } from '../actions/server';
+import { changedServer, serverSuccess, serverFailure, serverRequest, setServer } from '../actions/server';
+import { logout } from '../actions/login';
 import RocketChat from '../lib/rocketchat';
 import realm from '../lib/realm';
+import * as NavigationService from '../containers/routes/NavigationService';
 
 const validate = function* validate(server) {
 	return yield RocketChat.testServer(server);
@@ -42,13 +43,21 @@ const addServer = function* addServer({ server }) {
 		realm.write(() => {
 			realm.create('servers', { id: server, current: false }, true);
 		});
+		yield put(setServer(server));
 	}
 };
 
+const handleGotoAddServer = function* handleGotoAddServer() {
+	yield put(logout());
+	yield call(AsyncStorage.removeItem, RocketChat.TOKEN_KEY);
+	yield delay(1000);
+	yield call(NavigationService.navigate, 'AddServer');
+};
 
 const root = function* root() {
 	yield takeLatest(SERVER.REQUEST, validateServer);
 	yield takeEvery(SERVER.SELECT, selectServer);
 	yield takeEvery(SERVER.ADD, addServer);
+	yield takeEvery(SERVER.GOTO_ADD, handleGotoAddServer);
 };
 export default root;

app/views/LoginView.js

@@ -114,12 +114,15 @@ class LoginView extends React.Component {
 
 						{this.renderTOTP()}
 
-						<TouchableOpacity style={styles.buttonContainer}>
+						<TouchableOpacity
-							<Text style={styles.button} onPress={this.submit}>LOGIN</Text>
+							style={styles.buttonContainer}
+							onPress={this.submit}
+						>
+							<Text style={styles.button}>LOGIN</Text>
 						</TouchableOpacity>
 
-						<TouchableOpacity style={styles.buttonContainer}>
+						<TouchableOpacity style={styles.buttonContainer} onPress={this.register}>
-							<Text style={styles.button} onPress={this.register}>REGISTER</Text>
+							<Text style={styles.button}>REGISTER</Text>
 						</TouchableOpacity>
 
 						<TouchableOpacity style={styles.buttonContainer} onPress={this.termsService}>

app/views/RegisterView.js

@@ -119,12 +119,14 @@ class RegisterView extends React.Component {
 					placeholder={this.props.Accounts_RepeatPasswordPlaceholder || 'Repeat Password'}
 				/>
 
-				<TouchableOpacity style={[styles.buttonContainer, styles.registerContainer]}>
+				<TouchableOpacity
+					style={[styles.buttonContainer, styles.registerContainer]}
+					onPress={this.submit}
+				>
 					<Text
 						style={[styles.button, this._valid() ? {}
 							: { color: placeholderTextColor }
 						]}
-						onPress={this.submit}
 					>REGISTER</Text>
 				</TouchableOpacity>
 
@@ -151,11 +153,11 @@ class RegisterView extends React.Component {
 					placeholder={this.props.Accounts_UsernamePlaceholder || 'Username'}
 				/>
 
-				<TouchableOpacity style={[styles.buttonContainer, styles.registerContainer]}>
+				<TouchableOpacity
-					<Text
+					style={[styles.buttonContainer, styles.registerContainer]}
-						style={styles.button}
 					onPress={this.usernameSubmit}
-					>REGISTER</Text>
+				>
+					<Text style={styles.button}>REGISTER</Text>
 				</TouchableOpacity>
 
 				{this.props.login.failure && <Text style={styles.error}>{this.props.login.error.reason}</Text>}