Skip to content

Commit 42838a2

Browse files
nishanbajracharyanishanbajracharya
authored
Merge pull request #21 from leapfrogtechnology/LFG-184
Lfg 184: Search for a contact in the list
2 parents 06d8608 + 43421dd commit 42838a2

File tree

13 files changed

+184
-175
lines changed

13 files changed

+184
-175
lines changed

‎app/screens/contact/contact.js‎

Lines changed: 59 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,14 @@ import Swiper from 'react-native-swiper';
1212
import Search from 'react-native-search-box';
1313
import ParallaxScrollView from 'react-native-parallax-scroll-view';
1414

15-
import * as util from 'App/utils/dataNormalization';
1615
import colors from 'App/config/colors';
1716
import ContactCell from './contactCell';
1817
import screens from 'App/constants/screens';
18+
import * as util from 'App/utils/dataNormalization';
19+
import SearchContactView from 'App/screens/searchContact';
1920
import { getWidth, getHeight } from 'App/utils/dimension';
21+
import { searchEmployeesOfName } from 'App/utils/dataNormalization';
2022
import style, { AVATAR_SIZE, STICKY_HEADER_HEIGHT, DOT_MARGIN, PARALLAX_HEADER_HEIGHT } from './styles';
21-
import { setInterval } from 'core-js/library/web/timers';
2223

2324
const DEPARTMENT_LIST = [{
2425
name: 'iOS',
@@ -63,7 +64,9 @@ const DEPARTMENT_LIST = [{
6364
super(props);
6465

6566
this.state = {
67+
isSearching: false,
6668
currentSwipeIndex: 0,
69+
searchedEmployees: [],
6770
}
6871
}
6972

@@ -84,50 +87,53 @@ const DEPARTMENT_LIST = [{
8487
componentDidMount() {
8588
// this._animateOnMount();
8689
LayoutAnimation.configureNext(LayoutAnimation.Presets.spring);
87-
88-
this.props.employees ? null : this.props.fetchEmployees()
90+
if (!this.props.employees) { this.props.fetchEmployees() }
8991
}
9092

91-
_onSearchBarTextChange = () => {
92-
console.log('bigno');
93+
_onSearchBarTextChange = (text) => {
94+
var employees = searchEmployeesOfName(this.props.employees, text);
95+
this.setState({ searchedEmployees: employees });
9396
}
9497

9598
_onSearchBarFocus = () => {
96-
console.log('focus');
99+
this.setState({ isSearching: true });
97100
}
98101

99-
_onSearch = () => {
100-
console.log('search');
102+
_onReturnAction = () => {
103+
// also cancels on done button action
104+
this._onSearchCancel();
101105
}
102106

103107
_onSearchCancel = () => {
104-
console.log('cancel');
108+
this.setState({ searchedEmployees: [] });
109+
this.setState({ isSearching: false });
105110
}
106111

107-
_onCellSelection = () => {
108-
// this.props.navigator.push({
109-
// screen: screens.PROFILE_SCREEN.id,
110-
// animated: true,
111-
// overrideBackPress: true,
112-
// navigatorStyle: {
113-
// drawUnderNavBar: true,
114-
// navBarTranslucent: true,
115-
// navBarTransparent: true,
116-
// navBarTextColor: 'white',
117-
// navBarTransparency: 1,
118-
// navBarButtonColor: 'white',
119-
// navBarLeftButtonColor: 'white',
120-
// navBarRightButtonColor: 'white',
121-
// },
122-
// title: '',
123-
// passProps: {
124-
// data: {
125-
// department: DEPARTMENT_LIST[this.state.currentSwipeIndex]
126-
// }
127-
// }
128-
// });
112+
_onCellSelection = (data) => {
113+
this.props.navigator.push({
114+
screen: screens.PROFILE_SCREEN.id,
115+
animated: true,
116+
overrideBackPress: true,
117+
navigatorStyle: {
118+
drawUnderNavBar: true,
119+
navBarTranslucent: true,
120+
navBarTransparent: true,
121+
navBarTextColor: 'white',
122+
navBarTransparency: 1,
123+
navBarButtonColor: 'white',
124+
navBarLeftButtonColor: 'white',
125+
navBarRightButtonColor: 'white',
126+
},
127+
title: '',
128+
passProps: {
129+
data: {
130+
profile: data
131+
}
132+
}
133+
});
129134
}
130135

136+
/*
131137
_renderParallaxTableHeaderView = (data, index) => {
132138
// return (<View style={{width: 200, height: 200}}>asd</View>)
133139
return (
@@ -167,6 +173,7 @@ const DEPARTMENT_LIST = [{
167173
/>
168174
);
169175
}
176+
*/
170177

171178
_renderTableView = (employees, index) => {
172179
const { onScroll = () => {} } = this.props;
@@ -209,11 +216,12 @@ const DEPARTMENT_LIST = [{
209216
ref={component => this.searchBar = component}
210217
backgroundColor={colors.LF_DARK_GRREEN}
211218
titleCancelColor='white'
212-
onChangeText={this._onSearchBarTextChange}
213-
onFocus={this._onSearchBarFocus}
214-
afterSearch={this.onSearch}
215-
afterCancel={this.onCancel}
219+
onChangeText={(text) => this._onSearchBarTextChange(text)}
220+
onFocus={() => this._onSearchBarFocus()}
221+
afterSearch={() => this._onReturnAction()}
222+
afterCancel={() => this._onSearchCancel()}
216223
keyboardDismissOnSubmit={true}
224+
returnKeyType={'done'}
217225
blurOnSubmit={true}
218226
/>
219227
)
@@ -243,6 +251,18 @@ const DEPARTMENT_LIST = [{
243251
)
244252
}
245253

254+
_renderSearchView = () => {
255+
console.log('_renderSearchView')
256+
return (
257+
<View style={style.searchViewContainer}>
258+
<SearchContactView
259+
data={this.state.searchedEmployees}
260+
onPress={this._onCellSelection}
261+
/>
262+
</View>
263+
)
264+
}
265+
246266
render() {
247267
// setInterval(() => {
248268
// console.log('----_CONTACT', this.props.groupedEmp);
@@ -255,7 +275,9 @@ const DEPARTMENT_LIST = [{
255275
{ this._renderSearchBar() }
256276
</View>
257277
<View style={style.tableContainer}>
258-
{ this.props.employees ? this._renderSwiper() : this._renderActivityIndicator() }
278+
{ (!this.props.employees) && this._renderActivityIndicator() }
279+
{ (this.props.employees) && this._renderSwiper() }
280+
{ (this.state.isSearching) && this._renderSearchView() }
259281
</View>
260282
</View>
261283
);

‎app/screens/contact/contactCell/contactCell.js‎

Lines changed: 20 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ import Communications from 'react-native-communications';
1212
import style from './styles';
1313
import colors from 'App/config/colors';
1414
import screens from 'App/constants/screens';
15-
import ProgressiveImage from 'App/components/progressiveImage';
1615

1716
import moreImage from './../../../../assets/images/more.png';
1817
import callImage from './../../../../assets/images/call.png';
@@ -29,30 +28,6 @@ import placeHolderImage from './../../../../assets/images/default.png';
2928
}
3029
}
3130

32-
_onCellSelection = () => {
33-
this.props.navigator.push({
34-
screen: screens.PROFILE_SCREEN.id,
35-
animated: true,
36-
overrideBackPress: true,
37-
navigatorStyle: {
38-
drawUnderNavBar: true,
39-
navBarTranslucent: true,
40-
navBarTransparent: true,
41-
navBarTextColor: 'white',
42-
navBarTransparency: 1,
43-
navBarButtonColor: 'white',
44-
navBarLeftButtonColor: 'white',
45-
navBarRightButtonColor: 'white',
46-
},
47-
title: '',
48-
passProps: {
49-
data: {
50-
profile: this.props.data
51-
}
52-
}
53-
});
54-
}
55-
5631
_toggleButtonState = () => {
5732
this.setState((oldState) => {
5833
return { isMoreButtonPressed: !oldState.isMoreButtonPressed }
@@ -64,14 +39,22 @@ import placeHolderImage from './../../../../assets/images/default.png';
6439
}
6540

6641
_callButtonPressed = (event) => {
67-
console.log('call');
68-
Communications.phonecall(this.props.data.contact.mobilePhone, true)
42+
// console.log('call');
43+
if (this.props.data.contact.mobilePhone) {
44+
Communications.phonecall(this.props.data.contact.mobilePhone, true)
45+
} else {
46+
//show alert
47+
}
6948
this._toggleButtonState();
7049
}
7150

7251
_messageButtonPressed = (event) => {
7352
console.log('message');
74-
Communications.text(this.props.data.contact.mobilePhone)
53+
if (this.props.data.contact.mobilePhone) {
54+
Communications.text(this.props.data.contact.mobilePhone);
55+
} else {
56+
//show alert
57+
}
7558
this._toggleButtonState();
7659
}
7760

@@ -89,17 +72,22 @@ import placeHolderImage from './../../../../assets/images/default.png';
8972
}
9073

9174
render() {
75+
if (this.props.data === null) { return <View/> }
9276
return (
93-
<TouchableHighlight onPress={() => this._onCellSelection()} underlayColor={colors.LIGHT_GRAY} activeOpacity={0.4}>
77+
<TouchableHighlight onPress={() => this.props.onPress(this.props.data)} underlayColor={colors.LIGHT_GRAY} activeOpacity={0.4}>
9478
<View style={ style.mainContainer }>
9579
<View style={style.imageContainer}>
96-
<ProgressiveImage source={{uri: this.props.avatarUrl}} thumbnail={placeHolderImage} style={style.contactImage} />
97-
{/* <Image source={{uri: this.props.avatarUrl}} style={style.contactImage}/> */}
80+
{
81+
this.props.data.avatarUrl ?
82+
<Image source={{uri: this.props.data.avatarUrl}} style={style.contactImage}/>
83+
:
84+
<Image source={placeHolderImage} style={style.contactImage}/>
85+
}
9886
</View>
9987
<View style={style.titleContainer}>
10088
<View style={style.titleSubContainer}>
10189
<Text style={style.titleLabel}>{this.props.data.firstName} {this.props.data.lastName}</Text>
102-
<Text style={style.subTitleLabel}>{this.props.data.contact.mobilePhone}</Text>
90+
<Text style={style.subTitleLabel}>{this.props.data.contact.mobilePhone || ''}</Text>
10391
</View>
10492
</View>
10593
<View style={style.buttonContainer}>

‎app/screens/contact/styles.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,13 @@ const style = StyleSheet.create({
105105
color: 'white',
106106
paddingVertical: 5
107107
},
108+
searchViewContainer: {
109+
position: 'absolute',
110+
zIndex: 100,
111+
width: getWidth(),
112+
height: getHeight() - 120,
113+
backgroundColor: 'white'
114+
}
108115

109116
});
110117

‎app/screens/contactDetail/contactDetail.js‎

Lines changed: 0 additions & 90 deletions
This file was deleted.

‎app/screens/contactDetail/index.js‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎app/screens/profile/profile.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ class ProfileScreen extends Component {
156156
}
157157

158158
_renderTableView = () => {
159-
var data = [{key: 'a'}, {key: 'b'}, {key: 'c'}, {key: 'd'}, {key: 'e'}, {key: 'f'}]
159+
var data = [{key: '1'}, {key: '2'}, {key: '3'}, {key: '4'}, {key: '5'}, {key: '6'}]
160160
// this.props.data.fromProfileTab ? data.push({key: 'f'}) : null
161161
return (
162162
<FlatList

‎app/screens/searchContact/index.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import SearchContactView from './searchContact';
2+
3+
export default SearchContactView;

0 commit comments

Comments
 (0)