feat: keypair list

Author: OmarBasem

src/quo/components/wallet/keypair/view.cljs

@@ -60,7 +60,7 @@
           :accessibility-label :options-button}]])]))
 
 (defn details-view
-  [{:keys [details stored blur? theme]}]
+  [{:keys [details stored type blur? theme]}]
   (let [{:keys [address]} details]
     [rn/view
      {:style               {:flex-direction :row
@@ -70,10 +70,11 @@
       {:size  :paragraph-2
        :style (style/subtitle blur? theme)}
       address]
-     [text/text
-      {:size  :paragraph-2
-       :style (merge (style/subtitle blur? theme) {:bottom (if platform/ios? 2 -2)})}
-      " ∙ "]
+     (when (= type :default-keypair)
+       [text/text
+        {:size  :paragraph-2
+         :style (merge (style/subtitle blur? theme) {:bottom (if platform/ios? 2 -2)})}
+        " ∙ "])
      [text/text
       {:size  :paragraph-2
        :style (style/subtitle blur? theme)}
@@ -87,8 +88,8 @@
                    (colors/theme-colors colors/neutral-50 colors/neutral-40 theme))}]])]))
 
 (defn- view-internal
-  []
-  (let [selected? (reagent/atom true)]
+  [{:keys [default-selected?]}]
+  (let [selected? (reagent/atom default-selected?)]
     (fn [{:keys [accounts action container-style] :as props}]
       [rn/pressable
        {:style    (merge (style/container (merge props {:selected? @selected?})) container-style)

src/status_im/contexts/wallet/create_account/select_keypair/view.cljs

@@ -38,13 +38,49 @@
     :state         :default
     :action        :none}])
 
-(defn view
+(defn parse-accounts
+  [given-accounts]
+  (map (fn [{:keys [colorId emoji name address]}]
+         {:account-props {:customization-color (if (not-empty colorId) (keyword colorId) :blue)
+                          :size                32
+                          :emoji               emoji
+                          :type                :default
+                          :name                name
+                          :address             address}
+          :networks      [{:network-name :ethereum :short-name "eth"}
+                          {:network-name :optimism :short-name "opt"}]
+          :state         :default
+          :action        :none})
+       given-accounts))
+
+(defn keypair
+  [item index _ {:keys [profile-picture compressed-key]}]
+  (let [main-account    (first (:accounts item))
+        color           (keyword (:colorId main-account))
+        parsed-accounts (parse-accounts (:accounts item))]
+    [quo/keypair
+     {:customization-color (if (not-empty (:colorId main-account)) color :blue)
+      :profile-picture     (when (zero? index) profile-picture)
+      :status-indicator    false
+      :type                (if (zero? index) :default-keypair :other)
+      :stored              :on-device
+      :on-options-press    #(js/alert "Options pressed")
+      :action              :selector
+      :blur?               false
+      :details             {:full-name (:name item)
+                            :address   (when (zero? index)
+                                         (utils/get-shortened-compressed-key compressed-key))}
+      :accounts            parsed-accounts
+      :default-selected?   (zero? index)
+      :container-style     {:margin-horizontal 20
+                            :margin-vertical   8}}]))
+(defn- view-internal
   []
-  (let [{:keys [public-key compressed-key
-                customization-color]} (rf/sub [:profile/profile])
-        [display-name _]              (rf/sub [:contacts/contact-two-names-by-identity public-key])
-        profile-with-image            (rf/sub [:profile/profile-with-image])
-        profile-picture               (profile.utils/photo profile-with-image)]
+  (let [{:keys [compressed-key customization-color]} (rf/sub [:profile/profile])
+        profile-with-image                           (rf/sub [:profile/profile-with-image])
+        keypairs                                     (rf/sub [:wallet/keypairs])
+        profile-picture                              (profile.utils/photo profile-with-image)]
+    (rn/use-effect #(rf/dispatch [:wallet/get-keypairs]))
     [rn/view {:style {:flex 1}}
      [quo/page-nav
       {:icon-name           :i/close
@@ -60,23 +96,18 @@
                                                   [:show-bottom-sheet {:content keypair-options}])}
        :description       :text
        :description-text  (i18n/label :t/keypairs-description)}]
-     [quo/keypair
-      {:customization-color customization-color
-       :profile-picture     profile-picture
-       :status-indicator    false
-       :type                :default-keypair
-       :stored              :on-device
-       :on-options-press    #(js/alert "Options pressed")
-       :action              :selector
-       :blur?               false
-       :details             {:full-name display-name
-                             :address   (utils/get-shortened-compressed-key compressed-key)}
-       :accounts            accounts
-       :container-style     {:margin-horizontal 20
-                             :margin-vertical   8}}]
+     [rn/flat-list
+      {:data        keypairs
+       :render-fn   keypair
+       :render-data {:profile-picture profile-picture
+                     :compressed-key  compressed-key}}]
      [quo/bottom-actions
       {:actions          :one-action
        :button-one-label (i18n/label :t/confirm-account-origin)
        :button-one-props {:disabled?           true
                           :customization-color customization-color}
        :container-style  style/bottom-action-container}]]))
+
+(defn view
+  []
+  [:f> view-internal])

src/status_im/contexts/wallet/create_account/view.cljs

@@ -55,15 +55,14 @@
         account-name                 (reagent/atom "")
         placeholder                  (i18n/label :t/default-account-placeholder
                                                  {:number (inc number-of-accounts)})
-        derivation-path              (reagent/atom (utils/get-derivation-path (inc number-of-accounts)))
+        derivation-path              (reagent/atom (utils/get-derivation-path number-of-accounts))
         {:keys [public-key address]} (rf/sub [:profile/profile])
         on-change-text               #(reset! account-name %)
         primary-name                 (first (rf/sub [:contacts/contact-two-names-by-identity
                                                      public-key]))
         {window-width :width}        (rn/get-window)]
     (fn [{:keys [theme]}]
       (let [{:keys [new-keypair]} (rf/sub [:wallet/create-account])]
-        (println "qqq" address)
         (rn/use-effect (fn [] #(rf/dispatch [:wallet/clear-new-keypair])))
         [rn/view {:style {:flex 1}}
          [quo/page-nav
@@ -132,14 +131,14 @@
                                                  (merge new-keypair
                                                         {:name         (:keypair-name new-keypair)
                                                          :key-uid      (:keyUid new-keypair)
-                                                         :type         :generated
+                                                         :type         :seed
                                                          :derived-from address})
                                                  {:accounts [{:keypair-name (:keypair-name new-keypair)
                                                               :key-uid      (:keyUid new-keypair)
                                                               :seed-phrase  (:mnemonic new-keypair)
                                                               :public-key   (:publicKey new-keypair)
                                                               :name         @account-name
-                                                              :type         :generated
+                                                              :type         :seed
                                                               :emoji        @emoji
                                                               :colorID      @account-color
                                                               :path         @derivation-path

src/status_im/contexts/wallet/events.cljs

@@ -198,20 +198,33 @@
  :wallet/derive-address-and-add-account
  (fn [_ [account-details]]
    (let [on-success (fn [derived-address-details]
-                      (println "dervied d" derived-address-details)
                       (rf/dispatch [:wallet/add-account account-details
                                     (first derived-address-details)]))]
      {:fx [[:dispatch [:wallet/create-derived-addresses account-details on-success]]]})))
 
 (rf/reg-event-fx
  :wallet/finalize-new-keypair
- (fn [_ [{:keys [sha3-pwd new-keypair] :as account-details}]]
-   (let [account-config {}]
-     {:fx [[:json-rpc/call
-            [{:method     "accounts_addKeypair"
-              :params     [sha3-pwd new-keypair]
-              :on-success #(println "success new keypair: " %)
-              :on-error   #(log/info "failed to create keypair " %)}]]]})))
+ (fn [_ [{:keys [sha3-pwd new-keypair]}]]
+   {:fx [[:json-rpc/call
+          [{:method     "accounts_addKeypair"
+            :params     [sha3-pwd new-keypair]
+            :on-success [:wallet/add-account-success (string/lower-case (:address new-keypair))]
+            :on-error   #(log/info "failed to create keypair " %)}]]]}))
+
+(rf/reg-event-fx
+ :wallet/get-keypairs
+ (fn [{:keys [db]}]
+   {:fx [[:json-rpc/call
+          [{:method     "accounts_getKeypairs"
+            :params     []
+            :on-success [:wallet/get-keypairs-success]
+            :on-error   #(log/info "failed to get keypairs " %)}]]]}))
+
+(rf/reg-event-fx
+ :wallet/get-keypairs-success
+ (fn [{:keys [db]} [keypairs]]
+   (let []
+     {:db (assoc-in db [:wallet :keypairs] keypairs)})))
 
 (rf/reg-event-fx :wallet/bridge-select-token
  (fn [{:keys [db]} [{:keys [token stack-id]}]]

src/status_im/subs/wallet/wallet.cljs

@@ -93,6 +93,11 @@
  :<- [:wallet/ui]
  :-> :watch-address-activity-state)
 
+(rf/reg-sub
+ :wallet/keypairs
+ :<- [:wallet]
+ :-> :keypairs)
+
 (rf/reg-sub
  :wallet/accounts
  :<- [:wallet]