Websocket reconnect reload page data. Fixes #504

diff --git a/.gitignore b/.gitignore
index 7fac3d5fe1febb9b6fa179cf145dbb346c0266a2..90972df6a6469a5300832d321bb4dba62703bb20 100644 (file)
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,5 @@
 ansible/inventory
+ansible/inventory_dev
 ansible/passwords/
 docker/lemmy_mine.hjson
 docker/dev/env_deploy.sh

diff --git a/ui/src/components/community.tsx b/ui/src/components/community.tsx
index 7e3e2cd7c86e2851effd22950abce6349e9996fd..0fa8f7b5304204133aa0e74faf8fe33329b94516 100644 (file)
--- a/ui/src/components/community.tsx
+++ b/ui/src/components/community.tsx
@@ -254,6 +254,8 @@ export class Community extends Component<any, State> {
       toast(i18n.t(msg.error), 'danger');
       this.context.router.history.push('/');
       return;
+    } else if (msg.reconnect) {
+      this.fetchPosts();
     } else if (res.op == UserOperation.GetCommunity) {
       let data = res.data as GetCommunityResponse;
       this.state.community = data.community;

diff --git a/ui/src/components/inbox.tsx b/ui/src/components/inbox.tsx
index 6f4d2377c4f6aa2106b8fbd45ef7a0c129a7a199..6849b37d25edcb4875fffc96689fa98cabd3041e 100644 (file)
--- a/ui/src/components/inbox.tsx
+++ b/ui/src/components/inbox.tsx
@@ -313,6 +313,8 @@ export class Inbox extends Component<any, InboxState> {
     if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
+    } else if (msg.reconnect) {
+      this.refetch();
     } else if (res.op == UserOperation.GetReplies) {
       let data = res.data as GetRepliesResponse;
       this.state.replies = data.replies;

diff --git a/ui/src/components/main.tsx b/ui/src/components/main.tsx
index 6d3e18157aed5229a46886dd7856c9905a9f0ce4..0970381b5ab85dfee267a0a9455e0431a137f8d6 100644 (file)
--- a/ui/src/components/main.tsx
+++ b/ui/src/components/main.tsx
@@ -537,6 +537,8 @@ export class Main extends Component<any, MainState> {
     if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
+    } else if (msg.reconnect) {
+      this.fetchPosts();
     } else if (res.op == UserOperation.GetFollowedCommunities) {
       let data = res.data as GetFollowedCommunitiesResponse;
       this.state.subscribedCommunities = data.communities;

diff --git a/ui/src/components/navbar.tsx b/ui/src/components/navbar.tsx
index a916f69fc5fae163bf0197547790cbcbd3406d95..c675cfe7b57f46193f49a52b3e4730103a960bb3 100644 (file)
--- a/ui/src/components/navbar.tsx
+++ b/ui/src/components/navbar.tsx
@@ -208,6 +208,8 @@ export class Navbar extends Component<any, NavbarState> {
         location.reload();
       }
       return;
+    } else if (msg.reconnect) {
+      this.fetchUnreads();
     } else if (res.op == UserOperation.GetReplies) {
       let data = res.data as GetRepliesResponse;
       let unreadReplies = data.replies.filter(r => !r.read);

diff --git a/ui/src/components/post.tsx b/ui/src/components/post.tsx
index b0faf8506e1d4e97e4934afae63c40f70e45bfb4..b399d3b28c38fc91006988c34a583a4753fc6567 100644 (file)
--- a/ui/src/components/post.tsx
+++ b/ui/src/components/post.tsx
@@ -370,6 +370,10 @@ export class Post extends Component<any, PostState> {
     if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
+    } else if (msg.reconnect) {
+      WebSocketService.Instance.getPost({
+        id: Number(this.props.match.params.id),
+      });
     } else if (res.op == UserOperation.GetPost) {
       let data = res.data as GetPostResponse;
       this.state.post = data.post;

diff --git a/ui/src/components/user.tsx b/ui/src/components/user.tsx
index ebdf6d5b0019a9898ff06bd70a395f4169747118..1c3c51d93898b9201b0e253d3ed0b81445349d8f 100644 (file)
--- a/ui/src/components/user.tsx
+++ b/ui/src/components/user.tsx
@@ -991,6 +991,8 @@ export class User extends Component<any, UserState> {
       }
       this.setState(this.state);
       return;
+    } else if (msg.reconnect) {
+      this.refetch();
     } else if (res.op == UserOperation.GetUserDetails) {
       let data = res.data as UserDetailsResponse;
       this.state.user = data.user;

diff --git a/ui/src/interfaces.ts b/ui/src/interfaces.ts
index 6c87d3e931e0d7b8625dc3db136f079bb73b5753..02c108aa59e4ccdefafc699467238844f6d969bf 100644 (file)
--- a/ui/src/interfaces.ts
+++ b/ui/src/interfaces.ts
@@ -854,4 +854,5 @@ export interface WebSocketJsonResponse {
   op?: string;
   data?: ResponseType;
   error?: string;
+  reconnect?: boolean;
 }

diff --git a/ui/src/services/WebSocketService.ts b/ui/src/services/WebSocketService.ts
index c5e45e791aef8a3f0755384c5ac19d3e75fe8e30..6d951618a8ad0be55ad506bf38cf6f90d4ffdc3d 100644 (file)
--- a/ui/src/services/WebSocketService.ts
+++ b/ui/src/services/WebSocketService.ts
@@ -40,6 +40,7 @@ import {
   GetPrivateMessagesForm,
   UserJoinForm,
   MessageType,
+  WebSocketJsonResponse,
 } from '../interfaces';
 import { UserService } from './';
 import { i18n } from '../i18next';
@@ -59,17 +60,21 @@ export class WebSocketService {
 
   private constructor() {
     this.ws = new ReconnectingWebSocket(wsUri);
-    this.ws.onopen = () => {
-      console.log(`Connected to ${wsUri}`);
-      if (UserService.Instance.user) {
-        this.userJoin();
-      }
-    };
 
     this.subject = Observable.create((obs: any) => {
       this.ws.onmessage = e => {
         obs.next(JSON.parse(e.data));
       };
+      this.ws.onopen = () => {
+        console.log(`Connected to ${wsUri}`);
+        if (UserService.Instance.user) {
+          this.userJoin();
+        }
+        let res: WebSocketJsonResponse = {
+          reconnect: true,
+        };
+        obs.next(res);
+      };
     }).pipe(share());
   }