Replaced chat flat list with bidirectional infinite scroll

package.json

@@ -20,6 +20,7 @@
     "@react-native-community/netinfo": "^4.4.0",
     "@react-native-community/push-notification-ios": "^1.4.1",
     "@react-native-community/slider": "^3.0.0",
+    "@stream-io/flat-list-mvcp": "^0.10.1",
     "bignumber.js": "git+https://github.com/status-im/bignumber.js.git#v4.0.2-status",
     "buffer": "^5.4.2",
     "chance": "^1.1.0",
@@ -34,7 +35,7 @@
     "react-dom": "^16.4.2",
     "react-native": "0.63.4",
     "react-native-background-timer": "^2.1.1",
-    "react-native-bidirectional-list": "git+https://github.com/callstack-internal/react-native-bidirectional-list.git#main",
+    "react-native-bidirectional-infinite-scroll": "^0.3.3",
     "react-native-camera-kit": "^8.0.4",
     "react-native-config": "git+https://github.com/status-im/react-native-config.git#v1.4.2-status",
     "react-native-dark-mode": "^0.2.2",

src/status_im/ui/components/list/views.cljs

@@ -3,11 +3,11 @@
             [status-im.ui.components.list.styles :as styles]
             [status-im.ui.components.react :as react]
             [status-im.utils.platform :as platform]
-            ["react-native" :as react-native]
+            ["react-native-bidirectional-infinite-scroll" :as react-native-bidirectional-infinite-scroll]
-            ["react-native-bidirectional-list" :refer [BidirectionalList]]))
+            ["react-native" :as react-native]))
 
-(def flat-list-class (reagent/adapt-react-class BidirectionalList))
+(def flat-list-class (reagent/adapt-react-class (.-FlatList react-native)))
-;(def flat-list-class (reagent/adapt-react-class (.-FlatList react-native)))
+(def bidi-flat-list-class (reagent/adapt-react-class (.-FlatList react-native-bidirectional-infinite-scroll)))
 (def section-list-class (reagent/adapt-react-class (.-SectionList react-native)))
 
 (def memo-wrap-render-fn
@@ -57,6 +57,18 @@
              props
              {:data (to-array data)})])))
 
+(defn bidi-flat-list
+  "A wrapper for react-native-bidirectional-infinite-scroll.
+  See https://github.com/GetStream/react-native-bidirectional-infinite-scroll"
+  ([{:keys [data] :as props}]
+   (do
+     {:pre [(or (nil? data)
+                (sequential? data))]}
+     [bidi-flat-list-class
+      (merge (base-list-props props)
+             props
+             {:data (to-array data)})])))
+
 (defn- wrap-render-section-header-fn [f]
   (fn [^js data]
     (let [^js section (.-section data)]

src/status_im/ui/screens/chat/views.cljs

@@ -302,7 +302,7 @@
   (let [{:keys [group-chat chat-id public? community-id admins]} chat
         messages @(re-frame/subscribe [:chats/chat-messages-stream chat-id])]
     ;;do not use anonymous functions for handlers
-    [list/flat-list
+    [list/bidi-flat-list
      (merge
       pan-responder
       {:key-fn                       list-key-fn

yarn.lock

@@ -6603,13 +6603,6 @@ react-native-bidirectional-infinite-scroll@^0.3.3:
   resolved "https://registry.yarnpkg.com/react-native-bidirectional-infinite-scroll/-/react-native-bidirectional-infinite-scroll-0.3.3.tgz#31e83e30514be2eaaa889b97d01149c8a08576ec"
   integrity sha512-zxYJDjrxTkGqg83WH3fSdufg79XZ7xDDn9HdHlKo9avAcz92Rf28/ivDeUM2aOUmmboqJK8BqtVByT6cF/taYg==
 
-"react-native-bidirectional-list@git+https://github.com/callstack-internal/react-native-bidirectional-list.git#main":
-  version "0.1.0"
-  resolved "git+https://github.com/callstack-internal/react-native-bidirectional-list.git#ef52f1c115917b9f7a5e0a67b2bb83864f349b61"
-  dependencies:
-    "@stream-io/flat-list-mvcp" "^0.10.1"
-    react-native-bidirectional-infinite-scroll "^0.3.3"
-
 react-native-camera-kit@^8.0.4:
   version "8.0.4"
   resolved "https://registry.yarnpkg.com/react-native-camera-kit/-/react-native-camera-kit-8.0.4.tgz#8e350b37a205054ceb140a8babe1d032acdcdbd5"