[Fix #3485] Increase tap zones for rows with checkboxes

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

src/status_im/ui/components/contact/contact.cljs

@@ -7,6 +7,7 @@
             [status-im.ui.components.checkbox.view :as checkbox]
             [status-im.ui.components.contact.styles :as styles]
             [status-im.ui.components.list-selection :as list-selection]
+            [status-im.ui.components.list.views :as list]
             [status-im.utils.gfycat.core :as gfycat]))
 
 (defn- contact-inner-view
@@ -42,7 +43,9 @@
 
 (views/defview toogle-contact-view [{:keys [whisper-identity] :as contact} selected-key on-toggle-handler]
   (views/letsubs [checked [selected-key whisper-identity]]
-    [react/view styles/contact-container
-     [contact-inner-view {:contact contact}]
-     [checkbox/checkbox {:checked?         checked
-                         :on-value-change  #(on-toggle-handler checked whisper-identity)}]]))
+    [list/list-item-with-checkbox
+     {:checked?        checked
+      :on-value-change #(on-toggle-handler checked whisper-identity)
+      :plain-checkbox? true}
+     [react/view styles/contact-container
+      [contact-inner-view {:contact contact}]]]))

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

@@ -82,6 +82,12 @@
   [react/view {:style (merge style styles/item-checkbox)}
    [checkbox/checkbox props]])
 
+(defn list-item-with-checkbox [{:keys [on-value-change checked? plain-checkbox?] :as props} item]
+  (let [handler  #(on-value-change (not checked?))
+        checkbox [(if plain-checkbox? checkbox/checkbox item-checkbox) props]
+        item     (conj item checkbox)]
+    [touchable-item handler item]))
+
 (def item-icon-forward
   [item-icon {:icon      :icons/forward
               :icon-opts {:color colors/white-light-transparent}}])

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

@@ -12,13 +12,14 @@
             [status-im.utils.ethereum.tokens :as tokens]))
 
 (defn- render-token [{:keys [symbol name icon]} visible-tokens]
-  [list/item
-   [list/item-image icon]
-   [list/item-content
-    [list/item-primary name]
-    [list/item-secondary symbol]]
-   [list/item-checkbox {:checked?        (contains? visible-tokens (keyword symbol))
-                        :on-value-change #(re-frame/dispatch [:wallet.settings/toggle-visible-token (keyword symbol) %])}]])
+  [list/list-item-with-checkbox
+   {:checked?        (contains? visible-tokens (keyword symbol))
+    :on-value-change #(re-frame/dispatch [:wallet.settings/toggle-visible-token (keyword symbol) %])}
+   [list/item
+    [list/item-image icon]
+    [list/item-content
+     [list/item-primary name]
+     [list/item-secondary symbol]]]])
 
 (defview manage-assets []
   (letsubs [network        [:network]

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

@@ -122,10 +122,12 @@
 ;; Filter history
 
 (defn- item-filter [{:keys [icon checked? path]} content]
-  [list/item
-   [list/item-icon icon]
-   content
-   [list/item-checkbox {:checked? checked? :on-value-change #(re-frame/dispatch [:wallet.transactions/filter path %])}]])
+  [list/list-item-with-checkbox
+   {:checked?        checked?
+    :on-value-change #(re-frame/dispatch [:wallet.transactions/filter path %])}
+   [list/item
+    [list/item-icon icon]
+    content]])
 
 (defn- render-item-filter [{:keys [id label checked?]}]
   [item-filter {:icon (transaction-type->icon id) :checked? checked? :path {:type id}}