From 286f05c3be9a2b55079693e51a9f9198681d6319 Mon Sep 17 00:00:00 2001
From: Mattermost Build <build@mattermost.com>
Date: Mon, 14 Jun 2021 22:01:54 +0200
Subject: [PATCH] fix: connect websocket when the component mounts (#5456)
 (#5457)

(cherry picked from commit 0e81e0e2a82bbde91218dc0380f3ea17d314587d)

Co-authored-by: Elias Nahum <nahumhbl@gmail.com>
---
 app/components/network_indicator/network.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/app/components/network_indicator/network.tsx b/app/components/network_indicator/network.tsx
index 917a60eef..d68b39502 100644
--- a/app/components/network_indicator/network.tsx
+++ b/app/components/network_indicator/network.tsx
@@ -111,10 +111,7 @@ const NetworkIndicator = ({
     };
 
     const handleConnectionChange = ({hasInternet}: ConnectionChangedEvent) => {
-        if (firstRun.current) {
-            firstRun.current = false;
-            handleWebSocket(true);
-        } else {
+        if (!firstRun.current) {
             if (!hasInternet) {
                 setConnected(false);
             }
@@ -150,6 +147,11 @@ const NetworkIndicator = ({
         }
     };
 
+    useEffect(() => {
+        handleWebSocket(true);
+        firstRun.current = false;
+    }, []);
+
     useEffect(() => {
         const networkListener = networkConnectionListener(handleConnectionChange);
         return () => networkListener.removeEventListener();
@@ -168,7 +170,6 @@ const NetworkIndicator = ({
     useEffect(() => {
         const handleAppStateChange = stateChange(async (appState: AppStateStatus) => {
             const active = appState === 'active';
-
             handleWebSocket(active);
 
             if (active) {