Merge pull request #6 from dessalines/dev

Merge upstream

31 files changed, 825 insertions, 163 deletions

diff --git a/ui/package.json b/ui/package.json
index d3085650..7e75052b 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -49,6 +49,7 @@
     "fuse-box": "^3.1.3",
     "lint-staged": "^10.0.2",
     "sortpack": "^2.0.1",
+    "ts-node": "^8.6.2",
     "ts-transform-classcat": "^0.0.2",
     "ts-transform-inferno": "^4.0.2",
     "typescript": "^3.7.5"
@@ -59,7 +60,7 @@
   "engineStrict": true,
   "husky": {
     "hooks": {
-      "pre-commit": "ts-node translation_report.ts && git add ../README.md && cargo clippy --manifest-path ../server/Cargo.toml --all-targets --all-features -- -D warnings && lint-staged"
+      "pre-commit": "yarn run ts-node translation_report.ts && git add ../README.md && cargo clippy --manifest-path ../server/Cargo.toml --all-targets --all-features -- -D warnings && lint-staged"
     }
   },
   "lint-staged": {
diff --git a/ui/src/components/comment-form.tsx b/ui/src/components/comment-form.tsx
index f4eb1181..7eb30f50 100644
--- a/ui/src/components/comment-form.tsx
+++ b/ui/src/components/comment-form.tsx
@@ -96,6 +96,7 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
                 className={`form-control ${this.state.previewMode && 'd-none'}`}
                 value={this.state.commentForm.content}
                 onInput={linkEvent(this, this.handleCommentContentChange)}
+                onPaste={linkEvent(this, this.handleImageUploadPaste)}
                 required
                 disabled={this.props.disabled}
                 rows={2}
@@ -208,9 +209,22 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
     i.props.onReplyCancel();
   }
 
+  handleImageUploadPaste(i: CommentForm, event: any) {
+    let image = event.clipboardData.files[0];
+    if (image) {
+      i.handleImageUpload(i, image);
+    }
+  }
+
   handleImageUpload(i: CommentForm, event: any) {
-    event.preventDefault();
-    let file = event.target.files[0];
+    let file: any;
+    if (event.target) {
+      event.preventDefault();
+      file = event.target.files[0];
+    } else {
+      file = event;
+    }
+
     const imageUploadUrl = `/pictshare/api/upload.php`;
     const formData = new FormData();
     formData.append('file', file);
@@ -225,13 +239,15 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
       .then(res => res.json())
       .then(res => {
         let url = `${window.location.origin}/pictshare/${res.url}`;
-        let markdown =
+        let imageMarkdown =
           res.filetype == 'mp4' ? `[vid](${url}/raw)` : `![](${url})`;
         let content = i.state.commentForm.content;
-        content = content ? `${content} ${markdown}` : markdown;
+        content = content ? `${content}\n${imageMarkdown}` : imageMarkdown;
         i.state.commentForm.content = content;
         i.state.imageLoading = false;
         i.setState(i.state);
+        var textarea: any = document.getElementById(i.id);
+        autosize.update(textarea);
       })
       .catch(error => {
         i.state.imageLoading = false;
diff --git a/ui/src/components/comment-node.tsx b/ui/src/components/comment-node.tsx
index 046fc88d..a42d096e 100644
--- a/ui/src/components/comment-node.tsx
+++ b/ui/src/components/comment-node.tsx
@@ -117,7 +117,6 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
               .viewOnly && 'no-click'}`}
           >
             <button
-              disabled={!UserService.Instance.user}
               className={`btn p-0 ${
                 node.comment.my_vote == 1 ? 'text-info' : 'text-muted'
               }`}
@@ -138,7 +137,6 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
             </div>
             {WebSocketService.Instance.site.enable_downvotes && (
               <button
-                disabled={!UserService.Instance.user}
                 className={`btn p-0 ${
                   node.comment.my_vote == -1 ? 'text-danger' : 'text-muted'
                 }`}
@@ -761,9 +759,11 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
   }
 
   handleCommentUpvote(i: CommentNodeI) {
-    this.setState({
-      upvoteLoading: true,
-    });
+    if (UserService.Instance.user) {
+      this.setState({
+        upvoteLoading: true,
+      });
+    }
     let form: CommentLikeForm = {
       comment_id: i.comment.id,
       post_id: i.comment.post_id,
@@ -773,9 +773,11 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
   }
 
   handleCommentDownvote(i: CommentNodeI) {
-    this.setState({
-      downvoteLoading: true,
-    });
+    if (UserService.Instance.user) {
+      this.setState({
+        downvoteLoading: true,
+      });
+    }
     let form: CommentLikeForm = {
       comment_id: i.comment.id,
       post_id: i.comment.post_id,
diff --git a/ui/src/components/communities.tsx b/ui/src/components/communities.tsx
index 867cfd81..b1da9882 100644
--- a/ui/src/components/communities.tsx
+++ b/ui/src/components/communities.tsx
@@ -235,7 +235,7 @@ export class Communities extends Component<any, CommunitiesState> {
   parseMessage(msg: WebSocketJsonResponse) {
     console.log(msg);
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
     } else if (res.op == UserOperation.ListCommunities) {
diff --git a/ui/src/components/community-form.tsx b/ui/src/components/community-form.tsx
index 33c63c89..c8d888be 100644
--- a/ui/src/components/community-form.tsx
+++ b/ui/src/components/community-form.tsx
@@ -261,7 +261,7 @@ export class CommunityForm extends Component<
   parseMessage(msg: WebSocketJsonResponse) {
     let res = wsJsonToRes(msg);
     console.log(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       this.state.loading = false;
       this.setState(this.state);
diff --git a/ui/src/components/community.tsx b/ui/src/components/community.tsx
index 9d02dd86..3c5f6890 100644
--- a/ui/src/components/community.tsx
+++ b/ui/src/components/community.tsx
@@ -11,6 +11,7 @@ import {
   SortType,
   Post,
   GetPostsForm,
+  GetCommunityForm,
   ListingType,
   GetPostsResponse,
   CreatePostLikeResponse,
@@ -98,11 +99,11 @@ export class Community extends Component<any, State> {
         () => console.log('complete')
       );
 
-    if (this.state.communityId) {
-      WebSocketService.Instance.getCommunity(this.state.communityId);
-    } else if (this.state.communityName) {
-      WebSocketService.Instance.getCommunityByName(this.state.communityName);
-    }
+    let form: GetCommunityForm = {
+      id: this.state.communityId ? this.state.communityId : null,
+      name: this.state.communityName ? this.state.communityName : null,
+    };
+    WebSocketService.Instance.getCommunity(form);
   }
 
   componentWillUnmount() {
@@ -258,7 +259,7 @@ export class Community extends Component<any, State> {
   parseMessage(msg: WebSocketJsonResponse) {
     console.log(msg);
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       this.context.router.history.push('/');
       return;
diff --git a/ui/src/components/inbox.tsx b/ui/src/components/inbox.tsx
index 5c3ff6d2..41c1ce60 100644
--- a/ui/src/components/inbox.tsx
+++ b/ui/src/components/inbox.tsx
@@ -38,6 +38,8 @@ enum UnreadType {
   Messages,
 }
 
+type ReplyType = Comment | PrivateMessageI;
+
 interface InboxState {
   unreadOrAll: UnreadOrAll;
   unreadType: UnreadType;
@@ -186,7 +188,7 @@ export class Inbox extends Component<any, InboxState> {
   }
 
   all() {
-    let combined: Array<Comment | PrivateMessageI> = [];
+    let combined: Array<ReplyType> = [];
 
     combined.push(...this.state.replies);
     combined.push(...this.state.mentions);
@@ -324,7 +326,7 @@ export class Inbox extends Component<any, InboxState> {
   parseMessage(msg: WebSocketJsonResponse) {
     console.log(msg);
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
     } else if (res.op == UserOperation.GetReplies) {
diff --git a/ui/src/components/login.tsx b/ui/src/components/login.tsx
index ac60ba74..64687a3d 100644
--- a/ui/src/components/login.tsx
+++ b/ui/src/components/login.tsx
@@ -295,7 +295,7 @@ export class Login extends Component<any, State> {
 
   parseMessage(msg: WebSocketJsonResponse) {
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       this.state = this.emptyState;
       this.setState(this.state);
diff --git a/ui/src/components/main.tsx b/ui/src/components/main.tsx
index 9f16edb5..6bf4164f 100644
--- a/ui/src/components/main.tsx
+++ b/ui/src/components/main.tsx
@@ -566,7 +566,7 @@ export class Main extends Component<any, MainState> {
   parseMessage(msg: WebSocketJsonResponse) {
     console.log(msg);
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
     } else if (res.op == UserOperation.GetFollowedCommunities) {
diff --git a/ui/src/components/modlog.tsx b/ui/src/components/modlog.tsx
index dd651092..e03f1ff7 100644
--- a/ui/src/components/modlog.tsx
+++ b/ui/src/components/modlog.tsx
@@ -425,7 +425,7 @@ export class Modlog extends Component<any, ModlogState> {
   parseMessage(msg: WebSocketJsonResponse) {
     console.log(msg);
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
     } else if (res.op == UserOperation.GetModlog) {
diff --git a/ui/src/components/navbar.tsx b/ui/src/components/navbar.tsx
index 849822af..1828fce9 100644
--- a/ui/src/components/navbar.tsx
+++ b/ui/src/components/navbar.tsx
@@ -138,7 +138,7 @@ export class Navbar extends Component<any, NavbarState> {
             </li>
             <li className="nav-item">
               <Link
-                class="nav-link ml-2"
+                class="nav-link"
                 to="/sponsors"
                 title={i18n.t('donate_to_lemmy')}
               >
@@ -202,8 +202,8 @@ export class Navbar extends Component<any, NavbarState> {
 
   parseMessage(msg: WebSocketJsonResponse) {
     let res = wsJsonToRes(msg);
-    if (res.error) {
-      if (res.error == 'not_logged_in') {
+    if (msg.error) {
+      if (msg.error == 'not_logged_in') {
         UserService.Instance.logout();
         location.reload();
       }
diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx
index 677007ca..57d9a964 100644
--- a/ui/src/components/post-form.tsx
+++ b/ui/src/components/post-form.tsx
@@ -160,6 +160,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
                 class="form-control"
                 value={this.state.postForm.url}
                 onInput={linkEvent(this, this.handlePostUrlChange)}
+                onPaste={linkEvent(this, this.handleImageUploadPaste)}
               />
               {this.state.suggestedTitle && (
                 <div
@@ -442,9 +443,22 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
     i.setState(i.state);
   }
 
+  handleImageUploadPaste(i: PostForm, event: any) {
+    let image = event.clipboardData.files[0];
+    if (image) {
+      i.handleImageUpload(i, image);
+    }
+  }
+
   handleImageUpload(i: PostForm, event: any) {
-    event.preventDefault();
-    let file = event.target.files[0];
+    let file: any;
+    if (event.target) {
+      event.preventDefault();
+      file = event.target.files[0];
+    } else {
+      file = event;
+    }
+
     const imageUploadUrl = `/pictshare/api/upload.php`;
     const formData = new FormData();
     formData.append('file', file);
@@ -475,7 +489,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
 
   parseMessage(msg: WebSocketJsonResponse) {
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       this.state.loading = false;
       this.setState(this.state);
diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx
index aab2cea5..c9a29e87 100644
--- a/ui/src/components/post-listing.tsx
+++ b/ui/src/components/post-listing.tsx
@@ -119,7 +119,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
       <div class="listing col-12">
         <div className={`vote-bar mr-2 float-left small text-center`}>
           <button
-            disabled={!UserService.Instance.user}
             className={`btn p-0 ${
               post.my_vote == 1 ? 'text-info' : 'text-muted'
             }`}
@@ -138,7 +137,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
           <div class={`font-weight-bold text-muted`}>{post.score}</div>
           {WebSocketService.Instance.site.enable_downvotes && (
             <button
-              disabled={!UserService.Instance.user}
               className={`btn p-0 ${
                 post.my_vote == -1 ? 'text-danger' : 'text-muted'
               }`}
@@ -740,17 +738,22 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
   }
 
   handlePostLike(i: PostListing) {
-    i.setState({ upvoteLoading: true });
+    if (UserService.Instance.user) {
+      i.setState({ upvoteLoading: true });
+    }
 
     let form: CreatePostLikeForm = {
       post_id: i.props.post.id,
       score: i.props.post.my_vote == 1 ? 0 : 1,
     };
+
     WebSocketService.Instance.likePost(form);
   }
 
   handlePostDisLike(i: PostListing) {
-    i.setState({ downvoteLoading: true });
+    if (UserService.Instance.user) {
+      i.setState({ downvoteLoading: true });
+    }
 
     let form: CreatePostLikeForm = {
       post_id: i.props.post.id,
diff --git a/ui/src/components/post.tsx b/ui/src/components/post.tsx
index 931ced2d..36621248 100644
--- a/ui/src/components/post.tsx
+++ b/ui/src/components/post.tsx
@@ -23,6 +23,7 @@ import {
   SearchType,
   SortType,
   SearchForm,
+  GetPostForm,
   SearchResponse,
   GetSiteResponse,
   GetCommunityResponse,
@@ -84,7 +85,10 @@ export class Post extends Component<any, PostState> {
         () => console.log('complete')
       );
 
-    WebSocketService.Instance.getPost(postId);
+    let form: GetPostForm = {
+      id: postId,
+    };
+    WebSocketService.Instance.getPost(form);
   }
 
   componentWillUnmount() {
@@ -231,6 +235,18 @@ export class Post extends Component<any, PostState> {
             onChange={linkEvent(this, this.handleCommentSortChange)}
           />
         </label>
+        <label
+          className={`btn btn-sm btn-secondary pointer ${this.state
+            .commentSort === CommentSortType.Old && 'active'}`}
+        >
+          {i18n.t('old')}
+          <input
+            type="radio"
+            value={CommentSortType.Old}
+            checked={this.state.commentSort === CommentSortType.Old}
+            onChange={linkEvent(this, this.handleCommentSortChange)}
+          />
+        </label>
       </div>
     );
   }
@@ -313,6 +329,13 @@ export class Post extends Component<any, PostState> {
           +a.comment.deleted - +b.comment.deleted ||
           b.comment.published.localeCompare(a.comment.published)
       );
+    } else if (this.state.commentSort == CommentSortType.Old) {
+      tree.sort(
+        (a, b) =>
+          +a.comment.removed - +b.comment.removed ||
+          +a.comment.deleted - +b.comment.deleted ||
+          a.comment.published.localeCompare(b.comment.published)
+      );
     } else if (this.state.commentSort == CommentSortType.Hot) {
       tree.sort(
         (a, b) =>
@@ -345,7 +368,7 @@ export class Post extends Component<any, PostState> {
   parseMessage(msg: WebSocketJsonResponse) {
     console.log(msg);
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
     } else if (res.op == UserOperation.GetPost) {
diff --git a/ui/src/components/private-message-form.tsx b/ui/src/components/private-message-form.tsx
index c8627845..13b4d2ea 100644
--- a/ui/src/components/private-message-form.tsx
+++ b/ui/src/components/private-message-form.tsx
@@ -283,7 +283,7 @@ export class PrivateMessageForm extends Component<
 
   parseMessage(msg: WebSocketJsonResponse) {
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       this.state.loading = false;
       this.setState(this.state);
diff --git a/ui/src/components/search.tsx b/ui/src/components/search.tsx
index 18b5d341..604c2617 100644
--- a/ui/src/components/search.tsx
+++ b/ui/src/components/search.tsx
@@ -479,7 +479,7 @@ export class Search extends Component<any, SearchState> {
   parseMessage(msg: WebSocketJsonResponse) {
     console.log(msg);
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
     } else if (res.op == UserOperation.Search) {
diff --git a/ui/src/components/setup.tsx b/ui/src/components/setup.tsx
index 26475a38..25cfadef 100644
--- a/ui/src/components/setup.tsx
+++ b/ui/src/components/setup.tsx
@@ -188,7 +188,7 @@ export class Setup extends Component<any, State> {
 
   parseMessage(msg: WebSocketJsonResponse) {
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       this.state.userLoading = false;
       this.setState(this.state);
diff --git a/ui/src/components/user.tsx b/ui/src/components/user.tsx
index 09129d67..1475de6b 100644
--- a/ui/src/components/user.tsx
+++ b/ui/src/components/user.tsx
@@ -1016,12 +1016,12 @@ export class User extends Component<any, UserState> {
   parseMessage(msg: WebSocketJsonResponse) {
     console.log(msg);
     let res = wsJsonToRes(msg);
-    if (res.error) {
+    if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       this.state.deleteAccountLoading = false;
       this.state.avatarLoading = false;
       this.state.userSettingsLoading = false;
-      if (res.error == 'couldnt_find_that_username_or_email') {
+      if (msg.error == 'couldnt_find_that_username_or_email') {
         this.context.router.history.push('/');
       }
       this.setState(this.state);
diff --git a/ui/src/env.ts b/ui/src/env.ts
index 82377415..af9aad5d 100644
--- a/ui/src/env.ts
+++ b/ui/src/env.ts
@@ -1,6 +1,5 @@
-let host = `${window.location.hostname}`;
-let port = `${window.location.port == '4444' ? '8536' : window.location.port}`;
-let endpoint = `${host}:${port}`;
-export let wsUri = `${
-  window.location.protocol == 'https:' ? 'wss://' : 'ws://'
-}${endpoint}/api/v1/ws`;
+const host = `${window.location.hostname}`;
+const port = `${window.location.port == '4444' ? '8536' : window.location.port}`;
+const endpoint = `${host}:${port}`;
+
+export const wsUri = `${window.location.protocol == 'https:' ? 'wss://' : 'ws://'}${endpoint}/api/v1/ws`;
diff --git a/ui/src/i18next.ts b/ui/src/i18next.ts
index aaaecd04..51e7e3a3 100644
--- a/ui/src/i18next.ts
+++ b/ui/src/i18next.ts
@@ -10,6 +10,8 @@ import { ru } from './translations/ru';
 import { zh } from './translations/zh';
 import { nl } from './translations/nl';
 import { it } from './translations/it';
+import { fi } from './translations/fi';
+import { ca } from './translations/ca';
 
 // https://github.com/nimbusec-oss/inferno-i18next/blob/master/tests/T.test.js#L66
 const resources = {
@@ -23,11 +25,12 @@ const resources = {
   ru,
   nl,
   it,
+  fi,
+  ca,
 };
 
-function format(value: any, format: any, lng: any) {
-  if (format === 'uppercase') return value.toUpperCase();
-  return value;
+function format(value: any, format: any, lng: any): any {
+  return format === 'uppercase' ? value.toUpperCase() : value;
 }
 
 i18next.init({
@@ -38,9 +41,7 @@ i18next.init({
   lng: getLanguage(),
   fallbackLng: 'en',
   resources,
-  interpolation: {
-    format: format,
-  },
+  interpolation: { format },
 });
 
 export { i18next as i18n, resources };
diff --git a/ui/src/index.html b/ui/src/index.html
index 122783d4..09f13097 100644
--- a/ui/src/index.html
+++ b/ui/src/index.html
@@ -1,29 +1,28 @@
 <!DOCTYPE html>
 <html lang="en">
+  <head>
+    <!-- Required meta tags -->
+    <meta name="Description" content="Lemmy">
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
-<head>
-	<!-- Required meta tags -->
-  <meta name="Description" content="Lemmy">
-	<meta charset="utf-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <!-- Icons -->
+    <link rel="shortcut icon" type="image/svg+xml" href="/static/assets/favicon.svg" />
+    <link rel="apple-touch-icon" href="/static/assets/apple-touch-icon.png" />
 
-  <!-- Icons -->
-	<link rel="shortcut icon" type="image/svg+xml" href="/static/assets/favicon.svg" />
-	<link rel="apple-touch-icon" href="/static/assets/apple-touch-icon.png" />
+    <!-- Styles -->
+    <link rel="stylesheet" type="text/css" href="/static/assets/css/tribute.css" />
+    <link rel="stylesheet" type="text/css" href="/static/assets/css/toastify.css" />
+    <link rel="stylesheet" type="text/css" href="/static/assets/css/themes/darkly.min.css" id="darkly" />
+    <link rel="stylesheet" type="text/css" href="/static/assets/css/main.css" />
 
-  <!-- Styles -->
-  <link rel="stylesheet" type="text/css" href="/static/assets/css/tribute.css" />
-  <link rel="stylesheet" type="text/css" href="/static/assets/css/toastify.css" />
-  <link rel="stylesheet" type="text/css" href="/static/assets/css/themes/darkly.min.css" id="darkly" />
-  <link rel="stylesheet" type="text/css" href="/static/assets/css/main.css" />
-
-  <!-- Scripts -->
-  <script async src="/static/assets/libs/sortable/sortable.min.js"></script>
-</head>
-
-<body>
-	<div id="app"></div>
-	$bundles
-</body>
+    <!-- Scripts -->
+    <script async src="/static/assets/libs/sortable/sortable.min.js"></script>
+  </head>
 
+  <body>
+    <noscript>JavaScript is required for this page.</noscript>
+    <div id="app"></div>
+    $bundles
+  </body>
 </html>
diff --git a/ui/src/interfaces.ts b/ui/src/interfaces.ts
index bd954d20..f83595d7 100644
--- a/ui/src/interfaces.ts
+++ b/ui/src/interfaces.ts
@@ -47,6 +47,7 @@ export enum CommentSortType {
   Hot,
   Top,
   New,
+  Old,
 }
 
 export enum ListingType {
@@ -248,6 +249,10 @@ export interface FollowCommunityForm {
   auth?: string;
 }
 
+export interface GetFollowedCommunitiesForm {
+  auth: string;
+}
+
 export interface GetFollowedCommunitiesResponse {
   communities: Array<CommunityUser>;
 }
@@ -523,6 +528,12 @@ export interface CommunityForm {
   auth?: string;
 }
 
+export interface GetCommunityForm {
+  id?: number;
+  name?: string;
+  auth?: string;
+}
+
 export interface GetCommunityResponse {
   community: Community;
   moderators: Array<CommunityUser>;
@@ -572,6 +583,11 @@ export interface PostFormParams {
   community?: string;
 }
 
+export interface GetPostForm {
+  id: number;
+  auth?: string;
+}
+
 export interface GetPostResponse {
   post: Post;
   comments: Array<Comment>;
@@ -759,6 +775,45 @@ export interface PrivateMessageResponse {
   message: PrivateMessage;
 }
 
+export type MessageType =
+  | EditPrivateMessageForm
+  | LoginForm
+  | RegisterForm
+  | CommunityForm
+  | FollowCommunityForm
+  | ListCommunitiesForm
+  | GetFollowedCommunitiesForm
+  | PostForm
+  | GetPostForm
+  | GetPostsForm
+  | GetCommunityForm
+  | CommentForm
+  | CommentLikeForm
+  | SaveCommentForm
+  | CreatePostLikeForm
+  | BanFromCommunityForm
+  | AddAdminForm
+  | AddModToCommunityForm
+  | TransferCommunityForm
+  | TransferSiteForm
+  | SaveCommentForm
+  | BanUserForm
+  | AddAdminForm
+  | GetUserDetailsForm
+  | GetRepliesForm
+  | GetUserMentionsForm
+  | EditUserMentionForm
+  | GetModlogForm
+  | SiteForm
+  | SearchForm
+  | UserSettingsForm
+  | DeleteAccountForm
+  | PasswordResetForm
+  | PasswordChangeForm
+  | PrivateMessageForm
+  | EditPrivateMessageForm
+  | GetPrivateMessagesForm;
+
 type ResponseType =
   | SiteResponse
   | GetFollowedCommunitiesResponse
@@ -784,11 +839,10 @@ type ResponseType =
 export interface WebSocketResponse {
   op: UserOperation;
   data: ResponseType;
-  error?: string;
 }
 
 export interface WebSocketJsonResponse {
-  op: string;
-  data: ResponseType;
+  op?: string;
+  data?: ResponseType;
   error?: string;
 }
diff --git a/ui/src/services/WebSocketService.ts b/ui/src/services/WebSocketService.ts
index e72a2871..83e9ef1e 100644
--- a/ui/src/services/WebSocketService.ts
+++ b/ui/src/services/WebSocketService.ts
@@ -9,9 +9,12 @@ import {
   CommentForm,
   SaveCommentForm,
   CommentLikeForm,
+  GetPostForm,
   GetPostsForm,
   CreatePostLikeForm,
+  GetCommunityForm,
   FollowCommunityForm,
+  GetFollowedCommunitiesForm,
   GetUserDetailsForm,
   ListCommunitiesForm,
   GetModlogForm,
@@ -35,6 +38,7 @@ import {
   PrivateMessageForm,
   EditPrivateMessageForm,
   GetPrivateMessagesForm,
+  MessageType,
 } from '../interfaces';
 import { webSocket } from 'rxjs/webSocket';
 import { Subject } from 'rxjs';
@@ -108,9 +112,9 @@ export class WebSocketService {
   }
 
   public getFollowedCommunities() {
-    let data = { auth: UserService.Instance.auth };
+    let form: GetFollowedCommunitiesForm = { auth: UserService.Instance.auth };
     this.subject.next(
-      this.wsSendWrapper(UserOperation.GetFollowedCommunities, data)
+      this.wsSendWrapper(UserOperation.GetFollowedCommunities, form)
     );
   }
 
@@ -125,19 +129,14 @@ export class WebSocketService {
     this.subject.next(this.wsSendWrapper(UserOperation.CreatePost, postForm));
   }
 
-  public getPost(postId: number) {
-    let data = { id: