diff --git a/src/quo/components/settings/category/settings/view.cljs b/src/quo/components/settings/category/settings/view.cljs index df2b68c7ece..980c4ed6b31 100644 --- a/src/quo/components/settings/category/settings/view.cljs +++ b/src/quo/components/settings/category/settings/view.cljs @@ -15,10 +15,12 @@ :size :paragraph-2 :style (style/label props)} label]) - [rn/flat-list - {:data data - :style (style/settings-items props) - :render-fn settings-item/view - :separator [rn/view {:style (style/settings-separator props)}]}]]) + [rn/view {:style (style/settings-items props)} + (for [item data] + ^{:key item} + [:<> + [settings-item/view item] + (when-not (= item (last data)) + [rn/view {:style (style/settings-separator props)}])])]]) (def settings-category (quo.theme/with-theme category-internal)) diff --git a/src/status_im/contexts/profile/settings/view.cljs b/src/status_im/contexts/profile/settings/view.cljs index 10f8258d2d5..7c49262479e 100644 --- a/src/status_im/contexts/profile/settings/view.cljs +++ b/src/status_im/contexts/profile/settings/view.cljs @@ -16,11 +16,12 @@ (defn- settings-item-view [data] - [quo/category - {:list-type :settings - :container-style {:padding-bottom 0} - :blur? true - :data data}]) + [rf/delay-render + [quo/category + {:list-type :settings + :container-style {:padding-bottom 0} + :blur? true + :data data}]]) (defn scroll-handler [event scroll-y] @@ -29,12 +30,13 @@ (defn- footer [logout-press] - [rn/view {:style style/footer-container} - [quo/logout-button {:on-press logout-press}]]) + [rf/delay-render + [rn/view {:style style/footer-container} + [quo/logout-button {:on-press logout-press}]]]) (defn- get-item-layout [_ index] - #js {:length 48 :offset (* 48 index) :index index}) + #js {:length 100 :offset (* 100 index) :index index}) (defn- settings-view [theme] @@ -60,12 +62,9 @@ {:key :list :header [settings.header/view {:scroll-y scroll-y}] :data settings.items/items - :key-fn :title - :get-item-layout get-item-layout - :initial-num-to-render 6 - :max-to-render-per-batch 6 :shows-vertical-scroll-indicator false :render-fn settings-item-view + :get-item-layout get-item-layout :footer [footer logout-press] :scroll-event-throttle 16 :on-scroll #(scroll-handler % scroll-y) diff --git a/src/utils/re_frame.cljs b/src/utils/re_frame.cljs index aeba147c83d..c35b5b08ead 100644 --- a/src/utils/re_frame.cljs +++ b/src/utils/re_frame.cljs @@ -3,6 +3,7 @@ (:require [re-frame.core :as re-frame] [re-frame.interceptor :as interceptor] + [reagent.core :as reagent] [taoensso.timbre :as log] [utils.datetime :as datetime]) (:refer-clojure :exclude [merge reduce])) @@ -76,6 +77,14 @@ (swap! handler-nesting-level dec) res)) +(defn delay-render + [content] + (let [render? (reagent/atom false)] + (js/setTimeout #(reset! render? true) 0) + (fn [] + (when @render? + content)))) + (def sub (comp deref re-frame/subscribe)) (def dispatch re-frame/dispatch)