radiegtya/index.js

## index.js
render(){
    // #1. use this.props.profiles.data from redux to get the list of object returned from REST API
    const {name, experiences, educations, summary, profilePicture, bgPicture} = this.props.profiles.data

    const latestExperience = experiences? experiences[0]: null
    const position = latestExperience? `${latestExperience.position} at ${latestExperience.companyName}`: '-'

    const latestEducation = educations? educations[0]: null
    const education = latestEducation? latestEducation.school: '-'

    return (
        <Container>
          <View style={styles.bgPictureContainer}>
            <Image
              source={{uri: bgPicture}}
              style={styles.bgPicture}
            />
          </View>
          <View style={styles.profilePicture}>
            <Thumbnail
              large
              source={{uri: profilePicture}}
            />
          </View>

          {/* #2. check whether props.profiles.isLoading true or false, if true then show spinner, else show content */}
          {this.props.profiles.isLoading? (
            <Spinner/>
          ): (
            <Content style={{marginTop: 120}}>
              <Card>
                <CardItem>
                  <Body style={styles.centeredBody}>
                    <Text style={styles.nameTitle}>{name}</Text>
                    <Text style={styles.experiences}>{position}</Text>
                    <Text style={styles.education}>{education}</Text>

                    <Text style={styles.summary}>
                      {summary}
                    </Text>
                  </Body>
                </CardItem>
              </Card>
            </Content>
          )}
        </Container>
    )
}
	render(){
	// #1. use this.props.profiles.data from redux to get the list of object returned from REST API
	const {name, experiences, educations, summary, profilePicture, bgPicture} = this.props.profiles.data

	const latestExperience = experiences? experiences[0]: null
	const position = latestExperience? `${latestExperience.position} at ${latestExperience.companyName}`: '-'

	const latestEducation = educations? educations[0]: null
	const education = latestEducation? latestEducation.school: '-'

	return (
	<Container>
	<View style={styles.bgPictureContainer}>
	<Image
	source={{uri: bgPicture}}
	style={styles.bgPicture}
	/>
	</View>
	<View style={styles.profilePicture}>
	<Thumbnail
	large
	source={{uri: profilePicture}}
	/>
	</View>

	{/* #2. check whether props.profiles.isLoading true or false, if true then show spinner, else show content */}
	{this.props.profiles.isLoading? (
	<Spinner/>
	): (
	<Content style={{marginTop: 120}}>
	<Card>
	<CardItem>
	<Body style={styles.centeredBody}>
	<Text style={styles.nameTitle}>{name}</Text>
	<Text style={styles.experiences}>{position}</Text>
	<Text style={styles.education}>{education}</Text>

	<Text style={styles.summary}>
	{summary}
	</Text>
	</Body>
	</CardItem>
	</Card>
	</Content>
	)}
	</Container>
	)
	}