Home feed and column fixes

2 files changed, 39 insertions, 35 deletions

diff --git a/vnext/src/components/Feeds.js b/vnext/src/components/Feeds.js
index f0a3c523..0f12575f 100644
--- a/vnext/src/components/Feeds.js
+++ b/vnext/src/components/Feeds.js
@@ -47,6 +47,14 @@ export function Tag(props) {
   return (<Feed query={query} {...props} />)
 }
 
+export function Home(props) {
+  const query = {
+    baseUrl: `https://api.juick.com/home`,
+    pageParam: 'before_mid'
+  };
+  return (<Feed authRequired="true" query={query} {...props} />)
+}
+
 class Feed extends React.Component {
   constructor(props) {
     super(props);
diff --git a/vnext/src/index.js b/vnext/src/index.js
index a7e439a4..e2090b78 100644
--- a/vnext/src/index.js
+++ b/vnext/src/index.js
@@ -2,7 +2,7 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import { BrowserRouter as Router, Route, Link, Switch } from 'react-router-dom';
 import Icon from './components/Icon';
-import { Discover, Discussions, Blog, Tag } from './components/Feeds';
+import { Discover, Discussions, Blog, Tag, Home } from './components/Feeds';
 import Post from './components/Post';
 import Thread from './components/Thread';
 import LoginButton from './components/LoginButton';
@@ -120,6 +120,7 @@ class App extends React.Component {
             <section id="content">
               <Switch>
                 <Route exact path="/" render={(props) => <Discover visitor={this.state.visitor} {...props} />} />
+                <Route exact path="/home" render={(props) => <Home visitor={this.state.visitor} {...props} />} />
                 <Route exact path="/discussions" render={(props) => <Discussions visitor={this.state.visitor} {...props} />} />
                 <Route exact path="/post" render={(props) => <Post visitor={this.state.visitor} {...props} />} />
                 <Route exact path="/:user" render={(props) => <Blog visitor={this.state.visitor} {...props} />} />
@@ -128,10 +129,10 @@ class App extends React.Component {
               </Switch>
             </section>
             <aside id="column">
-              <ul>
-                {
-                  this.state.visitor.uid > 0 &&
-                  <React.Fragment>
+              {
+                this.state.visitor.uid > 0 &&
+                <React.Fragment>
+                  <ul>
                     <li>
                       <Link to="/home">
                         <Icon name="ei-clock" size="s" />My feed
@@ -143,11 +144,6 @@ class App extends React.Component {
                       </Link>
                     </li>
                     <li>
-                      <Link to="/?show=discuss">
-                        <Icon name="ei-comment" size="s" />Discussions
-                      </Link>
-                      </li>
-                    <li>
                       <Link to="/{{ user.name }}/?show=recomm" rel="nofollow">
                         <Icon name="ei-heart" size="s" />Recommendations
                       </Link>
@@ -162,34 +158,34 @@ class App extends React.Component {
                         <Icon name="ei-gear" size="s" />Settings
                       </Link>
                     </li>
-                  </React.Fragment>
-                }
-              </ul>
-              <hr />
-              <form action="/{{ user.name }}/">
-                <p><input type="text" name="search" className="inp" placeholder="Search..." /></p>
-              </form>
-              <hr />
-              <div id="ustats">
-                <ul>
-                  <li><a href="/{{ user.name }}/friends">I read: {this.state.visitor.statsIRead}</a></li>
-                  <li><a href="/{{ user.name }}/readers">My readers: {this.state.visitor.statsMyReaders}</a></li>
-                  {
-                    this.state.visitor.statsMyBL &&
-                    <li><a href="/{{ user.name }}/bl">My blacklist: {this.state.visitor.statsMyBL}</a></li>
-                  }
-                  <li>Messages: {this.state.visitor.statsMessages}</li>
-                  <li>Comments: {this.state.visitor.statsReplies}</li>
-                </ul>
-                {
-                  this.state.visitor.iread &&
-                  <div className="iread">
+                  </ul>
+                  <hr />
+                  <form action="/{{ user.name }}/">
+                    <p><input type="text" name="search" className="inp" placeholder="Search..." /></p>
+                  </form>
+                  <hr />
+                  <div id="ustats">
+                    <ul>
+                      <li><a href="/{{ user.name }}/friends">I read: {this.state.visitor.statsIRead}</a></li>
+                      <li><a href="/{{ user.name }}/readers">My readers: {this.state.visitor.statsMyReaders}</a></li>
+                      {
+                        this.state.visitor.statsMyBL &&
+                        <li><a href="/{{ user.name }}/bl">My blacklist: {this.state.visitor.statsMyBL}</a></li>
+                      }
+                      <li>Messages: {this.state.visitor.statsMessages}</li>
+                      <li>Comments: {this.state.visitor.statsReplies}</li>
+                    </ul>
                     {
-                      this.state.visitor.iread.map(u => <Avatar user={u} /> )
+                      this.state.visitor.iread &&
+                      <div className="iread">
+                        {
+                          this.state.visitor.iread.map(u => <Avatar user={u} />)
+                        }
+                      </div>
                     }
                   </div>
-                }
-              </div>
+                </React.Fragment>
+              }
             </aside>
           </div>
           <Footer />