[Fixes #6739] Introduced wallet.settings hook

Signed-off-by: Julien Eluard <julien.eluard@gmail.com>

project.clj

@@ -11,7 +11,7 @@
                  [com.taoensso/timbre "4.10.0"]
                  [hickory "0.7.1"]
                  [com.cognitect/transit-cljs "0.8.248"]
-                 [status-im/pluto "iteration-4-1"]
+                 [status-im/pluto "iteration-4-2"]
                  [mvxcvi/alphabase "1.0.0"]
                  [rasom/cljs-react-navigation "0.1.4"]]
   :plugins [[lein-cljsbuild "1.1.7"]

src/status_im/extensions/core.cljs

@@ -10,6 +10,8 @@
             [status-im.ui.components.checkbox.view :as checkbox]
             [status-im.ui.components.list.views :as list]
             [status-im.ui.components.react :as react]
+            [status-im.ui.screens.wallet.settings.views :as settings]
+            [status-im.i18n :as i18n]
             [status-im.ui.components.colors :as colors]
             [status-im.ui.screens.navigation :as navigation]
             [status-im.utils.handlers :as handlers]
@@ -150,15 +152,16 @@
    {::arithmetic m}))
 
 (defn button [{:keys [on-click]} label]
-  [button/secondary-button {:on-press #(re-frame/dispatch (on-click {}))} label])
+  [button/secondary-button (when on-click {:on-press #(re-frame/dispatch (on-click {}))}) label])
 
 (defn input [{:keys [on-change placeholder]}]
-  [react/text-input {:placeholder placeholder
+  [react/text-input (merge {:placeholder placeholder
-                     :style {:width "100%"}
+                            :style {:width "100%"}}
-                     :on-change-text #(re-frame/dispatch (on-change {:value %}))}])
+                           (when on-change
+                             {:on-change-text #(re-frame/dispatch (on-change {:value %}))}))])
 
 (defn touchable-opacity [{:keys [style on-press]} & children]
-  (into [react/touchable-opacity (merge {:on-press #(re-frame/dispatch (on-press {}))}
+  (into [react/touchable-opacity (merge (when on-press {:on-press #(re-frame/dispatch (on-press {}))})
                                         (when style {:style style}))] children))
 
 (defn image [{:keys [uri style]}]
@@ -190,7 +193,7 @@
 
 (defn view [o & children]
   (if (map? o)
-    [react/view o (map wrap-view-child children)]
+    (into [react/view o] (map wrap-view-child children))
     (into [react/view {} (wrap-view-child o)] (map wrap-view-child children))))
 
 (def capacities
@@ -286,7 +289,8 @@
                                :params?    :vector
                                :outputs?   :vector
                                :on-result  :event}}}
-   :hooks      {:commands commands/command-hook}})
+   :hooks      {:commands        commands/command-hook
+                :wallet.settings settings/hook}})
 
 (defn parse [{:keys [data]} id]
   (try

src/status_im/ui/screens/subs.cljs

@@ -13,6 +13,7 @@
             status-im.ui.screens.wallet.collectibles.subs
             status-im.ui.screens.wallet.request.subs
             status-im.ui.screens.wallet.send.subs
+            status-im.ui.screens.wallet.settings.subs
             status-im.ui.screens.wallet.transactions.subs
             status-im.ui.screens.network-settings.subs
             status-im.ui.screens.log-level-settings.subs

src/status_im/ui/screens/views.cljs

@@ -247,6 +247,10 @@
        {:screen (nav-reagent/stack-screen
                  (wrap-modal :wallet-settings-assets wallet-settings/manage-assets))}
 
+       :wallet-settings-hook
+       {:screen (nav-reagent/stack-screen
+                 (wrap-modal :wallet-settings-assets wallet-settings/settings-hook))}
+
        :wallet-transaction-fee
        {:screen (nav-reagent/stack-screen
                  (wrap-modal :wallet-transaction-fee

src/status_im/ui/screens/wallet/main/views.cljs

@@ -10,6 +10,7 @@
             [status-im.ui.screens.wallet.onboarding.views :as onboarding.views]
             [status-im.ui.screens.wallet.styles :as wallet.styles]
             [status-im.ui.screens.wallet.main.styles :as styles]
+            [status-im.ui.screens.wallet.settings.views :as settings]
             [status-im.ui.screens.wallet.utils :as wallet.utils]
             [status-im.utils.money :as money]
             [status-im.ui.components.toolbar.actions :as action]
@@ -19,19 +20,7 @@
             status-im.ui.screens.wallet.collectibles.superrare.views
             status-im.ui.screens.wallet.collectibles.kudos.views
             [status-im.ui.components.status-bar.view :as status-bar.view]
-            [status-im.ui.screens.wallet.transactions.views :as transactions.views]
+            [status-im.ui.screens.wallet.transactions.views :as transactions.views]))
-            [status-im.ui.components.colors :as colors]))
-
-(defn toolbar-view []
-  [toolbar/toolbar {:style wallet.styles/toolbar :flat? true}
-   nil
-   [toolbar/content-wrapper]
-   [toolbar/actions
-    [{:icon      :icons/options
-      :icon-opts {:color               :white
-                  :accessibility-label :options-menu-button}
-      :options   [{:label  (i18n/label :t/wallet-manage-assets)
-                   :action #(re-frame/dispatch [:navigate-to :wallet-settings-assets])}]}]]])
 
 (defn toolbar-modal [modal-history?]
   [react/view
@@ -170,7 +159,7 @@
     [react/view styles/main-section
      (if modal?
        [toolbar-modal modal-history?]
-       [toolbar-view])
+       [settings/toolbar-view])
      (if (and modal? modal-history?)
        [react/view styles/modal-history
         [transactions.views/history-list true]]

src/status_im/ui/screens/wallet/settings/subs.cljs

@@ -0,0 +1,8 @@
+(ns status-im.ui.screens.wallet.settings.subs
+  (:require [re-frame.core :as re-frame]))
+
+(re-frame/reg-sub
+ :wallet/settings
+ :<- [:wallet]
+ (fn [{:keys [settings]}]
+   (reduce-kv #(conj %1 %3) [] settings)))

src/status_im/ui/screens/wallet/settings/views.cljs

@@ -1,7 +1,9 @@
 (ns status-im.ui.screens.wallet.settings.views
   (:require-macros [status-im.utils.views :refer [defview letsubs]])
   (:require [re-frame.core :as re-frame]
+            [pluto.reader.hooks :as hooks]
             [status-im.i18n :as i18n]
+            [status-im.ui.components.colors :as colors]
             [status-im.ui.components.list.views :as list]
             [status-im.ui.components.react :as react]
             [status-im.ui.components.styles :as components.styles]
@@ -11,6 +13,19 @@
             [status-im.utils.ethereum.core :as ethereum]
             [status-im.utils.ethereum.tokens :as tokens]))
 
+(def hook
+  "Hook for extensions"
+  {:properties
+   {:label     :string
+    :view      :view
+    :on-click? :event}
+   :hook
+   (reify hooks/Hook
+     (hook-in [_ id {:keys [label view on-click]} {:keys [db]}]
+       {:db (assoc-in db [:wallet :settings id] {:label label :view view :on-click on-click})})
+     (unhook [_ id _ {:keys [db]}]
+       {:db (update-in db [:wallet :settings] dissoc id)}))})
+
 (defn- render-token [{:keys [symbol name icon]} visible-tokens]
   [list/list-item-with-checkbox
    {:checked?        (contains? visible-tokens (keyword symbol))
@@ -30,12 +45,46 @@
      [toolbar/toolbar {:style wallet.styles/toolbar}
       [toolbar/nav-text {:handler             #(do (re-frame/dispatch [:update-wallet])
                                                    (re-frame/dispatch [:navigate-back]))
-                         :style               {:color :white}
+                         :style               {:color colors/white}
                          :accessibility-label :done-button}
        (i18n/label :t/done)]
-      [toolbar/content-title {:color :white}
+      [toolbar/content-title {:color colors/white}
        (i18n/label :t/wallet-assets)]]
      [react/view {:style components.styles/flex}
       [list/flat-list {:data      (tokens/sorted-tokens-for all-tokens (ethereum/network->chain-keyword network))
                        :key-fn    (comp str :symbol)
                        :render-fn #(render-token % visible-tokens)}]]]))
+
+(defview settings-hook []
+  (letsubs [{:keys [label view]} [:get-screen-params :wallet-settings-hook]]
+    [react/view {:style {:flex 1 :background-color colors/white}}
+     [status-bar/status-bar {:type :modal-wallet}]
+     [toolbar/toolbar {:style wallet.styles/toolbar}
+      [toolbar/nav-text {:handler             #(do (re-frame/dispatch [:update-wallet])
+                                                   (re-frame/dispatch [:navigate-back]))
+                         :style               {:color colors/white}
+                         :accessibility-label :done-button}
+       (i18n/label :t/done)]
+      [toolbar/content-title {:color colors/white}
+       label]]
+     [view]]))
+
+(defn- setting->action [{:keys [label on-click] :as m}]
+  {:label  label
+   :action #(do
+              (when on-click
+                (re-frame/dispatch (on-click {})))
+              (re-frame/dispatch [:navigate-to :wallet-settings-hook m]))})
+
+(defview toolbar-view []
+  (letsubs [settings [:wallet/settings]]
+    [toolbar/toolbar {:style wallet.styles/toolbar :flat? true}
+     nil
+     [toolbar/content-wrapper]
+     [toolbar/actions
+      [{:icon      :icons/options
+        :icon-opts {:color               colors/white
+                    :accessibility-label :options-menu-button}
+        :options   (into [{:label  (i18n/label :t/wallet-manage-assets)
+                           :action #(re-frame/dispatch [:navigate-to-modal :wallet-settings-assets])}]
+                         (map setting->action settings))}]]]))