[ISSUE #3633] Migrated profile lists to latest design
Signed-off-by: Julien Eluard <julien.eluard@gmail.com>
This commit is contained in:
parent
e6623516e9
commit
38c9bb7266
|
@ -11,8 +11,8 @@
|
|||
[status-im.data-store.local-storage :as local-storage]))
|
||||
|
||||
(defn command-handler!
|
||||
[_ [_
|
||||
{:keys [command] :as params}
|
||||
[_ [chat-id
|
||||
params
|
||||
{:keys [result error]}]]
|
||||
(let [{:keys [returned]} result
|
||||
{handler-error :error} returned]
|
||||
|
@ -22,10 +22,10 @@
|
|||
(dispatch [:set-chat-ui-props {:validation-messages markup}]))
|
||||
|
||||
result
|
||||
(dispatch [:chat-send-message/send-command (assoc-in params [:command :handler-data] returned)])
|
||||
(dispatch [:chat-send-message/send-command chat-id (assoc-in params [:command :handler-data] returned)])
|
||||
|
||||
(not (or error handler-error))
|
||||
(dispatch [:chat-send-message/send-command params])
|
||||
(dispatch [:chat-send-message/send-command chat-id params])
|
||||
|
||||
:else nil)))
|
||||
|
||||
|
|
|
@ -475,6 +475,7 @@
|
|||
:network "Network"
|
||||
:remove-network "Remove network"
|
||||
:network-settings "Network settings"
|
||||
:offline-messaging "Offline messages"
|
||||
:offline-messaging-settings "Offline messages settings"
|
||||
:edit-network-warning "Be careful, editing the network data may disable this network for you"
|
||||
:connecting-requires-login "Connecting to another network requires login"
|
||||
|
|
|
@ -1,18 +1,19 @@
|
|||
(ns status-im.ui.screens.network-settings.styles
|
||||
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
|
||||
(:require [status-im.ui.components.styles :as common]))
|
||||
(:require [status-im.ui.components.colors :as colors]))
|
||||
|
||||
(def networks-list
|
||||
{:background-color common/color-light-gray})
|
||||
(def wrapper
|
||||
{:flex 1
|
||||
:background-color :white})
|
||||
|
||||
(defstyle badge-name-text
|
||||
{:color common/color-black
|
||||
{:color colors/black
|
||||
:ios {:font-size 17
|
||||
:letter-spacing -0.2}
|
||||
:android {:font-size 16}})
|
||||
|
||||
(defstyle badge-connected-text
|
||||
{:color common/color-gray4
|
||||
{:color colors/gray
|
||||
:ios {:margin-top 5
|
||||
:font-size 14
|
||||
:letter-spacing -0.2}
|
||||
|
@ -32,18 +33,18 @@
|
|||
{:height 52
|
||||
:align-items :center
|
||||
:justify-content :center
|
||||
:background-color common/color-light-blue
|
||||
:background-color colors/blue
|
||||
:border-radius 8
|
||||
:ios {:opacity 0.9}})
|
||||
|
||||
(defstyle connect-button-label
|
||||
{:color common/color-white
|
||||
{:color colors/white
|
||||
:ios {:font-size 17
|
||||
:letter-spacing -0.2}
|
||||
:android {:font-size 14}})
|
||||
|
||||
(defstyle connect-button-description
|
||||
{:color common/color-gray4
|
||||
{:color colors/gray
|
||||
:ios {:margin-top 8
|
||||
:height 20
|
||||
:font-size 14
|
||||
|
@ -57,13 +58,13 @@
|
|||
:padding-top 16
|
||||
:padding-left 16
|
||||
:margin-horizontal 16
|
||||
:background-color "#eef2f5"
|
||||
:background-color colors/gray-lighter
|
||||
:ios {:border-radius 9
|
||||
:opacity 0.9}
|
||||
:android {:border-radius 4}})
|
||||
|
||||
(defstyle network-config-text
|
||||
{:color common/color-black
|
||||
{:color colors/black
|
||||
:ios {:opacity 0.8
|
||||
:font-size 17
|
||||
:line-height 24
|
||||
|
@ -82,21 +83,21 @@
|
|||
{:height 52
|
||||
:align-items :center
|
||||
:justify-content :center
|
||||
:background-color common/color-light-blue-transparent
|
||||
:background-color colors/blue
|
||||
:border-radius 8
|
||||
:ios {:width 343}
|
||||
|
||||
:android {:width 328}})
|
||||
|
||||
(defstyle edit-button-label
|
||||
{:color common/color-light-blue
|
||||
{:color colors/blue
|
||||
:ios {:font-size 17
|
||||
:letter-spacing -0.2}
|
||||
:android {:font-size 14}})
|
||||
|
||||
(defstyle edit-button-description
|
||||
{:text-align :center
|
||||
:color common/color-gray4
|
||||
:color colors/gray
|
||||
:ios {:margin-top 8
|
||||
:font-size 14
|
||||
:letter-spacing -0.2}
|
||||
|
@ -107,7 +108,7 @@
|
|||
{:width size
|
||||
:height size
|
||||
:border-radius (/ size 2)
|
||||
:background-color (if connected? "#729ae6" "#eef2f5")
|
||||
:background-color (if connected? colors/blue colors/gray-lighter)
|
||||
:align-items :center :justify-content :center})
|
||||
|
||||
(def network-badge
|
||||
|
@ -125,14 +126,14 @@
|
|||
:android {:height 56}})
|
||||
|
||||
(defstyle network-item-name-text
|
||||
{:color common/color-black
|
||||
{:color colors/black
|
||||
:ios {:font-size 17
|
||||
:letter-spacing -0.2
|
||||
:line-height 20}
|
||||
:android {:font-size 16}})
|
||||
|
||||
(defstyle network-item-connected-text
|
||||
{:color common/color-gray4
|
||||
{:color colors/gray
|
||||
:ios {:font-size 14
|
||||
:margin-top 6
|
||||
:letter-spacing -0.2}
|
||||
|
|
|
@ -1,17 +1,15 @@
|
|||
(ns status-im.ui.screens.network-settings.views
|
||||
(:require-macros [status-im.utils.views :as views])
|
||||
(:require [re-frame.core :as re-frame]
|
||||
[status-im.ui.components.action-button.styles :as action-button-styles]
|
||||
[status-im.i18n :as i18n]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.ui.components.icons.vector-icons :as vector-icons]
|
||||
[status-im.ui.components.list.views :as list]
|
||||
[status-im.ui.components.common.common :as common]
|
||||
[status-im.ui.screens.network-settings.styles :as styles]
|
||||
[status-im.ui.components.status-bar.view :as status-bar]
|
||||
[status-im.ui.components.toolbar.view :as toolbar]
|
||||
[status-im.i18n :as i18n]))
|
||||
[status-im.ui.screens.network-settings.styles :as styles]))
|
||||
|
||||
(defn network-icon [connected? size]
|
||||
(defn- network-icon [connected? size]
|
||||
[react/view (styles/network-icon connected? size)
|
||||
[vector-icons/icon :icons/network {:color (if connected? :white :gray)}]])
|
||||
|
||||
|
@ -25,9 +23,6 @@
|
|||
[react/text {:style styles/badge-connected-text}
|
||||
(i18n/label :t/connected)])]])
|
||||
|
||||
(defn actions-view []
|
||||
[react/view action-button-styles/actions-list])
|
||||
|
||||
(defn render-network [current-network]
|
||||
(fn [{:keys [id name] :as network}]
|
||||
(let [connected? (= id current-network)]
|
||||
|
@ -50,17 +45,8 @@
|
|||
[status-bar/status-bar]
|
||||
[toolbar/simple-toolbar
|
||||
(i18n/label :t/network-settings)]
|
||||
[react/view {:flex 1}
|
||||
[list/flat-list {:style styles/networks-list
|
||||
:data (vals networks)
|
||||
:key-fn :id
|
||||
:render-fn (render-network network)
|
||||
:header [react/view
|
||||
[actions-view
|
||||
[common/bottom-shadow]
|
||||
[common/form-title (i18n/label :t/existing-networks)
|
||||
{:count-value (count networks)}]
|
||||
[common/list-header]]]
|
||||
:footer [react/view
|
||||
[common/list-footer]
|
||||
[common/bottom-shadow]]}]]]))
|
||||
[react/view styles/wrapper
|
||||
[list/flat-list {:data (vals networks)
|
||||
:key-fn :id
|
||||
:default-separator? true
|
||||
:render-fn (render-network network)}]]]))
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
|
||||
(handlers/register-handler-fx
|
||||
:connect-wnode
|
||||
(fn [{:keys [db now]} [_ wnode]]
|
||||
(fn [{:keys [db]} [_ wnode]]
|
||||
{:show-confirmation {:title (i18n/label :t/close-app-title)
|
||||
:content (i18n/label :t/connect-wnode-content
|
||||
{:name (get-in db [:inbox/wnodes wnode :name])})
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
(ns status-im.ui.screens.offline-messaging-settings.styles
|
||||
(:require [status-im.ui.components.styles :as common])
|
||||
(:require [status-im.ui.components.colors :as colors])
|
||||
(:require-macros [status-im.utils.styles :refer [defstyle]]))
|
||||
|
||||
(def wnodes-list
|
||||
{:background-color common/color-light-gray})
|
||||
(def wrapper
|
||||
{:flex 1
|
||||
:background-color :white})
|
||||
|
||||
(def wnode-item-inner
|
||||
{:padding-horizontal 16})
|
||||
|
@ -17,14 +18,14 @@
|
|||
:android {:height 56}})
|
||||
|
||||
(defstyle wnode-item-name-text
|
||||
{:color common/color-black
|
||||
{:color colors/black
|
||||
:ios {:font-size 17
|
||||
:letter-spacing -0.2
|
||||
:line-height 20}
|
||||
:android {:font-size 16}})
|
||||
|
||||
(defstyle wnode-item-connected-text
|
||||
{:color common/color-gray4
|
||||
{:color colors/gray
|
||||
:ios {:font-size 14
|
||||
:margin-top 6
|
||||
:letter-spacing -0.2}
|
||||
|
@ -36,7 +37,7 @@
|
|||
:height 40
|
||||
:border-radius 20
|
||||
:background-color (if connected?
|
||||
common/color-light-blue
|
||||
common/color-light-gray)
|
||||
colors/blue
|
||||
colors/gray-light)
|
||||
:align-items :center
|
||||
:justify-content :center})
|
||||
|
|
|
@ -1,71 +1,38 @@
|
|||
(ns status-im.ui.screens.offline-messaging-settings.views
|
||||
(:require-macros [status-im.utils.views :as views])
|
||||
(:require [re-frame.core :as re-frame]
|
||||
[status-im.constants :as constants]
|
||||
[status-im.i18n :as i18n]
|
||||
[status-im.ui.components.common.common :as common]
|
||||
[status-im.ui.components.icons.vector-icons :as vector-icons]
|
||||
[status-im.ui.components.list.views :as list]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.ui.components.status-bar.view :as status-bar]
|
||||
[status-im.ui.components.toolbar.view :as toolbar]
|
||||
[status-im.ui.screens.offline-messaging-settings.styles :as styles]
|
||||
[status-im.utils.platform :as platform]
|
||||
[taoensso.timbre :as log]
|
||||
[reagent.core :as reagent])
|
||||
(:require-macros [status-im.utils.views :refer [defview letsubs]]))
|
||||
[status-im.ui.screens.offline-messaging-settings.styles :as styles]))
|
||||
|
||||
(defn- wnode-icon [connected?]
|
||||
[react/view (styles/wnode-icon connected?)
|
||||
[vector-icons/icon :icons/wnode {:color (if connected? :white :gray)}]])
|
||||
|
||||
(defn- render-row [current-wnode]
|
||||
(fn [{:keys [address name id] :as row} _ _]
|
||||
(fn [{:keys [name id]}]
|
||||
(let [connected? (= id current-wnode)]
|
||||
[react/list-item
|
||||
^{:key row}
|
||||
[react/touchable-highlight
|
||||
{:on-press #(re-frame/dispatch [:connect-wnode id])
|
||||
:accessibility-label :mailserver-item}
|
||||
[react/view styles/wnode-item
|
||||
[wnode-icon connected?]
|
||||
[react/view styles/wnode-item-inner
|
||||
[react/text {:style styles/wnode-item-name-text}
|
||||
name]
|
||||
#_
|
||||
(when connected?
|
||||
[react/text {:style styles/wnode-item-connected-text}
|
||||
(i18n/label :t/connected)])]]]])))
|
||||
[react/touchable-highlight
|
||||
{:on-press #(re-frame/dispatch [:connect-wnode id])
|
||||
:accessibility-label :mailserver-item}
|
||||
[react/view styles/wnode-item
|
||||
[wnode-icon connected?]
|
||||
[react/view styles/wnode-item-inner
|
||||
[react/text {:style styles/wnode-item-name-text}
|
||||
name]]]])))
|
||||
|
||||
(defn- form-title [label wnodes]
|
||||
(-> (common/form-title label {:count-value (count wnodes)})
|
||||
(update-in [1 2 1] dissoc :margin-top)))
|
||||
|
||||
(defn- render-header [wnodes]
|
||||
[react/list-item
|
||||
[react/view
|
||||
[form-title (i18n/label :t/existing-wnodes) wnodes]
|
||||
[common/list-header]]])
|
||||
|
||||
(defn- render-footer []
|
||||
[react/list-item [react/view
|
||||
[common/list-footer]
|
||||
[common/bottom-shadow]]])
|
||||
|
||||
(defview offline-messaging-settings []
|
||||
(letsubs [current-wnode [:get :inbox/wnode]
|
||||
wnodes [:get :inbox/wnodes]]
|
||||
(views/defview offline-messaging-settings []
|
||||
(views/letsubs [current-wnode [:get :inbox/wnode]
|
||||
wnodes [:get :inbox/wnodes]]
|
||||
[react/view {:flex 1}
|
||||
[status-bar/status-bar]
|
||||
[toolbar/simple-toolbar (i18n/label :t/offline-messaging-settings)]
|
||||
(when platform/ios?
|
||||
[common/separator])
|
||||
[react/view {:flex 1}
|
||||
;; TODO(dmitryn) migrate to :header/:footer properties of flat-list
|
||||
;; after merge of https://github.com/status-im/status-react/pull/2297/
|
||||
[render-header wnodes]
|
||||
[list/flat-list {:data (vals wnodes)
|
||||
:separator? false
|
||||
:key-fn :id
|
||||
:render-fn (render-row current-wnode)
|
||||
:ListFooterComponent (reagent/as-element (render-footer))
|
||||
:style styles/wnodes-list}]]]))
|
||||
[react/view styles/wrapper
|
||||
[list/flat-list {:data (vals wnodes)
|
||||
:default-separator? false
|
||||
:key-fn :id
|
||||
:render-fn (render-row current-wnode)}]]]))
|
||||
|
|
|
@ -149,7 +149,7 @@
|
|||
[profile.components/settings-item-separator])
|
||||
(when config/offline-inbox-enabled?
|
||||
[profile.components/settings-item
|
||||
{:label-kw :t/offline-messaging-settings
|
||||
{:label-kw :t/offline-messaging
|
||||
:action-fn #(re-frame/dispatch [:navigate-to :offline-messaging-settings])
|
||||
:accessibility-label :offline-messages-settings-button}])
|
||||
[profile.components/settings-item-separator]
|
||||
|
|
Loading…
Reference in New Issue