Skip to content

Commit 6bcf7e2

Browse files
nishanbajracharyanishanbajracharya
authored
Merge pull request #19 from leapfrogtechnology/LFG-185
Lfg 185: Sorted and Grouped contacts according to department
2 parents 9c96214 + 43318f6 commit 6bcf7e2

File tree

18 files changed

+327
-108
lines changed

18 files changed

+327
-108
lines changed

‎app/actions/fetchActions.js‎

Lines changed: 19 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -5,34 +5,35 @@ import * as ActionType from 'App/constants/actionsType';
55
import { store } from './../../App';
66

77
export const validateEmail = (token) => {
8-
console.log('11111', Resource.emailValidation(token));
8+
// console.log('11111', Resource.emailValidation(token));
99
return (dispatch) => {
1010
dispatch(networkFetching())
11-
fetch(uri.EMAIL_VALIDATION, Resource.emailValidation(token))
11+
fetch(`${uri.EMAIL_VALIDATION}?token=${token}`, Resource.emailValidation())
1212
.then(data => data.json())
1313
.then(json => {
14-
console.log('json:', json)
14+
// console.log('loginjson:', json)
1515
dispatch(validateLFEmail())
1616
})
17-
.catch(err => dispatch(networkFetchError(err)))
17+
.catch(err => {
18+
console.log('errrrrrrr', err);
19+
dispatch(networkFetchError(err))
20+
})
1821
}
1922
}
2023

2124
export const fetchEmployeeFromAPI = (apiKey) => {
22-
console.log('77777');
2325
return (dispatch) => {
2426
dispatch(networkFetching())
2527
fetch(uri.EMPLOYEES_LIST, Resource.employeesList(apiKey))
2628
.then(data => data.json())
2729
.then(jsonResponse => {
28-
console.log('json:', jsonResponse);
29-
var myProfile = util.myInformation(jsonResponse, store.getState().rootReducer.auth.user.email)[0];
30+
// console.log('json:', jsonResponse);
31+
var myProfile = util.getMyInformation(jsonResponse, store.getState().rootReducer.auth.user.email)[0];
3032
dispatch(myProfileInfo(myProfile));
3133
dispatch(getEmployeeList(jsonResponse));
34+
dispatch(groupEmployeesOnDepartmentBasis(util.groupByDepartment(jsonResponse)))
3235
})
33-
.catch(err => {dispatch(networkFetchError(err))
34-
console.log("9999", err)
35-
})
36+
.catch(err => {dispatch(networkFetchError(err))})
3637
}
3738
}
3839

@@ -71,13 +72,20 @@ validateLFEmail = () => {
7172
}
7273

7374
getEmployeeList = (employees) => {
74-
console.log('88888');
7575
return {
7676
type: ActionType.EMPLOYEES_LIST,
7777
employees
7878
}
7979
}
8080

81+
groupEmployeesOnDepartmentBasis = (groupedEmployees) => {
82+
console.log('55555xxx', groupedEmployees);
83+
return {
84+
type: ActionType.GROUP_EMPLOYEES_DEPARTMENT_BASIS,
85+
groupedEmployees
86+
}
87+
}
88+
8189
myProfileInfo = (myProfile) => {
8290
return {
8391
type: ActionType.MY_PROFILE,

‎app/components/progressiveImage/index.js‎

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

‎app/components/progressiveImage/progressiveImage.js‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
import React, { Component, PropTypes } from 'react';
2+
import {
3+
Animated,
4+
View,
5+
Image
6+
} from 'react-native';
7+
8+
class ProgressiveImage extends Component{
9+
constructor(props){
10+
super(props);
11+
this.state = {
12+
thumbnailOpacity: new Animated.Value(0)
13+
}
14+
}
15+
onLoad(){
16+
Animated.timing(this.state.thumbnailOpacity,{
17+
toValue: 0,
18+
duration : 250
19+
}).start()
20+
21+
}
22+
onThumbnailLoad(){
23+
Animated.timing(this.state.thumbnailOpacity,{
24+
toValue: 1,
25+
duration: 250
26+
}).start();
27+
}
28+
render(){
29+
return (
30+
<View
31+
width={this.props.style.width}
32+
height={this.props.style.height}
33+
backgroundColor={'#ffffff'}>
34+
<Animated.Image
35+
resizeMode = {'contain'}
36+
key = {this.props.key}
37+
style = {[
38+
{
39+
position: 'absolute'
40+
},
41+
this.props.style
42+
]}
43+
source = {this.props.source}
44+
onLoad = {(event)=>this.onLoad(event)}
45+
/>
46+
<Animated.Image
47+
resizeMode={'contain'}
48+
key={this.props.key}
49+
style={[
50+
{
51+
opacity: this.state.thumbnailOpacity
52+
},
53+
this.props.style
54+
]}
55+
source={this.props.thumbnail}
56+
onLoad={(event) => this.onThumbnailLoad(event)}
57+
/>
58+
</View>
59+
)
60+
}
61+
}
62+
63+
export default ProgressiveImage;

‎app/constants/actionsType.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,3 +5,4 @@ export const VALIDATE_EMAIL = 'VALIDATE_EMAIL';
55
export const EMPLOYEES_LIST = 'EMPLOYEES_LIST';
66
export const NETWORK_FETCHING = 'NETWORK_FETCHING';
77
export const NETWORK_FETCH_ERROR = 'NETWORK_FETCH_ERROR';
8+
export const GROUP_EMPLOYEES_DEPARTMENT_BASIS = 'GROUP_EMPLOYEES_DEPARTMENT_BASIS';

‎app/navigator/tabNavigator.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { Navigation } from 'react-native-navigation';
22

3+
import { store } from './../../App';
34
import colors from 'App/config/colors';
45
import screens from 'App/constants/screens';
56

‎app/reducers/user.js‎

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,30 +2,36 @@ import * as actionType from 'App/constants/actionsType';
22

33
const initialState = {
44
isValid: false,
5+
groupedEmployees: [],
56
}
67

78
const user = (state = initialState, action) => {
89
switch (action.type) {
910
case actionType.VALIDATE_EMAIL:
10-
console.log('VALIDATE_EMAIL');
1111
return {
1212
...state,
1313
isValid: true,
1414
};
1515

1616
case actionType.EMPLOYEES_LIST:
17-
console.log('EMPLOYEES_LIST', action.employees);
1817
return {
1918
...state,
2019
employees: action.employees
2120
};
2221

2322
case actionType.MY_PROFILE:
24-
console.log('MY_PROFILE', action.myProfile);
25-
return {
26-
...state,
27-
myProfile: action.myProfile
28-
}
23+
return {
24+
...state,
25+
myProfile: action.myProfile
26+
}
27+
28+
case actionType.GROUP_EMPLOYEES_DEPARTMENT_BASIS:
29+
// console.log('11111_GROUP', action.groupedEmployees)
30+
return {
31+
...state,
32+
groupedEmployees: action.groupedEmployees
33+
}
34+
2935
default:
3036
return state;
3137
}

‎app/screens/contact/contact.js‎

Lines changed: 57 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import {
55
Image,
66
SectionList,
77
ActivityIndicator,
8+
LayoutAnimation,
89
} from 'react-native';
910
import Swiper from 'react-native-swiper';
1011
import Search from 'react-native-search-box';
@@ -16,6 +17,7 @@ import ContactCell from './contactCell';
1617
import screens from 'App/constants/screens';
1718
import { getWidth, getHeight } from 'App/utils/dimension';
1819
import style, { AVATAR_SIZE, STICKY_HEADER_HEIGHT, DOT_MARGIN, PARALLAX_HEADER_HEIGHT } from './styles';
20+
import { setInterval } from 'core-js/library/web/timers';
1921

2022
const DEPARTMENT_LIST = [{
2123
name: 'iOS',
@@ -64,7 +66,24 @@ const DEPARTMENT_LIST = [{
6466
}
6567
}
6668

69+
// _animateOnMount = () => {
70+
// LayoutAnimation.configureNext({
71+
// duration: 700,
72+
// create: {
73+
// type: LayoutAnimation.Types.linear,
74+
// property: LayoutAnimation.Properties.opacity,
75+
// },
76+
// update: {
77+
// type: LayoutAnimation.Types.spring,
78+
// springDamping: 0.75,
79+
// },
80+
// });
81+
// }
82+
6783
componentDidMount() {
84+
// this._animateOnMount();
85+
LayoutAnimation.configureNext(LayoutAnimation.Presets.spring);
86+
6887
this.props.employees ? null : this.props.fetchEmployees()
6988
}
7089

@@ -85,30 +104,31 @@ const DEPARTMENT_LIST = [{
85104
}
86105

87106
_onCellSelection = () => {
88-
this.props.navigator.push({
89-
screen: screens.PROFILE_SCREEN.id,
90-
animated: true,
91-
overrideBackPress: true,
92-
navigatorStyle: {
93-
drawUnderNavBar: true,
94-
navBarTranslucent: true,
95-
navBarTransparent: true,
96-
navBarTextColor: 'white',
97-
navBarTransparency: 1,
98-
navBarButtonColor: 'white',
99-
navBarLeftButtonColor: 'white',
100-
navBarRightButtonColor: 'white',
101-
},
102-
title: '',
103-
passProps: {
104-
data: {
105-
department: DEPARTMENT_LIST[this.state.currentSwipeIndex]
106-
}
107-
}
108-
});
107+
// this.props.navigator.push({
108+
// screen: screens.PROFILE_SCREEN.id,
109+
// animated: true,
110+
// overrideBackPress: true,
111+
// navigatorStyle: {
112+
// drawUnderNavBar: true,
113+
// navBarTranslucent: true,
114+
// navBarTransparent: true,
115+
// navBarTextColor: 'white',
116+
// navBarTransparency: 1,
117+
// navBarButtonColor: 'white',
118+
// navBarLeftButtonColor: 'white',
119+
// navBarRightButtonColor: 'white',
120+
// },
121+
// title: '',
122+
// passProps: {
123+
// data: {
124+
// department: DEPARTMENT_LIST[this.state.currentSwipeIndex]
125+
// }
126+
// }
127+
// });
109128
}
110129

111130
_renderParallaxTableHeaderView = (data, index) => {
131+
// return (<View style={{width: 200, height: 200}}>asd</View>)
112132
return (
113133
<ParallaxScrollView
114134
onScroll={this.props.onScroll}
@@ -129,7 +149,7 @@ const DEPARTMENT_LIST = [{
129149
<Image style={ style.avatar } source={{uri: 'https://pbs.twimg.com/profile_images/2694242404/5b0619220a92d391534b0cd89bf5adc1_400x400.jpeg'}}/>
130150
<Text style={ style.sectionSpeakerText }>
131151
{
132-
DEPARTMENT_LIST[index].name
152+
// DEPARTMENT_LIST[index].name
133153
}
134154
</Text>
135155
<Text style={ style.sectionTitleText }>
@@ -140,34 +160,31 @@ const DEPARTMENT_LIST = [{
140160

141161
renderStickyHeader={() => (
142162
<View key="sticky-header" style={style.stickySection}>
143-
<Text style={style.stickySectionText}>{DEPARTMENT_LIST[index].name}</Text>
163+
<Text style={style.stickySectionText}>aaa</Text>
144164
</View>
145165
)}
146166
/>
147167
);
148168
}
149169

150-
_renderTableView = (data, index) => {
170+
_renderTableView = (employees, index) => {
171+
const { onScroll = () => {} } = this.props;
151172
return (
152173
<SectionList
153174
ref="ListView"
154-
key={data}
155-
sections={[
156-
{title: 'D', data: ['Devin']},
157-
{title: 'J', data: ['Jackson', 'James', 'Jillian', 'Jimmy', 'Joel', 'John', 'Julie']},
158-
]}
175+
key={index}
176+
sections={util.groupByAlphabets(employees.data)}
159177
keyExtractor={(item, index) => index}
160-
renderItem={({item, section, index}) =>
178+
renderItem={({item}) =>
161179
<ContactCell
162-
index={index}
163-
section={section}
180+
{...this.props}
164181
data={item}
165182
onPress={this._onCellSelection}/>
166183
}
167184
renderSectionHeader={({section}) => <Text style={style.sectionHeader}>{section.title}</Text>}
168-
renderScrollComponent={props => (
169-
this._renderParallaxTableHeaderView(props, index)
170-
)}
185+
// renderScrollComponent={props => (
186+
// this._renderParallaxTableHeaderView(props, index)
187+
// )}
171188
renderSeparator={() => <View style={{backgroundColor: colors.GRAY, height: 1}}></View>}
172189
/>
173190
);
@@ -211,7 +228,7 @@ const DEPARTMENT_LIST = [{
211228
activeDotColor={colors.LF_DARK_GRREEN}
212229
dotStyle={{marginBottom: DOT_MARGIN}}>
213230
{
214-
DEPARTMENT_LIST.map((data, index) => this._renderTableView(data, index))
231+
this.props.groupedEmp.map((data, index) => this._renderTableView(data, index))
215232
}
216233
</Swiper>
217234
)
@@ -226,6 +243,10 @@ const DEPARTMENT_LIST = [{
226243
}
227244

228245
render() {
246+
// setInterval(() => {
247+
// console.log('----_CONTACT', this.props.groupedEmp);
248+
// }, 1000);
249+
// console.log('----_CONTACT', this.props.groupedEmp);
229250
return (
230251
<View style={ style.mainContainer }>
231252
{ this._renderStatusBar() }

0 commit comments

Comments
 (0)