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:
parent
37be08d2d7
commit
4e3ce54ac4
|
@ -10,16 +10,16 @@
|
||||||
{:db (-> db
|
{:db (-> db
|
||||||
(assoc-in [:community-channels-permissions community-id]
|
(assoc-in [:community-channels-permissions community-id]
|
||||||
(data-store/rpc->channel-permissions (:channels response)))
|
(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
|
(rf/reg-event-fx :communities/check-all-community-channels-permissions-failed
|
||||||
(fn [{:keys [db]} [community-id]]
|
(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
|
(rf/reg-event-fx :communities/check-all-community-channels-permissions
|
||||||
(fn [{:keys [db]} [community-id]]
|
(fn [{:keys [db]} [community-id]]
|
||||||
(when (get-in db [:communities 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
|
:fx [[:json-rpc/call
|
||||||
[{:method "wakuext_checkAllCommunityChannelsPermissions"
|
[{:method "wakuext_checkAllCommunityChannelsPermissions"
|
||||||
:params [{:CommunityID community-id}]
|
:params [{:CommunityID community-id}]
|
||||||
|
@ -38,21 +38,19 @@
|
||||||
(let [token-permissions-check (cond-> result
|
(let [token-permissions-check (cond-> result
|
||||||
based-on-client-selection? (assoc :based-on-client-selection? true))]
|
based-on-client-selection? (assoc :based-on-client-selection? true))]
|
||||||
{:db (-> db
|
{:db (-> db
|
||||||
(assoc-in [:communities community-id :checking-permissions?] false)
|
(assoc-in [:communities/permissions-check community-id]
|
||||||
(assoc-in [:communities community-id :token-permissions-check]
|
{:checking? false
|
||||||
token-permissions-check))})))
|
:check token-permissions-check}))})))
|
||||||
|
|
||||||
(rf/reg-event-fx :communities/check-permissions-to-join-community-failed
|
(rf/reg-event-fx :communities/check-permissions-to-join-community-failed
|
||||||
(fn [{:keys [db]} [community-id]]
|
(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
|
(rf/reg-event-fx :communities/check-permissions-to-join-community
|
||||||
(fn [{:keys [db]} [community-id addresses based-on-client-selection?]]
|
(fn [{:keys [db]} [community-id addresses based-on-client-selection?]]
|
||||||
(when-let [community (get-in db [:communities community-id])]
|
(when-let [community (get-in db [:communities community-id])]
|
||||||
(when-not (:checking-permissions? community)
|
(when-not (:checking-permissions? community)
|
||||||
{:db (-> db
|
{:db (assoc-in db [:communities/permissions-check community-id :checking?] true)
|
||||||
(assoc-in [:communities community-id :checking-permissions?] true)
|
|
||||||
(assoc-in [:communities community-id :can-request-access?] false))
|
|
||||||
:json-rpc/call [{:method "wakuext_checkPermissionsToJoinCommunity"
|
:json-rpc/call [{:method "wakuext_checkPermissionsToJoinCommunity"
|
||||||
:params [(cond-> {:communityId community-id}
|
:params [(cond-> {:communityId community-id}
|
||||||
addresses
|
addresses
|
||||||
|
|
|
@ -112,7 +112,7 @@
|
||||||
|
|
||||||
(defn- network-not-supported
|
(defn- network-not-supported
|
||||||
[]
|
[]
|
||||||
[quo/text (i18n/label :network-not-supported)])
|
[quo/text (i18n/label :t/network-not-supported)])
|
||||||
|
|
||||||
(defn- request-access-button
|
(defn- request-access-button
|
||||||
[id color]
|
[id color]
|
||||||
|
@ -253,14 +253,16 @@
|
||||||
:description-accessibility-label :community-description}])
|
:description-accessibility-label :community-description}])
|
||||||
|
|
||||||
(defn- community-content
|
(defn- community-content
|
||||||
[{:keys [id]}]
|
[id]
|
||||||
(rf/dispatch [:communities/check-all-community-channels-permissions id])
|
(rf/dispatch [:communities/check-all-community-channels-permissions id])
|
||||||
(fn [{:keys [name description joined spectated images tags color id membership-permissions?]
|
(fn [id
|
||||||
:as community}
|
|
||||||
{:keys [on-category-layout
|
{:keys [on-category-layout
|
||||||
collapsed?
|
collapsed?
|
||||||
on-first-channel-height-changed]}]
|
on-first-channel-height-changed]}]
|
||||||
(let [joined-or-spectated (or joined spectated)
|
(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])]
|
chats-by-category (rf/sub [:communities/categorized-channels id])]
|
||||||
[:<>
|
[:<>
|
||||||
[rn/view {:style style/community-content-container}
|
[rn/view {:style style/community-content-container}
|
||||||
|
@ -311,20 +313,24 @@
|
||||||
(and (>= scroll-height (+ height first-channel-height))
|
(and (>= scroll-height (+ height first-channel-height))
|
||||||
category)))))
|
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
|
;; We track the initial value of joined
|
||||||
;; as we open the page to avoid switching
|
;; as we open the page to avoid switching
|
||||||
;; from not collapsed to collapsed if the
|
;; from not collapsed to collapsed if the
|
||||||
;; user is on this page
|
;; 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])}
|
(let [cover {:uri (get-in images [:banner :uri])}
|
||||||
logo {:uri (get-in images [:thumbnail :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])))]
|
overlay-shown? (boolean (:sheets (rf/sub [:bottom-sheet])))]
|
||||||
[scroll-page/scroll-page
|
[scroll-page/scroll-page
|
||||||
{:cover-image cover
|
{:cover-image cover
|
||||||
|
@ -347,24 +353,22 @@
|
||||||
@first-channel-height
|
@first-channel-height
|
||||||
@categories-heights)}]}
|
@categories-heights)}]}
|
||||||
[community-content
|
[community-content
|
||||||
community
|
id
|
||||||
{:on-category-layout (partial add-category-height categories-heights)
|
{:on-category-layout on-category-layout
|
||||||
:collapsed? collapsed?
|
:collapsed? collapsed?
|
||||||
:on-first-channel-height-changed
|
:on-first-channel-height-changed
|
||||||
;; Here we set the height of the component and we filter out the categories, as some
|
;; Here we set the height of the component and we filter out the categories, as some
|
||||||
;; might have been removed.
|
;; might have been removed.
|
||||||
(fn [height categories]
|
on-first-channel-height-changed}]]))))
|
||||||
(swap! categories-heights select-keys categories)
|
|
||||||
(reset! first-channel-height height))}]]))))
|
|
||||||
|
|
||||||
(defn- community-card-page-view
|
(defn- community-card-page-view
|
||||||
[id]
|
[id]
|
||||||
(let [{:keys [id joined]
|
(let [{:keys [id joined name images]
|
||||||
:as community} (rf/sub [:communities/community id])]
|
:as community} (rf/sub [:communities/community id])]
|
||||||
(when community
|
(when community
|
||||||
(when joined
|
(when joined
|
||||||
(rf/dispatch [:activity-center.notifications/dismiss-community-overview id]))
|
(rf/dispatch [:activity-center.notifications/dismiss-community-overview id]))
|
||||||
[community-scroll-page community])))
|
[community-scroll-page id joined name images])))
|
||||||
|
|
||||||
(defn view
|
(defn view
|
||||||
[id]
|
[id]
|
||||||
|
|
|
@ -311,25 +311,33 @@
|
||||||
:amount (wallet.utils/remove-trailing-zeroes amount)
|
:amount (wallet.utils/remove-trailing-zeroes amount)
|
||||||
:img-src (get token-images sym)}))
|
: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
|
(re-frame/reg-sub
|
||||||
:community/token-gated-overview
|
:community/token-gated-overview
|
||||||
(fn [[_ community-id]]
|
(fn [[_ community-id]]
|
||||||
[(re-frame/subscribe [:communities/community community-id])])
|
[(re-frame/subscribe [:communities/community community-id])
|
||||||
(fn [[{:keys [token-permissions-check checking-permissions? token-images]}] _]
|
(re-frame/subscribe [:communities/checking-permissions-by-id community-id])])
|
||||||
(let [highest-role (:highestRole token-permissions-check)
|
(fn [[{:keys [token-images]}
|
||||||
networks-not-supported? (:networksNotSupported token-permissions-check)
|
{:keys [checking? check]}] _]
|
||||||
lowest-role (last (:roles token-permissions-check))
|
(let [highest-role (:highestRole check)
|
||||||
|
networks-not-supported? (:networksNotSupported check)
|
||||||
|
lowest-role (last (:roles check))
|
||||||
highest-permission-role (:type highest-role)
|
highest-permission-role (:type highest-role)
|
||||||
can-request-access? (and (boolean highest-permission-role) (not networks-not-supported?))]
|
can-request-access? (and (boolean highest-permission-role) (not networks-not-supported?))]
|
||||||
{:can-request-access? can-request-access?
|
{:can-request-access? can-request-access?
|
||||||
:highest-permission-role highest-permission-role
|
:highest-permission-role highest-permission-role
|
||||||
:networks-not-supported? networks-not-supported?
|
:networks-not-supported? networks-not-supported?
|
||||||
:no-member-permission? (and highest-permission-role
|
:no-member-permission? (and highest-permission-role
|
||||||
(not (-> token-permissions-check :highestRole :criteria)))
|
(not (-> check :highestRole :criteria)))
|
||||||
:tokens (map (fn [{:keys [tokenRequirement]}]
|
:tokens (map (fn [{:keys [tokenRequirement]}]
|
||||||
(map
|
(map
|
||||||
(partial token-requirement->token
|
(partial token-requirement->token
|
||||||
checking-permissions?
|
checking?
|
||||||
token-images)
|
token-images)
|
||||||
tokenRequirement))
|
tokenRequirement))
|
||||||
(or (:criteria highest-role)
|
(or (:criteria highest-role)
|
||||||
|
|
|
@ -383,6 +383,31 @@
|
||||||
(let
|
(let
|
||||||
[checking-permissions? true
|
[checking-permissions? true
|
||||||
token-image-eth "data:image/jpeg;base64,/9j/2w"
|
token-image-eth "data:image/jpeg;base64,/9j/2w"
|
||||||
|
checks {:checking? checking-permissions?
|
||||||
|
:check
|
||||||
|
{:satisfied true
|
||||||
|
:highestRole {:type constants/community-token-permission-become-admin
|
||||||
|
:criteria [{:tokenRequirement [{:satisfied true
|
||||||
|
:criteria {:contract_addresses
|
||||||
|
{:5 "0x0"}
|
||||||
|
:type 1
|
||||||
|
:symbol "DAI"
|
||||||
|
:amount "5.0"
|
||||||
|
:decimals 18}}]}
|
||||||
|
{:tokenRequirement [{:satisfied false
|
||||||
|
:criteria {:type 1
|
||||||
|
:symbol "ETH"
|
||||||
|
:amount "0.002"
|
||||||
|
:decimals 18}}]}]}
|
||||||
|
|
||||||
|
:permissions
|
||||||
|
{:a3dd5b6b-d93b-452c-b22a-09a8f42ec566 {:criteria [true false
|
||||||
|
true]}}
|
||||||
|
:validCombinations
|
||||||
|
[{:address "0xd722eaa60dc73e334b588d34ba66a3b27e537783"
|
||||||
|
:chainIds nil}
|
||||||
|
{:address "0x738d3146831c5871fa15872b409e8f360e341784"
|
||||||
|
:chainIds [5 420]}]}}
|
||||||
community {:id community-id
|
community {:id community-id
|
||||||
:checking-permissions? checking-permissions?
|
:checking-permissions? checking-permissions?
|
||||||
:permissions {:access 3}
|
:permissions {:access 3}
|
||||||
|
@ -411,36 +436,14 @@
|
||||||
:position 0
|
:position 0
|
||||||
:can-post? false
|
:can-post? false
|
||||||
:members {"0x04" {"roles" [1]}}}}
|
:members {"0x04" {"roles" [1]}}}}
|
||||||
:token-permissions-check
|
|
||||||
{:satisfied true
|
|
||||||
:highestRole {:type constants/community-token-permission-become-admin
|
|
||||||
:criteria [{:tokenRequirement [{:satisfied true
|
|
||||||
:criteria {:contract_addresses
|
|
||||||
{:5 "0x0"}
|
|
||||||
:type 1
|
|
||||||
:symbol "DAI"
|
|
||||||
:amount "5.0"
|
|
||||||
:decimals 18}}]}
|
|
||||||
{:tokenRequirement [{:satisfied false
|
|
||||||
:criteria {:type 1
|
|
||||||
:symbol "ETH"
|
|
||||||
:amount "0.002"
|
|
||||||
:decimals 18}}]}]}
|
|
||||||
|
|
||||||
:permissions
|
|
||||||
{:a3dd5b6b-d93b-452c-b22a-09a8f42ec566 {:criteria [true false
|
|
||||||
true]}}
|
|
||||||
:validCombinations
|
|
||||||
[{:address "0xd722eaa60dc73e334b588d34ba66a3b27e537783"
|
|
||||||
:chainIds nil}
|
|
||||||
{:address "0x738d3146831c5871fa15872b409e8f360e341784"
|
|
||||||
:chainIds [5 420]}]}
|
|
||||||
:members {"0x04" {"roles" [1]}}
|
:members {"0x04" {"roles" [1]}}
|
||||||
:can-request-access? false
|
:can-request-access? false
|
||||||
:outroMessage "bla"
|
:outroMessage "bla"
|
||||||
:verified false}]
|
:verified false}]
|
||||||
(swap! rf-db/app-db assoc-in [:communities community-id] community)
|
(swap! rf-db/app-db assoc-in [:communities community-id] community)
|
||||||
|
(swap! rf-db/app-db assoc-in [:communities/permissions-check community-id] checks)
|
||||||
(is (match? {:can-request-access? true
|
(is (match? {:can-request-access? true
|
||||||
|
:networks-not-supported? nil
|
||||||
:tokens [[{:symbol "DAI"
|
:tokens [[{:symbol "DAI"
|
||||||
:amount "5"
|
:amount "5"
|
||||||
:sufficient? true
|
:sufficient? true
|
||||||
|
|
|
@ -148,6 +148,8 @@
|
||||||
(reg-root-key-sub :communities/selected-tab :communities/selected-tab)
|
(reg-root-key-sub :communities/selected-tab :communities/selected-tab)
|
||||||
(reg-root-key-sub :contract-communities :contract-communities)
|
(reg-root-key-sub :contract-communities :contract-communities)
|
||||||
(reg-root-key-sub :communities/permissioned-balances :communities/permissioned-balances)
|
(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
|
;;activity center
|
||||||
(reg-root-key-sub :activity-center :activity-center)
|
(reg-root-key-sub :activity-center :activity-center)
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
"_comment": "Instead use: scripts/update-status-go.sh <rev>",
|
"_comment": "Instead use: scripts/update-status-go.sh <rev>",
|
||||||
"owner": "status-im",
|
"owner": "status-im",
|
||||||
"repo": "status-go",
|
"repo": "status-go",
|
||||||
"version": "chore/debug-token-permissions",
|
"version": "v0.174.5",
|
||||||
"commit-sha1": "b7b7660a534a01099e55ee0e4253f6a9531c7f02",
|
"commit-sha1": "1ea2bd99d4c11f591df554c089aa9283b9742c59",
|
||||||
"src-sha256": "0nrmm3j9z6iwlr32mggd3xl63226drvvhrlrhrkgxcpgrgpixcfj"
|
"src-sha256": "0b9411581gmxrrrbgbjk34db8xgz5qlhvrhp9hngggar1b7vmp1w"
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue