fix Incorrect name and image at Ready to import key pair screen (#22080)

src/quo/foundations/resources.cljs

@@ -4,7 +4,6 @@
   {:keycard-logo       (js/require "../resources/images/ui2/keycard-logo.png")
    :keycard-chip-light (js/require "../resources/images/ui2/keycard-chip-light.png")
    :keycard-chip-dark  (js/require "../resources/images/ui2/keycard-chip-dark.png")
-   :keycard-watermark  (js/require "../resources/images/ui2/keycard-watermark.png")
    :bored-ape          (js/require "../resources/images/mock2/bored-ape.png")})
 
 (def ui-themed

src/status_im/common/resources.cljs

@@ -18,13 +18,13 @@
    :podcasts                      (js/require "../resources/images/ui2/podcasts.png")
    :generate-keys                 (js/require "../resources/images/ui2/generate-keys.png")
    :add-key-to-keycard            (js/require "../resources/images/ui2/add-key-to-keycard.png")
+   :import-key-to-keycard         (js/require "../resources/images/ui2/import-key-to-keycard.png")
    :ethereum-address              (js/require "../resources/images/ui2/ethereum-address.png")
    :use-keycard                   (js/require "../resources/images/ui2/keycard.png")
    :use-recovery-phrase           (js/require "../resources/images/ui2/recovery-phrase.png")
    :check-your-keycard            (js/require "../resources/images/ui2/check-your-keycard.png")
    :qr-code                       (js/require "../resources/images/ui2/qr-code.png")
    :keycard-logo                  (js/require "../resources/images/ui2/keycard-logo.png")
-   :keycard-watermark             (js/require "../resources/images/ui2/keycard-watermark.png")
    :keycard-buy                   (js/require "../resources/images/ui2/keycard-buy.png")
    :keycard-migration             (js/require "../resources/images/ui2/keycard-migration.png")
    :keycard-migration-failed      (js/require "../resources/images/ui2/keycard-migration-failed.png")

src/status_im/contexts/keycard/create/events.cljs

@@ -1,5 +1,7 @@
 (ns status-im.contexts.keycard.create.events
   (:require [clojure.string :as string]
+            [status-im.common.resources :as resources]
+            [utils.i18n :as i18n]
             [utils.re-frame :as rf]
             [utils.security.core :as security]))
 
@@ -49,10 +51,13 @@
               security/safe-unmask-data
               (string/join " ")
               security/mask-data))
-    :fx [[:dispatch [:keycard/create.create-or-enter-pin]]]}))
+    :fx [[:dispatch
+          [:keycard/create.create-or-enter-pin
+           {:ready-to-add-screen-title (i18n/label :t/ready-add-keypair-keycard)
+            :ready-to-add-screen-image (resources/get-image :add-key-to-keycard)}]]]}))
 
 (rf/reg-event-fx :keycard/create.create-or-enter-pin
- (fn [{:keys [db]}]
+ (fn [{:keys [db]} [{:keys [ready-to-add-screen-title ready-to-add-screen-image]}]]
    (let [{:keys [initialized?]} (get-in db [:keycard :application-info])]
      {:fx [[:dispatch [:navigate-back]]
            (if initialized?
@@ -66,7 +71,9 @@
                {:on-complete (fn [new-pin]
                                (rf/dispatch [:navigate-back])
                                (rf/dispatch [:keycard/create.save-pin new-pin])
-                               (rf/dispatch [:open-modal :screen/keycard.create.ready-to-add]))}]])]})))
+                               (rf/dispatch [:open-modal :screen/keycard.create.ready-to-add
+                                             {:title ready-to-add-screen-title
+                                              :image ready-to-add-screen-image}]))}]])]})))
 
 (rf/reg-event-fx :keycard/create.save-pin
  (fn [{:keys [db]} [pin]]
@@ -123,4 +130,7 @@
    (if (contains? (:profile/profiles-overview db) key-uid)
      {:fx [[:dispatch [:onboarding/multiaccount-already-exists key-uid]]]}
      {:db (assoc-in db [:keycard :create :masked-phrase] masked-seed-phrase)
-      :fx [[:dispatch [:keycard/create.create-or-enter-pin]]]})))
+      :fx [[:dispatch
+            [:keycard/create.create-or-enter-pin
+             {:ready-to-add-screen-title (i18n/label :t/ready-to-import-keypair-keycard)
+              :ready-to-add-screen-image (resources/get-image :import-key-to-keycard)}]]]})))

src/status_im/contexts/keycard/create/view.cljs

@@ -48,25 +48,24 @@
 
 (defn ready-to-add
   []
-  [:<>
+  (let [{:keys [title image]} (rf/sub [:get-screen-params])]
-   [quo/page-nav
+    [:<>
-    {:icon-name  :i/close
+     [quo/page-nav
-     :on-press   events-helper/navigate-back
+      {:icon-name  :i/close
-     :right-side [{:icon-name :i/info
+       :on-press   events-helper/navigate-back
-                   :on-press  #(rf/dispatch [:show-bottom-sheet
+       :right-side [{:icon-name :i/info
-                                             {:content ready-to-add-documentation
+                     :on-press  #(rf/dispatch [:show-bottom-sheet
-                                              :theme   :dark
+                                               {:content ready-to-add-documentation
-                                              :shell?  true}])}]}]
+                                                :theme   :dark
-   [quo/page-top
+                                                :shell?  true}])}]}]
-    {:title            (i18n/label :t/ready-add-keypair-keycard)
+     [quo/page-top
-     :description      :text
+      {:title title}]
-     :description-text ""}]
+     [rn/image
-   [rn/image
+      {:resize-mode :contain
-    {:resize-mode :contain
+       :style       {:flex 1 :align-self :center :margin-vertical 37}
-     :style       {:flex 1 :align-self :center :margin-vertical 37}
+       :source      image}]
-     :source      (resources/get-image :add-key-to-keycard)}]
+     [common.view/tips]
-   [common.view/tips]
+     [quo/bottom-actions
-   [quo/bottom-actions
+      {:actions          :one-action
-    {:actions          :one-action
+       :button-one-label (i18n/label :t/scan-keycard)
-     :button-one-label (i18n/label :t/scan-keycard)
+       :button-one-props {:on-press #(rf/dispatch [:keycard/create.start])}}]]))
-     :button-one-props {:on-press #(rf/dispatch [:keycard/create.start])}}]])

translations/en.json

@@ -2134,6 +2134,7 @@
   "ready-add-keypair-keycard-documentation": "When you create a Status profile, the Status app generates cryptographic keys for your profile authentication and authorization.\n\nYour Keycard stores the cryptographic keys for your Status profile, permanently offline and isolated from the internet, and also secures your Wallet accounts.",
   "ready-keycard": "Get your Keycard ready",
   "ready-to-change-pin": "Ready to change PIN",
+  "ready-to-import-keypair-keycard": "Ready to import key pair to the Keycard",
   "ready-to-migrate-key-pair": "Ready to migrate profile key pair to the Keycard",
   "ready-to-scan": "Ready to Scan",
   "ready-to-unblock-keycard": "Ready to unblock Keycard",