status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Reduce renderings in community overview 

c15f9e73...1ea2bd99

This PR reduces the amount of rendering in community overview.
It limits the amount of data is passed to components to the necessary,
and it creates functions on component initialization so that they won't
cause a re-render.
Performance of the header are very noticeably better on my local
environment, though on nightly builds is less noticeable.

It also removes data from `communities/communities id` as that cause a
re-render of any component subscribed to it.
This commit is contained in:
Andrea Maria Piana 2024-02-13 08:43:20 +00:00
parent 37be08d2d7
commit 4e3ce54ac4
No known key found for this signature in database
6 changed files with 100 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/status_im/contexts/communities/overview/events.cljs
View File

@ -10,16 +10,16 @@
{:db (-> db
(assoc-in [:community-channels-permissions community-id]
(data-store/rpc->channel-permissions (:channels response)))
(assoc-in [:communities community-id :checking-all-channels-permissions?] false))}))
(assoc-in [:communities/channel-permissions-check community-id] false))}))
(rf/reg-event-fx :communities/check-all-community-channels-permissions-failed
(fn [{:keys [db]} [community-id]]
{:db (assoc-in db [:communities community-id :checking-all-channels-permissions?] false)}))
{:db (assoc-in db [:communities/channel-permissions-check community-id] false)}))
(rf/reg-event-fx :communities/check-all-community-channels-permissions
(fn [{:keys [db]} [community-id]]
(when (get-in db [:communities community-id])
{:db (assoc-in db [:communities community-id :checking-all-channels-permissions?] true)
{:db (assoc-in db [:communities/channel-permissions-check community-id] true)
:fx [[:json-rpc/call
[{:method "wakuext_checkAllCommunityChannelsPermissions"
:params [{:CommunityID community-id}]
@ -38,21 +38,19 @@
(let [token-permissions-check (cond-> result
based-on-client-selection? (assoc :based-on-client-selection? true))]
{:db (-> db
(assoc-in [:communities community-id :checking-permissions?] false)
(assoc-in [:communities community-id :token-permissions-check]
token-permissions-check))})))
(assoc-in [:communities/permissions-check community-id]
{:checking? false
:check token-permissions-check}))})))
(rf/reg-event-fx :communities/check-permissions-to-join-community-failed
(fn [{:keys [db]} [community-id]]
{:db (assoc-in db [:communities community-id :checking-permissions?] false)}))
{:db (assoc-in db [:communities/permissions-check community-id :checking?] false)}))
(rf/reg-event-fx :communities/check-permissions-to-join-community
(fn [{:keys [db]} [community-id addresses based-on-client-selection?]]
(when-let [community (get-in db [:communities community-id])]
(when-not (:checking-permissions? community)
{:db (-> db
(assoc-in [:communities community-id :checking-permissions?] true)
(assoc-in [:communities community-id :can-request-access?] false))
{:db (assoc-in db [:communities/permissions-check community-id :checking?] true)
:json-rpc/call [{:method "wakuext_checkPermissionsToJoinCommunity"
:params [(cond-> {:communityId community-id}
addresses

46
src/status_im/contexts/communities/overview/view.cljs
View File

@ -112,7 +112,7 @@
(defn- network-not-supported
[]
[quo/text (i18n/label :network-not-supported)])
[quo/text (i18n/label :t/network-not-supported)])
(defn- request-access-button
[id color]
@ -253,15 +253,17 @@
:description-accessibility-label :community-description}])
(defn- community-content
[{:keys [id]}]
[id]
(rf/dispatch [:communities/check-all-community-channels-permissions id])
(fn [{:keys [name description joined spectated images tags color id membership-permissions?]
:as community}
(fn [id
{:keys [on-category-layout
collapsed?
on-first-channel-height-changed]}]
(let [joined-or-spectated (or joined spectated)
chats-by-category (rf/sub [:communities/categorized-channels id])]
(let [{:keys [name description joined spectated images tags color id membership-permissions?]
:as community}
(rf/sub [:communities/community id])
joined-or-spectated (or joined spectated)
chats-by-category (rf/sub [:communities/categorized-channels id])]
[:<>
[rn/view {:style style/community-content-container}
(when-not collapsed?
@ -311,20 +313,24 @@
(and (>= scroll-height (+ height first-channel-height))
category)))))
(defn- community-scroll-page
[{:keys [joined]}]
(let [scroll-height (reagent/atom 0)
categories-heights (reagent/atom {})
first-channel-height (reagent/atom 0)
;; We track the initial value of joined
;; as we open the page to avoid switching
;; from not collapsed to collapsed if the
;; user is on this page
initial-joined? joined]
(fn [{:keys [id name images] :as community}]
(defn- community-scroll-page
[_ initial-joined? _ _]
(let [scroll-height (reagent/atom 0)
categories-heights (reagent/atom {})
first-channel-height (reagent/atom 0)
on-category-layout (partial add-category-height categories-heights)
on-first-channel-height-changed (fn [height categories]
(swap! categories-heights select-keys categories)
(reset! first-channel-height height))]
(fn [id joined name images]
(let [cover {:uri (get-in images [:banner :uri])}
logo {:uri (get-in images [:thumbnail :uri])}
collapsed? (and initial-joined? (:joined community))
collapsed? (and initial-joined? joined)
overlay-shown? (boolean (:sheets (rf/sub [:bottom-sheet])))]
[scroll-page/scroll-page
{:cover-image cover
@ -347,24 +353,22 @@
@first-channel-height
@categories-heights)}]}
[community-content
community
{:on-category-layout (partial add-category-height categories-heights)
id
{:on-category-layout on-category-layout
:collapsed? collapsed?
:on-first-channel-height-changed
;; Here we set the height of the component and we filter out the categories, as some
;; might have been removed.
(fn [height categories]
(swap! categories-heights select-keys categories)
(reset! first-channel-height height))}]]))))
on-first-channel-height-changed}]]))))
(defn- community-card-page-view
[id]
(let [{:keys [id joined]
(let [{:keys [id joined name images]
:as community} (rf/sub [:communities/community id])]
(when community
(when joined
(rf/dispatch [:activity-center.notifications/dismiss-community-overview id]))
[community-scroll-page community])))
[community-scroll-page id joined name images])))
(defn view
[id]

22
src/status_im/subs/communities.cljs
View File

@ -311,25 +311,33 @@
:amount (wallet.utils/remove-trailing-zeroes amount)
:img-src (get token-images sym)}))
(re-frame/reg-sub
:communities/checking-permissions-by-id
:<- [:communities/permissions-check]
(fn [permissions [_ id]]
(get permissions id)))
(re-frame/reg-sub
:community/token-gated-overview
(fn [[_ community-id]]
[(re-frame/subscribe [:communities/community community-id])])
(fn [[{:keys [token-permissions-check checking-permissions? token-images]}] _]
(let [highest-role (:highestRole token-permissions-check)
networks-not-supported? (:networksNotSupported token-permissions-check)
lowest-role (last (:roles token-permissions-check))
[(re-frame/subscribe [:communities/community community-id])
(re-frame/subscribe [:communities/checking-permissions-by-id community-id])])
(fn [[{:keys [token-images]}
{:keys [checking? check]}] _]
(let [highest-role (:highestRole check)
networks-not-supported? (:networksNotSupported check)
lowest-role (last (:roles check))
highest-permission-role (:type highest-role)
can-request-access? (and (boolean highest-permission-role) (not networks-not-supported?))]
{:can-request-access? can-request-access?
:highest-permission-role highest-permission-role
:networks-not-supported? networks-not-supported?
:no-member-permission? (and highest-permission-role
(not (-> token-permissions-check :highestRole :criteria)))
(not (-> check :highestRole :criteria)))
:tokens (map (fn [{:keys [tokenRequirement]}]
(map
(partial token-requirement->token
checking-permissions?
checking?
token-images)
tokenRequirement))
(or (:criteria highest-role)

91
src/status_im/subs/communities_test.cljs
View File

@ -383,35 +383,8 @@
(let
[checking-permissions? true
token-image-eth "data:image/jpeg;base64,/9j/2w"
community {:id community-id
:checking-permissions? checking-permissions?
:permissions {:access 3}
:highest-permission-role constants/community-token-permission-become-admin
:token-images {"ETH" token-image-eth}
:name "Community super name"
:chats {"89f98a1e-6776-4e5f-8626-8ab9f855253f"
{:description "x"
:emoji "🎲"
:permissions {:access 1}
:color "#88B0FF"
:name "random"
:categoryID "0c3c64e7-d56e-439b-a3fb-a946d83cb056"
:id "89f98a1e-6776-4e5f-8626-8ab9f855253f"
:position 4
:can-post? false
:members {"0x04" {"roles" [1]}}}
"a076358e-4638-470e-a3fb-584d0a542ce6"
{:description "General channel for the community"
:emoji "🐷 "
:permissions {:access 1}
:color "#4360DF"
:name "general"
:categoryID "0c3c64e7-d56e-439b-a3fb-a946d83cb056"
:id "a076358e-4638-470e-a3fb-584d0a542ce6"
:position 0
:can-post? false
:members {"0x04" {"roles" [1]}}}}
:token-permissions-check
checks {:checking? checking-permissions?
:check
{:satisfied true
:highestRole {:type constants/community-token-permission-become-admin
:criteria [{:tokenRequirement [{:satisfied true
@ -434,22 +407,52 @@
[{:address "0xd722eaa60dc73e334b588d34ba66a3b27e537783"
:chainIds nil}
{:address "0x738d3146831c5871fa15872b409e8f360e341784"
:chainIds [5 420]}]}
:members {"0x04" {"roles" [1]}}
:can-request-access? false
:outroMessage "bla"
:verified false}]
:chainIds [5 420]}]}}
community {:id community-id
:checking-permissions? checking-permissions?
:permissions {:access 3}
:highest-permission-role constants/community-token-permission-become-admin
:token-images {"ETH" token-image-eth}
:name "Community super name"
:chats {"89f98a1e-6776-4e5f-8626-8ab9f855253f"
{:description "x"
:emoji "🎲"
:permissions {:access 1}
:color "#88B0FF"
:name "random"
:categoryID "0c3c64e7-d56e-439b-a3fb-a946d83cb056"
:id "89f98a1e-6776-4e5f-8626-8ab9f855253f"
:position 4
:can-post? false
:members {"0x04" {"roles" [1]}}}
"a076358e-4638-470e-a3fb-584d0a542ce6"
{:description "General channel for the community"
:emoji "🐷 "
:permissions {:access 1}
:color "#4360DF"
:name "general"
:categoryID "0c3c64e7-d56e-439b-a3fb-a946d83cb056"
:id "a076358e-4638-470e-a3fb-584d0a542ce6"
:position 0
:can-post? false
:members {"0x04" {"roles" [1]}}}}
:members {"0x04" {"roles" [1]}}
:can-request-access? false
:outroMessage "bla"
:verified false}]
(swap! rf-db/app-db assoc-in [:communities community-id] community)
(is (match? {:can-request-access? true
:tokens [[{:symbol "DAI"
:amount "5"
:sufficient? true
:loading? checking-permissions?}]
[{:symbol "ETH"
:amount "0.002"
:sufficient? false
:loading? checking-permissions?
:img-src token-image-eth}]]}
(swap! rf-db/app-db assoc-in [:communities/permissions-check community-id] checks)
(is (match? {:can-request-access? true
:networks-not-supported? nil
:tokens [[{:symbol "DAI"
:amount "5"
:sufficient? true
:loading? checking-permissions?}]
[{:symbol "ETH"
:amount "0.002"
:sufficient? false
:loading? checking-permissions?
:img-src token-image-eth}]]}
(rf/sub [sub-name community-id])))))
(h/deftest-sub :communities/airdrop-account

2
src/status_im/subs/root.cljs
View File

@ -148,6 +148,8 @@
(reg-root-key-sub :communities/selected-tab :communities/selected-tab)
(reg-root-key-sub :contract-communities :contract-communities)
(reg-root-key-sub :communities/permissioned-balances :communities/permissioned-balances)
(reg-root-key-sub :communities/permissions-check :communities/permissions-check)
(reg-root-key-sub :communities/channel-permissions-check :communities/channel-permissions-check)
;;activity center
(reg-root-key-sub :activity-center :activity-center)

6
status-go-version.json
View File

@ -3,7 +3,7 @@
"_comment": "Instead use: scripts/update-status-go.sh <rev>",
"owner": "status-im",
"repo": "status-go",
"version": "chore/debug-token-permissions",
"commit-sha1": "b7b7660a534a01099e55ee0e4253f6a9531c7f02",
"src-sha256": "0nrmm3j9z6iwlr32mggd3xl63226drvvhrlrhrkgxcpgrgpixcfj"
"version": "v0.174.5",
"commit-sha1": "1ea2bd99d4c11f591df554c089aa9283b9742c59",
"src-sha256": "0b9411581gmxrrrbgbjk34db8xgz5qlhvrhp9hngggar1b7vmp1w"
}