Codecademy export

Profile.js

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>
    );
  }
}