fix the scroll top issue on mobile

vj-abishek · Apr 20, 2021 · 8728c34 · 8728c34 · vercel · Apr 20, 2021
1 parent 5daf063
commit 8728c34
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 445 deletions.
diff --git a/package.json b/package.json
@@ -33,7 +33,7 @@
     "react-dom": "^16.12.0",
     "react-error-boundary": "^3.0.2",
     "react-helmet": "^6.0.0",
-    "react-infinite-scroll-component": "vj-abishek/react-infinite-scroll-component#mobile",
+    "react-infinite-scroll-component": "vj-abishek/react-infinite-scroll-component#mobile2",
     "react-redux": "^7.2.0",
     "react-router-dom": "^5.1.2",
     "react-scripts": "^3.4.1",

diff --git a/src/Components/Channel/Chat/Conversation.jsx b/src/Components/Channel/Chat/Conversation.jsx
@@ -16,7 +16,7 @@ import {
   InitSignal,
   RecieveFile,
 } from '../../../Store/Actions/Peer';
-import { isMobile } from '../../Utils/helper';
+import { isMobile, getChromeVersion } from '../../Utils/helper';
 
 const Loader = () => (
   <div className="flex flex-row justify-center items-center p-2 ">
@@ -114,7 +114,7 @@ function Conversation({
     const { target } = e;
 
     if (
-      isMobile &&
+      isMobile && (getChromeVersion() <= 80) &&
       !(target.scrollTop + 50 >= target.scrollHeight - target.clientHeight)
     ) {
       setAutoScroll((a) => {
@@ -132,7 +132,10 @@ function Conversation({
   };
 
   const handleClick = () => {
-    if (isMobile) {
+
+    const isOldMobileBrowser = isMobile && (getChromeVersion() <= 80);
+    console.log(getChromeVersion() <= 80)
+    if (isOldMobileBrowser) {
       console.log('Inside', ChatBox.current.scrollHeight);
       ChatBox.current.scrollTo(0, ChatBox.current.scrollHeight);
       return;