aboutsummaryrefslogtreecommitdiff
path: root/vnext/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'vnext/src/components')
-rw-r--r--vnext/src/components/Avatar.js21
-rw-r--r--vnext/src/components/Feeds.js11
-rw-r--r--vnext/src/components/Message.js24
-rw-r--r--vnext/src/components/Thread.js49
-rw-r--r--vnext/src/components/UserInfo.js85
5 files changed, 140 insertions, 50 deletions
diff --git a/vnext/src/components/Avatar.js b/vnext/src/components/Avatar.js
index 0df0dbd7..f79d7b09 100644
--- a/vnext/src/components/Avatar.js
+++ b/vnext/src/components/Avatar.js
@@ -6,15 +6,26 @@ import { UserType } from './Types';
export default function Avatar(props) {
return (
- <div className="msg-avatar">
- <Link to={{ pathname: props.link || `/${props.user.uname}/`}}>
- <img src={`//i.juick.com/a/${props.user.uid}.png`} alt={`${props.user.uname}`} />
- </Link>
+ <div style={{ display: 'flex' }}>
+ <div className="msg-avatar">
+ <Link to={{ pathname: props.link || `/${props.user.uname}/` }}>
+ <img src={`//i.juick.com/a/${props.user.uid}.png`} alt={`${props.user.uname}`} />
+ </Link>
+ </div>
+ <div style={{ display: 'flex', flexDirection: 'column' }}>
+ <span itemProp="author" itemScope="" itemType="http://schema.org/Person">
+ <Link to={{ pathname: `/${props.user.uname}/` }} itemProp="url" rel="author">
+ <span itemProp="name">{props.user.uname}</span>
+ </Link>
+ </span>
+ {props.children}
+ </div>
</div>
);
}
Avatar.propTypes = {
user: UserType,
- link: PropTypes.string
+ link: PropTypes.string,
+ children: PropTypes.node
};
diff --git a/vnext/src/components/Feeds.js b/vnext/src/components/Feeds.js
index 194af71c..a7833f67 100644
--- a/vnext/src/components/Feeds.js
+++ b/vnext/src/components/Feeds.js
@@ -8,6 +8,8 @@ import moment from 'moment';
import Message from './Message';
import Spinner from './Spinner';
+import UserInfo from './UserInfo';
+
import { getMessages } from '../api';
import { UserType } from './Types';
@@ -38,7 +40,12 @@ export function Blog(props) {
search: search,
pageParam: search.search ? 'page' : 'before_mid'
};
- return (<Feed authRequired={false} query={query} {...props} />);
+ return (
+ <>
+ <UserInfo user={user} />
+ <Feed authRequired={false} query={query} {...props} />
+ </>
+ );
}
export function Tag(props) {
@@ -75,7 +82,7 @@ class Feed extends React.Component {
shouldComponentUpdate(nextProps, nextState) {
return this.props.visitor.uid !== nextProps.visitor.uid
- || this.state !== nextState || this.props.location !== nextProps.location;
+ || this.state !== nextState || this.props.location !== nextProps.location;
}
getSnapshotBeforeUpdate(prevProps) {
diff --git a/vnext/src/components/Message.js b/vnext/src/components/Message.js
index f091296b..b36936ba 100644
--- a/vnext/src/components/Message.js
+++ b/vnext/src/components/Message.js
@@ -13,20 +13,16 @@ export default function Message({ data, visitor, children, ...rest }) {
return (
<div className="msg-cont" itemProp="blogPost" itemScope="" itemType="http://schema.org/BlogPosting" itemRef="org">
<header className="h">
- <span itemProp="author" itemScope="" itemType="http://schema.org/Person">
- <Link to={{ pathname: `/${data.user.uname}/` }} itemProp="url" rel="author">
- <span itemProp="name">{data.user.uname}</span>
- </Link>
- </span>
- <Avatar user={data.user} />
- <div className="msg-ts">
- <Link to={{ pathname: `/${data.user.uname}/${data.mid}`, state: { msg: data } }}>
- <time itemProp="datePublished dateModified" itemType="http://schema.org/Date" dateTime={data.timestamp}
- title={moment.utc(data.timestamp).local().format('lll')}>
- {moment.utc(data.timestamp).fromNow()}
- </time>
- </Link>
- </div>
+ <Avatar user={data.user}>
+ <div className="msg-ts">
+ <Link to={{ pathname: `/${data.user.uname}/${data.mid}`, state: { msg: data } }}>
+ <time itemProp="datePublished dateModified" itemType="http://schema.org/Date" dateTime={data.timestamp}
+ title={moment.utc(data.timestamp).local().format('lll')}>
+ {moment.utc(data.timestamp).fromNow()}
+ </time>
+ </Link>
+ </div>
+ </Avatar>
<Tags user={data.user} data={data.tags || []} />
</header>
<div className="msg-txt">
diff --git a/vnext/src/components/Thread.js b/vnext/src/components/Thread.js
index b0e73b40..2097a315 100644
--- a/vnext/src/components/Thread.js
+++ b/vnext/src/components/Thread.js
@@ -45,7 +45,7 @@ export default class Thread extends React.Component {
.then(response => {
let msg = response.data.shift();
this.setState({
- msg: {...msg},
+ msg: { ...msg },
replies: response.data,
loading: false,
active: 0
@@ -100,29 +100,20 @@ export default class Thread extends React.Component {
<li id={msg.rid} key={msg.rid} className="msg">
<div className="msg-cont">
<div className="msg-header">
- {!msg.user.banned ? (
- <>
- <span itemProp="author" itemScope="" itemType="http://schema.org/Person">
- <Link to={`/${msg.user.uname}/`} itemProp="url" rel="author"><span itemProp="name">{msg.user.uname}</span></Link>
- </span><Avatar user={msg.user} />
- </>) : (
- <>
- <span>[удалено]:</span><Avatar user={{ uid: 0 }} />
- </>
- )
- }
- <div className="msg-ts">
- <a href={`/${msg.user.uname}/${msg.mid}`}>
- <time itemProp="datePublished dateModified" itemType="http://schema.org/Date" dateTime={msg.timestamp}
- title={moment.utc(msg.timestamp).local().format('lll')}>
- {moment.utc(msg.timestamp).fromNow()}
- </time>
- </a>
- {msg.replyto > 0 &&
- (
- <a href={`#${msg.replyto}`}> in reply to {msg.to.uname}&nbsp;</a>
- )}
- </div>
+ <Avatar user={msg.user}>
+ <div className="msg-ts">
+ <a href={`/${msg.user.uname}/${msg.mid}`}>
+ <time itemProp="datePublished dateModified" itemType="http://schema.org/Date" dateTime={msg.timestamp}
+ title={moment.utc(msg.timestamp).local().format('lll')}>
+ {moment.utc(msg.timestamp).fromNow()}
+ </time>
+ </a>
+ {msg.replyto > 0 &&
+ (
+ <a href={`#${msg.replyto}`}> in reply to {msg.to.uname}&nbsp;</a>
+ )}
+ </div>
+ </Avatar>
</div>
<div className="msg-txt"><p dangerouslySetInnerHTML={{ __html: format(msg.body, msg.mid, (msg.tags || []).indexOf('code') >= 0) }}></p></div>
{
@@ -149,10 +140,10 @@ export default class Thread extends React.Component {
</li>
)) : (
<>
- {Array(loaders).fill().map((it, i) => <Spinner key={i} />)}
- </>
- )
- }
+ {Array(loaders).fill().map((it, i) => <Spinner key={i} />)}
+ </>
+ )
+ }
</ul>
</>
);
@@ -170,7 +161,7 @@ Thread.propTypes = {
visitor: UserType.isRequired
};
-function Recommendations({forMessage, ...rest}) {
+function Recommendations({ forMessage, ...rest }) {
const { likes, recommendations } = forMessage;
return recommendations && recommendations.length > 0 && (
<div className="msg-recomms">{'Recommended by '}
diff --git a/vnext/src/components/UserInfo.js b/vnext/src/components/UserInfo.js
new file mode 100644
index 00000000..147bb6f8
--- /dev/null
+++ b/vnext/src/components/UserInfo.js
@@ -0,0 +1,85 @@
+import React from 'react';
+
+import { Link } from 'react-router-dom';
+
+import { info } from '../api';
+
+import Avatar from './Avatar';
+import Icon from './Icon';
+import SearchBox from './SearchBox';
+
+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[0]
+ });
+ });
+ }
+ render() {
+ const { user } = this.state;
+ return (
+ <div style={{ padding: '14px' }}>
+ <Avatar user={user}>
+ <div className="msg-ts">Was online recently</div>
+ </Avatar>
+ <div>
+ {
+ user.uid > 0 &&
+ <>
+ <ul>
+ <li>
+ <Link to="/pm">
+ <Icon name="ei-envelope" size="s" />PM
+ </Link>
+ </li>
+ <li>
+ <Link to={`/${user.uname}/?show=recomm`} rel="nofollow">
+ <Icon name="ei-heart" size="s" />Recommendations
+ </Link>
+ </li>
+ <li>
+ <Link to={`/${user.uname}/?media=1`} rel="nofollow">
+ <Icon name="ei-camera" size="s" />Photos
+ </Link>
+ </li>
+ </ul>
+ <hr />
+ <SearchBox pathname={`/${user.uname}/`} onSearch={this.search} {...this.props} />
+ <hr />
+ <div id="ustats">
+ <ul>
+ {
+ user.read &&
+ <li><Link to={`/${user.uname}/friends`}>I read: {user.read.length}</Link></li>
+ }
+ <li><Link to={`/${user.uname}/readers`}>My readers: {user.readers ? user.readers.length : 0}</Link></li>
+ {
+ user.statsMyBL &&
+ <li><Link to={`/${user.uname}/bl`}>My blacklist: {user.statsMyBL}</Link></li>
+ }
+ <li>Messages: {user.statsMessages}</li>
+ <li>Comments: {user.statsReplies}</li>
+ </ul>
+ {
+ user.read &&
+ <div className="iread">
+ {
+ user.read.map(u => <Avatar user={u} key={u.uid} />)
+ }
+ </div>
+ }
+ </div>
+ </>
+ }
+ </div>
+ </div>
+ );
+ }
+} \ No newline at end of file
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-30 22:26:56 +0000