diff --git a/src/status_im2/common/scan_qr_code/style.cljs b/src/status_im2/common/scan_qr_code/style.cljs index c4eeed2327..5c66a9f1ad 100644 --- a/src/status_im2/common/scan_qr_code/style.cljs +++ b/src/status_im2/common/scan_qr_code/style.cljs @@ -38,10 +38,11 @@ :padding-horizontal screen-padding :margin-vertical 12}) -(def header-text +(defn header-text + [bottom-padding?] {:padding-horizontal screen-padding :padding-top 12 - :padding-bottom 8 + :padding-bottom (when bottom-padding? 8) :color colors/white}) (def header-sub-text @@ -53,7 +54,7 @@ :margin-top 20}) (def scan-qr-code-container - {:margin-top 19}) + {:margin-top 20}) (def qr-view-finder {:margin-horizontal screen-padding diff --git a/src/status_im2/common/scan_qr_code/view.cljs b/src/status_im2/common/scan_qr_code/view.cljs index 66658cac19..374255ec56 100644 --- a/src/status_im2/common/scan_qr_code/view.cljs +++ b/src/status_im2/common/scan_qr_code/view.cljs @@ -35,13 +35,14 @@ [quo/text {:size :heading-1 :weight :semi-bold - :style style/header-text} + :style (style/header-text (when subtitle true))} title] - [quo/text - {:size :paragraph-1 - :weight :regular - :style style/header-sub-text} - subtitle]]) + (when subtitle + [quo/text + {:size :paragraph-1 + :weight :regular + :style style/header-sub-text} + subtitle])]) (defn get-labels-and-on-press-method [] @@ -109,21 +110,22 @@ [white-border :bottom-right]]]) (defn- viewfinder - [qr-view-finder] + [qr-view-finder helper-text?] (let [layout-size (+ (:width qr-view-finder) 2)] [rn/view {:style (style/viewfinder-container qr-view-finder)} [white-square layout-size] - [quo/text - {:size :paragraph-2 - :weight :regular - :style style/viewfinder-text} - (i18n/label :t/ensure-qr-code-is-in-focus-to-scan)]])) + (when helper-text? + [quo/text + {:size :paragraph-2 + :weight :regular + :style style/viewfinder-text} + (i18n/label :t/ensure-qr-code-is-in-focus-to-scan)])])) (defn- scan-qr-code-tab - [qr-view-finder] + [qr-view-finder helper-text?] (if (and @camera-permission-granted? (boolean (not-empty qr-view-finder))) - [viewfinder qr-view-finder] + [viewfinder qr-view-finder helper-text?] [camera-permission-view])) (defn- check-qr-code-and-navigate @@ -223,7 +225,7 @@ [:<> [rn/view {:style style/scan-qr-code-container}] [qr-scan-hole-area qr-view-finder]]) - [scan-qr-code-tab @qr-view-finder] + [scan-qr-code-tab @qr-view-finder (when subtitle true)] [rn/view {:style style/flex-spacer}] (when show-camera? [quo.theme/provider {:theme :light} diff --git a/src/status_im2/contexts/add_new_contact/scan/scan_profile_qr_page.cljs b/src/status_im2/contexts/add_new_contact/scan/scan_profile_qr_page.cljs new file mode 100644 index 0000000000..f7f6973d3e --- /dev/null +++ b/src/status_im2/contexts/add_new_contact/scan/scan_profile_qr_page.cljs @@ -0,0 +1,20 @@ +(ns status-im2.contexts.add-new-contact.scan.scan-profile-qr-page + (:require [react-native.core :as rn] + [react-native.hooks :as hooks] + [status-im2.common.scan-qr-code.view :as scan-qr-code] + [utils.debounce :as debounce] + [utils.i18n :as i18n])) + +(defn- f-internal-view + [] + (let [{:keys [keyboard-shown]} (hooks/use-keyboard)] + [:<> + (when keyboard-shown + (rn/dismiss-keyboard!)) + [scan-qr-code/view + {:title (i18n/label :t/scan-qr) + :on-success-scan #(debounce/debounce-and-dispatch [:contacts/set-new-identity % %] 300)}]])) + +(defn view + [] + [:f> f-internal-view]) diff --git a/src/status_im2/contexts/add_new_contact/views.cljs b/src/status_im2/contexts/add_new_contact/views.cljs index 7c0eb9c820..052f1f2ffa 100644 --- a/src/status_im2/contexts/add_new_contact/views.cljs +++ b/src/status_im2/contexts/add_new_contact/views.cljs @@ -4,7 +4,6 @@ [react-native.clipboard :as clipboard] [react-native.core :as rn] [reagent.core :as reagent] - [status-im.qr-scanner.core :as qr-scanner] [status-im2.contexts.add-new-contact.style :as style] [utils.address :as address] [utils.debounce :as debounce] @@ -96,8 +95,7 @@ {:type :outline :icon-only? true :size 40 - :on-press #(rf/dispatch [::qr-scanner/scan-code - {:handler :contacts/qr-code-scanned}])} + :on-press #(rf/dispatch [:open-modal :scan-profile-qr-code])} :i/scan]]]) (finally (rf/dispatch [:contacts/clear-new-identity])))) diff --git a/src/status_im2/navigation/screens.cljs b/src/status_im2/navigation/screens.cljs index fa08f33540..8f3ef89336 100644 --- a/src/status_im2/navigation/screens.cljs +++ b/src/status_im2/navigation/screens.cljs @@ -2,6 +2,7 @@ (:require [status-im.ui.screens.screens :as old-screens] [status-im2.config :as config] + [status-im2.contexts.add-new-contact.scan.scan-profile-qr-page :as scan-profile-qr-page] [status-im2.contexts.add-new-contact.views :as add-new-contact] [status-im2.contexts.chat.camera.view :as camera-screen] [status-im2.contexts.chat.group-details.view :as group-details] @@ -315,7 +316,13 @@ :options (merge options/dark-screen {:modalPresentationStyle :overCurrentContext}) - :component scan-address/view}] + :component scan-address/view} + + {:name :scan-profile-qr-code + :options (merge + options/dark-screen + {:modalPresentationStyle :overCurrentContext}) + :component scan-profile-qr-page/view}] (when js/goog.DEBUG [{:name :dev-component-preview