reverted network details

Signed-off-by: Julien Eluard <julien.eluard@gmail.com>

src/status_im/ui/screens/network_settings/network_details/views.cljs

@@ -0,0 +1,36 @@
+(ns status-im.ui.screens.network-settings.network-details.views
+  (:require-macros [status-im.utils.views :as views])
+  (:require
+    [re-frame.core :as rf]
+    [status-im.ui.components.status-bar.view :as status-bar]
+    [status-im.ui.components.toolbar.view :as toolbar]
+    [status-im.ui.components.react :as react]
+    [status-im.i18n :as i18n]
+    [status-im.ui.screens.network-settings.styles :as st]
+    [status-im.ui.screens.network-settings.views :as network-settings]))
+
+(views/defview network-details []
+  (views/letsubs [{:keys [networks/selected-network]} [:get-screen-params]
+                  {:keys [network]} [:get-current-account]]
+    (let [{:keys [id name config]} selected-network
+          connected?               (= id network)]
+      [react/view {:flex 1}
+       [status-bar/status-bar]
+       [toolbar/simple-toolbar]
+       [network-settings/network-badge
+        {:name       name
+         :connected? connected?}]
+       (when-not connected?
+         [react/touchable-highlight {:on-press #(rf/dispatch [:connect-network id])}
+          [react/view st/connect-button-container
+           [react/view {:style               st/connect-button
+                        :accessibility-label :network-connect-button}
+            [react/text {:style      st/connect-button-label
+                         :uppercase? true}
+             (i18n/label :t/connect)]]
+           [react/text {:style st/connect-button-description}
+            (i18n/label :t/connecting-requires-login)]]])
+       [react/view st/network-config-container
+        [react/text {:style               st/network-config-text
+                     :accessibility-label :network-details-text}
+         config]]])))

src/status_im/ui/screens/network_settings/views.cljs

@@ -15,6 +15,16 @@
   [react/view (styles/network-icon connected? size)
    [vector-icons/icon :icons/network {:color (if connected? :white :gray)}]])
 
+(defn network-badge [& [{:keys [name connected?]}]]
+  [react/view styles/network-badge
+   [network-icon connected? 56]
+   [react/view {:padding-left 16}
+    [react/text {:style styles/badge-name-text}
+     (or name (i18n/label :t/new-network))]
+    (when connected?
+      [react/text {:style styles/badge-connected-text}
+       (i18n/label :t/connected)])]])
+
 (defn actions-view []
   [react/view action-button-styles/actions-list])
 

src/status_im/ui/screens/views.cljs

@@ -39,6 +39,7 @@
             [status-im.ui.screens.wallet.send.transaction-sent.views :refer [transaction-sent transaction-sent-modal]]
             [status-im.ui.screens.wallet.components.views :refer [contact-code recent-recipients recipient-qr-code]]
             [status-im.ui.screens.network-settings.views :refer [network-settings]]
+            [status-im.ui.screens.network-settings.network-details.views :refer [network-details]]
             [status-im.ui.screens.offline-messaging-settings.views :refer [offline-messaging-settings]]
             [status-im.ui.screens.browser.views :refer [browser]]
             [status-im.ui.screens.add-new.open-dapp.views :refer [open-dapp dapp-description]]
@@ -150,6 +151,7 @@
                         :login login
                         :recover recover
                         :network-settings network-settings
+                        :network-details network-details
                         :offline-messaging-settings offline-messaging-settings
                         :recent-recipients recent-recipients
                         :recipient-qr-code recipient-qr-code