[#19183] fix: scan qr design issues (#19698)

src/status_im/common/home/top_nav/view.cljs

@@ -35,7 +35,7 @@
      {:avatar-on-press          #(rf/dispatch [:open-modal :settings])
       :scan-on-press            #(rf/dispatch [:open-modal :shell-qr-reader])
       :activity-center-on-press #(rf/dispatch [:activity-center/open])
-      :qr-code-on-press         #(rf/dispatch [:open-modal :share-shell])
+      :qr-code-on-press         #(rf/dispatch [:open-modal :screen/share-shell])
       :container-style          (merge style/top-nav-container container-style)
       :blur?                    blur?
       :jump-to?                 jump-to?

src/status_im/common/scan_qr_code/view.cljs

@@ -3,7 +3,6 @@
             [oops.core :as oops]
             [quo.core :as quo]
             [quo.foundations.colors :as colors]
-            [quo.theme :as quo.theme]
             [react-native.blur :as blur]
             [react-native.camera-kit :as camera-kit]
             [react-native.core :as rn]
@@ -31,7 +30,17 @@
       :size                32
       :accessibility-label :close-scan-qr-code
       :on-press            #(rf/dispatch [:navigate-back])}
-     :i/arrow-left]]
+     :i/close]
+    [quo/button
+     {:icon-only?          true
+      :type                :grey
+      :background          :blur
+      :size                32
+      :accessibility-label :show-qr-button
+      :on-press            (fn []
+                             (rf/dispatch [:navigate-back])
+                             (rf/dispatch [:open-modal :screen/share-shell]))}
+     :i/qr-code]]
    [quo/text
     {:size   :heading-1
      :weight :semi-bold
@@ -171,8 +180,8 @@
      {:style            style/absolute-fill
       :blur-amount      10
       :blur-type        :transparent
-      :overlay-color    colors/neutral-80-opa-80
-      :background-color colors/neutral-80-opa-80}]]])
+      :overlay-color    colors/neutral-80-opa-80-blur
+      :background-color colors/neutral-80-opa-80-blur}]]])
 
 (defn- set-listener-torch-off-on-app-inactive
   [torch-atm]
@@ -234,10 +243,9 @@
             [:<>
              [rn/view {:style style/scan-qr-code-container}]
              [qr-scan-hole-area qr-view-finder]])
-          [scan-qr-code-tab @qr-view-finder (when subtitle true)]
+          [scan-qr-code-tab @qr-view-finder true]
           [rn/view {:style style/flex-spacer}]
           (when show-camera?
-            [quo.theme/provider :light
             [quo/button
              {:icon-only?          true
               :type                :grey
@@ -246,4 +254,4 @@
               :accessibility-label :camera-flash
               :container-style     (style/camera-flash-button @qr-view-finder)
               :on-press            #(swap! torch? not)}
-              flashlight-icon]])]]))))
+             flashlight-icon])]]))))

src/status_im/contexts/profile/settings/view.cljs

@@ -61,7 +61,8 @@
         :icon-name  :i/close
         :on-press   #(rf/dispatch [:navigate-back])
         :right-side [{:icon-name :i/qr-code
-                      :on-press  #(debounce/throttle-and-dispatch [:open-modal :share-shell] 1000)}
+                      :on-press  #(debounce/throttle-and-dispatch [:open-modal :screen/share-shell]
+                                                                  1000)}
                      {:icon-name :i/share
                       :on-press  #(rf/dispatch [:open-share
                                                 {:options {:message (:universal-profile-url

src/status_im/navigation/screens.cljs

@@ -100,7 +100,7 @@
      :options   options/transparent-screen-options
      :component activity-center/view}
 
-    {:name      :share-shell
+    {:name      :screen/share-shell
      :options   options/transparent-screen-options
      :component share/view}
 

translations/en.json

@@ -2186,7 +2186,6 @@
     "link-preview-loading-message": "Generating preview",
     "to-scan-a-qr-enable-your-camera": "To scan a QR, enable your camera",
     "enable-camera": "Enable camera",
-    "ensure-qr-code-in-focus-to-scan": "Ensure that the QR code is in focus to scan",
     "i-dont-have-status-on-another-device": "I don’t have Status on another device",
     "ensure-qr-code-is-in-focus-to-scan": "Ensure that the QR code is in focus to scan",
     "ensure-both-devices-are-on-the-same-network": "Ensure both devices are on the same network",