Cross posting working.

This commit is contained in:
Dessalines 2019-08-22 16:13:26 -07:00
parent f7ef3fb7f8
commit 6d42d114e4
7 changed files with 77 additions and 36 deletions

View file

@ -1,6 +1,7 @@
import { Component } from 'inferno'; import { Component } from 'inferno';
import { PostForm } from './post-form'; import { PostForm } from './post-form';
import { WebSocketService } from '../services'; import { WebSocketService } from '../services';
import { PostFormParams } from '../interfaces';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
import { T } from 'inferno-i18next'; import { T } from 'inferno-i18next';
@ -21,13 +22,25 @@ export class CreatePost extends Component<any, any> {
<div class="row"> <div class="row">
<div class="col-12 col-lg-6 offset-lg-3 mb-4"> <div class="col-12 col-lg-6 offset-lg-3 mb-4">
<h5><T i18nKey="create_post">#</T></h5> <h5><T i18nKey="create_post">#</T></h5>
<PostForm onCreate={this.handlePostCreate} prevCommunityName={this.prevCommunityName} /> <PostForm onCreate={this.handlePostCreate} params={this.params} />
</div> </div>
</div> </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 { get prevCommunityName(): string {
if (this.props.match.params.name) { if (this.props.match.params.name) {
return this.props.match.params.name; return this.props.match.params.name;

View file

@ -2,7 +2,7 @@ import { Component, linkEvent } from 'inferno';
import { PostListings } from './post-listings'; import { PostListings } from './post-listings';
import { Subscription } from "rxjs"; import { Subscription } from "rxjs";
import { retryWhen, delay, take } from 'rxjs/operators'; 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 { WebSocketService, UserService } from '../services';
import { msgOp, getPageTitle, debounce, validURL, capitalizeFirstLetter } from '../utils'; import { msgOp, getPageTitle, debounce, validURL, capitalizeFirstLetter } from '../utils';
import * as autosize from 'autosize'; import * as autosize from 'autosize';
@ -11,7 +11,7 @@ import { T } from 'inferno-i18next';
interface PostFormProps { interface PostFormProps {
post?: Post; // If a post is given, that means this is an edit post?: Post; // If a post is given, that means this is an edit
prevCommunityName?: string; params?: PostFormParams;
onCancel?(): any; onCancel?(): any;
onCreate?(id: number): any; onCreate?(id: number): any;
onEdit?(post: Post): 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 this.subscription = WebSocketService.Instance.subject
.pipe(retryWhen(errors => errors.pipe(delay(3000), take(10)))) .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
.subscribe( .subscribe(
(msg) => this.parseMessage(msg), (msg) => this.parseMessage(msg),
(err) => console.error(err), (err) => console.error(err),
() => console.log('complete') () => console.log('complete')
); );
let listCommunitiesForm: ListCommunitiesForm = { let listCommunitiesForm: ListCommunitiesForm = {
sort: SortType[SortType.TopAll], sort: SortType[SortType.TopAll],
limit: 9999, limit: 9999,
} }
WebSocketService.Instance.listCommunities(listCommunitiesForm); WebSocketService.Instance.listCommunities(listCommunitiesForm);
} }
componentDidMount() { 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} /> <textarea value={this.state.postForm.body} onInput={linkEvent(this, this.handlePostBodyChange)} class="form-control" rows={4} maxLength={10000} />
</div> </div>
</div> </div>
{/* Cant change a community from an edit */}
{!this.props.post && {!this.props.post &&
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-2 col-form-label"><T i18nKey="community">#</T></label> <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; this.state.communities = res.communities;
if (this.props.post) { if (this.props.post) {
this.state.postForm.community_id = this.props.post.community_id; this.state.postForm.community_id = this.props.post.community_id;
} else if (this.props.prevCommunityName) { } else if (this.props.params && this.props.params.community) {
let foundCommunityId = res.communities.find(r => r.name == this.props.prevCommunityName).id; let foundCommunityId = res.communities.find(r => r.name == this.props.params.community).id;
this.state.postForm.community_id = foundCommunityId; this.state.postForm.community_id = foundCommunityId;
} else { } else {
this.state.postForm.community_id = res.communities[0].id; this.state.postForm.community_id = res.communities[0].id;

View file

@ -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> <span class="pointer" onClick={linkEvent(this, this.handleSavePostClick)}>{post.saved ? i18n.t('unsave') : i18n.t('save')}</span>
</li> </li>
<li className="list-inline-item mr-2"> <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> </li>
{this.myPost && {this.myPost &&
<> <>
@ -273,15 +273,15 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
WebSocketService.Instance.savePost(form); WebSocketService.Instance.savePost(form);
} }
handleCrossPostClick(i: PostListing) { get crossPostParams(): string {
let params = `?name=${i.props.post.name}`; let params = `?name=${this.props.post.name}`;
if (i.props.post.url) { if (this.props.post.url) {
params += `&url=${i.props.post.url}`; params += `&url=${this.props.post.url}`;
} }
if (i.props.post.body) { if (this.props.post.body) {
params += `&body=${i.props.post.body}`; params += `&body=${this.props.post.body}`;
} }
i.context.router.history.push(`/create_post${params}`); return params;
} }
handleModRemoveShow(i: PostListing) { handleModRemoveShow(i: PostListing) {

View file

@ -78,6 +78,19 @@ export class Post extends Component<any, PostState> {
this.state.scrolled = true; this.state.scrolled = true;
this.markScrolledAsRead(this.state.scrolled_comment_id); 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) { markScrolledAsRead(commentId: number) {
@ -258,7 +271,6 @@ export class Post extends Component<any, PostState> {
} else if (op == UserOperation.GetPost) { } else if (op == UserOperation.GetPost) {
let res: GetPostResponse = msg; let res: GetPostResponse = msg;
this.state.post = res.post; this.state.post = res.post;
this.state.post = res.post;
this.state.comments = res.comments; this.state.comments = res.comments;
this.state.community = res.community; this.state.community = res.community;
this.state.moderators = res.moderators; 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}`; document.title = `${this.state.post.name} - ${WebSocketService.Instance.site.name}`;
// Get cross-posts // Get cross-posts
let form: SearchForm = { if (this.state.post.url) {
q: res.post.url, let form: SearchForm = {
type_: SearchType[SearchType.Url], q: this.state.post.url,
sort: SortType[SortType.TopAll], type_: SearchType[SearchType.Url],
page: 1, sort: SortType[SortType.TopAll],
limit: 6, page: 1,
}; limit: 6,
};
WebSocketService.Instance.search(form); WebSocketService.Instance.search(form);
}
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateComment) { } else if (op == UserOperation.CreateComment) {
let res: CommentResponse = msg; let res: CommentResponse = msg;

View file

@ -121,7 +121,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
)} )}
</ul> </ul>
<Link class={`btn btn-sm btn-secondary btn-block mb-3 ${(community.deleted || community.removed) && 'no-click'}`} <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> <div>
{community.subscribed {community.subscribed
? <button class="btn btn-sm btn-secondary btn-block" onClick={linkEvent(community.id, this.handleUnsubscribe)}><T i18nKey="unsubscribe">#</T></button> ? <button class="btn btn-sm btn-secondary btn-block" onClick={linkEvent(community.id, this.handleUnsubscribe)}><T i18nKey="unsubscribe">#</T></button>

View file

@ -44,7 +44,6 @@ class Index extends Component<any, any> {
<Route path={`/home/type/:type/sort/:sort/page/:page`} component={Main} /> <Route path={`/home/type/:type/sort/:sort/page/:page`} component={Main} />
<Route exact path={`/`} component={Main} /> <Route exact path={`/`} component={Main} />
<Route path={`/login`} component={Login} /> <Route path={`/login`} component={Login} />
<Route path={`/create_post/c/:name`} component={CreatePost} />
<Route path={`/create_post`} component={CreatePost} /> <Route path={`/create_post`} component={CreatePost} />
<Route path={`/create_community`} component={CreateCommunity} /> <Route path={`/create_community`} component={CreateCommunity} />
<Route path={`/communities/page/:page`} component={Communities} /> <Route path={`/communities/page/:page`} component={Communities} />

View file

@ -412,6 +412,13 @@ export interface PostForm {
auth: string; auth: string;
} }
export interface PostFormParams {
name: string;
url?: string;
body?: string;
community?: string;
}
export interface GetPostResponse { export interface GetPostResponse {
op: string; op: string;
post: Post; post: Post;