diff options
Diffstat (limited to 'vnext/src/components')
-rw-r--r-- | vnext/src/components/Avatar.js | 68 | ||||
-rw-r--r-- | vnext/src/components/Feeds.js | 10 | ||||
-rw-r--r-- | vnext/src/components/Thread.js | 10 | ||||
-rw-r--r-- | vnext/src/components/Types.js | 2 |
4 files changed, 59 insertions, 31 deletions
diff --git a/vnext/src/components/Avatar.js b/vnext/src/components/Avatar.js index 6ea0d5d5..a83107ce 100644 --- a/vnext/src/components/Avatar.js +++ b/vnext/src/components/Avatar.js @@ -6,33 +6,54 @@ import { UserType } from './Types'; import Icon from './Icon'; +import { fetchUserUri } from '../api'; + import './Avatar.css'; -const Avatar = React.memo(props => { - return ( - <div className="Avatar" style={props.style}> - <div className="msg-avatar"> - { - props.user.uname ? - <Link to={{ pathname: props.link || `/${props.user.uname}/` }}> - { props.user.avatar ? - <img src={props.user.avatar} alt={`${props.user.uname}`} /> - : <Icon name="ei-spinner" size="m" /> } +class Avatar extends React.Component { + constructor(props) { + super(props); + this.state = { + user: props.user + }; + } + componentDidMount() { + let user = this.state.user; + if (!user.uid && user.uri) { + fetchUserUri(user.uri).then(response => { + this.setState({ + user: response.data + }); + }); + } + } + render() { + let user = this.state.user; + return ( + <div className="Avatar" style={this.props.style}> + <div className="msg-avatar"> + { + user.uname ? + <Link to={{ pathname: this.props.link || `/${user.uname}/` }}> + {user.avatar ? + <img src={user.avatar} alt={`${user.uname}`} /> + : <Icon name="ei-spinner" size="m" />} + </Link> + : <Icon name="ei-spinner" size="m" /> + } + </div> + <div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center' }}> + <span> + <Link to={{ pathname: `/${user.uname}/` }}> + <span>{user.uname}</span> </Link> - : <Icon name="ei-spinner" size="m" /> - } - </div> - <div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center' }}> - <span> - <Link to={{ pathname: `/${props.user.uname}/` }}> - <span>{props.user.uname}</span> - </Link> - </span> - {props.children} + </span> + {this.props.children} + </div> </div> - </div> - ); -}); + ); + } +} export default Avatar; @@ -48,5 +69,6 @@ export const AvatarLink = React.memo(props => { Avatar.propTypes = { user: UserType, link: PropTypes.string, + style: PropTypes.object, children: PropTypes.node }; diff --git a/vnext/src/components/Feeds.js b/vnext/src/components/Feeds.js index e8558084..430ce9f1 100644 --- a/vnext/src/components/Feeds.js +++ b/vnext/src/components/Feeds.js @@ -16,7 +16,7 @@ import { UserType } from './Types'; export function Discover(props) { let search = qs.parse(props.location.search.substring(1)); const query = { - baseUrl: '/messages', + baseUrl: '/api/messages', search: search, pageParam: search.search ? 'page' : 'before_mid' }; @@ -25,7 +25,7 @@ export function Discover(props) { export function Discussions(props) { const query = { - baseUrl: '/messages/discussions', + baseUrl: '/api/messages/discussions', pageParam: 'to' }; return (<Feed authRequired={false} query={query} {...props} />); @@ -36,7 +36,7 @@ export function Blog(props) { let search = qs.parse(props.location.search.substring(1)); search.uname = user; const query = { - baseUrl: '/messages', + baseUrl: '/api/messages', search: search, pageParam: search.search ? 'page' : 'before_mid' }; @@ -53,7 +53,7 @@ export function Blog(props) { export function Tag(props) { const { tag } = props.match.params; const query = { - baseUrl: '/messages', + baseUrl: '/api/messages', search: { tag: tag }, @@ -64,7 +64,7 @@ export function Tag(props) { export function Home(props) { const query = { - baseUrl: '/home', + baseUrl: '/api/home', pageParam: 'before_mid' }; return (<Feed authRequired={true} query={query} {...props} />); diff --git a/vnext/src/components/Thread.js b/vnext/src/components/Thread.js index b824c0ed..cf7291a8 100644 --- a/vnext/src/components/Thread.js +++ b/vnext/src/components/Thread.js @@ -41,7 +41,7 @@ export default class Thread extends React.Component { if (this.props.visitor && this.props.visitor.hash) { params.hash = this.props.visitor.hash; } - getMessages('/thread', params) + getMessages('/api/thread', params) .then(response => { let msg = response.data.shift(); this.setState({ @@ -111,7 +111,13 @@ export default class Thread extends React.Component { </div> </Avatar> </div> - <div className="msg-txt"><p dangerouslySetInnerHTML={{ __html: format(msg.body, msg.mid, (msg.tags || []).indexOf('code') >= 0) }}></p></div> + { + msg.html ? <div className="msg-txt" dangerouslySetInnerHTML={{__html: msg.body }}/> + : + <div className="msg-txt"> + <p dangerouslySetInnerHTML={{ __html: format(msg.body, msg.mid, (msg.tags || []).indexOf('code') >= 0) }} /> + </div> + } { msg.photo && <p className="ir"><a href={`//i.juick.com/p/${msg.mid}-${msg.rid}.${msg.attach}`} data-fname={`${msg.mid}-${msg.rid}.${msg.attach}`}> diff --git a/vnext/src/components/Types.js b/vnext/src/components/Types.js index 6596dc8e..db90d41e 100644 --- a/vnext/src/components/Types.js +++ b/vnext/src/components/Types.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; export const UserType = PropTypes.shape({ - uid: PropTypes.number.isRequired, + uid: PropTypes.number, uname: PropTypes.string }); |