aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--vnext/src/components/Feeds.js29
-rw-r--r--vnext/src/components/Message.js6
2 files changed, 26 insertions, 9 deletions
diff --git a/vnext/src/components/Feeds.js b/vnext/src/components/Feeds.js
index b8367de4..0216a1b4 100644
--- a/vnext/src/components/Feeds.js
+++ b/vnext/src/components/Feeds.js
@@ -1,21 +1,22 @@
import React from 'react';
import PropTypes from 'prop-types';
+import { Link } from 'react-router-dom';
import * as qs from 'query-string';
import Message from './Message';
import Spinner from './Spinner';
export function Discover(props) {
- return (<Feed query={{ baseUrl: "https://api.juick.com/messages"}} {...props} />)
+ return (<Feed query={{ baseUrl: "https://api.juick.com/messages" }} {...props} />)
}
export function Discussions(props) {
- return (<Feed authRequired="true" query={{ baseUrl: "https://api.juick.com/messages/discussions"}} {...props} />)
+ return (<Feed authRequired="true" query={{ baseUrl: "https://api.juick.com/messages/discussions" }} {...props} />)
}
export function Blog(props) {
const { user } = props.match.params;
- return (<Feed query={{ baseUrl: `https://api.juick.com/messages`, search: { uname: user }}} {...props} />)
+ return (<Feed query={{ baseUrl: `https://api.juick.com/messages`, search: { uname: user } }} {...props} />)
}
export function Tag(props) {
@@ -34,7 +35,7 @@ class Feed extends React.Component {
componentDidMount() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
- this.loadMessages(this.props.visitor.hash);
+ this.loadMessages(this.props.visitor.hash, this.props.location.search);
}
componentWillReceiveProps(nextProps) {
if (this.props.location.search != nextProps.location.search
@@ -67,9 +68,23 @@ class Feed extends React.Component {
}
render() {
- var nodes = this.state.msgs.map(msg => {
- return (<Message key={msg.mid} data={msg} visitor={this.props.visitor} />);
- });
+ const { tag } = qs.parse(this.props.location.search || {});
+ const nodes = (
+ <React.Fragment>
+ {
+ tag && (
+ <p className="page">
+ <Link to={{ pathname: `/tag/${tag}` }}>
+ <span>← All posts with tag&nbsp;</span><b>{tag}</b>
+ </Link>
+ </p>
+ )
+ }
+ {this.state.msgs.map(msg =>
+ <Message key={msg.mid} data={msg} visitor={this.props.visitor} />)
+ }
+ </React.Fragment>
+ );
return this.state.msgs.length > 0 ? (
<div className="msgs" id="content">{nodes}</div>
) : <div className="msgs" id="content"><Spinner /><Spinner /><Spinner /><Spinner /></div>;
diff --git a/vnext/src/components/Message.js b/vnext/src/components/Message.js
index 5667047c..9a15d512 100644
--- a/vnext/src/components/Message.js
+++ b/vnext/src/components/Message.js
@@ -1,5 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
+import { Link } from 'react-router-dom';
import moment from 'moment';
import { UserType } from './Types';
@@ -27,7 +28,7 @@ export default function Message(props) {
</a>
</div>
<div className="msg-tags" itemProp="headline">
- <Tags data={msg.tags || []} />
+ <Tags user={msg.user} data={msg.tags || []} />
</div>
</header>
<div className="msg-txt">
@@ -96,7 +97,7 @@ export default function Message(props) {
function Tags(props) {
return props.data && props.data.map(tag => {
- return (<a key={tag} href={`/tag/${tag}`} title={tag}>{tag}</a>)
+ return (<Link key={tag} to={{ pathname: `/${props.user.uname}`, search: `?tag=${tag}`}} title={tag}>{tag}</Link>)
})
}
@@ -111,6 +112,7 @@ Message.propTypes = {
};
Tags.propTypes = {
+ user: UserType.isRequired,
data: PropTypes.array
}