Skip to content

Instantly share code, notes, and snippets.

@codecademydev

codecademydev/Profile.js Secret

Created Dec 6, 2020
Embed
What would you like to do?
Codecademy export
import React from 'react';
import { fetchUserData, cancelFetch } from './dataFetcher';
import { Userlist } from './Userlist';
export class Profile extends React.Component {
constructor(props) {
super(props)
this.state = {userData: null}
}
loadUserData() {
this.setstate({
userData : null
});
this.fetchID = fetchUserData(this.props.username, (userData) => {
this.setState({ userData });
});
}
componenetDidMount() {
this.loadUserData()
}
render() {
let isLoading = this.state.userData === null ? true : false;
let name = isLoading ? 'Loading..'
: this.state.userData.name;
let className = 'Profile';
if (isLoading) {
className += ' loading';
}
return (
<div className={className}>
<div className="profile-picture"></div>
<div className="profile-body">
<h2>{name}</h2>
<h3>@{this.props.username}</h3>
<p>Bio goes here</p>
<h3>My friends</h3>
<Userlist usernames={[]} onChoose={this.props.onChoose} />
</div>
</div>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment