round off width passed to rn-hole-view

Makefile

@@ -279,6 +279,8 @@ run-android: export TARGET := android
 # https://github.com/status-im/status-mobile/issues/18493
 run-android: export ORG_GRADLE_PROJECT_hermesEnabled := false
 run-android: export ORG_GRADLE_PROJECT_universalApk := false
+# enabling new architecture requires hermes to be enabled
+run-android: export ORG_GRADLE_PROJECT_newArchEnabled := false
 run-android: ##@run Build Android APK and start it on the device
 	@scripts/run-android.sh
 

android/gradle.properties

@@ -53,6 +53,7 @@ commitHash=unknown
 # your application. You should enable this flag either if you want
 # to write custom TurboModules/Fabric components OR use libraries that
 # are providing them.
+# enabling new architecture requires hermes to be enabled
 newArchEnabled=false
 
 # Use this property to enable or disable the Hermes JS engine.

nix/mobile/android/build.nix

@@ -15,6 +15,8 @@
   # Disabled for debug builds to avoid 'maximum call stack exceeded' errors.
   # https://github.com/status-im/status-mobile/issues/18493
   hermesEnabled ? lib.getEnvWithDefault "ORG_GRADLE_PROJECT_hermesEnabled" "true",
+  # enabling new architecture requires hermes to be enabled
+  newArchEnabled ? lib.getEnvWithDefault "ORG_GRADLE_PROJECT_newArchEnabled" "true",
   buildUrl ? lib.getEnvWithDefault "ORG_GRADLE_PROJECT_buildUrl" null,
   statusGoSrcOverride ? lib.getEnvWithDefault "STATUS_GO_SRC_OVERRIDE" null,
   reactMetroPort ? lib.getEnvWithDefault "RCT_METRO_PORT" 8081,
@@ -91,6 +93,8 @@ in stdenv.mkDerivation rec {
   ORG_GRADLE_PROJECT_buildUrl = buildUrl;
   ORG_GRADLE_PROJECT_hermesEnabled = hermesEnabled;
   ORG_GRADLE_PROJECT_universalApk = universalApk;
+  # enabling new architecture requires hermes to be enabled
+  ORG_GRADLE_PROJECT_newArchEnabled = newArchEnabled;
 
   # Fix for ERR_OSSL_EVP_UNSUPPORTED error.
   NODE_OPTIONS = "--openssl-legacy-provider";

react-native.config.js

@@ -1,4 +1,10 @@
 module.exports = {
+  project: {
+    android: {
+      // https://github.com/reactwg/react-native-new-architecture/discussions/135
+      unstable_reactLegacyComponentNames: ['BVLinearGradient', 'CKCameraManager', 'FastImageView'],
+    },
+  },
   dependencies: {
     'react-native-config': {
       platforms: {

src/quo/components/profile/profile_card/view.cljs

@@ -43,7 +43,8 @@
                 []
                 [{:x            20
                   :y            108
-                  :width        (- width 40)
+                  ;; https://github.com/status-im/status-mobile/pull/20950#issuecomment-2351505926
+                  :width        (- (int width) 40)
                   :height       50
                   :borderRadius 16}])}
       [rn/view

src/quo/components/tags/token_tag/view.cljs

@@ -27,7 +27,7 @@
     [rn/view {:on-layout on-layout}
      [hole-view/hole-view
       {:holes (if options
-                [{:x            (- container-width
+                [{:x            (- (int container-width)
                                    (case size
                                      :size-24 10
                                      :size-32 12

src/quo/components/wallet/approval_label/view.cljs

@@ -36,7 +36,7 @@
      {:holes     [{:x                       0
                    :y                       0
                    :height                  style/top-hole-view-height
-                   :width                   container-width
+                   :width                   (int container-width)
                    :borderBottomStartRadius 16
                    :borderBottomEndRadius   16}]
       :style     {:margin-top (- style/top-hole-view-height)}

src/quo/foundations/colors.cljs

@@ -10,29 +10,32 @@
 (defn alpha
   [value opacity]
   (when value
-    (if (string/starts-with? value "#")
-      (let [hex (string/replace value #"#" "")
-            r   (js/parseInt (subs hex 0 2) 16)
-            g   (js/parseInt (subs hex 2 4) 16)
-            b   (js/parseInt (subs hex 4 6) 16)]
-        (str "rgba(" r "," g "," b "," opacity ")"))
-      (let [rgb (string/split value #",")]
-        (str (string/join "," (butlast rgb)) "," opacity ")")))))
+    ;; https://github.com/status-im/status-mobile/pull/20950#issuecomment-2328228947
+    (let [opacity (if (zero? opacity) 0.002 opacity)]
+      (if (string/starts-with? value "#")
+        (let [hex (string/replace value #"#" "")
+              r   (js/parseInt (subs hex 0 2) 16)
+              g   (js/parseInt (subs hex 2 4) 16)
+              b   (js/parseInt (subs hex 4 6) 16)]
+          (str "rgba(" r "," g "," b "," opacity ")"))
+        (let [rgb (string/split value #",")]
+          (str (string/join "," (butlast rgb)) "," opacity ")"))))))
 
 (defn- alpha-opaque
   [value opacity]
   (when value
-    (if (string/starts-with? value "#")
-      (let [hex (string/replace value #"#" "")
-            r   (- 255 (* opacity (- 255 (js/parseInt (subs hex 0 2) 16))))
-            g   (- 255 (* opacity (- 255 (js/parseInt (subs hex 2 4) 16))))
-            b   (- 255 (* opacity (- 255 (js/parseInt (subs hex 4 6) 16))))]
-        (str "rgb(" r "," g "," b ")"))
-      (let [rgb (string/split value #",")
-            r   (- 255 (* opacity (- 255 (get rgb 0))))
-            g   (- 255 (* opacity (- 255 (get rgb 1))))
-            b   (- 255 (* opacity (- 255 (get rgb 2))))]
-        (str "rgb(" r "," g "," b ")")))))
+    (let [opacity (if (zero? opacity) 0.002 opacity)]
+      (if (string/starts-with? value "#")
+        (let [hex (string/replace value #"#" "")
+              r   (- 255 (* opacity (- 255 (js/parseInt (subs hex 0 2) 16))))
+              g   (- 255 (* opacity (- 255 (js/parseInt (subs hex 2 4) 16))))
+              b   (- 255 (* opacity (- 255 (js/parseInt (subs hex 4 6) 16))))]
+          (str "rgb(" r "," g "," b ")"))
+        (let [rgb (string/split value #",")
+              r   (- 255 (* opacity (- 255 (get rgb 0))))
+              g   (- 255 (* opacity (- 255 (get rgb 1))))
+              b   (- 255 (* opacity (- 255 (get rgb 2))))]
+          (str "rgb(" r "," g "," b ")"))))))
 
 (def theme-alpha
   (memoize

src/status_im/common/alert_banner/view.cljs

@@ -29,7 +29,7 @@
               []
               [{:x            0
                 :y            constants/alert-banner-height
-                :width        (:width (rn/get-window))
+                :width        (int (:width (rn/get-window)))
                 :height       constants/alert-banner-height
                 :borderRadius style/border-radius}])}
     [quo/text
@@ -54,7 +54,7 @@
        {:style {:padding-bottom 0.5}
         :holes [{:x            0
                  :y            (+ safe-area-top (* constants/alert-banner-height banners-count))
-                 :width        (:width (rn/get-window))
+                 :width        (int (:width (rn/get-window)))
                  :height       constants/alert-banner-height
                  :borderRadius style/border-radius}]}
        [rn/view {:style {:background-color colors/neutral-100}}