From 6f0a710b53a69e0b302837c42abd759a2f790c63 Mon Sep 17 00:00:00 2001
From: Foo Pang <foo.pang@gmail.com>
Date: Tue, 6 Mar 2018 06:39:42 +0800
Subject: [PATCH] [Fix #3369] Migrate checkboxes to native widget

Signed-off-by: Julien Eluard <julien.eluard@gmail.com>
---
 android/app/src/main/res/values/colors.xml    |  2 +-
 .../ui/components/checkbox/view.cljs          | 20 ++++++++++---------
 src/status_im/ui/components/react.cljs        |  1 +
 3 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/android/app/src/main/res/values/colors.xml b/android/app/src/main/res/values/colors.xml
index 629b151f53..44dee5a246 100644
--- a/android/app/src/main/res/values/colors.xml
+++ b/android/app/src/main/res/values/colors.xml
@@ -1,5 +1,5 @@
 <resources>
-    <color name="primary">#7099e6</color>
+    <color name="primary">#4360df</color>
     <color name="primary_dark">#5c6bc0</color>
     <color name="accent">#5c6bc0</color>
 </resources>
diff --git a/src/status_im/ui/components/checkbox/view.cljs b/src/status_im/ui/components/checkbox/view.cljs
index d41fb13cd7..3a1611179f 100644
--- a/src/status_im/ui/components/checkbox/view.cljs
+++ b/src/status_im/ui/components/checkbox/view.cljs
@@ -1,13 +1,15 @@
 (ns status-im.ui.components.checkbox.view
   (:require [status-im.ui.components.checkbox.styles :as styles]
-            [status-im.ui.components.react :as react]))
-
-;; TODO(jeluard) Migrate to native checkbox provided by RN 0.49
-;; https://facebook.github.io/react-native/docs/checkbox.html
+            [status-im.ui.components.react :as react]
+            [status-im.utils.platform :as platform]))
 
 (defn checkbox [{:keys [on-value-change checked?]}]
-  [react/touchable-highlight (merge {:style styles/wrapper}
-                                    (when on-value-change {:on-press #(on-value-change (not checked?))}))
-   [react/view (styles/icon-check-container checked?)
-    (when checked?
-      [react/icon :check_on styles/check-icon])]])
+  (if platform/android?
+    [react/view {:style styles/wrapper}
+     [react/check-box {:on-value-change on-value-change
+                       :value           checked?}]]
+    [react/touchable-highlight (merge {:style styles/wrapper}
+                                      (when on-value-change {:on-press #(on-value-change (not checked?))}))
+     [react/view (styles/icon-check-container checked?)
+      (when checked?
+        [react/icon :check_on styles/check-icon])]]))
diff --git a/src/status_im/ui/components/react.cljs b/src/status_im/ui/components/react.cljs
index 071ff55d6a..9a69e5ebbc 100644
--- a/src/status_im/ui/components/react.cljs
+++ b/src/status_im/ui/components/react.cljs
@@ -46,6 +46,7 @@
 (def text-class (get-class "Text"))
 (def text-input-class (get-class "TextInput"))
 (def image (get-class "Image"))
+(def check-box (get-class "CheckBox"))
 
 (def touchable-without-feedback (get-class "TouchableWithoutFeedback"))
 (def touchable-highlight-class (get-class "TouchableHighlight"))