From 1c4ea223178667585f6854f16430f031bdb5ca2c Mon Sep 17 00:00:00 2001
From: Mustafa Buyukcelebi <mustafa.buyukcel@gmail.com>
Date: Sat, 24 Oct 2020 19:56:24 +0300
Subject: [PATCH] Fixed unmounted component issue

---
 .../posts/container/postsContainer.js         | 66 +++++++++----------
 src/customHooks/useIsMountedRef.js            | 12 ++++
 2 files changed, 45 insertions(+), 33 deletions(-)
 create mode 100644 src/customHooks/useIsMountedRef.js

diff --git a/src/components/posts/container/postsContainer.js b/src/components/posts/container/postsContainer.js
index 5f81bc843..3174d5baf 100644
--- a/src/components/posts/container/postsContainer.js
+++ b/src/components/posts/container/postsContainer.js
@@ -15,7 +15,7 @@ import PostsView from '../view/postsView';
 import { setFeedPosts } from '../../../redux/actions/postsAction';
 import { hidePostsThumbnails } from '../../../redux/actions/uiAction';
 
-let _isLoadingPost = false;
+import useIsMountedRef from '../../../customHooks/useIsMountedRef';
 
 const PostsContainer = ({
   changeForceLoadPostState,
@@ -51,6 +51,7 @@ const PostsContainer = ({
     filterOptionsValue && filterOptionsValue[selectedFilterIndex],
   );
   const elem = useRef(null);
+  const isMountedRef = useIsMountedRef();
 
   useEffect(() => {
     if (isConnected) {
@@ -119,7 +120,9 @@ const PostsContainer = ({
             ),
           );
 
-          setPromotedPosts(_promotedPosts);
+          if (isMountedRef.current) {
+            setPromotedPosts(_promotedPosts);
+          }
         }
       })
       .catch(() => {});
@@ -127,7 +130,6 @@ const PostsContainer = ({
 
   const _loadPosts = (type) => {
     if (
-      _isLoadingPost ||
       isLoading ||
       !isConnected ||
       (!isLoggedIn && type === 'feed') ||
@@ -136,12 +138,10 @@ const PostsContainer = ({
       return;
     }
     setIsLoading(true);
-    _isLoadingPost = true;
 
     if (!isConnected && (refreshing || isLoading)) {
       setRefreshing(false);
       setIsLoading(false);
-      _isLoadingPost = false;
       return;
     }
 
@@ -182,45 +182,45 @@ const PostsContainer = ({
     }
     func(options, username, nsfw)
       .then((result) => {
-        if (result.length > 0) {
-          let _posts = result;
+        if (isMountedRef.current) {
+          if (result.length > 0) {
+            let _posts = result;
 
-          if (filter === 'reblogs') {
-            for (let i = _posts.length - 1; i >= 0; i--) {
-              if (_posts[i].author === username) {
-                _posts.splice(i, 1);
+            if (filter === 'reblogs') {
+              for (let i = _posts.length - 1; i >= 0; i--) {
+                if (_posts[i].author === username) {
+                  _posts.splice(i, 1);
+                }
               }
             }
-          }
-          if (_posts.length > 0) {
-            if (posts.length > 0) {
-              if (refreshing) {
-                _posts = unionBy(_posts, posts, 'permlink');
-              } else {
-                _posts = unionBy(posts, _posts, 'permlink');
+            if (_posts.length > 0) {
+              if (posts.length > 0) {
+                if (refreshing) {
+                  _posts = unionBy(_posts, posts, 'permlink');
+                } else {
+                  _posts = unionBy(posts, _posts, 'permlink');
+                }
+              }
+              if (posts.length <= 7 && pageType !== 'profiles') {
+                _setFeedPosts(_posts);
               }
-            }
-            if (posts.length <= 7 && pageType !== 'profiles') {
-              _setFeedPosts(_posts);
-            }
 
-            //if (!refreshing) {
-            setStartAuthor(result[result.length - 1] && result[result.length - 1].author);
-            setStartPermlink(result[result.length - 1] && result[result.length - 1].permlink);
-            //}
-            setPosts(_posts);
+              //if (!refreshing) {
+              setStartAuthor(result[result.length - 1] && result[result.length - 1].author);
+              setStartPermlink(result[result.length - 1] && result[result.length - 1].permlink);
+              //}
+              setPosts(_posts);
+            }
+          } else if (result.length === 0) {
+            setIsNoPost(true);
           }
-        } else if (result.length === 0) {
-          setIsNoPost(true);
+          setRefreshing(false);
+          setIsLoading(false);
         }
-        setRefreshing(false);
-        setIsLoading(false);
-        _isLoadingPost = false;
       })
       .catch(() => {
         setRefreshing(false);
         setIsLoading(false);
-        _isLoadingPost = false;
       });
     // track filter and tag views
     if (isAnalytics) {
diff --git a/src/customHooks/useIsMountedRef.js b/src/customHooks/useIsMountedRef.js
new file mode 100644
index 000000000..18e4e2e83
--- /dev/null
+++ b/src/customHooks/useIsMountedRef.js
@@ -0,0 +1,12 @@
+import { useEffect, useRef } from 'react';
+
+export default () => {
+  const isMountedRef = useRef(null);
+  useEffect(() => {
+    isMountedRef.current = true;
+    return () => {
+      isMountedRef.current = false;
+    };
+  });
+  return isMountedRef;
+};