aboutsummaryrefslogtreecommitdiff
path: root/vnext
diff options
context:
space:
mode:
Diffstat (limited to 'vnext')
-rw-r--r--vnext/src/components/UserInfo.js90
1 files changed, 40 insertions, 50 deletions
diff --git a/vnext/src/components/UserInfo.js b/vnext/src/components/UserInfo.js
index 3c4ffab3..d772d76e 100644
--- a/vnext/src/components/UserInfo.js
+++ b/vnext/src/components/UserInfo.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';
@@ -12,59 +12,49 @@ import SearchBox from './SearchBox';
import './UserInfo.css';
-export default class UserInfo extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- user: { uname: props.user, uid: 0 }
- };
- }
- componentDidMount() {
- info(this.state.user.uname).then(response => {
- this.setState({
- user: response.data
- });
- this.props.onUpdate && this.props.onUpdate(response.data);
+export default function UserInfo(props) {
+ const [user, setUser] = useState({ uname: props.user, uid: 0 });
+ useEffect(() => {
+ info(user.uname).then(response => {
+ setUser(response.data);
+ props.onUpdate && props.onUpdate(response.data);
});
- }
- render() {
- const { user } = this.state;
- return (
- <>
- <div className="userinfo">
- <Avatar user={user}>
- <div className="msg-ts">Was online recently</div>
- </Avatar>
- </div>
- <div className="l">
- {
- user.uid > 0 &&
- <>
- <Link to="/pm">
- <Icon name="ei-envelope" size="s" />PM
+ });
+ return (
+ <>
+ <div className="userinfo">
+ <Avatar user={user}>
+ <div className="msg-ts">Was online recently</div>
+ </Avatar>
+ </div>
+ <div className="l">
+ {
+ user.uid > 0 &&
+ <>
+ <Link to="/pm">
+ <Icon name="ei-envelope" size="s" />PM
</Link>
- <Link to={`/${user.uname}/?show=recomm`} rel="nofollow">
- <Icon name="ei-heart" size="s" />Recommendations
+ <Link to={`/${user.uname}/?show=recomm`} rel="nofollow">
+ <Icon name="ei-heart" size="s" />Recommendations
</Link>
- <Link to={`/${user.uname}/?media=1`} rel="nofollow">
- <Icon name="ei-camera" size="s" />Photos
+ <Link to={`/${user.uname}/?media=1`} rel="nofollow">
+ <Icon name="ei-camera" size="s" />Photos
</Link>
- {
- user.read &&
- <Link to={`/${user.uname}/friends`}>I read: {user.read.length}</Link>
- }
- <Link to={`/${user.uname}/readers`}>My readers: {user.readers ? user.readers.length : 0}</Link>
- {
- user.statsMyBL &&
- <Link to={`/${user.uname}/bl`}>My blacklist: {user.statsMyBL}</Link>
- }
- </>
- }
- </div>
- {this.props.children}
- </>
- );
- }
+ {
+ user.read &&
+ <Link to={`/${user.uname}/friends`}>I read: {user.read.length}</Link>
+ }
+ <Link to={`/${user.uname}/readers`}>My readers: {user.readers ? user.readers.length : 0}</Link>
+ {
+ user.statsMyBL &&
+ <Link to={`/${user.uname}/bl`}>My blacklist: {user.statsMyBL}</Link>
+ }
+ </>
+ }
+ </div>
+ {props.children}
+ </>
+ );
}
UserInfo.propTypes = {