Fix issue 2 on iOS

src/status_im/network/net_info.cljs

@@ -5,12 +5,15 @@
             [status-im.utils.fx :as fx]
             [status-im.wallet.core :as wallet]
             ["@react-native-community/netinfo" :default net-info]
-            [taoensso.timbre :as log]))
+            [taoensso.timbre :as log]
+            [reagent.core :as reagent]))
 
 (fx/defn change-network-status
-  [{:keys [db] :as cofx} is-connected?]
+  [{:keys [db] :as cofx} is-connected? reconnected?]
   (fx/merge cofx
-            {:db (assoc db :network-status (if is-connected? :online :offline))}
+            (cond-> {:db (assoc db :network-status (if is-connected? :online :offline))}
+              reconnected? (assoc :dispatch-later [{:dispatch [:wallet-connect-legacy/get-connector-session-from-db]
+                                                    :ms       1500}]))
             (when (and is-connected?
                        (or (not= (count (get-in db [:wallet :accounts]))
                                  (count (get db :multiaccount/accounts)))
@@ -26,29 +29,39 @@
 
 (fx/defn handle-network-info-change
   {:events [::network-info-changed]}
-  [{:keys [db] :as cofx} {:keys [isConnected type details] :as state}]
+  [{:keys [db] :as cofx} {:keys [isConnected type details isInternetReachable app-went-offline?] :as state}]
   (let [old-network-status  (:network-status db)
         old-network-type    (:network/type db)
         connectivity-status (if isConnected :online :offline)
-        status-changed?     (= connectivity-status old-network-status)
+        status-changed?     (not= connectivity-status old-network-status)
-        type-changed?       (= type old-network-type)]
+        type-changed?       (= type old-network-type)
+        _                   (when (and (not isConnected)
+                                       (not isInternetReachable)
+                                       (not @app-went-offline?))
+                              (swap! app-went-offline? not))
+        reconnected?        (when (and isInternetReachable
+                                       @app-went-offline?)
+                              (swap! app-went-offline? not)
+                              true)]
     (log/debug "[net-info]"
-               "old-network-status" old-network-status
+               "old-network-status"  old-network-status
-               "old-network-type" old-network-type
+               "old-network-type"    old-network-type
                "connectivity-status" connectivity-status
-               "type" type
+               "type"                type
-               "details" details)
+               "details"             details)
     (fx/merge cofx
-              (when-not status-changed?
+              (when (or status-changed? reconnected?)
-                (change-network-status isConnected))
+                (change-network-status isConnected reconnected?))
               (when-not type-changed?
                 (change-network-type old-network-type type (:is-connection-expensive details))))))
 
 (defn add-net-info-listener []
-  (when net-info
+  (let [app-went-offline?       (reagent/atom false)]
-    (.addEventListener ^js net-info
+    (when net-info
-                       #(re-frame/dispatch [::network-info-changed
+      (.addEventListener ^js net-info
-                                            (js->clj % :keywordize-keys true)]))))
+                         #(re-frame/dispatch [::network-info-changed
+                                              (-> (js->clj % :keywordize-keys true)
+                                                  (assoc :app-went-offline? app-went-offline?))])))))
 
 (re-frame/reg-fx
  ::listen-to-network-info

src/status_im/ui/screens/wallet/manage_connections/views.cljs

@@ -6,17 +6,29 @@
             [quo.core :as quo]
             [quo.design-system.colors :as colors]
             [status-im.ui.components.icons.icons :as icons]
-            [status-im.utils.utils :as utils]))
+            [status-im.utils.utils :as utils]
+            [status-im.ui.screens.wallet-connect.session-proposal.views :refer [app-management-sheet-view]]
+            [status-im.ui.components.bottom-panel.views :as bottom-panel]
+            [status-im.utils.handlers :refer [<sub]]
+            [reagent.core :as reagent]))
 
-(defn print-session-info [session]
+(defn account-selector-bottom-sheet [{:keys [session show-account-selector? idx]}]
-  (let [peer-meta (get-in session [:params 0 :peerMeta])
+  (when @show-account-selector?
-        peer-id (get-in session [:params 0 :peerId])
+    [rn/view {:style (cond-> {:height 50}
-        name (get peer-meta :name)
+                       (= idx 0) (assoc :margin-top 50))}
-        url (get peer-meta :url)
+     [bottom-panel/animated-bottom-panel
-        account (get-in session [:params 0  :accounts 0])
+      session
-        icons (get peer-meta :icons)
+      app-management-sheet-view
-        icon-uri (first (status-im.utils.utils/exclude-svg-resources icons))
+      true]]))
-        visible-accounts @(re-frame/subscribe [:visible-accounts-without-watch-only])
+
+(defn print-session-info [{:keys [session visible-accounts show-account-selector?]}]
+  (let [peer-meta        (get-in session [:params 0 :peerMeta])
+        peer-id          (get-in session [:params 0 :peerId])
+        name             (get peer-meta :name)
+        url              (get peer-meta :url)
+        account          (get-in session [:params 0 :accounts 0])
+        icons            (get peer-meta :icons)
+        icon-uri         (first (status-im.utils.utils/exclude-svg-resources icons))
         selected-account (first (filter
                                  #(= account
                                      (:address %))
@@ -25,28 +37,51 @@
     [rn/view
      [:<>
       [rn/view {:style styles/app-row}
-       [react/image {:style styles/dapp-icon :source {:uri icon-uri}}]
+       [react/image {:style  styles/dapp-icon
+                     :source {:uri icon-uri}}]
        [rn/view {:style styles/app-column}
         [quo/text {:style styles/dapp-name} name]
         [quo/text {:style styles/dapp-url} url]]
 
        [rn/view {:flex-direction :row
-                 :position :absolute
+                 :position       :absolute
-                 :right 10
+                 :right          10
-                 :align-items :center}
+                 :align-items    :center}
-        [rn/touchable-opacity {:style styles/delete-icon-container
+        [rn/touchable-opacity {:style    styles/delete-icon-container
                                :on-press #(re-frame/dispatch [:wallet-connect-legacy/disconnect session])}
 
-         [icons/icon :icons/delete {:width 20
+         [icons/icon :icons/delete {:width           20
-                                    :height 20
+                                    :height          20
                                     :container-style {:elevation 3}
-                                    :color colors/red}]]
+                                    :color           colors/red}]]
-
         (when selected-account ;; The account might not be available in theory, if deleted
-          [rn/view {:style (styles/selected-account-container (:color selected-account))}
+          [rn/touchable-opacity {:style    (styles/selected-account-container (:color selected-account))
+                                 :on-press #(swap! show-account-selector? not)}
            [rn/text {:style styles/selected-account} (:name selected-account)]])]]]]))
 
+(defn list-item [{:keys [session visible-accounts show-account-selector?]} idx]
+  [rn/view
+   [print-session-info {:session session
+                        :visible-accounts visible-accounts
+                        :show-account-selector? show-account-selector?}]
+   [account-selector-bottom-sheet {:session                session
+                                   :show-account-selector? show-account-selector?
+                                   :idx                    idx}]])
+
+(defn list-comp [sessions visible-accounts]
+  (let [items (reagent/atom (doall (map (fn [session]
+                                          (let [show-account-selector? (reagent/atom false)]
+                                            {:visible-accounts       visible-accounts
+                                             :show-account-selector? show-account-selector?
+                                             :session                session}))
+                                        @sessions)))]
+    [rn/flat-list {:flex                      1
+                   :keyboardShouldPersistTaps :always
+                   :data                      @items
+                   :render-fn                 list-item
+                   :key-fn                    str}]))
+
 (defn views []
-  (let [legacy-sessions @(re-frame/subscribe [:wallet-connect-legacy/sessions])]
+  (let [sessions (reagent/atom (<sub [:wallet-connect-legacy/sessions]))
-    [rn/view {:margin-top 10}
+        visible-accounts (<sub [:visible-accounts-without-watch-only])]
-     (doall (map print-session-info legacy-sessions))]))
+    [list-comp sessions visible-accounts]))

src/status_im/wallet_connect_legacy/core.cljs

@@ -142,31 +142,41 @@
                     (:wallet-connect-legacy/sessions db))]
     {:wc-1-clean-up-sessions connectors}))
 
-(fx/defn session-connected
+(fx/defn save-session
-  {:events [:wallet-connect-legacy/created]}
+  {:events [:wallet-connect-legacy/save-session]}
-  [{:keys [db]} session]
+  [{:keys [db]} {:keys [peer-id dapp-name dapp-url connector]}]
-  (let [connector (get db :wallet-connect-legacy/proposal-connector)
+  (let [info (.stringify js/JSON (.-session connector))]
-        session (assoc (types/js->clj session)
+    {::json-rpc/call [{:method     "wakuext_addWalletConnectSession"
-                       :wc-version constants/wallet-connect-version-1
-                       :connector connector)
-        info (.stringify js/JSON (.-session connector))
-        peer-id (get-in session [:params 0 :peerId])
-        dapp-name (get-in session [:params 0 :peerMeta :name])
-        dapp-url (get-in session [:params 0 :peerMeta :url])]
-    {:show-wallet-connect-success-sheet nil
-     :db (-> db
-             (assoc :wallet-connect/session-connected session)
-             (update :wallet-connect-legacy/sessions
-                     conj
-                     session))
-     ::json-rpc/call [{:method     "wakuext_addWalletConnectSession"
                        :params     [{:id peer-id
                                      :info info
+                                    ;;  info will be the updated value
                                      :dappName dapp-name
                                      :dappUrl dapp-url}]
                        :on-success #(log/info "wakuext_addWalletConnectSession success call back , data =>" %)
                        :on-error   #(log/error "wakuext_addWalletConnectSession error call back , data =>" %)}]}))
 
+(fx/defn session-connected
+  {:events [:wallet-connect-legacy/created]}
+  [{:keys [db] :as cofx} session]
+  (let [connector (get db :wallet-connect-legacy/proposal-connector)
+        session (assoc (types/js->clj session)
+                       :wc-version constants/wallet-connect-version-1
+                       :connector connector)
+        peer-id (get-in session [:params 0 :peerId])
+        dapp-name (get-in session [:params 0 :peerMeta :name])
+        dapp-url (get-in session [:params 0 :peerMeta :url])]
+    (fx/merge cofx
+              {:db (-> db
+                       (assoc :wallet-connect/session-connected session)
+                       (update :wallet-connect-legacy/sessions
+                               conj
+                               session))
+               :show-wallet-connect-success-sheet nil}
+              (save-session {:peer-id peer-id
+                             :dapp-name dapp-name
+                             :dapp-url dapp-url
+                             :connector connector}))))
+
 (fx/defn manage-app
   {:events [:wallet-connect-legacy/manage-app]}
   [{:keys [db]} session]
@@ -211,16 +221,20 @@
 
 (fx/defn change-session-account
   {:events [:wallet-connect-legacy/change-session-account]}
-  [{:keys [db]} session account]
+  [{:keys [db] :as cofx} session account]
-  (let [connector (:connector session)
+  (let [connector          (:connector session)
-        address (:address account)
+        address            (:address account)
-        networks (get db :networks/networks)
+        networks           (get db :networks/networks)
         current-network-id (get db :networks/current-network)
-        current-network (get networks current-network-id)
+        current-network    (get networks current-network-id)
-        chain-id (get-in current-network [:config :NetworkId])]
+        dapp-name          (get-in session [:params 0 :peerMeta :name])
-    {:hide-wallet-connect-app-management-sheet nil
+        dapp-url           (get-in session [:params 0 :peerMeta :url])
-     :wc-1-update-session [connector chain-id address]
+        peer-id            (get-in session [:params 0 :peerId])
-     :db (assoc db :wallet-connect/showing-app-management-sheet? false)}))
+        chain-id           (get-in current-network [:config :NetworkId])]
+    (fx/merge cofx
+              {:hide-wallet-connect-app-management-sheet nil
+               :wc-1-update-session                      [connector chain-id address]
+               :db                                       (assoc db :wallet-connect/showing-app-management-sheet? false)})))
 
 (fx/defn disconnect-by-peer-id
   {:events [:wallet-connect-legacy/disconnect-by-peer-id]}
@@ -268,10 +282,18 @@
   (let [sessions (get db :wallet-connect-legacy/sessions)
         accounts-new (:accounts (first (:params payload)))
         session (first (filter #(= (:connector %) connector) sessions))
-        updated-session (assoc-in session [:params 0 :accounts] accounts-new)]
+        updated-session (assoc-in session [:params 0 :accounts] accounts-new)
-    {:db (-> db
+        peer-id (get-in updated-session [:params 0 :peerId])
-             (assoc :wallet-connect-legacy/sessions (conj (filter #(not= (:connector %) connector) sessions) updated-session))
+        dapp-name (get-in updated-session [:params 0 :peerMeta :name])
-             (dissoc :wallet-connect/session-managed))}))
+        dapp-url (get-in updated-session [:params 0 :peerMeta :url])]
+    (fx/merge cofx
+              {:db (-> db
+                       (assoc :wallet-connect-legacy/sessions (conj (filter #(not= (:connector %) connector) sessions) updated-session))
+                       (dissoc :wallet-connect/session-managed))
+               :dispatch [:wallet-connect-legacy/save-session {:peer-id   peer-id
+                                                               :dapp-url  dapp-url
+                                                               :dapp-name dapp-name
+                                                               :connector connector}]})))
 
 (fx/defn wallet-connect-legacy-complete-transaction
   {:events [:wallet-connect-legacy.dapp/transaction-on-result]}
@@ -338,7 +360,8 @@
 (fx/defn sync-app-db-with-wc-sessions
   {:events [:sync-wallet-connect-app-sessions]}
   [{:keys [db]} session-data]
-  (let [chain-id (get-in db [:networks/networks (:networks/current-network db) :config :NetworkId])
+  (let [_        (log/debug "sync-app-db-with-wc-sessions")
+        chain-id (get-in db [:networks/networks (:networks/current-network db) :config :NetworkId])
         sessions (->> session-data
                       (map :info)
                       (map js/JSON.parse)
@@ -347,7 +370,7 @@
       {:initialize-wc-sessions [chain-id sessions]})))
 
 (fx/defn get-connector-session-from-db
-  {:events [:get-connector-session-from-db]}
+  {:events [:wallet-connect-legacy/get-connector-session-from-db]}
   [_]
   {::json-rpc/call [{:method     "wakuext_getWalletConnectSession"
                      :on-success #(re-frame/dispatch [:sync-wallet-connect-app-sessions %])