import ActionButton from 'react-native-action-button';
import { ListView } from 'realm/react-native';
import React from 'react';
import PropTypes from 'prop-types';
import Icon from 'react-native-vector-icons/Ionicons';
import { Platform, View, StyleSheet, TextInput, SafeAreaView } from 'react-native';
import { connect } from 'react-redux';
import * as actions from '../actions';
import * as server from '../actions/connect';
import realm from '../lib/realm';
import RocketChat from '../lib/rocketchat';
import RoomItem from '../presentation/RoomItem';
import Banner from '../containers/Banner';
import { goRoom } from '../containers/routes/NavigationService';
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'stretch',
justifyContent: 'center'
},
separator: {
height: 1,
backgroundColor: '#E7E7E7'
},
list: {
width: '100%',
backgroundColor: '#FFFFFF'
},
emptyView: {
flexGrow: 1,
alignItems: 'stretch',
justifyContent: 'center'
},
emptyText: {
textAlign: 'center',
fontSize: 18,
color: '#ccc'
},
actionButtonIcon: {
fontSize: 20,
height: 22,
color: 'white'
},
searchBoxView: {
backgroundColor: '#eee'
},
searchBox: {
backgroundColor: '#fff',
margin: 5,
borderRadius: 5,
padding: 5,
paddingLeft: 10,
color: '#aaa'
},
safeAreaView: {
flex: 1,
backgroundColor: '#fff'
}
});
const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
@connect(state => ({
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
}), dispatch => ({
login: () => dispatch(actions.login()),
connect: () => dispatch(server.connectRequest())
}))
export default class RoomsListView extends React.Component {
static propTypes = {
navigation: PropTypes.object.isRequired,
Site_Url: PropTypes.string,
// Message_DateFormat: PropTypes.string,
server: PropTypes.string
}
static navigationOptions = ({ navigation }) => {
if (Platform.OS !== 'ios') {
return;
}
const { params = {} } = navigation.state;
const headerRight = (
);
return { headerRight };
};
constructor(props) {
super(props);
this.state = {
dataSource: ds.cloneWithRows([]),
searchText: ''
};
this.data = realm.objects('subscriptions').filtered('_server.id = $0', this.props.server).sorted('roomUpdatedAt', true);
}
componentDidMount() {
this.data.addListener(this.updateState);
this.props.navigation.setParams({
createChannel: () => this._createChannel()
});
this.updateState();
}
componentWillReceiveProps(props) {
if (this.props.server !== props.server) {
this.data.removeListener(this.updateState);
this.data = realm.objects('subscriptions').filtered('_server.id = $0', props.server).sorted('roomUpdatedAt', true);
this.data.addListener(this.updateState);
}
}
componentWillUnmount() {
this.data.removeAllListeners();
}
onSearchChangeText = (text) => {
const searchText = text.trim();
this.setState({
searchText: text
});
if (searchText === '') {
return this.setState({
dataSource: ds.cloneWithRows(this.data)
});
}
const data = this.data.filtered('name CONTAINS[c] $0', searchText).slice();
const usernames = [];
const dataSource = data.map((sub) => {
if (sub.t === 'd') {
usernames.push(sub.name);
}
return sub;
});
if (dataSource.length < 7) {
if (this.oldPromise) {
this.oldPromise();
}
Promise.race([
RocketChat.spotlight(searchText, usernames),
new Promise((resolve, reject) => this.oldPromise = reject)
])
.then((results) => {
results.users.forEach((user) => {
dataSource.push({
...user,
name: user.username,
t: 'd',
search: true
});
});
results.rooms.forEach((room) => {
dataSource.push({
...room,
search: true
});
});
this.setState({
dataSource: ds.cloneWithRows(dataSource)
});
}, () => console.log('spotlight stopped'))
.then(() => delete this.oldPromise);
}
this.setState({
dataSource: ds.cloneWithRows(dataSource)
});
}
updateState = () => {
this.setState({
dataSource: ds.cloneWithRows(this.data)
});
};
_onPressItem = (item = {}) => {
const clearSearch = () => {
this.setState({
searchText: ''
});
};
// if user is using the search we need first to join/create room
if (item.search) {
if (item.t === 'd') {
RocketChat.createDirectMessage(item.username)
.then(room => new Promise((resolve) => {
const data = realm.objects('subscriptions').filtered('_server.id = $0 AND rid = $1', this.props.server, room.rid);
if (data.length) {
return resolve(data[0]);
}
data.addListener(() => {
if (data.length) {
resolve(data[0]);
data.removeAllListeners();
}
});
}))
.then(sub => goRoom({ room: sub, name: sub.name }))
.then(() => clearSearch());
} else {
clearSearch();
goRoom(item);
}
return;
}
goRoom(item);
clearSearch();
}
_createChannel() {
this.props.navigation.navigate('SelectUsers');
}
renderSearchBar = () => (
);
renderItem = item => (
this._onPressItem(item)}
/>
)
renderList = () => (
)
renderCreateButtons = () => (
{ this._createChannel(); }} >
);
render = () => (
{this.renderList()}
{Platform.OS === 'android' && this.renderCreateButtons()}
)
}