Merge branch 'develop' into jc/hide-graph

.env

@@ -36,3 +36,4 @@ TEST_STATEOFUS=1
 FAST_CREATE_COMMUNITY_ENABLED=1
 TEST_NETWORKS_ENABLED=1
 SHOW_NOT_IMPLEMENTED_FEATURES=0
+ENABLE_ALERT_BANNER=0

.env.e2e

@@ -37,3 +37,4 @@ TEST_NETWORKS_ENABLED=1
 SHOW_NOT_IMPLEMENTED_FEATURES=1
 DELETE_MESSAGE_FOR_ME_UNDO_TIME_LIMIT=10000
 DELETE_MESSAGE_UNDO_TIME_LIMIT=10000
+ENABLE_ALERT_BANNER=0

.env.jenkins

@@ -37,3 +37,4 @@ LOCAL_PAIRING_ENABLED=1
 FAST_CREATE_COMMUNITY_ENABLED=1
 TEST_NETWORKS_ENABLED=1
 SHOW_NOT_IMPLEMENTED_FEATURES=1
+ENABLE_ALERT_BANNER=1

.env.nightly

@@ -23,3 +23,4 @@ DATABASE_MANAGEMENT_ENABLED=1
 DELETE_MESSAGE_ENABLED=1
 FAST_CREATE_COMMUNITY_ENABLED=0
 TEST_NETWORKS_ENABLED=0
+ENABLE_ALERT_BANNER=1

src/legacy/status_im/events.cljs

@@ -185,7 +185,8 @@
               (= :chat view-id)
               {:effects.async-storage/set {:chat-id (get-in cofx [:db :current-chat-id])
                                            :key-uid (get-in cofx [:db :profile/profile :key-uid])}
-               :db                        (assoc db :screens/was-focused-once? true)}
+               :db                        (assoc db :screens/was-focused-once? true)
+               :dispatch                  [:alert-banners/unhide]}
 
               (not (get db :screens/was-focused-once?))
               {:db (assoc db :screens/was-focused-once? true)})))

src/legacy/status_im/ui/components/react.cljs

@@ -223,25 +223,28 @@
 
 (defn show-image-picker
   ([images-fn]
-   (show-image-picker images-fn nil))
+   (show-image-picker images-fn nil nil))
   ([images-fn
     {:keys [media-type]
      :or   {media-type "any"}
-     :as   props}]
+     :as   props}
+    finally-callback]
    (-> ^js image-picker
        (.openPicker (clj->js (merge {:mediaType media-type}
                                     props)))
        (.then images-fn)
-       (.catch show-access-error))))
+       (.catch show-access-error)
+       (.finally finally-callback))))
 
 (defn show-image-picker-camera
   ([images-fn]
-   (show-image-picker-camera images-fn nil))
-  ([images-fn props]
+   (show-image-picker-camera images-fn nil nil))
+  ([images-fn props finally-callback]
    (-> ^js image-picker
        (.openCamera (clj->js props))
        (.then images-fn)
-       (.catch show-access-error))))
+       (.catch show-access-error)
+       (.finally finally-callback))))
 
 ;; Clipboard
 

src/legacy/status_im/ui/screens/profile/user/edit_picture.cljs

@@ -3,9 +3,11 @@
     [legacy.status-im.ui.components.list.item :as list.item]
     [legacy.status-im.ui.components.react :as react]
     [re-frame.core :as re-frame]
+    [react-native.platform :as platform]
     [status-im.config :as config]
     [status-im.contexts.profile.settings.events]
-    [utils.i18n :as i18n]))
+    [utils.i18n :as i18n]
+    [utils.re-frame :as rf]))
 
 (def crop-size 1000)
 (def crop-opts
@@ -17,16 +19,22 @@
 (defn pick-pic
   []
   (re-frame/dispatch [:bottom-sheet/hide-old])
+  (when platform/ios?
+    (rf/dispatch [:alert-banners/hide]))
   (react/show-image-picker
    #(re-frame/dispatch [:profile.settings/save-profile-picture (.-path ^js %) 0 0 crop-size crop-size])
-   crop-opts))
+   crop-opts
+   #(rf/dispatch [:alert-banners/unhide])))
 
 (defn take-pic
   []
   (re-frame/dispatch [:bottom-sheet/hide-old])
+  (when platform/ios?
+    (rf/dispatch [:alert-banners/hide]))
   (react/show-image-picker-camera
    #(re-frame/dispatch [:profile.settings/save-profile-picture (.-path ^js %) 0 0 crop-size crop-size])
-   crop-opts))
+   crop-opts
+   #(rf/dispatch [:alert-banners/unhide])))
 
 (defn bottom-sheet
   [has-picture]

src/quo/components/wallet/network_link/schema.cljs

@@ -1,6 +1,6 @@
 (ns quo.components.wallet.network-link.schema)
 
-(def ^:private ?networks [:enum :optimism :arbitrum :ethereum])
+(def ^:private ?networks [:enum :optimism :arbitrum :ethereum :mainnet])
 
 (def ?schema
   [:=>

src/react_native/image_crop_picker.cljs

@@ -7,21 +7,24 @@
 
 (defn show-image-picker
   ([callback]
-   (show-image-picker callback nil))
+   (show-image-picker callback nil nil))
   ([callback
     {:keys [media-type]
      :or   {media-type "any"}
-     :as   props}]
+     :as   props}
+    finally-callback]
    (-> ^js image-picker
        (.openPicker (clj->js (merge {:mediaType media-type} props)))
        (.then #(callback (.-path ^js %)))
-       (.catch show-access-error))))
+       (.catch show-access-error)
+       (.finally finally-callback))))
 
 (defn show-image-picker-camera
   ([callback]
-   (show-image-picker-camera callback nil))
-  ([callback props]
+   (show-image-picker-camera callback nil nil))
+  ([callback props finally-callback]
    (-> ^js image-picker
        (.openCamera (clj->js props))
        (.then #(callback (.-path ^js %)))
-       (.catch show-access-error))))
+       (.catch show-access-error)
+       (.finally finally-callback))))

src/status_im/common/alert_banner/events.cljs

@@ -22,6 +22,18 @@
   {:db                (dissoc db :alert-banners)
    :hide-alert-banner [(:view-id db) (:theme db)]})
 
+;; Hide/Unhide will only toggle the visibility of alert banners without removing them.
+;; Required for ios image picker, which doesn't allow top margin
+(defn hide-alert-banners
+  [{:keys [db]}]
+  {:db (assoc db :alert-banners/hide? true)})
+
+(defn unhide-alert-banners
+  [{:keys [db]}]
+  {:db (dissoc db :alert-banners/hide?)})
+
 (re-frame/reg-event-fx :alert-banners/add add-alert-banner)
 (re-frame/reg-event-fx :alert-banners/remove remove-alert-banner)
 (re-frame/reg-event-fx :alert-banners/remove-all remove-all-alert-banners)
+(re-frame/reg-event-fx :alert-banners/hide hide-alert-banners)
+(re-frame/reg-event-fx :alert-banners/unhide unhide-alert-banners)

src/status_im/common/alert_banner/view.cljs

@@ -39,32 +39,34 @@
 (defn view
   []
   (let [banners       (rf/sub [:alert-banners])
+        hide-banners? (rf/sub [:alert-banners/hide?])
         theme         (quo.theme/use-theme)
         banners-count (count banners)
         alert-banner  (:alert banners)
         error-banner  (:error banners)
         safe-area-top (safe-area/get-top)
         colors-map    (get-colors-map theme)]
-    [hole-view/hole-view
-     ;; required for fix flicker issue https://github.com/status-im/status-mobile/issues/19490
-     {:style {:padding-bottom 1}
-      :holes [{:x            0
-               :y            (+ safe-area-top (* constants/alert-banner-height banners-count))
-               :width        (:width (rn/get-window))
-               :height       constants/alert-banner-height
-               :borderRadius style/border-radius}]}
-     [rn/view {:style {:background-color colors/neutral-100}}
-      [rn/view
-       {:style {:height           safe-area-top
-                :background-color (get-in colors-map
-                                          [(if error-banner :error :alert) :background-color])}}]
-      (when error-banner
-        [banner
-         (assoc error-banner
-                :colors-map     colors-map
-                :second-banner? false)])
-      (when alert-banner
-        [banner
-         (assoc alert-banner
-                :colors-map     colors-map
-                :second-banner? (= 2 banners-count))])]]))
+    (when-not hide-banners?
+      [hole-view/hole-view
+       ;; required for fix flicker issue https://github.com/status-im/status-mobile/issues/19490
+       {:style {:padding-bottom 0.5}
+        :holes [{:x            0
+                 :y            (+ safe-area-top (* constants/alert-banner-height banners-count))
+                 :width        (:width (rn/get-window))
+                 :height       constants/alert-banner-height
+                 :borderRadius style/border-radius}]}
+       [rn/view {:style {:background-color colors/neutral-100}}
+        [rn/view
+         {:style {:height           safe-area-top
+                  :background-color (get-in colors-map
+                                            [(if error-banner :error :alert) :background-color])}}]
+        (when error-banner
+          [banner
+           (assoc error-banner
+                  :colors-map     colors-map
+                  :second-banner? false)])
+        (when alert-banner
+          [banner
+           (assoc alert-banner
+                  :colors-map     colors-map
+                  :second-banner? (= 2 banners-count))])]])))

src/status_im/common/floating_button_page/component_spec.cljs

@@ -3,8 +3,12 @@
             [status-im.common.floating-button-page.view :as floating-button-page]
             [test-helpers.component :as h]))
 
+
+(def sub-mocks {:alert-banners/top-margin 0})
+
 (h/describe "floating button page"
   (h/test "renders with a header and standard button"
+    (h/setup-subs sub-mocks)
     (h/render [floating-button-page/view
                {:header [quo/page-nav
                          {:type        :title-description
@@ -18,6 +22,7 @@
     (h/is-truthy (h/get-by-text "floating button page")))
 
   (h/test "renders with a header and a slide button"
+    (h/setup-subs sub-mocks)
     (h/render [floating-button-page/view
                {:header [quo/page-nav
                          {:type        :title-description

src/status_im/common/floating_button_page/view.cljs

@@ -8,7 +8,8 @@
     [react-native.safe-area :as safe-area]
     [reagent.core :as reagent]
     [status-im.common.floating-button-page.floating-container.view :as floating-container]
-    [status-im.common.floating-button-page.style :as style]))
+    [status-im.common.floating-button-page.style :as style]
+    [utils.re-frame :as rf]))
 
 (defn- show-background
   [{:keys [window-height keyboard-height footer-container-height content-scroll-y
@@ -82,14 +83,15 @@
                      set-content-y-scroll         (fn [event]
                                                     (reset! content-scroll-y
                                                       (oops/oget event "nativeEvent.contentOffset.y")))]
-    (let [keyboard-shown?  (if platform/ios? @keyboard-will-show? @keyboard-did-show?)
-          show-background? (show-background {:window-height            window-height
-                                             :footer-container-height  @footer-container-height
-                                             :keyboard-height          @keyboard-height
-                                             :content-scroll-y         @content-scroll-y
-                                             :content-container-height @content-container-height
-                                             :header-height            @header-height
-                                             :keyboard-shown?          keyboard-shown?})]
+    (let [keyboard-shown?          (if platform/ios? @keyboard-will-show? @keyboard-did-show?)
+          footer-container-padding (+ footer-container-padding (rf/sub [:alert-banners/top-margin]))
+          show-background?         (show-background {:window-height            window-height
+                                                     :footer-container-height  @footer-container-height
+                                                     :keyboard-height          @keyboard-height
+                                                     :content-scroll-y         @content-scroll-y
+                                                     :content-container-height @content-container-height
+                                                     :header-height            @header-height
+                                                     :keyboard-shown?          keyboard-shown?})]
       [:<>
        (when gradient-cover?
          [quo/gradient-cover {:customization-color customization-color}])

src/status_im/common/image_crop_picker/events.cljs

@@ -1,14 +1,25 @@
 (ns status-im.common.image-crop-picker.events
   (:require [react-native.image-crop-picker :as image-crop-picker]
+            [react-native.platform :as platform]
             [utils.re-frame :as rf]))
 
 (rf/reg-fx :effect.image-crop-picker/show
  (fn [[callback crop-opts]]
-   (image-crop-picker/show-image-picker callback crop-opts)))
+   (when platform/ios?
+     (rf/dispatch [:alert-banners/hide]))
+   (image-crop-picker/show-image-picker
+    callback
+    crop-opts
+    #(rf/dispatch [:alert-banners/unhide]))))
 
 (rf/reg-fx :effect.image-crop-picker/show-camera
  (fn [[callback crop-opts]]
-   (image-crop-picker/show-image-picker-camera callback crop-opts)))
+   (when platform/ios?
+     (rf/dispatch [:alert-banners/hide]))
+   (image-crop-picker/show-image-picker-camera
+    callback
+    crop-opts
+    #(rf/dispatch [:alert-banners/unhide]))))
 
 (rf/reg-event-fx
  :image-crop-picker/show

src/status_im/common/lightbox/view.cljs

@@ -51,9 +51,11 @@
         insets                     (safe-area/get-insets)
         window                     (rn/get-window)
         window-width               (:width window)
-        window-height              (if platform/android?
-                                     (+ (:height window) (:top insets))
-                                     (:height window))
+        alert-banners-top-margin   (rf/sub [:alert-banners/top-margin])
+        window-height              (- (if platform/android?
+                                        (+ (:height window) (:top insets))
+                                        (:height window))
+                                      alert-banners-top-margin)
         curr-orientation           (or (rf/sub [:lightbox/orientation]) orientation/portrait)
         landscape?                 (string/includes? curr-orientation orientation/landscape)
         horizontal?                (or platform/android? (not landscape?))

src/status_im/config.cljs

@@ -35,6 +35,9 @@
 (def arbitrum-sepolia-chain-explorer-link "https://sepolia.arbiscan.io/address/")
 (def goerli-chain-explorer-link "https://goerli.etherscan.io/address/")
 (def optimism-goerli-chain-explorer-link "https://goerli-optimistic.etherscan.io/address/")
+(def opensea-link "https://opensea.io")
+(def opensea-tesnet-link "https://testnets.opensea.io")
+
 (def opensea-api-key OPENSEA_API_KEY)
 (def bootnodes-settings-enabled? (enabled? (get-config :BOOTNODES_SETTINGS_ENABLED "1")))
 (def mailserver-confirmations-enabled? (enabled? (get-config :MAILSERVER_CONFIRMATIONS_ENABLED)))
@@ -133,3 +136,7 @@
 (def community-accounts-selection-enabled? true)
 (def fetch-messages-enabled? (enabled? (get-config :FETCH_MESSAGES_ENABLED "1")))
 (def test-networks-enabled? (enabled? (get-config :TEST_NETWORKS_ENABLED "0")))
+
+;; Alert banners are disabled for debug builds because alert banners overlay
+;; interfere with react-native debug tools, such as inspector and Perf monitor
+(def enable-alert-banner? (enabled? (get-config :ENABLE_ALERT_BANNER "0")))

src/status_im/constants.cljs

@@ -436,6 +436,15 @@
 (def ^:const optimism-goerli-chain-id 420)
 (def ^:const optimism-sepolia-chain-id 11155420)
 
+(def opensea-url-names
+  {:ethereum "ethereum"
+   :sepolia  "sepolia"
+   :goerli   "goerli"})
+
+(def ^:const ethereum "ethereum")
+(def ^:const sepolia "sepolia")
+(def ^:const goerli "goerli")
+
 (def ^:const mainnet-chain-ids
   #{ethereum-mainnet-chain-id arbitrum-mainnet-chain-id optimism-mainnet-chain-id})
 

src/status_im/contexts/chat/messenger/composer/actions/view.cljs

@@ -186,6 +186,8 @@
     :on-allowed  (fn []
                    (when (and platform/android? @input-ref)
                      (.blur ^js @input-ref))
+                   (when platform/ios?
+                     (rf/dispatch [:alert-banners/hide]))
                    (rf/dispatch [:chat.ui/set-input-content-height
                                  (reanimated/get-shared-value height)])
                    (rf/dispatch [:photo-selector/navigate-to-photo-selector]))

src/status_im/contexts/chat/messenger/composer/keyboard.cljs

@@ -14,8 +14,9 @@
     curr-height))
 
 (defn store-kb-height
-  [event {:keys [kb-default-height kb-height]} {:keys [window-height]}]
-  (let [height (- window-height (oops/oget event "endCoordinates.screenY"))]
+  [event {:keys [kb-default-height kb-height]}]
+  (let [height (- (:height (rn/get-window))
+                  (oops/oget event "endCoordinates.screenY"))]
     (reset! kb-height height)
     (when (zero? @kb-default-height)
       (async-storage/set-item! :kb-default-height (str height)))))
@@ -56,9 +57,10 @@
 (defn add-kb-listeners
   [{:keys [keyboard-show-listener keyboard-frame-listener keyboard-hide-listener input-ref] :as props}
    state animations dimensions]
-  (reset! keyboard-show-listener (.addListener rn/keyboard
-                                               "keyboardDidShow"
-                                               #(store-kb-height % state dimensions)))
+  (reset! keyboard-show-listener (.addListener
+                                  rn/keyboard
+                                  "keyboardDidShow"
+                                  #(store-kb-height % state)))
   (reset! keyboard-frame-listener (.addListener
                                    rn/keyboard
                                    "keyboardWillChangeFrame"