chore(wallet): add missing keypair to wallet home cards (#20455)

src/status_im/contexts/settings/wallet/keypairs_and_accounts/missing_keypairs/import_private_key/view.cljs

@@ -21,9 +21,9 @@
 
 (defn view
   []
-  (let [blur?                         true
+  (let [keypair                       (rf/sub [:get-screen-params])
+        blur?                         true
         insets                        (safe-area/get-insets)
-        keypair                       (rf/sub [:get-screen-params])
         customization-color           (rf/sub [:profile/customization-color])
         [private-key set-private-key] (rn/use-state "")
         [flow-state set-flow-state]   (rn/use-state nil)

src/status_im/contexts/wallet/sheets/missing_keypair/style.cljs

@@ -0,0 +1,6 @@
+(ns status-im.contexts.wallet.sheets.missing-keypair.style)
+
+(def description-container
+  {:padding-horizontal 20
+   :padding-top        4
+   :padding-bottom     12})

src/status_im/contexts/wallet/sheets/missing_keypair/view.cljs

@@ -0,0 +1,41 @@
+(ns status-im.contexts.wallet.sheets.missing-keypair.view
+  (:require
+    [quo.core :as quo]
+    [react-native.core :as rn]
+    [status-im.contexts.wallet.sheets.missing-keypair.style :as style]
+    [utils.i18n :as i18n]
+    [utils.re-frame :as rf]))
+
+(defn view
+  [{:keys [name emoji color type] :as _account} keypair]
+  (let [customization-color (rf/sub [:profile/customization-color])]
+    [:<>
+     [quo/drawer-top
+      {:title               (i18n/label :t/import-keypair-to-use-account)
+       :type                :context-tag
+       :context-tag-type    :account
+       :account-name        name
+       :emoji               emoji
+       :customization-color color}]
+     [rn/view {:style style/description-container}
+      [quo/text {:weight :medium}
+       (i18n/label :t/import-keypair-steps
+                   {:account-name name
+                    :keypair-name (:name keypair)})]]
+     [quo/bottom-actions
+      {:actions          :two-actions
+       :button-one-label (i18n/label :t/import-key-pair)
+       :button-one-props {:on-press
+                          (fn []
+                            (case type
+                              :seed
+                              (rf/dispatch [:navigate-to
+                                            :screen/settings.missing-keypair.import-seed-phrase keypair])
+                              :key
+                              (rf/dispatch [:navigate-to
+                                            :screen/settings.missing-keypair-import-private-key keypair])
+                              nil))
+                          :customization-color customization-color}
+       :button-two-label (i18n/label :t/not-now)
+       :button-two-props {:on-press #(rf/dispatch [:hide-bottom-sheet])
+                          :type     :grey}}]]))

src/status_im/subs/wallet/wallet.cljs

@@ -5,6 +5,7 @@
             [status-im.contexts.wallet.common.utils :as utils]
             [status-im.contexts.wallet.common.utils.networks :as network-utils]
             [status-im.contexts.wallet.send.utils :as send-utils]
+            [status-im.contexts.wallet.sheets.missing-keypair.view :as missing-keypair]
             [status-im.subs.wallet.add-account.address-to-watch]
             [utils.number]
             [utils.security.core :as security]))
@@ -335,15 +336,31 @@
  :<- [:wallet/balances-in-selected-networks]
  :<- [:wallet/tokens-loading]
  :<- [:profile/currency-symbol]
- (fn [[accounts balances tokens-loading currency-symbol]]
-   (mapv (fn [{:keys [color address watch-only?] :as account}]
-           (assoc account
-                  :customization-color color
-                  :type                (if watch-only? :watch-only :empty)
-                  :on-press            #(rf/dispatch [:wallet/navigate-to-account address])
-                  :loading?            (or (get tokens-loading address)
-                                           (not (contains? tokens-loading address)))
-                  :balance             (utils/prettify-balance currency-symbol (get balances address))))
+ :<- [:wallet/keypairs]
+ (fn [[accounts balances tokens-loading currency-symbol keypairs]]
+   (mapv (fn [{:keys [color address watch-only? key-uid operable] :as account}]
+           (let [account-type (cond
+                                (= operable :no) :missing-keypair
+                                watch-only?      :watch-only
+                                :else            :empty)
+                 keypair      (first (filter #(= key-uid (:key-uid %)) keypairs))]
+             (assoc account
+                    :customization-color color
+                    :type                (cond
+                                           (= operable :no) :missing-keypair
+                                           watch-only?      :watch-only
+                                           :else            :empty)
+                    :on-press            (if (= account-type :missing-keypair)
+                                           (fn []
+                                             (rf/dispatch [:show-bottom-sheet
+                                                           {:content #(missing-keypair/view
+                                                                       account
+                                                                       keypair)}]))
+                                           #(rf/dispatch [:wallet/navigate-to-account address]))
+                    :loading?            (or (get tokens-loading address)
+                                             (not (contains? tokens-loading address)))
+                    :balance             (utils/prettify-balance currency-symbol
+                                                                 (get balances address)))))
          accounts)))
 
 (rf/reg-sub

translations/en.json

@@ -2709,5 +2709,8 @@
     "not-enough-assets": "Not enough assets to pay gas fees",
     "send-from-network" : "Send from {{network}}",
     "define-amount-sent-from-network" : "Define amount sent from {{network}} network",
-    "dont-auto-recalculate-network": "Don't auto recalculate {{network}}"
+    "dont-auto-recalculate-network": "Don't auto recalculate {{network}}",
+    "import-keypair-to-use-account": "Import key pair to use this account",
+    "import-keypair-steps": "{{account-name}} was derived from your {{keypair-name}} key pair, which has not yet been imported to this device. To transact using this account, you will need to import the {{keypair-name}} key pair first.",
+    "not-now": "Not now"
 }