User.js 1006 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. import React from 'react';
  2. import PropTypes from 'prop-types';
  3. import UserPicture from './UserPicture';
  4. export default class User extends React.Component {
  5. render() {
  6. const user = this.props.user;
  7. const userLink = `/user/${user.username}`;
  8. const username = this.props.username;
  9. const name = this.props.name;
  10. return (
  11. <span className="user-component">
  12. <a href={userLink}>
  13. <UserPicture user={user} />
  14. {username
  15. && (
  16. <span className="user-component-username">
  17. @
  18. {user.username}
  19. </span>
  20. )
  21. }
  22. {name
  23. && (
  24. <span className="user-component-name">
  25. (
  26. {user.name}
  27. )
  28. </span>
  29. )
  30. }
  31. </a>
  32. </span>
  33. );
  34. }
  35. }
  36. User.propTypes = {
  37. user: PropTypes.object.isRequired,
  38. name: PropTypes.bool.isRequired,
  39. username: PropTypes.bool.isRequired,
  40. };
  41. User.defaultProps = {
  42. name: false,
  43. username: false,
  44. };