From b7e73a5559d05a8d06ef2e01f7382a90bb50f44f Mon Sep 17 00:00:00 2001 From: Dessalines Date: Wed, 21 Aug 2019 22:17:15 -0700 Subject: View where a URL has been cross-posted to in the past - This shows when creating a post, or when viewing a post. - Fixes #131 --- ui/src/components/post-form.tsx | 29 ++++++++++++++++++++++++++++- ui/src/components/post.tsx | 29 +++++++++++++++++++++++++++-- ui/src/components/search.tsx | 1 + ui/src/interfaces.ts | 3 ++- ui/src/translations/en.ts | 1 + 5 files changed, 59 insertions(+), 4 deletions(-) (limited to 'ui/src') diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx index 42620c9f..d21b2fb4 100644 --- a/ui/src/components/post-form.tsx +++ b/ui/src/components/post-form.tsx @@ -23,6 +23,7 @@ interface PostFormState { loading: boolean; suggestedTitle: string; suggestedPosts: Array; + crossPosts: Array; } export class PostForm extends Component { @@ -40,6 +41,7 @@ export class PostForm extends Component { loading: false, suggestedTitle: undefined, suggestedPosts: [], + crossPosts: [], } constructor(props: any, context: any) { @@ -95,6 +97,12 @@ export class PostForm extends Component { {this.state.suggestedTitle &&
#
} + {this.state.crossPosts.length > 0 && + <> +
#
+ + + }
@@ -170,13 +178,27 @@ export class PostForm extends Component { handlePostUrlChange(i: PostForm, event: any) { i.state.postForm.url = event.target.value; if (validURL(i.state.postForm.url)) { + + let form: SearchForm = { + q: i.state.postForm.url, + type_: SearchType[SearchType.Url], + sort: SortType[SortType.TopAll], + page: 1, + limit: 6, + }; + + WebSocketService.Instance.search(form); + + // Fetch the page title getPageTitle(i.state.postForm.url).then(d => { i.state.suggestedTitle = d; i.setState(i.state); }); } else { i.state.suggestedTitle = undefined; + i.state.crossPosts = []; } + i.setState(i.state); } @@ -248,7 +270,12 @@ export class PostForm extends Component { this.props.onEdit(res.post); } else if (op == UserOperation.Search) { let res: SearchResponse = msg; - this.state.suggestedPosts = res.posts; + + if (res.type_ == SearchType[SearchType.Posts]) { + this.state.suggestedPosts = res.posts; + } else if (res.type_ == SearchType[SearchType.Url]) { + this.state.crossPosts = res.posts; + } this.setState(this.state); } } diff --git a/ui/src/components/post.tsx b/ui/src/components/post.tsx index b0204d38..97a9cd72 100644 --- a/ui/src/components/post.tsx +++ b/ui/src/components/post.tsx @@ -1,10 +1,11 @@ import { Component, linkEvent } from 'inferno'; import { Subscription } from "rxjs"; import { retryWhen, delay, take } from 'rxjs/operators'; -import { UserOperation, Community, Post as PostI, GetPostResponse, PostResponse, Comment, CommentForm as CommentFormI, CommentResponse, CommentSortType, CreatePostLikeResponse, CommunityUser, CommunityResponse, CommentNode as CommentNodeI, BanFromCommunityResponse, BanUserResponse, AddModToCommunityResponse, AddAdminResponse, UserView } from '../interfaces'; +import { UserOperation, Community, Post as PostI, GetPostResponse, PostResponse, Comment, CommentForm as CommentFormI, CommentResponse, CommentSortType, CreatePostLikeResponse, CommunityUser, CommunityResponse, CommentNode as CommentNodeI, BanFromCommunityResponse, BanUserResponse, AddModToCommunityResponse, AddAdminResponse, UserView, SearchType, SortType, SearchForm, SearchResponse } from '../interfaces'; import { WebSocketService, UserService } from '../services'; import { msgOp, hotRank } from '../utils'; import { PostListing } from './post-listing'; +import { PostListings } from './post-listings'; import { Sidebar } from './sidebar'; import { CommentForm } from './comment-form'; import { CommentNodes } from './comment-nodes'; @@ -22,6 +23,7 @@ interface PostState { scrolled?: boolean; scrolled_comment_id?: number; loading: boolean; + crossPosts: Array; } export class Post extends Component { @@ -35,7 +37,8 @@ export class Post extends Component { moderators: [], admins: [], scrolled: false, - loading: true + loading: true, + crossPosts: [], } constructor(props: any, context: any) { @@ -112,6 +115,12 @@ export class Post extends Component { moderators={this.state.moderators} admins={this.state.admins} /> + {this.state.crossPosts.length > 0 && + <> +
#
+ + + }
{this.sortRadios()} @@ -256,6 +265,18 @@ export class Post extends Component { this.state.admins = res.admins; this.state.loading = false; 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); + this.setState(this.state); } else if (op == UserOperation.CreateComment) { let res: CommentResponse = msg; @@ -332,6 +353,10 @@ export class Post extends Component { let res: AddAdminResponse = msg; this.state.admins = res.admins; this.setState(this.state); + } else if (op == UserOperation.Search) { + let res: SearchResponse = msg; + this.state.crossPosts = res.posts.filter(p => p.id != this.state.post.id); + this.setState(this.state); } } diff --git a/ui/src/components/search.tsx b/ui/src/components/search.tsx index 0f8727cb..34a4a3d3 100644 --- a/ui/src/components/search.tsx +++ b/ui/src/components/search.tsx @@ -29,6 +29,7 @@ export class Search extends Component { page: 1, searchResponse: { op: null, + type_: null, posts: [], comments: [], communities: [], diff --git a/ui/src/interfaces.ts b/ui/src/interfaces.ts index ebd42340..91d89783 100644 --- a/ui/src/interfaces.ts +++ b/ui/src/interfaces.ts @@ -15,7 +15,7 @@ export enum SortType { } export enum SearchType { - All, Comments, Posts, Communities, Users + All, Comments, Posts, Communities, Users, Url } export interface User { @@ -551,6 +551,7 @@ export interface SearchForm { export interface SearchResponse { op: string; + type_: string; posts?: Array; comments?: Array; communities: Array; diff --git a/ui/src/translations/en.ts b/ui/src/translations/en.ts index b5c06672..90497ada 100644 --- a/ui/src/translations/en.ts +++ b/ui/src/translations/en.ts @@ -8,6 +8,7 @@ export const en = { number_of_posts:'{{count}} Posts', posts: 'Posts', related_posts: 'These posts might be related', + cross_posts: 'This link has also been posted to:', comments: 'Comments', number_of_comments:'{{count}} Comments', remove_comment: 'Remove Comment', -- cgit v1.2.3