import React from 'react';

import {
StyleSheet,
Text,
View,
ScrollView,
Image
} from 'react-native';

export default class UsersComponent extends React.Component {

componentDidMount() {

render() {
// console.log(this.props.users.count)
// console.log('test user components')
const searchcounter = this.props.users.count
const users = this.props.users
const listusers = users.users.map((d)=>
<View style={styles.viewstyle}>

<Image
style={{width: 50, height: 50}}
source={{uri: d.avatar_url}}
/>

<Text>{d.login}</Text>
</View>
)
const searchablecounter = <ScrollView
style={styles.ScrollView}>{listusers}<Text> </Text></ScrollView>
const unsearchablecounter = <Text> "No result" </Text>

let message;
if(searchcounter>0){
message = searchablecounter
}
else{
message = unsearchablecounter
}

return (

<View style={styles.container}> {message} </View>

);
}
}

const styles = StyleSheet.create({

container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
width: '100%'
 },
ScrollView: {
width: '100%'
},
viewstyle: {
top: 30,
display: 'flex',
flexDirection : 'row'
}
});