userDetail.jsx

import React from 'react';
import './userDetail.css';
import {Link} from "react-router-dom";
import {Typography} from "@material-ui/core";


/**
 * Define UserDetail, a React componment of CS142 project #5
 */
class UserDetail extends React.Component {
  constructor(props) {
    super(props);
    //console.log(this.props.match.params.userId);
  }

  generateUserPreview() {
    let user = window.cs142models.userListModel().find(e => e._id === this.props.match.params.userId)
    console.log(user)
    return (
      <Typography variant="body1">
        <h2>{user.first_name} {user.last_name}</h2>
        <p>
          Occupation: {user.occupation} <br />
          From: {user.location} <br />
          Description: {user.description}
        </p>
      </Typography>
    )
  }


  render() {
    return (
      <div id="divUserDetail">
        {this.generateUserPreview()}
        <Link to={"/photos/" + this.props.match.params.userId}>See photos!</Link>
      </div>
    );
  }
}

export default UserDetail;