blob: e03935ced5d8194302e5b95383cf2acfa1e7df0f (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
import React from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';
import moment from 'moment';
import { UserType } from './Types';
import Icon from './Icon';
import Avatar from './Avatar';
import { format } from '../utils/embed';
export default function Message(props) {
const msg = props.data;
const visitor = props.visitor;
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: `/${msg.user.uname}/` }} itemProp="url" rel="author">
<span itemProp="name">{msg.user.uname}</span>
</Link>
</span>
<Avatar user={msg.user} />
<div className="msg-ts">
<Link to={{ pathname: `/${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>
</Link>
</div>
<div className="msg-tags" itemProp="headline">
<Tags user={msg.user} data={msg.tags || []} />
</div>
</header>
<div className="msg-txt">
<p itemProp="description" dangerouslySetInnerHTML={{ __html: format(msg.body, msg.mid, (msg.tags || []).indexOf('code') >= 0) }}></p>
</div>
{msg.photo &&
<p className="ir"><a href={`//i.juick.com/p/${msg.mid}.${msg.attach}`} data-fname={`${msg.mid}.${msg.attach}`}>
<img itemProp="image" src={`//i.juick.com/p/${msg.mid}.${msg.attach}`} alt="" /></a>
</p>
}
<nav className="l">
{visitor.uid === msg.user.uid ? (
<a href={`/${msg.user.uname}/${msg.mid}`} className="a-like msg-button">
<span className="msg-button-icon">
<Icon name="ei-heart" size="s" />
{msg.likes > 0 && (` ${msg.likes}`)}
</span>
<span> Recommend</span>
</a>
) : visitor.uid > 0 ? (
<a href="/post?body=!+%23{{ msg.mid }}" className="a-like msg-button">
<span className="msg-button-icon">
<Icon name="ei-heart" size="s" />
{msg.likes > 0 && (` ${msg.likes}`)}
</span>
<span> Recommend</span>
</a>
) : (
<a href="/login" className="a-login msg-button">
<span className="msg-button-icon">
<Icon name="ei-heart" size="s" />
{msg.likes > 0 && (` ${msg.likes}`)}
</span>
<span> Recommend</span>
</a>
)}
{!Boolean(msg.ReadOnly) | (visitor.uid === msg.user.uid) && (
<React.Fragment>
<Link to={{ pathname: `/${msg.user.uname}/${msg.mid}` }} className="a-comment msg-button">
<span className="msg-button-icon">
<Icon name="ei-comment" size="s" />
{msg.replies > 0 &&
(Boolean(msg.unread) ? (
<span className="badge">${msg.replies}</span>
) : (
`${msg.replies}`
))
}
</span>
<span> Comment</span>
</Link>
<a href="#" className="msg-menu msg-button">
<Icon name="ei-link" size="s" />
<span> Share</span>
</a>
</React.Fragment>
)}
{msg.FriendsOnly && (
<a href="#" className="a-privacy">Открыть доступ</a>
)}
</nav>
{props.children}
</div>
);
}
function Tags(props) {
return props.data && props.data.map(tag => {
return (<Link key={tag} to={{ pathname: `/${props.user.uname}`, search: `?tag=${tag}` }} title={tag}>{tag}</Link>)
})
}
Message.propTypes = {
data: PropTypes.shape({
mid: PropTypes.number.isRequired,
user: UserType,
timestamp: PropTypes.string.isRequired,
body: PropTypes.string
}),
children: PropTypes.node
};
Tags.propTypes = {
user: UserType.isRequired,
data: PropTypes.array
}
|
