|
|
|
@ -27,7 +27,7 @@ import { |
|
|
|
Site, |
|
|
|
FollowCommunityForm, |
|
|
|
} from '../interfaces'; |
|
|
|
import { WebSocketService } from '../services'; |
|
|
|
import { UserService, WebSocketService } from '../services'; |
|
|
|
import { PostListings } from './post-listings'; |
|
|
|
import { CommentNodes } from './comment-nodes'; |
|
|
|
import { SortSelect } from './sort-select'; |
|
|
|
@ -50,6 +50,8 @@ import { |
|
|
|
isCommentChanged, |
|
|
|
isPostChanged, |
|
|
|
siteName, |
|
|
|
api, |
|
|
|
savePostFindRes, |
|
|
|
} from '../utils'; |
|
|
|
import { i18n } from '../i18next'; |
|
|
|
import { Icon } from './icon'; |
|
|
|
@ -61,6 +63,9 @@ import Block, { Flex } from './elements/Block'; |
|
|
|
import Header, { Separator } from './Header'; |
|
|
|
import StyledLink from '../StyledLink'; |
|
|
|
import Tooltip from './Tooltip'; |
|
|
|
import { List } from 'immutable'; |
|
|
|
import update from 'immutability-helper'; |
|
|
|
import { Box } from 'theme-ui'; |
|
|
|
|
|
|
|
interface State { |
|
|
|
community: CommunityI; |
|
|
|
@ -71,7 +76,7 @@ interface State { |
|
|
|
sitemods: Array<UserView>; |
|
|
|
online: number; |
|
|
|
loading: boolean; |
|
|
|
posts: Array<Post>; |
|
|
|
posts: List<Post>; |
|
|
|
comments: Array<Comment>; |
|
|
|
dataType: DataType; |
|
|
|
sort: SortType; |
|
|
|
@ -122,7 +127,7 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
communityName: this.props.match.params.name, |
|
|
|
online: null, |
|
|
|
loading: true, |
|
|
|
posts: [], |
|
|
|
posts: List(), |
|
|
|
comments: [], |
|
|
|
dataType: getDataTypeFromProps(this.props), |
|
|
|
sort: getSortTypeFromProps(this.props), |
|
|
|
@ -150,7 +155,9 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
this.state = this.emptyState; |
|
|
|
this.handleSortChange = this.handleSortChange.bind(this); |
|
|
|
this.handleDataTypeChange = this.handleDataTypeChange.bind(this); |
|
|
|
} |
|
|
|
|
|
|
|
componentDidMount(){ |
|
|
|
this.subscription = WebSocketService.Instance.subject |
|
|
|
.pipe(retryWhen(errors => errors.pipe(delay(3000), take(10)))) |
|
|
|
.subscribe( |
|
|
|
@ -184,7 +191,6 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
lastState.sort !== this.state.sort || |
|
|
|
lastState.page !== this.state.page |
|
|
|
) { |
|
|
|
this.setState({ loading: true }); |
|
|
|
this.fetchData(); |
|
|
|
} |
|
|
|
|
|
|
|
@ -308,13 +314,27 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
|
|
|
|
listings() { |
|
|
|
return this.state.dataType == DataType.Post ? ( |
|
|
|
<PostListings |
|
|
|
posts={this.state.posts} |
|
|
|
removeDuplicates |
|
|
|
sort={this.state.sort} |
|
|
|
enableDownvotes |
|
|
|
enableNsfw |
|
|
|
/> |
|
|
|
<> |
|
|
|
<PostListings |
|
|
|
// filter out sticky posts from main and announcements otherwise they show up twice
|
|
|
|
posts={this.state.posts} |
|
|
|
sort={this.state.sort} |
|
|
|
enableDownvotes |
|
|
|
enableNsfw |
|
|
|
/> |
|
|
|
<Box my={4}> |
|
|
|
{this.state.page > 1 && ( |
|
|
|
<Button mr={1} variant="muted" onClick={this.prevPage}> |
|
|
|
{i18n.t('prev')} |
|
|
|
</Button> |
|
|
|
)} |
|
|
|
{this.state.posts.size > 0 && ( |
|
|
|
<Button variant="muted" onClick={this.nextPage}> |
|
|
|
{i18n.t('next')} |
|
|
|
</Button> |
|
|
|
)} |
|
|
|
</Box> |
|
|
|
</> |
|
|
|
) : ( |
|
|
|
<CommentNodes |
|
|
|
nodes={commentsToFlatNodes(this.state.comments)} |
|
|
|
@ -363,7 +383,7 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
{i18n.t('prev')} |
|
|
|
</Button> |
|
|
|
)} |
|
|
|
{this.state.posts.length > 0 && ( |
|
|
|
{this.state.posts.size > 0 && ( |
|
|
|
<Button |
|
|
|
className="btn btn-sm btn-secondary" |
|
|
|
onClick={linkEvent(this, this.nextPage)} |
|
|
|
@ -422,16 +442,37 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
fetchData() { |
|
|
|
async fetchData() { |
|
|
|
if (this.state.dataType == DataType.Post) { |
|
|
|
let getPostsForm: GetPostsForm = { |
|
|
|
this.setState({ |
|
|
|
loading: true, |
|
|
|
}) |
|
|
|
|
|
|
|
const params = new URLSearchParams({ |
|
|
|
page: this.state.page, |
|
|
|
limit: fetchLimit, |
|
|
|
sort: SortType[this.state.sort], |
|
|
|
type_: ListingType[ListingType.Community], |
|
|
|
community_id: this.state.community.id, |
|
|
|
}; |
|
|
|
WebSocketService.Instance.getPosts(getPostsForm); |
|
|
|
type_: ListingType[2], |
|
|
|
community_id: this.state.community.id |
|
|
|
} as any); |
|
|
|
|
|
|
|
if (UserService.Instance.auth) { |
|
|
|
params.append('auth', UserService.Instance.auth); |
|
|
|
} |
|
|
|
|
|
|
|
api.get(`post/list?${params.toString()}`) |
|
|
|
.then(res => res.data) |
|
|
|
.then( |
|
|
|
(result) => { |
|
|
|
this.setState({ |
|
|
|
posts: List(result.posts), |
|
|
|
loading: false, |
|
|
|
}) |
|
|
|
} |
|
|
|
); |
|
|
|
|
|
|
|
//WebSocketService.Instance.communityJoinRoom(this.state.community.id);
|
|
|
|
setupTippy(); |
|
|
|
} else { |
|
|
|
let getCommentsForm: GetCommentsForm = { |
|
|
|
page: this.state.page, |
|
|
|
@ -445,7 +486,6 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
} |
|
|
|
|
|
|
|
parseMessage(msg: WebSocketJsonResponse) { |
|
|
|
console.log(msg); |
|
|
|
let res = wsJsonToRes(msg); |
|
|
|
if (msg.error) { |
|
|
|
toast(i18n.t(msg.error), 'danger'); |
|
|
|
@ -483,7 +523,7 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
let data = res.data as GetPostsResponse; |
|
|
|
this.setState( |
|
|
|
{ |
|
|
|
posts: data.posts, |
|
|
|
posts: List(data.posts), |
|
|
|
loading: false, |
|
|
|
}, |
|
|
|
() => { |
|
|
|
@ -492,16 +532,23 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
); |
|
|
|
} else if (isPostChanged(res.op)) { |
|
|
|
let data = res.data as PostResponse; |
|
|
|
editPostFindRes(data, this.state.posts); |
|
|
|
this.setState(this.state); |
|
|
|
this.setState({ |
|
|
|
posts: editPostFindRes(data, this.state.posts), |
|
|
|
}); |
|
|
|
} else if (res.op == UserOperation.CreatePost) { |
|
|
|
let data = res.data as PostResponse; |
|
|
|
this.state.posts.unshift(data.post); |
|
|
|
this.setState(this.state); |
|
|
|
} else if (res.op == UserOperation.CreatePostLike) { |
|
|
|
let data = res.data as PostResponse; |
|
|
|
createPostLikeFindRes(data, this.state.posts); |
|
|
|
this.setState(this.state); |
|
|
|
this.setState({ |
|
|
|
posts: createPostLikeFindRes(data, this.state.posts), |
|
|
|
}); |
|
|
|
} else if (res.op == UserOperation.SavePost) { |
|
|
|
let data = res.data as PostResponse; |
|
|
|
this.setState({ |
|
|
|
posts: savePostFindRes(data, this.state.posts), |
|
|
|
}); |
|
|
|
} else if (res.op == UserOperation.AddModToCommunity) { |
|
|
|
let data = res.data as AddModToCommunityResponse; |
|
|
|
this.setState({ |
|
|
|
@ -510,9 +557,11 @@ export class BaseCommunity extends Component<any, State> { |
|
|
|
} else if (res.op == UserOperation.BanFromCommunity) { |
|
|
|
let data = res.data as BanFromCommunityResponse; |
|
|
|
|
|
|
|
this.state.posts |
|
|
|
.filter(p => p.creator_id == data.user.id) |
|
|
|
.forEach(p => (p.banned = data.banned)); |
|
|
|
this.setState({ |
|
|
|
posts: this.state.posts |
|
|
|
.filter(p => p.creator_id == data.user.id) |
|
|
|
.map(p => update(p, {banned_from_community: {$set: data.banned}})), |
|
|
|
}); |
|
|
|
} else if (res.op == UserOperation.GetComments) { |
|
|
|
let data = res.data as GetCommentsResponse; |
|
|
|
this.setState({ |
|
|
|
|
DashEightMate
2 years ago