Cross posting working.

7 files changed, 77 insertions, 36 deletions

diff --git a/ui/src/components/create-post.tsx b/ui/src/components/create-post.tsx
index dd93a3c5..3e00bd80 100644
--- a/ui/src/components/create-post.tsx
+++ b/ui/src/components/create-post.tsx
@@ -1,6 +1,7 @@
 import { Component } from 'inferno';
 import { PostForm } from './post-form';
 import { WebSocketService } from '../services';
+import { PostFormParams } from '../interfaces';
 import { i18n } from '../i18next';
 import { T } from 'inferno-i18next';
 
@@ -21,13 +22,25 @@ export class CreatePost extends Component<any, any> {
         <div class="row">
           <div class="col-12 col-lg-6 offset-lg-3 mb-4">
             <h5><T i18nKey="create_post">#</T></h5>
-            <PostForm onCreate={this.handlePostCreate} prevCommunityName={this.prevCommunityName} />
+            <PostForm onCreate={this.handlePostCreate} params={this.params} />
           </div>
         </div>
       </div>
     )
   }
 
+  get params(): PostFormParams {
+    let urlParams = new URLSearchParams(this.props.location.search);
+    let params: PostFormParams = {
+      name: urlParams.get("name"),
+      community: urlParams.get("community") || this.prevCommunityName,
+      body: urlParams.get("body"),
+      url: urlParams.get("url"),
+    };
+
+    return params;
+  }
+
   get prevCommunityName(): string {
     if (this.props.match.params.name) {
       return this.props.match.params.name;
diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx
index d21b2fb4..f502e7f3 100644
--- a/ui/src/components/post-form.tsx
+++ b/ui/src/components/post-form.tsx
@@ -2,7 +2,7 @@ import { Component, linkEvent } from 'inferno';
 import { PostListings } from './post-listings';
 import { Subscription } from "rxjs";
 import { retryWhen, delay, take } from 'rxjs/operators';
-import { PostForm as PostFormI, Post, PostResponse, UserOperation, Community, ListCommunitiesResponse, ListCommunitiesForm, SortType, SearchForm, SearchType, SearchResponse } from '../interfaces';
+import { PostForm as PostFormI, PostFormParams, Post, PostResponse, UserOperation, Community, ListCommunitiesResponse, ListCommunitiesForm, SortType, SearchForm, SearchType, SearchResponse } from '../interfaces';
 import { WebSocketService, UserService } from '../services';
 import { msgOp, getPageTitle, debounce, validURL, capitalizeFirstLetter } from '../utils';
 import * as autosize from 'autosize';
@@ -11,7 +11,7 @@ import { T } from 'inferno-i18next';
 
 interface PostFormProps {
   post?: Post; // If a post is given, that means this is an edit
-  prevCommunityName?: string;
+  params?: PostFormParams;
   onCancel?(): any;
   onCreate?(id: number): any;
   onEdit?(post: Post): any;
@@ -62,20 +62,30 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
       }
     }
 
+    if (this.props.params) {
+      this.state.postForm.name = this.props.params.name;
+      if (this.props.params.url) {
+        this.state.postForm.url = this.props.params.url;
+      }
+      if (this.props.params.body) {
+        this.state.postForm.body = this.props.params.body;
+      }
+    }
+
     this.subscription = WebSocketService.Instance.subject
-      .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
-      .subscribe(
-        (msg) => this.parseMessage(msg),
+    .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
+    .subscribe(
+      (msg) => this.parseMessage(msg),
         (err) => console.error(err),
         () => console.log('complete')
-      );
+    );
 
-      let listCommunitiesForm: ListCommunitiesForm = {
-        sort: SortType[SortType.TopAll],
-        limit: 9999,
-      }
+    let listCommunitiesForm: ListCommunitiesForm = {
+      sort: SortType[SortType.TopAll],
+      limit: 9999,
+    }
 
-      WebSocketService.Instance.listCommunities(listCommunitiesForm);
+    WebSocketService.Instance.listCommunities(listCommunitiesForm);
   }
 
   componentDidMount() {
@@ -123,7 +133,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
               <textarea value={this.state.postForm.body} onInput={linkEvent(this, this.handlePostBodyChange)} class="form-control" rows={4} maxLength={10000} />
             </div>
           </div>
-          {/* Cant change a community from an edit */}
           {!this.props.post &&
             <div class="form-group row">
             <label class="col-sm-2 col-form-label"><T i18nKey="community">#</T></label>
@@ -253,8 +262,8 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
       this.state.communities = res.communities;
       if (this.props.post) {
         this.state.postForm.community_id = this.props.post.community_id;
-      } else if (this.props.prevCommunityName) {
-        let foundCommunityId = res.communities.find(r => r.name == this.props.prevCommunityName).id;
+      } else if (this.props.params && this.props.params.community) {
+        let foundCommunityId = res.communities.find(r => r.name == this.props.params.community).id;
         this.state.postForm.community_id = foundCommunityId;
       } else {
         this.state.postForm.community_id = res.communities[0].id;
diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx
index f67a0fc7..f6bf80e4 100644
--- a/ui/src/components/post-listing.tsx
+++ b/ui/src/components/post-listing.tsx
@@ -151,7 +151,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
                 <span class="pointer" onClick={linkEvent(this, this.handleSavePostClick)}>{post.saved ? i18n.t('unsave') : i18n.t('save')}</span>
               </li>
               <li className="list-inline-item mr-2">
-                <span class="pointer" onClick={linkEvent(this, this.handleCrossPostClick)}><T i18nKey="cross_post">#</T></span>
+                <Link className="text-muted" to={`/create_post${this.crossPostParams}`}><T i18nKey="cross_post">#</T></Link>
               </li>
               {this.myPost && 
                 <>
@@ -273,15 +273,15 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
     WebSocketService.Instance.savePost(form);
   }
 
-  handleCrossPostClick(i: PostListing) { 
-    let params = `?name=${i.props.post.name}`;
-    if (i.props.post.url) {
-      params += `&url=${i.props.post.url}`;
+  get crossPostParams(): string {
+    let params = `?name=${this.props.post.name}`;
+    if (this.props.post.url) {
+      params += `&url=${this.props.post.url}`;
     }
-    if (i.props.post.body) {
-      params += `&body=${i.props.post.body}`;
+    if (this.props.post.body) {
+      params += `&body=${this.props.post.body}`;
     }
-    i.context.router.history.push(`/create_post${params}`);
+    return params;
   }
 
   handleModRemoveShow(i: PostListing) {
diff --git a/ui/src/components/post.tsx b/ui/src/components/post.tsx
index 97a9cd72..ab82ca4f 100644
--- a/ui/src/components/post.tsx
+++ b/ui/src/components/post.tsx
@@ -78,6 +78,19 @@ export class Post extends Component<any, PostState> {
       this.state.scrolled = true;
       this.markScrolledAsRead(this.state.scrolled_comment_id);
     }
+
+    // Necessary if you are on a post and you click another post (same route)
+    if (_lastProps.location.pathname !== _lastProps.history.location.pathname) {
+      // Couldnt get a refresh working. This does for now.
+      location.reload();
+
+      // let currentId = this.props.match.params.id;
+      // WebSocketService.Instance.getPost(currentId);
+      // this.context.router.history.push('/sponsors');
+      // this.context.refresh();
+      // this.context.router.history.push(_lastProps.location.pathname);
+
+    }
   }
 
   markScrolledAsRead(commentId: number) {
@@ -258,7 +271,6 @@ export class Post extends Component<any, PostState> {
     } else if (op == UserOperation.GetPost) {
       let res: GetPostResponse = msg;
       this.state.post = res.post;
-      this.state.post = res.post;
       this.state.comments = res.comments;
       this.state.community = res.community;
       this.state.moderators = res.moderators;
@@ -267,16 +279,17 @@ export class Post extends Component<any, PostState> {
       document.title = `${this.state.post.name} - ${WebSocketService.Instance.site.name}`;
 
       // Get cross-posts  
-      let form: SearchForm = {
-        q: res.post.url,
-        type_: SearchType[SearchType.Url],
-        sort: SortType[SortType.TopAll],
-        page: 1,
-        limit: 6,
-      };
-
-      WebSocketService.Instance.search(form);
-
+      if (this.state.post.url) {
+        let form: SearchForm = {
+          q: this.state.post.url,
+          type_: SearchType[SearchType.Url],
+          sort: SortType[SortType.TopAll],
+          page: 1,
+          limit: 6,
+        };
+        WebSocketService.Instance.search(form);
+      }
+      
       this.setState(this.state);
     } else if (op == UserOperation.CreateComment) {
       let res: CommentResponse = msg;
diff --git a/ui/src/components/sidebar.tsx b/ui/src/components/sidebar.tsx
index 9c24bed3..020ad018 100644
--- a/ui/src/components/sidebar.tsx
+++ b/ui/src/components/sidebar.tsx
@@ -121,7 +121,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
               )}
             </ul>
             <Link class={`btn btn-sm btn-secondary btn-block mb-3 ${(community.deleted || community.removed) && 'no-click'}`}
-            to={`/create_post/c/${community.name}`}><T i18nKey="create_a_post">#</T></Link>
+            to={`/create_post?community=${community.name}`}><T i18nKey="create_a_post">#</T></Link>
           <div>
             {community.subscribed 
               ? <button class="btn btn-sm btn-secondary btn-block" onClick={linkEvent(community.id, this.handleUnsubscribe)}><T i18nKey="unsubscribe">#</T></button>
diff --git a/ui/src/index.tsx b/ui/src/index.tsx
index e101be4e..d620a5e2 100644
--- a/ui/src/index.tsx
+++ b/ui/src/index.tsx
@@ -44,7 +44,6 @@ class Index extends Component<any, any> {
               <Route path={`/home/type/:type/sort/:sort/page/:page`} component={Main} />
               <Route exact path={`/`} component={Main} />
               <Route path={`/login`} component={Login} />
-              <Route path={`/create_post/c/:name`} component={CreatePost} />
               <Route path={`/create_post`} component={CreatePost} />
               <Route path={`/create_community`} component={CreateCommunity} />
               <Route path={`/communities/page/:page`} component={Communities} />
diff --git a/ui/src/interfaces.ts b/ui/src/interfaces.ts
index 91d89783..0a3daf66 100644
--- a/ui/src/interfaces.ts
+++ b/ui/src/interfaces.ts
@@ -412,6 +412,13 @@ export interface PostForm {
   auth: string;
 }
 
+export interface PostFormParams {
+  name: string;
+  url?: string;
+  body?: string;
+  community?: string;
+}
+
 export interface GetPostResponse {
   op: string;
   post: Post;