Search

app/actions/actionsTypes.js

@@ -27,7 +27,7 @@ export const FORGOT_PASSWORD = createRequestTypes('FORGOT_PASSWORD', [
 	'INIT'
 ]);
 export const USER = createRequestTypes('USER', ['SET']);
-export const ROOMS = createRequestTypes('ROOMS');
+export const ROOMS = createRequestTypes('ROOMS', [...defaultTypes, 'SEARCH_REQUEST', 'SEARCH_SUCCESS', 'SEARCH_FAILURE']);
 export const ROOM = createRequestTypes('ROOM', ['ADD_USER_TYPING', 'REMOVE_USER_TYPING', 'SOMEONE_TYPING', 'OPEN', 'USER_TYPING']);
 export const APP = createRequestTypes('APP', ['READY', 'INIT']);
 export const MESSAGES = createRequestTypes('MESSAGES', [

app/actions/rooms.js

@@ -19,3 +19,23 @@ export function roomsFailure(err) {
 		err
 	};
 }
+
+export function searchRequest(searchText) {
+	return {
+		type: types.ROOMS.SEARCH_REQUEST,
+		searchText
+	};
+}
+
+export function searchSuccess() {
+	return {
+		type: types.ROOMS.SEARCH_SUCCESS
+	};
+}
+
+export function searchFailure(err) {
+	return {
+		type: types.ROOMS.SEARCH_FAILURE,
+		err
+	};
+}

app/reducers/index.js

@@ -4,6 +4,7 @@ import login from './login';
 import meteor from './connect';
 import messages from './messages';
 import room from './room';
+import rooms from './rooms';
 import server from './server';
 import navigator from './navigator';
 import createChannel from './createChannel';
@@ -11,5 +12,5 @@ import app from './app';
 import permissions from './permissions';
 
 export default combineReducers({
-	settings, login, meteor, messages, server, navigator, createChannel, app, room, permissions
+	settings, login, meteor, messages, server, navigator, createChannel, app, room, rooms, permissions
 });

app/reducers/rooms.js

@@ -2,7 +2,8 @@ import * as types from '../actions/actionsTypes';
 
 const initialState = {
 	isFetching: false,
-	failure: false
+	failure: false,
+	searchText: ''
 };
 
 export default function login(state = initialState, action) {
@@ -24,8 +25,11 @@ export default function login(state = initialState, action) {
 				failure: true,
 				errorMessage: action.err
 			};
-		// case types.LOGOUT:
-		// 	return initialState;
+		case types.ROOMS.SEARCH_REQUEST:
+			return {
+				...state,
+				searchText: action.searchText
+			};
 		default:
 			return state;
 	}

app/views/RoomsListView/Header.js

@@ -9,6 +9,7 @@ import { CachedImage } from 'react-native-img-cache';
 import Avatar from '../../containers/Avatar';
 import RocketChat from '../../lib/rocketchat';
 import { STATUS_COLORS } from '../../constants/colors';
+import { searchRequest } from '../../actions/rooms';
 
 const TITLE_OFFSET = Platform.OS === 'ios' ? 70 : 56;
 
@@ -84,6 +85,8 @@ const styles = StyleSheet.create({
 @connect(state => ({
 	user: state.login.user,
 	baseUrl: state.settings.Site_Url
+}), dispatch => ({
+	searchRequest: searchText => dispatch(searchRequest(searchText))
 }))
 export default class extends React.Component {
 	static propTypes = {
@@ -96,7 +99,8 @@ export default class extends React.Component {
 		super(props);
 		this.state = {
 			isModalVisible: false,
-			searching: false
+			searching: false,
+			searchText: ''
 		};
 	}
 
@@ -105,6 +109,19 @@ export default class extends React.Component {
 		this.hideModal();
 	}
 
+	onSearchChangeText(text) {
+		const searchText = text.trim();
+		this.setState({ searchText: text });
+		this.props.searchRequest(searchText);
+	}
+
+	onPressSearchButton() {
+		this.setState({ searching: true });
+		requestAnimationFrame(() => {
+			this.inputSearch.focus();
+		});
+	}
+
 	showModal() {
 		this.setState({ isModalVisible: true });
 	}
@@ -157,7 +174,7 @@ export default class extends React.Component {
 				{Platform.OS === 'android' ?
 					<TouchableOpacity
 						style={styles.headerButton}
-						onPress={() => this.setState({ searching: true })}
+						onPress={() => this.onPressSearchButton()}
 					>
 						<Icon
 							name='md-search'
@@ -231,10 +248,11 @@ export default class extends React.Component {
 					</TouchableOpacity>
 				</View>
 				<TextInput
+					ref={inputSearch => this.inputSearch = inputSearch}
 					underlineColorAndroid='transparent'
 					style={{ flex: 1, marginLeft: 44 }}
-					// value={this.state.searchText}
-					onChangeText={this.props.teste}
+					value={this.state.searchText}
+					onChangeText={text => this.onSearchChangeText(text)}
 					returnKeyType='search'
 					placeholder='Search'
 					clearButtonMode='while-editing'

app/views/RoomsListView/index.js

@@ -66,8 +66,8 @@ const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
 	server: state.server.server,
 	login: state.login,
 	Site_Url: state.settings.Site_Url,
-	canShowList: state.login.token || state.login.user.token
-	// Message_DateFormat: state.settings.Message_DateFormat
+	canShowList: state.login.token || state.login.user.token,
+	searchText: state.rooms.searchText
 }), dispatch => ({
 	login: () => dispatch(actions.login()),
 	connect: () => dispatch(server.connectRequest())
@@ -77,8 +77,8 @@ export default class RoomsListView extends React.Component {
 	static propTypes = {
 		navigation: PropTypes.object.isRequired,
 		Site_Url: PropTypes.string,
-		// Message_DateFormat: PropTypes.string,
-		server: PropTypes.string
+		server: PropTypes.string,
+		searchText: PropTypes.string
 	}
 
 	static navigationOptions = ({ navigation }) => ({
@@ -110,6 +110,8 @@ export default class RoomsListView extends React.Component {
 			this.data.removeListener(this.updateState);
 			this.data = realm.objects('subscriptions').filtered('_server.id = $0', props.server).sorted('roomUpdatedAt', true);
 			this.data.addListener(this.updateState);
+		} else if (props.searchText && this.props.searchText !== props.searchText) {
+			this.search(props.searchText);
 		}
 	}
 
@@ -117,7 +119,11 @@ export default class RoomsListView extends React.Component {
 		this.data.removeAllListeners();
 	}
 
-	onSearchChangeText = (text) => {
+	onSearchChangeText(text) {
+		this.search(text);
+	}
+
+	search(text) {
 		const searchText = text.trim();
 		this.setState({
 			searchText: text
@@ -228,7 +234,7 @@ export default class RoomsListView extends React.Component {
 				underlineColorAndroid='transparent'
 				style={styles.searchBox}
 				value={this.state.searchText}
-				onChangeText={this.onSearchChangeText}
+				onChangeText={text => this.onSearchChangeText(text)}
 				returnKeyType='search'
 				placeholder='Search'
 				clearButtonMode='while-editing'