grishka/lemmy
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

First pass at fixing UI to work with new websocketresponses.

Browse source
This commit is contained in:
Dessalines 2020-01-18 23:54:10 -05:00
parent 05ee5a8b60
commit a044718066
16 changed files with 397 additions and 433 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
ui/src/components/communities.tsx vendored
View file

@ -12,7 +12,7 @@ import {
SortType, SortType,
} from '../interfaces'; } from '../interfaces';
import { WebSocketService } from '../services'; import { WebSocketService } from '../services';
import { msgOp } from '../utils'; import { wsJsonToRes } from '../utils';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
import { T } from 'inferno-i18next'; import { T } from 'inferno-i18next';
@ -36,14 +36,7 @@ export class Communities extends Component<any, CommunitiesState> {
super(props, context); super(props, context);
this.state = this.emptyState; this.state = this.emptyState;
this.subscription = WebSocketService.Instance.subject this.subscription = WebSocketService.Instance.subject
.pipe( .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
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),
@ -236,13 +229,13 @@ export class Communities extends Component<any, CommunitiesState> {
parseMessage(msg: any) { parseMessage(msg: any) {
console.log(msg); console.log(msg);
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
return; return;
} else if (op == UserOperation.ListCommunities) { } else if (res.op == UserOperation.ListCommunities) {
let res: ListCommunitiesResponse = msg; let data = res.data as ListCommunitiesResponse;
this.state.communities = res.communities; this.state.communities = data.communities;
this.state.communities.sort( this.state.communities.sort(
(a, b) => b.number_of_subscribers - a.number_of_subscribers (a, b) => b.number_of_subscribers - a.number_of_subscribers
); );
@ -251,11 +244,11 @@ export class Communities extends Component<any, CommunitiesState> {
this.setState(this.state); this.setState(this.state);
let table = document.querySelector('#community_table'); let table = document.querySelector('#community_table');
Sortable.initTable(table); Sortable.initTable(table);
} else if (op == UserOperation.FollowCommunity) { } else if (res.op == UserOperation.FollowCommunity) {
let res: CommunityResponse = msg; let data = res.data as CommunityResponse;
let found = this.state.communities.find(c => c.id == res.community.id); let found = this.state.communities.find(c => c.id == data.community.id);
found.subscribed = res.community.subscribed; found.subscribed = data.community.subscribed;
found.number_of_subscribers = res.community.number_of_subscribers; found.number_of_subscribers = data.community.number_of_subscribers;
this.setState(this.state); this.setState(this.state);
} }
} }

47
ui/src/components/community-form.tsx vendored
View file

@ -10,8 +10,8 @@ import {
GetSiteResponse, GetSiteResponse,
} from '../interfaces'; } from '../interfaces';
import { WebSocketService } from '../services'; import { WebSocketService } from '../services';
import { msgOp, capitalizeFirstLetter } from '../utils'; import { wsJsonToRes, capitalizeFirstLetter } from '../utils';
import * as autosize from 'autosize'; import autosize from 'autosize';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
import { T } from 'inferno-i18next'; import { T } from 'inferno-i18next';
@ -67,14 +67,7 @@ export class CommunityForm extends Component<
} }
this.subscription = WebSocketService.Instance.subject this.subscription = WebSocketService.Instance.subject
.pipe( .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
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),
@ -247,33 +240,33 @@ export class CommunityForm extends Component<
} }
parseMessage(msg: any) { parseMessage(msg: any) {
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
console.log(msg); console.log(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
this.state.loading = false; this.state.loading = false;
this.setState(this.state); this.setState(this.state);
return; return;
} else if (op == UserOperation.ListCategories) { } else if (res.op == UserOperation.ListCategories) {
let res: ListCategoriesResponse = msg; let data = res.data as ListCategoriesResponse;
this.state.categories = res.categories; this.state.categories = data.categories;
if (!this.props.community) { if (!this.props.community) {
this.state.communityForm.category_id = res.categories[0].id; this.state.communityForm.category_id = data.categories[0].id;
} }
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateCommunity) { } else if (res.op == UserOperation.CreateCommunity) {
let res: CommunityResponse = msg; let data = res.data as CommunityResponse;
this.state.loading = false; this.state.loading = false;
this.props.onCreate(res.community); this.props.onCreate(data.community);
} }
// TODO is ths necessary // TODO is this necessary
else if (op == UserOperation.EditCommunity) { else if (res.op == UserOperation.EditCommunity) {
let res: CommunityResponse = msg; let data = res.data as CommunityResponse;
this.state.loading = false; this.state.loading = false;
this.props.onEdit(res.community); this.props.onEdit(data.community);
} else if (op == UserOperation.GetSite) { } else if (res.op == UserOperation.GetSite) {
let res: GetSiteResponse = msg; let data = res.data as GetSiteResponse;
this.state.enable_nsfw = res.site.enable_nsfw; this.state.enable_nsfw = data.site.enable_nsfw;
this.setState(this.state); this.setState(this.state);
} }
} }

53
ui/src/components/community.tsx vendored
View file

@ -20,7 +20,7 @@ import { PostListings } from './post-listings';
import { SortSelect } from './sort-select'; import { SortSelect } from './sort-select';
import { Sidebar } from './sidebar'; import { Sidebar } from './sidebar';
import { import {
msgOp, wsJsonToRes,
routeSortTypeToEnum, routeSortTypeToEnum,
fetchLimit, fetchLimit,
postRefetchSeconds, postRefetchSeconds,
@ -253,46 +253,47 @@ export class Community extends Component<any, State> {
parseMessage(msg: any) { parseMessage(msg: any) {
console.log(msg); console.log(msg);
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
this.context.router.history.push('/'); this.context.router.history.push('/');
return; return;
} else if (op == UserOperation.GetCommunity) { } else if (res.op == UserOperation.GetCommunity) {
let res: GetCommunityResponse = msg; let data = res.data as GetCommunityResponse;
this.state.community = res.community; this.state.community = data.community;
this.state.moderators = res.moderators; this.state.moderators = data.moderators;
this.state.admins = res.admins; this.state.admins = data.admins;
document.title = `/c/${this.state.community.name} - ${WebSocketService.Instance.site.name}`; document.title = `/c/${this.state.community.name} - ${WebSocketService.Instance.site.name}`;
this.setState(this.state); this.setState(this.state);
this.keepFetchingPosts(); this.keepFetchingPosts();
} else if (op == UserOperation.EditCommunity) { } else if (res.op == UserOperation.EditCommunity) {
let res: CommunityResponse = msg; let data = res.data as CommunityResponse;
this.state.community = res.community; this.state.community = data.community;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.FollowCommunity) { } else if (res.op == UserOperation.FollowCommunity) {
let res: CommunityResponse = msg; let data = res.data as CommunityResponse;
this.state.community.subscribed = res.community.subscribed; this.state.community.subscribed = data.community.subscribed;
this.state.community.number_of_subscribers = this.state.community.number_of_subscribers =
res.community.number_of_subscribers; data.community.number_of_subscribers;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.GetPosts) { } else if (res.op == UserOperation.GetPosts) {
let res: GetPostsResponse = msg; let data = res.data as GetPostsResponse;
// TODO rework this
// This is needed to refresh the view // This is needed to refresh the view
this.state.posts = undefined; this.state.posts = undefined;
this.setState(this.state); this.setState(this.state);
this.state.posts = res.posts; this.state.posts = data.posts;
this.state.loading = false; this.state.loading = false;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreatePostLike) { } else if (res.op == UserOperation.CreatePostLike) {
let res: CreatePostLikeResponse = msg; let data = res.data as CreatePostLikeResponse;
let found = this.state.posts.find(c => c.id == res.post.id); let found = this.state.posts.find(c => c.id == data.post.id);
found.my_vote = res.post.my_vote; found.my_vote = data.post.my_vote;
found.score = res.post.score; found.score = data.post.score;
found.upvotes = res.post.upvotes; found.upvotes = data.post.upvotes;
found.downvotes = res.post.downvotes; found.downvotes = data.post.downvotes;
this.setState(this.state); this.setState(this.state);
} }
} }

102
ui/src/components/inbox.tsx vendored
View file

@ -14,7 +14,7 @@ import {
CommentResponse, CommentResponse,
} from '../interfaces'; } from '../interfaces';
import { WebSocketService, UserService } from '../services'; import { WebSocketService, UserService } from '../services';
import { msgOp, fetchLimit } from '../utils'; import { wsJsonToRes, fetchLimit } from '../utils';
import { CommentNodes } from './comment-nodes'; import { CommentNodes } from './comment-nodes';
import { SortSelect } from './sort-select'; import { SortSelect } from './sort-select';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
@ -298,92 +298,92 @@ export class Inbox extends Component<any, InboxState> {
parseMessage(msg: any) { parseMessage(msg: any) {
console.log(msg); console.log(msg);
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
return; return;
} else if (op == UserOperation.GetReplies) { } else if (res.op == UserOperation.GetReplies) {
let res: GetRepliesResponse = msg; let data = res.data as GetRepliesResponse;
this.state.replies = res.replies; this.state.replies = data.replies;
this.sendUnreadCount(); this.sendUnreadCount();
window.scrollTo(0, 0); window.scrollTo(0, 0);
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.GetUserMentions) { } else if (res.op == UserOperation.GetUserMentions) {
let res: GetUserMentionsResponse = msg; let data = res.data as GetUserMentionsResponse;
this.state.mentions = res.mentions; this.state.mentions = data.mentions;
this.sendUnreadCount(); this.sendUnreadCount();
window.scrollTo(0, 0); window.scrollTo(0, 0);
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.MarkAllAsRead) { } else if (res.op == UserOperation.MarkAllAsRead) {
this.state.replies = []; this.state.replies = [];
this.state.mentions = []; this.state.mentions = [];
window.scrollTo(0, 0); window.scrollTo(0, 0);
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.EditComment) { } else if (res.op == UserOperation.EditComment) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found = this.state.replies.find(c => c.id == res.comment.id); let found = this.state.replies.find(c => c.id == data.comment.id);
found.content = res.comment.content; found.content = data.comment.content;
found.updated = res.comment.updated; found.updated = data.comment.updated;
found.removed = res.comment.removed; found.removed = data.comment.removed;
found.deleted = res.comment.deleted; found.deleted = data.comment.deleted;
found.upvotes = res.comment.upvotes; found.upvotes = data.comment.upvotes;
found.downvotes = res.comment.downvotes; found.downvotes = data.comment.downvotes;
found.score = res.comment.score; found.score = data.comment.score;
// If youre in the unread view, just remove it from the list // If youre in the unread view, just remove it from the list
if (this.state.unreadOrAll == UnreadOrAll.Unread && res.comment.read) { if (this.state.unreadOrAll == UnreadOrAll.Unread && data.comment.read) {
this.state.replies = this.state.replies.filter( this.state.replies = this.state.replies.filter(
r => r.id !== res.comment.id r => r.id !== data.comment.id
); );
} else { } else {
let found = this.state.replies.find(c => c.id == res.comment.id); let found = this.state.replies.find(c => c.id == data.comment.id);
found.read = res.comment.read; found.read = data.comment.read;
} }
this.sendUnreadCount(); this.sendUnreadCount();
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.EditUserMention) { } else if (res.op == UserOperation.EditUserMention) {
let res: UserMentionResponse = msg; let data = res.data as UserMentionResponse;
let found = this.state.mentions.find(c => c.id == res.mention.id); let found = this.state.mentions.find(c => c.id == data.mention.id);
found.content = res.mention.content; found.content = data.mention.content;
found.updated = res.mention.updated; found.updated = data.mention.updated;
found.removed = res.mention.removed; found.removed = data.mention.removed;
found.deleted = res.mention.deleted; found.deleted = data.mention.deleted;
found.upvotes = res.mention.upvotes; found.upvotes = data.mention.upvotes;
found.downvotes = res.mention.downvotes; found.downvotes = data.mention.downvotes;
found.score = res.mention.score; found.score = data.mention.score;
// If youre in the unread view, just remove it from the list // If youre in the unread view, just remove it from the list
if (this.state.unreadOrAll == UnreadOrAll.Unread && res.mention.read) { if (this.state.unreadOrAll == UnreadOrAll.Unread && data.mention.read) {
this.state.mentions = this.state.mentions.filter( this.state.mentions = this.state.mentions.filter(
r => r.id !== res.mention.id r => r.id !== data.mention.id
); );
} else { } else {
let found = this.state.mentions.find(c => c.id == res.mention.id); let found = this.state.mentions.find(c => c.id == data.mention.id);
found.read = res.mention.read; found.read = data.mention.read;
} }
this.sendUnreadCount(); this.sendUnreadCount();
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateComment) { } else if (res.op == UserOperation.CreateComment) {
// let res: CommentResponse = msg; // let res: CommentResponse = msg;
alert(i18n.t('reply_sent')); alert(i18n.t('reply_sent'));
// this.state.replies.unshift(res.comment); // TODO do this right // this.state.replies.unshift(res.comment); // TODO do this right
// this.setState(this.state); // this.setState(this.state);
} else if (op == UserOperation.SaveComment) { } else if (res.op == UserOperation.SaveComment) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found = this.state.replies.find(c => c.id == res.comment.id); let found = this.state.replies.find(c => c.id == data.comment.id);
found.saved = res.comment.saved; found.saved = data.comment.saved;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateCommentLike) { } else if (res.op == UserOperation.CreateCommentLike) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found: Comment = this.state.replies.find( let found: Comment = this.state.replies.find(
c => c.id === res.comment.id c => c.id === data.comment.id
); );
found.score = res.comment.score; found.score = data.comment.score;
found.upvotes = res.comment.upvotes; found.upvotes = data.comment.upvotes;
found.downvotes = res.comment.downvotes; found.downvotes = data.comment.downvotes;
if (res.comment.my_vote !== null) found.my_vote = res.comment.my_vote; if (data.comment.my_vote !== null) found.my_vote = data.comment.my_vote;
this.setState(this.state); this.setState(this.state);
} }
} }

37
ui/src/components/login.tsx vendored
View file

@ -10,7 +10,7 @@ import {
GetSiteResponse, GetSiteResponse,
} from '../interfaces'; } from '../interfaces';
import { WebSocketService, UserService } from '../services'; import { WebSocketService, UserService } from '../services';
import { msgOp, validEmail } from '../utils'; import { wsJsonToRes, validEmail } from '../utils';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
import { T } from 'inferno-i18next'; import { T } from 'inferno-i18next';
@ -48,14 +48,7 @@ export class Login extends Component<any, State> {
this.state = this.emptyState; this.state = this.emptyState;
this.subscription = WebSocketService.Instance.subject this.subscription = WebSocketService.Instance.subject
.pipe( .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
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),
@ -300,30 +293,30 @@ export class Login extends Component<any, State> {
} }
parseMessage(msg: any) { parseMessage(msg: any) {
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
this.state = this.emptyState; this.state = this.emptyState;
this.setState(this.state); this.setState(this.state);
return; return;
} else { } else {
if (op == UserOperation.Login) { if (res.op == UserOperation.Login) {
let data = res.data as LoginResponse;
this.state = this.emptyState; this.state = this.emptyState;
this.setState(this.state); this.setState(this.state);
let res: LoginResponse = msg; UserService.Instance.login(data);
UserService.Instance.login(res);
this.props.history.push('/'); this.props.history.push('/');
} else if (op == UserOperation.Register) { } else if (res.op == UserOperation.Register) {
let data = res.data as LoginResponse;
this.state = this.emptyState; this.state = this.emptyState;
this.setState(this.state); this.setState(this.state);
let res: LoginResponse = msg; UserService.Instance.login(data);
UserService.Instance.login(res);
this.props.history.push('/communities'); this.props.history.push('/communities');
} else if (op == UserOperation.PasswordReset) { } else if (res.op == UserOperation.PasswordReset) {
alert(i18n.t('reset_password_mail_sent')); alert(i18n.t('reset_password_mail_sent'));
} else if (op == UserOperation.GetSite) { } else if (res.op == UserOperation.GetSite) {
let res: GetSiteResponse = msg; let data = res.data as GetSiteResponse;
this.state.enable_nsfw = res.site.enable_nsfw; this.state.enable_nsfw = data.site.enable_nsfw;
this.setState(this.state); this.setState(this.state);
document.title = `${i18n.t('login')} - ${ document.title = `${i18n.t('login')} - ${
WebSocketService.Instance.site.name WebSocketService.Instance.site.name

62
ui/src/components/main.tsx vendored
View file

@ -24,7 +24,7 @@ import { SortSelect } from './sort-select';
import { ListingTypeSelect } from './listing-type-select'; import { ListingTypeSelect } from './listing-type-select';
import { SiteForm } from './site-form'; import { SiteForm } from './site-form';
import { import {
msgOp, wsJsonToRes,
repoUrl, repoUrl,
mdToHtml, mdToHtml,
fetchLimit, fetchLimit,
@ -56,7 +56,6 @@ export class Main extends Component<any, MainState> {
subscribedCommunities: [], subscribedCommunities: [],
trendingCommunities: [], trendingCommunities: [],
site: { site: {
op: null,
site: { site: {
id: null, id: null,
name: null, name: null,
@ -564,53 +563,54 @@ export class Main extends Component<any, MainState> {
parseMessage(msg: any) { parseMessage(msg: any) {
console.log(msg); console.log(msg);
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
return; return;
} else if (op == UserOperation.GetFollowedCommunities) { } else if (res.op == UserOperation.GetFollowedCommunities) {
let res: GetFollowedCommunitiesResponse = msg; let data = res.data as GetFollowedCommunitiesResponse;
this.state.subscribedCommunities = res.communities; this.state.subscribedCommunities = data.communities;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.ListCommunities) { } else if (res.op == UserOperation.ListCommunities) {
let res: ListCommunitiesResponse = msg; let data = res.data as ListCommunitiesResponse;
this.state.trendingCommunities = res.communities; this.state.trendingCommunities = data.communities;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.GetSite) { } else if (res.op == UserOperation.GetSite) {
let res: GetSiteResponse = msg; let data = res.data as GetSiteResponse;
// This means it hasn't been set up yet // This means it hasn't been set up yet
if (!res.site) { if (!data.site) {
this.context.router.history.push('/setup'); this.context.router.history.push('/setup');
} }
this.state.site.admins = res.admins; this.state.site.admins = data.admins;
this.state.site.site = res.site; this.state.site.site = data.site;
this.state.site.banned = res.banned; this.state.site.banned = data.banned;
this.state.site.online = res.online; this.state.site.online = data.online;
this.setState(this.state); this.setState(this.state);
document.title = `${WebSocketService.Instance.site.name}`; document.title = `${WebSocketService.Instance.site.name}`;
} else if (op == UserOperation.EditSite) { } else if (res.op == UserOperation.EditSite) {
let res: SiteResponse = msg; let data = res.data as SiteResponse;
this.state.site.site = res.site; this.state.site.site = data.site;
this.state.showEditSite = false; this.state.showEditSite = false;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.GetPosts) { } else if (res.op == UserOperation.GetPosts) {
let res: GetPostsResponse = msg; let data = res.data as GetPostsResponse;
// This is needed to refresh the view // This is needed to refresh the view
// TODO mess with this
this.state.posts = undefined; this.state.posts = undefined;
this.setState(this.state); this.setState(this.state);
this.state.posts = res.posts; this.state.posts = data.posts;
this.state.loading = false; this.state.loading = false;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreatePostLike) { } else if (res.op == UserOperation.CreatePostLike) {
let res: CreatePostLikeResponse = msg; let data = res.data as CreatePostLikeResponse;
let found = this.state.posts.find(c => c.id == res.post.id); let found = this.state.posts.find(c => c.id == data.post.id);
found.my_vote = res.post.my_vote; found.my_vote = data.post.my_vote;
found.score = res.post.score; found.score = data.post.score;
found.upvotes = res.post.upvotes; found.upvotes = data.post.upvotes;
found.downvotes = res.post.downvotes; found.downvotes = data.post.downvotes;
this.setState(this.state); this.setState(this.state);
} }
} }

25
ui/src/components/modlog.tsx vendored
View file

@ -17,9 +17,9 @@ import {
ModAdd, ModAdd,
} from '../interfaces'; } from '../interfaces';
import { WebSocketService } from '../services'; import { WebSocketService } from '../services';
import { msgOp, addTypeInfo, fetchLimit } from '../utils'; import { wsJsonToRes, addTypeInfo, fetchLimit } from '../utils';
import { MomentTime } from './moment-time'; import { MomentTime } from './moment-time';
import * as moment from 'moment'; import moment from 'moment';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
interface ModlogState { interface ModlogState {
@ -55,14 +55,7 @@ export class Modlog extends Component<any, ModlogState> {
? Number(this.props.match.params.community_id) ? Number(this.props.match.params.community_id)
: undefined; : undefined;
this.subscription = WebSocketService.Instance.subject this.subscription = WebSocketService.Instance.subject
.pipe( .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
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),
@ -431,15 +424,15 @@ export class Modlog extends Component<any, ModlogState> {
parseMessage(msg: any) { parseMessage(msg: any) {
console.log(msg); console.log(msg);
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
return; return;
} else if (op == UserOperation.GetModlog) { } else if (res.op == UserOperation.GetModlog) {
let res: GetModlogResponse = msg; let data = res.data as GetModlogResponse;
this.state.loading = false; this.state.loading = false;
window.scrollTo(0, 0); window.scrollTo(0, 0);
this.setCombined(res); this.setCombined(data);
} }
} }
} }

30
ui/src/components/navbar.tsx vendored
View file

@ -14,7 +14,7 @@ import {
Comment, Comment,
} from '../interfaces'; } from '../interfaces';
import { import {
msgOp, wsJsonToRes,
pictshareAvatarThumbnail, pictshareAvatarThumbnail,
showAvatars, showAvatars,
fetchLimit, fetchLimit,
@ -182,16 +182,16 @@ export class Navbar extends Component<any, NavbarState> {
} }
parseMessage(msg: any) { parseMessage(msg: any) {
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
if (msg.error == 'not_logged_in') { if (res.error == 'not_logged_in') {
UserService.Instance.logout(); UserService.Instance.logout();
location.reload(); location.reload();
} }
return; return;
} else if (op == UserOperation.GetReplies) { } else if (res.op == UserOperation.GetReplies) {
let res: GetRepliesResponse = msg; let data = res.data as GetRepliesResponse;
let unreadReplies = res.replies.filter(r => !r.read); let unreadReplies = data.replies.filter(r => !r.read);
if ( if (
unreadReplies.length > 0 && unreadReplies.length > 0 &&
this.state.fetchCount > 1 && this.state.fetchCount > 1 &&
@ -203,9 +203,9 @@ export class Navbar extends Component<any, NavbarState> {
this.state.replies = unreadReplies; this.state.replies = unreadReplies;
this.setState(this.state); this.setState(this.state);
this.sendUnreadCount(); this.sendUnreadCount();
} else if (op == UserOperation.GetUserMentions) { } else if (res.op == UserOperation.GetUserMentions) {
let res: GetUserMentionsResponse = msg; let data = res.data as GetUserMentionsResponse;
let unreadMentions = res.mentions.filter(r => !r.read); let unreadMentions = data.mentions.filter(r => !r.read);
if ( if (
unreadMentions.length > 0 && unreadMentions.length > 0 &&
this.state.fetchCount > 1 && this.state.fetchCount > 1 &&
@ -217,12 +217,12 @@ export class Navbar extends Component<any, NavbarState> {
this.state.mentions = unreadMentions; this.state.mentions = unreadMentions;
this.setState(this.state); this.setState(this.state);
this.sendUnreadCount(); this.sendUnreadCount();
} else if (op == UserOperation.GetSite) { } else if (res.op == UserOperation.GetSite) {
let res: GetSiteResponse = msg; let data = res.data as GetSiteResponse;
if (res.site) { if (data.site) {
this.state.siteName = res.site.name; this.state.siteName = data.site.name;
WebSocketService.Instance.site = res.site; WebSocketService.Instance.site = data.site;
this.setState(this.state); this.setState(this.state);
} }
} }

19
ui/src/components/password_change.tsx vendored
View file

@ -7,7 +7,7 @@ import {
PasswordChangeForm, PasswordChangeForm,
} from '../interfaces'; } from '../interfaces';
import { WebSocketService, UserService } from '../services'; import { WebSocketService, UserService } from '../services';
import { msgOp, capitalizeFirstLetter } from '../utils'; import { wsJsonToRes, capitalizeFirstLetter } from '../utils';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
import { T } from 'inferno-i18next'; import { T } from 'inferno-i18next';
@ -34,14 +34,7 @@ export class PasswordChange extends Component<any, State> {
this.state = this.emptyState; this.state = this.emptyState;
this.subscription = WebSocketService.Instance.subject this.subscription = WebSocketService.Instance.subject
.pipe( .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
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),
@ -141,18 +134,18 @@ export class PasswordChange extends Component<any, State> {
} }
parseMessage(msg: any) { parseMessage(msg: any) {
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (msg.error) {
alert(i18n.t(msg.error)); alert(i18n.t(msg.error));
this.state.loading = false; this.state.loading = false;
this.setState(this.state); this.setState(this.state);
return; return;
} else { } else {
if (op == UserOperation.PasswordChange) { if (res.op == UserOperation.PasswordChange) {
let data = res.data as LoginResponse;
this.state = this.emptyState; this.state = this.emptyState;
this.setState(this.state); this.setState(this.state);
let res: LoginResponse = msg; UserService.Instance.login(data);
UserService.Instance.login(res);
this.props.history.push('/'); this.props.history.push('/');
} }
} }

48
ui/src/components/post-form.tsx vendored
View file

@ -19,7 +19,7 @@ import {
} from '../interfaces'; } from '../interfaces';
import { WebSocketService, UserService } from '../services'; import { WebSocketService, UserService } from '../services';
import { import {
msgOp, wsJsonToRes,
getPageTitle, getPageTitle,
validURL, validURL,
capitalizeFirstLetter, capitalizeFirstLetter,
@ -458,46 +458,46 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
} }
parseMessage(msg: any) { parseMessage(msg: any) {
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
this.state.loading = false; this.state.loading = false;
this.setState(this.state); this.setState(this.state);
return; return;
} else if (op == UserOperation.ListCommunities) { } else if (res.op == UserOperation.ListCommunities) {
let res: ListCommunitiesResponse = msg; let data = res.data as ListCommunitiesResponse;
this.state.communities = res.communities; this.state.communities = data.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.params && this.props.params.community) { } else if (this.props.params && this.props.params.community) {
let foundCommunityId = res.communities.find( let foundCommunityId = data.communities.find(
r => r.name == this.props.params.community r => r.name == this.props.params.community
).id; ).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 = data.communities[0].id;
} }
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreatePost) { } else if (res.op == UserOperation.CreatePost) {
let data = res.data as PostResponse;
this.state.loading = false; this.state.loading = false;
let res: PostResponse = msg; this.props.onCreate(data.post.id);
this.props.onCreate(res.post.id); } else if (res.op == UserOperation.EditPost) {
} else if (op == UserOperation.EditPost) { let data = res.data as PostResponse;
this.state.loading = false; this.state.loading = false;
let res: PostResponse = msg; this.props.onEdit(data.post);
this.props.onEdit(res.post); } else if (res.op == UserOperation.Search) {
} else if (op == UserOperation.Search) { let data = res.data as SearchResponse;
let res: SearchResponse = msg;
if (res.type_ == SearchType[SearchType.Posts]) { if (data.type_ == SearchType[SearchType.Posts]) {
this.state.suggestedPosts = res.posts; this.state.suggestedPosts = data.posts;
} else if (res.type_ == SearchType[SearchType.Url]) { } else if (data.type_ == SearchType[SearchType.Url]) {
this.state.crossPosts = res.posts; this.state.crossPosts = data.posts;
} }
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.GetSite) { } else if (res.op == UserOperation.GetSite) {
let res: GetSiteResponse = msg; let data = res.data as GetSiteResponse;
this.state.enable_nsfw = res.site.enable_nsfw; this.state.enable_nsfw = data.site.enable_nsfw;
this.setState(this.state); this.setState(this.state);
} }
} }

174
ui/src/components/post.tsx vendored
View file

@ -28,7 +28,7 @@ import {
GetCommunityResponse, GetCommunityResponse,
} from '../interfaces'; } from '../interfaces';
import { WebSocketService, UserService } from '../services'; import { WebSocketService, UserService } from '../services';
import { msgOp, hotRank } from '../utils'; import { wsJsonToRes, hotRank } from '../utils';
import { PostListing } from './post-listing'; import { PostListing } from './post-listing';
import { PostListings } from './post-listings'; import { PostListings } from './post-listings';
import { Sidebar } from './sidebar'; import { Sidebar } from './sidebar';
@ -343,17 +343,17 @@ export class Post extends Component<any, PostState> {
parseMessage(msg: any) { parseMessage(msg: any) {
console.log(msg); console.log(msg);
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
return; return;
} else if (op == UserOperation.GetPost) { } else if (res.op == UserOperation.GetPost) {
let res: GetPostResponse = msg; let data = res.data as GetPostResponse;
this.state.post = res.post; this.state.post = data.post;
this.state.comments = res.comments; this.state.comments = data.comments;
this.state.community = res.community; this.state.community = data.community;
this.state.moderators = res.moderators; this.state.moderators = data.moderators;
this.state.admins = res.admins; this.state.admins = data.admins;
this.state.loading = false; this.state.loading = false;
document.title = `${this.state.post.name} - ${WebSocketService.Instance.site.name}`; document.title = `${this.state.post.name} - ${WebSocketService.Instance.site.name}`;
@ -370,105 +370,107 @@ export class Post extends Component<any, PostState> {
} }
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateComment) { } else if (res.op == UserOperation.CreateComment) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
this.state.comments.unshift(res.comment); this.state.comments.unshift(data.comment);
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.EditComment) { } else if (res.op == UserOperation.EditComment) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == res.comment.id); let found = this.state.comments.find(c => c.id == data.comment.id);
found.content = res.comment.content; found.content = data.comment.content;
found.updated = res.comment.updated; found.updated = data.comment.updated;
found.removed = res.comment.removed; found.removed = data.comment.removed;
found.deleted = res.comment.deleted; found.deleted = data.comment.deleted;
found.upvotes = res.comment.upvotes; found.upvotes = data.comment.upvotes;
found.downvotes = res.comment.downvotes; found.downvotes = data.comment.downvotes;
found.score = res.comment.score; found.score = data.comment.score;
found.read = res.comment.read; found.read = data.comment.read;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.SaveComment) { } else if (res.op == UserOperation.SaveComment) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == res.comment.id); let found = this.state.comments.find(c => c.id == data.comment.id);
found.saved = res.comment.saved; found.saved = data.comment.saved;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateCommentLike) { } else if (res.op == UserOperation.CreateCommentLike) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found: Comment = this.state.comments.find( let found: Comment = this.state.comments.find(
c => c.id === res.comment.id c => c.id === data.comment.id
); );
found.score = res.comment.score; found.score = data.comment.score;
found.upvotes = res.comment.upvotes; found.upvotes = data.comment.upvotes;
found.downvotes = res.comment.downvotes; found.downvotes = data.comment.downvotes;
if (res.comment.my_vote !== null) found.my_vote = res.comment.my_vote; if (data.comment.my_vote !== null) found.my_vote = data.comment.my_vote;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreatePostLike) { } else if (res.op == UserOperation.CreatePostLike) {
let res: CreatePostLikeResponse = msg; let data = res.data as CreatePostLikeResponse;
this.state.post.my_vote = res.post.my_vote; this.state.post.my_vote = data.post.my_vote;
this.state.post.score = res.post.score; this.state.post.score = data.post.score;
this.state.post.upvotes = res.post.upvotes; this.state.post.upvotes = data.post.upvotes;
this.state.post.downvotes = res.post.downvotes; this.state.post.downvotes = data.post.downvotes;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.EditPost) { } else if (res.op == UserOperation.EditPost) {
let res: PostResponse = msg; let data = res.data as PostResponse;
this.state.post = res.post; this.state.post = data.post;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.SavePost) { } else if (res.op == UserOperation.SavePost) {
let res: PostResponse = msg; let data = res.data as PostResponse;
this.state.post = res.post; this.state.post = data.post;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.EditCommunity) { } else if (res.op == UserOperation.EditCommunity) {
let res: CommunityResponse = msg; let data = res.data as CommunityResponse;
this.state.community = res.community; this.state.community = data.community;
this.state.post.community_id = res.community.id; this.state.post.community_id = data.community.id;
this.state.post.community_name = res.community.name; this.state.post.community_name = data.community.name;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.FollowCommunity) { } else if (res.op == UserOperation.FollowCommunity) {
let res: CommunityResponse = msg; let data = res.data as CommunityResponse;
this.state.community.subscribed = res.community.subscribed; this.state.community.subscribed = data.community.subscribed;
this.state.community.number_of_subscribers = this.state.community.number_of_subscribers =
res.community.number_of_subscribers; data.community.number_of_subscribers;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.BanFromCommunity) { } else if (res.op == UserOperation.BanFromCommunity) {
let res: BanFromCommunityResponse = msg; let data = res.data as BanFromCommunityResponse;
this.state.comments this.state.comments
.filter(c => c.creator_id == res.user.id) .filter(c => c.creator_id == data.user.id)
.forEach(c => (c.banned_from_community = res.banned)); .forEach(c => (c.banned_from_community = data.banned));
if (this.state.post.creator_id == res.user.id) { if (this.state.post.creator_id == data.user.id) {
this.state.post.banned_from_community = res.banned; this.state.post.banned_from_community = data.banned;
} }
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.AddModToCommunity) { } else if (res.op == UserOperation.AddModToCommunity) {
let res: AddModToCommunityResponse = msg; let data = res.data as AddModToCommunityResponse;
this.state.moderators = res.moderators; this.state.moderators = data.moderators;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.BanUser) { } else if (res.op == UserOperation.BanUser) {
let res: BanUserResponse = msg; let data = res.data as BanUserResponse;
this.state.comments this.state.comments
.filter(c => c.creator_id == res.user.id) .filter(c => c.creator_id == data.user.id)
.forEach(c => (c.banned = res.banned)); .forEach(c => (c.banned = data.banned));
if (this.state.post.creator_id == res.user.id) { if (this.state.post.creator_id == data.user.id) {
this.state.post.banned = res.banned; this.state.post.banned = data.banned;
} }
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.AddAdmin) { } else if (res.op == UserOperation.AddAdmin) {
let res: AddAdminResponse = msg; let data = res.data as AddAdminResponse;
this.state.admins = res.admins; this.state.admins = data.admins;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.Search) { } else if (res.op == UserOperation.Search) {
let res: SearchResponse = msg; let data = res.data as SearchResponse;
this.state.crossPosts = res.posts.filter(p => p.id != this.state.post.id); this.state.crossPosts = data.posts.filter(
p => p.id != this.state.post.id
);
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.TransferSite) { } else if (res.op == UserOperation.TransferSite) {
let res: GetSiteResponse = msg; let data = res.data as GetSiteResponse;
this.state.admins = res.admins; this.state.admins = data.admins;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.TransferCommunity) { } else if (res.op == UserOperation.TransferCommunity) {
let res: GetCommunityResponse = msg; let data = res.data as GetCommunityResponse;
this.state.community = res.community; this.state.community = data.community;
this.state.moderators = res.moderators; this.state.moderators = data.moderators;
this.state.admins = res.admins; this.state.admins = data.admins;
this.setState(this.state); this.setState(this.state);
} }
} }

16
ui/src/components/search.tsx vendored
View file

@ -15,7 +15,7 @@ import {
} from '../interfaces'; } from '../interfaces';
import { WebSocketService } from '../services'; import { WebSocketService } from '../services';
import { import {
msgOp, wsJsonToRes,
fetchLimit, fetchLimit,
routeSearchTypeToEnum, routeSearchTypeToEnum,
routeSortTypeToEnum, routeSortTypeToEnum,
@ -45,7 +45,6 @@ export class Search extends Component<any, SearchState> {
sort: this.getSortTypeFromProps(this.props), sort: this.getSortTypeFromProps(this.props),
page: this.getPageFromProps(this.props), page: this.getPageFromProps(this.props),
searchResponse: { searchResponse: {
op: null,
type_: null, type_: null,
posts: [], posts: [],
comments: [], comments: [],
@ -386,7 +385,6 @@ export class Search extends Component<any, SearchState> {
return ( return (
<div> <div>
{res && {res &&
res.op &&
res.posts.length == 0 && res.posts.length == 0 &&
res.comments.length == 0 && res.comments.length == 0 &&
res.communities.length == 0 && res.communities.length == 0 &&
@ -464,13 +462,13 @@ export class Search extends Component<any, SearchState> {
parseMessage(msg: any) { parseMessage(msg: any) {
console.log(msg); console.log(msg);
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
return; return;
} else if (op == UserOperation.Search) { } else if (res.op == UserOperation.Search) {
let res: SearchResponse = msg; let data = res.data as SearchResponse;
this.state.searchResponse = res; this.state.searchResponse = data;
this.state.loading = false; this.state.loading = false;
document.title = `${i18n.t('search')} - ${this.state.q} - ${ document.title = `${i18n.t('search')} - ${this.state.q} - ${
WebSocketService.Instance.site.name WebSocketService.Instance.site.name

26
ui/src/components/setup.tsx vendored
View file

@ -3,7 +3,7 @@ import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators'; import { retryWhen, delay, take } from 'rxjs/operators';
import { RegisterForm, LoginResponse, UserOperation } from '../interfaces'; import { RegisterForm, LoginResponse, UserOperation } from '../interfaces';
import { WebSocketService, UserService } from '../services'; import { WebSocketService, UserService } from '../services';
import { msgOp } from '../utils'; import { wsJsonToRes } from '../utils';
import { SiteForm } from './site-form'; import { SiteForm } from './site-form';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
import { T } from 'inferno-i18next'; import { T } from 'inferno-i18next';
@ -35,14 +35,7 @@ export class Setup extends Component<any, State> {
this.state = this.emptyState; this.state = this.emptyState;
this.subscription = WebSocketService.Instance.subject this.subscription = WebSocketService.Instance.subject
.pipe( .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
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),
@ -189,20 +182,19 @@ export class Setup extends Component<any, State> {
} }
parseMessage(msg: any) { parseMessage(msg: any) {
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
this.state.userLoading = false; this.state.userLoading = false;
this.setState(this.state); this.setState(this.state);
return; return;
} else if (op == UserOperation.Register) { } else if (res.op == UserOperation.Register) {
let data = res.data as LoginResponse;
this.state.userLoading = false; this.state.userLoading = false;
this.state.doneRegisteringUser = true; this.state.doneRegisteringUser = true;
let res: LoginResponse = msg; UserService.Instance.login(data);
UserService.Instance.login(res);
console.log(res);
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateSite) { } else if (res.op == UserOperation.CreateSite) {
this.props.history.push('/'); this.props.history.push('/');
} }
} }

96
ui/src/components/user.tsx vendored
View file

@ -21,7 +21,7 @@ import {
} from '../interfaces'; } from '../interfaces';
import { WebSocketService, UserService } from '../services'; import { WebSocketService, UserService } from '../services';
import { import {
msgOp, wsJsonToRes,
fetchLimit, fetchLimit,
routeSortTypeToEnum, routeSortTypeToEnum,
capitalizeFirstLetter, capitalizeFirstLetter,
@ -970,25 +970,25 @@ export class User extends Component<any, UserState> {
parseMessage(msg: any) { parseMessage(msg: any) {
console.log(msg); console.log(msg);
let op: UserOperation = msgOp(msg); let res = wsJsonToRes(msg);
if (msg.error) { if (res.error) {
alert(i18n.t(msg.error)); alert(i18n.t(res.error));
this.state.deleteAccountLoading = false; this.state.deleteAccountLoading = false;
this.state.avatarLoading = false; this.state.avatarLoading = false;
this.state.userSettingsLoading = false; this.state.userSettingsLoading = false;
if (msg.error == 'couldnt_find_that_username_or_email') { if (res.error == 'couldnt_find_that_username_or_email') {
this.context.router.history.push('/'); this.context.router.history.push('/');
} }
this.setState(this.state); this.setState(this.state);
return; return;
} else if (op == UserOperation.GetUserDetails) { } else if (res.op == UserOperation.GetUserDetails) {
let res: UserDetailsResponse = msg; let data = res.data as UserDetailsResponse;
this.state.user = res.user; this.state.user = data.user;
this.state.comments = res.comments; this.state.comments = data.comments;
this.state.follows = res.follows; this.state.follows = data.follows;
this.state.moderates = res.moderates; this.state.moderates = data.moderates;
this.state.posts = res.posts; this.state.posts = data.posts;
this.state.admins = res.admins; this.state.admins = data.admins;
this.state.loading = false; this.state.loading = false;
if (this.isCurrentUser) { if (this.isCurrentUser) {
this.state.userSettingsForm.show_nsfw = this.state.userSettingsForm.show_nsfw =
@ -1010,59 +1010,59 @@ export class User extends Component<any, UserState> {
document.title = `/u/${this.state.user.name} - ${WebSocketService.Instance.site.name}`; document.title = `/u/${this.state.user.name} - ${WebSocketService.Instance.site.name}`;
window.scrollTo(0, 0); window.scrollTo(0, 0);
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.EditComment) { } else if (res.op == UserOperation.EditComment) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == res.comment.id); let found = this.state.comments.find(c => c.id == data.comment.id);
found.content = res.comment.content; found.content = data.comment.content;
found.updated = res.comment.updated; found.updated = data.comment.updated;
found.removed = res.comment.removed; found.removed = data.comment.removed;
found.deleted = res.comment.deleted; found.deleted = data.comment.deleted;
found.upvotes = res.comment.upvotes; found.upvotes = data.comment.upvotes;
found.downvotes = res.comment.downvotes; found.downvotes = data.comment.downvotes;
found.score = res.comment.score; found.score = data.comment.score;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateComment) { } else if (res.op == UserOperation.CreateComment) {
// let res: CommentResponse = msg; // let res: CommentResponse = msg;
alert(i18n.t('reply_sent')); alert(i18n.t('reply_sent'));
// this.state.comments.unshift(res.comment); // TODO do this right // this.state.comments.unshift(res.comment); // TODO do this right
// this.setState(this.state); // this.setState(this.state);
} else if (op == UserOperation.SaveComment) { } else if (res.op == UserOperation.SaveComment) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == res.comment.id); let found = this.state.comments.find(c => c.id == data.comment.id);
found.saved = res.comment.saved; found.saved = data.comment.saved;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateCommentLike) { } else if (res.op == UserOperation.CreateCommentLike) {
let res: CommentResponse = msg; let data = res.data as CommentResponse;
let found: Comment = this.state.comments.find( let found: Comment = this.state.comments.find(
c => c.id === res.comment.id c => c.id === data.comment.id
); );
found.score = res.comment.score; found.score = data.comment.score;
found.upvotes = res.comment.upvotes; found.upvotes = data.comment.upvotes;
found.downvotes = res.comment.downvotes; found.downvotes = data.comment.downvotes;
if (res.comment.my_vote !== null) found.my_vote = res.comment.my_vote; if (data.comment.my_vote !== null) found.my_vote = data.comment.my_vote;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.BanUser) { } else if (res.op == UserOperation.BanUser) {
let res: BanUserResponse = msg; let data = res.data as BanUserResponse;
this.state.comments this.state.comments
.filter(c => c.creator_id == res.user.id) .filter(c => c.creator_id == data.user.id)
.forEach(c => (c.banned = res.banned)); .forEach(c => (c.banned = data.banned));
this.state.posts this.state.posts
.filter(c => c.creator_id == res.user.id) .filter(c => c.creator_id == data.user.id)
.forEach(c => (c.banned = res.banned)); .forEach(c => (c.banned = data.banned));
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.AddAdmin) { } else if (res.op == UserOperation.AddAdmin) {
let res: AddAdminResponse = msg; let data = res.data as AddAdminResponse;
this.state.admins = res.admins; this.state.admins = data.admins;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.SaveUserSettings) { } else if (res.op == UserOperation.SaveUserSettings) {
let data = res.data as LoginResponse;
this.state = this.emptyState; this.state = this.emptyState;
this.state.userSettingsLoading = false; this.state.userSettingsLoading = false;
this.setState(this.state); this.setState(this.state);
let res: LoginResponse = msg; UserService.Instance.login(data);
UserService.Instance.login(res); } else if (res.op == UserOperation.DeleteAccount) {
} else if (op == UserOperation.DeleteAccount) {
this.state.deleteAccountLoading = false; this.state.deleteAccountLoading = false;
this.state.deleteAccountShowConfirm = false; this.state.deleteAccountShowConfirm = false;
this.setState(this.state); this.setState(this.state);

54
ui/src/interfaces.ts vendored
View file

@ -226,7 +226,6 @@ export interface FollowCommunityForm {
} }
export interface GetFollowedCommunitiesResponse { export interface GetFollowedCommunitiesResponse {
op: string;
communities: Array<CommunityUser>; communities: Array<CommunityUser>;
} }
@ -241,7 +240,6 @@ export interface GetUserDetailsForm {
} }
export interface UserDetailsResponse { export interface UserDetailsResponse {
op: string;
user: UserView; user: UserView;
follows: Array<CommunityUser>; follows: Array<CommunityUser>;
moderates: Array<CommunityUser>; moderates: Array<CommunityUser>;
@ -259,7 +257,6 @@ export interface GetRepliesForm {
} }
export interface GetRepliesResponse { export interface GetRepliesResponse {
op: string;
replies: Array<Comment>; replies: Array<Comment>;
} }
@ -272,7 +269,6 @@ export interface GetUserMentionsForm {
} }
export interface GetUserMentionsResponse { export interface GetUserMentionsResponse {
op: string;
mentions: Array<Comment>; mentions: Array<Comment>;
} }
@ -283,7 +279,6 @@ export interface EditUserMentionForm {
} }
export interface UserMentionResponse { export interface UserMentionResponse {
op: string;
mention: Comment; mention: Comment;
} }
@ -297,7 +292,6 @@ export interface BanFromCommunityForm {
} }
export interface BanFromCommunityResponse { export interface BanFromCommunityResponse {
op: string;
user: UserView; user: UserView;
banned: boolean; banned: boolean;
} }
@ -321,7 +315,6 @@ export interface TransferSiteForm {
} }
export interface AddModToCommunityResponse { export interface AddModToCommunityResponse {
op: string;
moderators: Array<CommunityUser>; moderators: Array<CommunityUser>;
} }
@ -333,7 +326,6 @@ export interface GetModlogForm {
} }
export interface GetModlogResponse { export interface GetModlogResponse {
op: string;
removed_posts: Array<ModRemovePost>; removed_posts: Array<ModRemovePost>;
locked_posts: Array<ModLockPost>; locked_posts: Array<ModLockPost>;
stickied_posts: Array<ModStickyPost>; stickied_posts: Array<ModStickyPost>;
@ -474,7 +466,6 @@ export interface RegisterForm {
} }
export interface LoginResponse { export interface LoginResponse {
op: string;
jwt: string; jwt: string;
} }
@ -509,14 +500,12 @@ export interface CommunityForm {
} }
export interface GetCommunityResponse { export interface GetCommunityResponse {
op: string;
community: Community; community: Community;
moderators: Array<CommunityUser>; moderators: Array<CommunityUser>;
admins: Array<UserView>; admins: Array<UserView>;
} }
export interface CommunityResponse { export interface CommunityResponse {
op: string;
community: Community; community: Community;
} }
@ -528,12 +517,10 @@ export interface ListCommunitiesForm {
} }
export interface ListCommunitiesResponse { export interface ListCommunitiesResponse {
op: string;
communities: Array<Community>; communities: Array<Community>;
} }
export interface ListCategoriesResponse { export interface ListCategoriesResponse {
op: string;
categories: Array<Category>; categories: Array<Category>;
} }
@ -562,7 +549,6 @@ export interface PostFormParams {
} }
export interface GetPostResponse { export interface GetPostResponse {
op: string;
post: Post; post: Post;
comments: Array<Comment>; comments: Array<Comment>;
community: Community; community: Community;
@ -577,7 +563,6 @@ export interface SavePostForm {
} }
export interface PostResponse { export interface PostResponse {
op: string;
post: Post; post: Post;
} }
@ -601,7 +586,6 @@ export interface SaveCommentForm {
} }
export interface CommentResponse { export interface CommentResponse {
op: string;
comment: Comment; comment: Comment;
} }
@ -627,7 +611,6 @@ export interface GetPostsForm {
} }
export interface GetPostsResponse { export interface GetPostsResponse {
op: string;
posts: Array<Post>; posts: Array<Post>;
} }
@ -638,7 +621,6 @@ export interface CreatePostLikeForm {
} }
export interface CreatePostLikeResponse { export interface CreatePostLikeResponse {
op: string;
post: Post; post: Post;
} }
@ -652,7 +634,6 @@ export interface SiteForm {
} }
export interface GetSiteResponse { export interface GetSiteResponse {
op: string;
site: Site; site: Site;
admins: Array<UserView>; admins: Array<UserView>;
banned: Array<UserView>; banned: Array<UserView>;
@ -660,7 +641,6 @@ export interface GetSiteResponse {
} }
export interface SiteResponse { export interface SiteResponse {
op: string;
site: Site; site: Site;
} }
@ -673,7 +653,6 @@ export interface BanUserForm {
} }
export interface BanUserResponse { export interface BanUserResponse {
op: string;
user: UserView; user: UserView;
banned: boolean; banned: boolean;
} }
@ -685,7 +664,6 @@ export interface AddAdminForm {
} }
export interface AddAdminResponse { export interface AddAdminResponse {
op: string;
admins: Array<UserView>; admins: Array<UserView>;
} }
@ -699,7 +677,6 @@ export interface SearchForm {
} }
export interface SearchResponse { export interface SearchResponse {
op: string;
type_: string; type_: string;
posts?: Array<Post>; posts?: Array<Post>;
comments?: Array<Comment>; comments?: Array<Comment>;
@ -715,12 +692,37 @@ export interface PasswordResetForm {
email: string; email: string;
} }
export interface PasswordResetResponse { // export interface PasswordResetResponse {
op: string; // }
}
export interface PasswordChangeForm { export interface PasswordChangeForm {
token: string; token: string;
password: string; password: string;
password_verify: string; password_verify: string;
} }
type ResponseType =
| SiteResponse
| GetFollowedCommunitiesResponse
| ListCommunitiesResponse
| GetPostsResponse
| CreatePostLikeResponse
| GetRepliesResponse
| GetUserMentionsResponse
| ListCategoriesResponse
| CommunityResponse
| CommentResponse
| UserMentionResponse
| LoginResponse
| GetModlogResponse
| SearchResponse
| BanFromCommunityResponse
| AddModToCommunityResponse
| BanUserResponse
| AddAdminResponse;
export interface WebSocketResponse {
op: UserOperation;
data: ResponseType;
error?: string;
}

8
ui/src/utils.ts vendored
View file

@ -15,6 +15,7 @@ import {
SortType, SortType,
ListingType, ListingType,
SearchType, SearchType,
WebSocketResponse,
} from './interfaces'; } from './interfaces';
import { UserService } from './services/UserService'; import { UserService } from './services/UserService';
import markdown_it from 'markdown-it'; import markdown_it from 'markdown-it';
@ -38,9 +39,12 @@ export function randomStr() {
.substr(2, 10); .substr(2, 10);
} }
export function msgOp(msg: any): UserOperation { export function wsJsonToRes(msg: any): WebSocketResponse {
let opStr: string = msg.op; let opStr: string = msg.op;
return UserOperation[opStr]; return {
op: UserOperation[opStr],
data: msg.data,
};
} }
export const md = new markdown_it({ export const md = new markdown_it({