[#7534] Separate DApp & chat tabs in mobile navigation
This commit is contained in:
Andrey Shovkoplyas
parent
7cad165a66
commit
30ab6c159a
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
|
|
@ -33,15 +33,6 @@
|
|||
(let [dapp-permissions (into {} (map #(vector (:dapp %) %) all-dapp-permissions))]
|
||||
{:db (assoc db :dapps/permissions dapp-permissions)}))
|
||||
|
||||
(fx/defn navigate-to-browser
|
||||
[{{:keys [view-id]} :db :as cofx}]
|
||||
(if (= view-id :dapp-description)
|
||||
(navigation/navigate-reset cofx
|
||||
{:index 1
|
||||
:actions [{:routeName :home}
|
||||
{:routeName :browser}]})
|
||||
(navigation/navigate-to-cofx cofx :browser nil)))
|
||||
|
||||
(fx/defn update-browser-option
|
||||
[{:keys [db]} option-key option-value]
|
||||
{:db (assoc-in db [:browser/options option-key] option-value)})
|
||||
|
|
@ -272,7 +263,7 @@
|
|||
(fx/merge cofx
|
||||
{:db (assoc db :browser/options
|
||||
{:browser-id (:browser-id browser)})}
|
||||
(navigate-to-browser)
|
||||
(navigation/navigate-to-cofx :browser nil)
|
||||
(update-browser browser)
|
||||
(resolve-url nil)))))
|
||||
|
||||
|
|
@ -368,7 +359,7 @@
|
|||
(fx/defn open-chat-from-browser
|
||||
[cofx host]
|
||||
(let [topic (string/lower-case (apply str (map filter-letters-numbers-and-replace-dot-on-dash host)))]
|
||||
{:dispatch [:chat.ui/start-public-chat topic {:modal? true :navigation-reset? true}]}))
|
||||
{:dispatch [:chat.ui/start-public-chat topic nil]}))
|
||||
|
||||
(re-frame/reg-fx
|
||||
:browser/resolve-ens-content
|
||||
|
|
|
|||
|
|
@ -71,4 +71,5 @@
|
|||
:hold-card-animation (js/require "./resources/images/ui/hold-card-animation.png")
|
||||
:warning-sign (js/require "./resources/images/ui/warning-sign.png")
|
||||
:phone-nfc-on (js/require "./resources/images/ui/phone-nfc-on.png")
|
||||
:phone-nfc-off (js/require "./resources/images/ui/phone-nfc-off.png")})
|
||||
:phone-nfc-off (js/require "./resources/images/ui/phone-nfc-off.png")
|
||||
:dapp-store (js/require "./resources/images/ui/dapp-store.png")})
|
||||
|
|
|
|||
|
|
@ -33,11 +33,11 @@
|
|||
:icon :main-icons/message}
|
||||
:count-subscription :chats/unread-messages-number
|
||||
:accessibility-label :home-tab-button}
|
||||
#_{:nav-stack :dapp-stack
|
||||
:content {:title (i18n/label :t/dapp)
|
||||
:icon :main-icons/dapp}
|
||||
;;:count-subscription :chats/unread-messages-number
|
||||
:accessibility-label :dapp-tab-button}
|
||||
{:nav-stack :browser-stack
|
||||
:content {:title (i18n/label :t/dapp)
|
||||
:icon :main-icons/dapp}
|
||||
;;:count-subscription :chats/unread-messages-number
|
||||
:accessibility-label :dapp-tab-button}
|
||||
{:nav-stack :wallet-stack
|
||||
:content {:title (i18n/label :t/wallet)
|
||||
:icon :main-icons/wallet}
|
||||
|
|
@ -88,7 +88,7 @@
|
|||
|
||||
(defn main-tab? [view-id]
|
||||
(contains?
|
||||
#{:home :wallet :dapps :my-profile :wallet-onboarding-setup}
|
||||
#{:home :wallet :open-dapp :my-profile :wallet-onboarding-setup}
|
||||
view-id))
|
||||
|
||||
(defn minimize-bar [view-id]
|
||||
|
|
@ -176,7 +176,8 @@
|
|||
-index)
|
||||
tab (case idx
|
||||
0 :chat-stack
|
||||
1 :wallet-stack
|
||||
2 :profile-stack
|
||||
1 :browser-stack
|
||||
2 :wallet-stack
|
||||
3 :profile-stack
|
||||
:chat-stack)]
|
||||
[tabs-animation-wrapper @keyboard-shown? @view-id tab]))})))
|
||||
|
|
|
|||
|
|
@ -21,6 +21,10 @@
|
|||
(second name)
|
||||
(first name)))]]))
|
||||
|
||||
(defn default-browser-icon [name]
|
||||
(default-chat-icon name {:default-chat-icon (styles/default-chat-icon-chat-list colors/default-chat-color)
|
||||
:default-chat-icon-text styles/default-chat-icon-text}))
|
||||
|
||||
(defn dapp-badge [{:keys [online-view-wrapper online-view online-dot-left online-dot-right]}]
|
||||
[react/view online-view-wrapper
|
||||
[react/view online-view
|
||||
|
|
@ -79,52 +83,6 @@
|
|||
:default-chat-icon-text styles/default-chat-icon-text}
|
||||
hide-dapp?])
|
||||
|
||||
(defn chat-icon-view-action [chat-id group-chat name online]
|
||||
^{:key chat-id}
|
||||
[chat-icon-view chat-id group-chat name online
|
||||
{:container styles/container-chat-list
|
||||
:online-view-wrapper styles/online-view-wrapper
|
||||
:online-view styles/online-view
|
||||
:online-dot-left styles/online-dot-left
|
||||
:online-dot-right styles/online-dot-right
|
||||
:size 40
|
||||
:chat-icon styles/chat-icon-chat-list
|
||||
:default-chat-icon (styles/default-chat-icon-chat-list colors/default-chat-color)
|
||||
:default-chat-icon-text styles/default-chat-icon-text}])
|
||||
|
||||
(defn chat-icon-view-menu-item [chat-id group-chat name color online]
|
||||
^{:key chat-id}
|
||||
[chat-icon-view chat-id group-chat name online
|
||||
{:container styles/container-menu-item
|
||||
:online-view-wrapper styles/online-view-menu-wrapper
|
||||
:online-view styles/online-view-menu-item
|
||||
:online-dot-left styles/online-dot-left-menu-item
|
||||
:online-dot-right styles/online-dot-right-menu-item
|
||||
:pending-wrapper styles/pending-view-menu-wrapper
|
||||
:pending-outer-circle styles/pending-outer-circle
|
||||
:pending-inner-circle styles/pending-inner-circle
|
||||
:size 24
|
||||
:chat-icon styles/chat-icon-menu-item
|
||||
:default-chat-icon (styles/default-chat-icon-view-action color)
|
||||
:default-chat-icon-text styles/default-chat-icon-text}
|
||||
true])
|
||||
|
||||
(defn chat-icon-message-status [chat-id group-chat name color online]
|
||||
^{:key chat-id}
|
||||
[chat-icon-view chat-id group-chat name online
|
||||
{:container styles/container-message-status
|
||||
:online-view-wrapper styles/online-view-wrapper
|
||||
:online-view styles/online-view
|
||||
:online-dot-left styles/online-dot-left
|
||||
:online-dot-right styles/online-dot-right
|
||||
:pending-wrapper styles/pending-wrapper
|
||||
:pending-outer-circle styles/pending-outer-circle
|
||||
:pending-inner-circle styles/pending-inner-circle
|
||||
:size 64
|
||||
:chat-icon styles/chat-icon-message-status
|
||||
:default-chat-icon (styles/default-chat-icon-message-status color)
|
||||
:default-chat-icon-text styles/message-status-icon-text}])
|
||||
|
||||
(defn contact-icon-view [{:keys [photo-path name dapp?]} {:keys [container] :as styles}]
|
||||
(let [photo-path photo-path]
|
||||
[react/view container
|
||||
|
|
@ -150,9 +108,6 @@
|
|||
[contact-icon-view contact
|
||||
{:container {:width size :height size :top 3 :margin-left 2}
|
||||
:online-view-wrapper styles/online-view-wrapper
|
||||
:online-view styles/online-view
|
||||
:online-dot-left styles/online-dot-left
|
||||
:online-dot-right styles/online-dot-right
|
||||
:size size
|
||||
:chat-icon (styles/custom-size-icon size)
|
||||
:default-chat-icon (styles/default-chat-icon-chat-list colors/default-chat-color)
|
||||
|
|
|
|||
|
|
@ -172,13 +172,14 @@
|
|||
(def default-footer [react/view styles/list-header-footer-spacing])
|
||||
|
||||
(defn- base-list-props
|
||||
[{:keys [key-fn render-fn empty-component header separator default-separator?]}]
|
||||
[{:keys [key-fn render-fn empty-component header footer separator default-separator?]}]
|
||||
(let [separator (or separator (when (and platform/ios? default-separator?) default-separator))]
|
||||
(merge (when key-fn {:keyExtractor (wrap-key-fn key-fn)})
|
||||
(when render-fn {:renderItem (wrap-render-fn render-fn)})
|
||||
(when separator {:ItemSeparatorComponent (fn [] (reagent/as-element separator))})
|
||||
(when empty-component {:ListEmptyComponent (fn [] (reagent/as-element empty-component))})
|
||||
(when header {:ListHeaderComponent (fn [] (reagent/as-element header))}))))
|
||||
(when header {:ListHeaderComponent (fn [] (reagent/as-element header))})
|
||||
(when footer {:ListFooterComponent (fn [] (reagent/as-element footer))}))))
|
||||
|
||||
;; Workaround an issue in reagent that does not consider JS array as JS value
|
||||
;; This forces clj <-> js serialization and breaks clj semantic
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
{:line-height 22 :font-size 15}
|
||||
{:line-height 20 :font-size 17})
|
||||
subtitle
|
||||
(assoc :font-weight 500 :font-size 15)))
|
||||
(assoc :font-weight "500" :font-size 15)))
|
||||
|
||||
(def subtitle
|
||||
{:margin-top 4
|
||||
|
|
|
|||
|
|
@ -18,7 +18,9 @@
|
|||
;;Image
|
||||
(when image
|
||||
[react/view {:margin-left 16}
|
||||
[image]])
|
||||
(if (vector? image)
|
||||
image
|
||||
[image])])
|
||||
(when image-path
|
||||
[react/view {:margin-left 16}
|
||||
[react/image {:source (utils.image/source image-path)
|
||||
|
|
@ -29,7 +31,9 @@
|
|||
title]
|
||||
;;Subtitle
|
||||
(when subtitle
|
||||
[react/text {:style styles/subtitle}
|
||||
[react/text {:style styles/subtitle
|
||||
:number-of-lines 1
|
||||
:ellipsize-mode :tail}
|
||||
subtitle])]
|
||||
;;Accessories
|
||||
(for [accessory accessories]
|
||||
|
|
|
|||
|
|
@ -30,6 +30,7 @@
|
|||
:contact-toggle-list {:type :main}
|
||||
:new-public-chat {:type :main}
|
||||
:qr-scanner {:type :main}
|
||||
:browser-stack {:type :main}
|
||||
:open-dapp {:type :main}
|
||||
:my-profile {:type :main}
|
||||
:profile-stack {:type :main}
|
||||
|
|
|
|||
|
|
@ -7,3 +7,9 @@
|
|||
:font-size 12
|
||||
:letter-spacing -0.2
|
||||
:color colors/red})
|
||||
|
||||
(def list-title
|
||||
{:margin-top 24
|
||||
:margin-left 16
|
||||
:font-size 14
|
||||
:color colors/gray})
|
||||
|
|
@ -10,8 +10,7 @@
|
|||
[status-im.ui.components.status-bar.view :as status-bar]
|
||||
[status-im.ui.components.toolbar.view :as toolbar.view]
|
||||
[status-im.ui.screens.add-new.styles :as add-new.styles]
|
||||
[status-im.ui.screens.add-new.new-chat.styles :as styles]
|
||||
[status-im.ui.screens.add-new.open-dapp.styles :as open-dapp.styles]))
|
||||
[status-im.ui.screens.add-new.new-chat.styles :as styles]))
|
||||
|
||||
(defn- render-row [row _ _]
|
||||
[contact-view/contact-view {:contact row
|
||||
|
|
@ -21,7 +20,7 @@
|
|||
(views/defview new-chat []
|
||||
(views/letsubs [contacts [:contacts/active]
|
||||
error-message [:new-identity-error]]
|
||||
[react/keyboard-avoiding-view open-dapp.styles/main-container
|
||||
[react/keyboard-avoiding-view {:style {:flex 1}}
|
||||
[status-bar/status-bar]
|
||||
[toolbar.view/simple-toolbar (i18n/label :t/new-chat)]
|
||||
[react/view add-new.styles/new-chat-container
|
||||
|
|
@ -43,7 +42,7 @@
|
|||
[react/text {:style styles/error-message}
|
||||
error-message]
|
||||
(when (seq contacts)
|
||||
[react/text {:style open-dapp.styles/list-title}
|
||||
[react/text {:style styles/list-title}
|
||||
(i18n/label :t/contacts)])
|
||||
[list/flat-list {:data contacts
|
||||
:key-fn :address
|
||||
|
|
|
|||
|
|
@ -1,32 +0,0 @@
|
|||
(ns status-im.ui.screens.add-new.open-dapp.styles
|
||||
(:require [status-im.ui.components.colors :as colors]))
|
||||
|
||||
(def main-container
|
||||
{:flex 1
|
||||
:background-color colors/white})
|
||||
|
||||
(def gray-label
|
||||
{:color colors/gray})
|
||||
|
||||
(def black-label
|
||||
{:font-size 15
|
||||
:letter-spacing -0.2})
|
||||
|
||||
(def dapp
|
||||
(merge gray-label
|
||||
{:margin-top 4}))
|
||||
|
||||
(def dapp-name
|
||||
(merge black-label
|
||||
{:margin-top 8}))
|
||||
|
||||
(def list-title
|
||||
{:margin-top 24
|
||||
:margin-left 16
|
||||
:font-size 14
|
||||
:letter-spacing -0.2
|
||||
:color colors/gray})
|
||||
|
||||
(def description-container
|
||||
{:margin-top 26
|
||||
:margin-horizontal 16})
|
||||
|
|
@ -1,73 +0,0 @@
|
|||
(ns status-im.ui.screens.add-new.open-dapp.views
|
||||
(:require-macros [status-im.utils.views :as views])
|
||||
(:require [re-frame.core :as re-frame]
|
||||
[status-im.i18n :as i18n]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.ui.components.action-button.action-button :as action-button]
|
||||
[status-im.ui.components.colors :as colors]
|
||||
[status-im.ui.components.common.common :as components]
|
||||
[status-im.ui.components.status-bar.view :as status-bar]
|
||||
[status-im.ui.components.toolbar.view :as toolbar.view]
|
||||
[status-im.ui.components.list.views :as list]
|
||||
[status-im.ui.components.contact.contact :as contact-view]
|
||||
[status-im.ui.components.chat-icon.screen :as chat-icon.screen]
|
||||
[status-im.ui.screens.add-new.styles :as add-new.styles]
|
||||
[status-im.ui.screens.add-new.open-dapp.styles :as styles]))
|
||||
|
||||
(defn- render-dapp [dapp]
|
||||
[contact-view/contact-view {:contact dapp
|
||||
:on-press #(re-frame/dispatch [:navigate-to :dapp-description dapp])
|
||||
:show-forward? true
|
||||
:accessibility-label :dapp-item}])
|
||||
|
||||
(views/defview open-dapp []
|
||||
(views/letsubs [dapps [:contacts/all-dapps]
|
||||
url-text (atom nil)]
|
||||
[react/keyboard-avoiding-view styles/main-container
|
||||
[status-bar/status-bar]
|
||||
[toolbar.view/simple-toolbar (i18n/label :t/open-dapp)]
|
||||
[components/separator]
|
||||
[react/view add-new.styles/input-container
|
||||
[react/text-input {:on-change-text #(reset! url-text %)
|
||||
:on-submit-editing #(re-frame/dispatch [:browser.ui/dapp-url-submitted @url-text])
|
||||
:placeholder (i18n/label :t/enter-url)
|
||||
:auto-capitalize :none
|
||||
:auto-correct false
|
||||
:style add-new.styles/input
|
||||
:accessibility-label :dapp-url-input
|
||||
:return-key-type :go}]]
|
||||
[list/section-list {:sections dapps
|
||||
:key-fn :dapp-url
|
||||
:render-fn render-dapp
|
||||
:default-separator? true
|
||||
:enableEmptySections true
|
||||
:keyboardShouldPersistTaps :always}]]))
|
||||
|
||||
(views/defview dapp-description []
|
||||
(views/letsubs [{:keys [name dapp-url description] :as dapp} [:get-screen-params]]
|
||||
[react/keyboard-avoiding-view styles/main-container
|
||||
[status-bar/status-bar]
|
||||
[toolbar.view/simple-toolbar]
|
||||
[react/view {:margin-top 24 :align-items :center}
|
||||
[chat-icon.screen/dapp-icon-browser dapp 56]
|
||||
[react/text {:style styles/dapp-name
|
||||
:accessibility-label :dapp-name-text}
|
||||
name]
|
||||
[react/text {:style styles/dapp}
|
||||
(i18n/label :t/dapp)]]
|
||||
[react/view {:margin-top 24}
|
||||
[action-button/action-button {:label (i18n/label :t/open)
|
||||
:icon :main-icons/address
|
||||
:icon-opts {:color colors/blue}
|
||||
:accessibility-label :open-dapp-button
|
||||
:on-press #(re-frame/dispatch [:browser.ui/open-dapp-button-pressed dapp-url])}]
|
||||
[components/separator {:margin-left 72}]]
|
||||
[react/view styles/description-container
|
||||
[react/i18n-text {:style styles/gray-label :key :description}]
|
||||
[react/text {:style (merge styles/black-label {:padding-top 18})}
|
||||
description]
|
||||
[components/separator {:margin-top 15}]
|
||||
[react/i18n-text {:style (merge styles/gray-label {:padding-top 18}) :key :url}]
|
||||
[react/text {:style (merge styles/black-label {:padding-top 14})}
|
||||
dapp-url]
|
||||
[components/separator {:margin-top 6}]]]))
|
||||
|
|
@ -36,13 +36,6 @@
|
|||
:icon-opts {:color colors/blue}
|
||||
:on-press #(re-frame/dispatch [:navigate-to :new-public-chat])}]
|
||||
[action-button/action-separator]
|
||||
[action-button/action-button
|
||||
{:label (i18n/label :t/open-dapp)
|
||||
:accessibility-label :open-dapp-button
|
||||
:icon :main-icons/address
|
||||
:icon-opts {:color colors/blue}
|
||||
:on-press #(re-frame/dispatch [:navigate-to :open-dapp])}]
|
||||
[action-button/action-separator]
|
||||
[action-button/action-button
|
||||
{:label (i18n/label :t/invite-friends)
|
||||
:accessibility-label :invite-friends-button
|
||||
|
|
|
|||
|
|
@ -0,0 +1,22 @@
|
|||
(ns status-im.ui.screens.browser.open-dapp.styles
|
||||
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])
|
||||
(:require [status-im.ui.components.colors :as colors]
|
||||
[status-im.ui.components.styles :as styles]))
|
||||
|
||||
(def input-container
|
||||
{:flex-direction :row
|
||||
:align-items :center
|
||||
:border-radius styles/border-radius
|
||||
:height 36
|
||||
:background-color colors/gray-lighter
|
||||
:margin-horizontal 16
|
||||
:margin-bottom 9
|
||||
:margin-top 24})
|
||||
|
||||
(defstyle input
|
||||
{:flex 1
|
||||
:font-size 15
|
||||
:padding-horizontal 14
|
||||
:desktop {:height 30
|
||||
:width "100%"}
|
||||
:android {:padding 0}})
|
||||
|
|
@ -0,0 +1,86 @@
|
|||
(ns status-im.ui.screens.browser.open-dapp.views
|
||||
(:require
|
||||
[re-frame.core :as re-frame]
|
||||
[status-im.i18n :as i18n]
|
||||
[status-im.ui.components.colors :as colors]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.ui.components.status-bar.view :as status-bar]
|
||||
[status-im.ui.screens.browser.open-dapp.styles :as styles]
|
||||
[status-im.ui.components.list.views :as list]
|
||||
[status-im.ui.screens.home.views.inner-item :as inner-item]
|
||||
[status-im.ui.components.common.common :as components.common]
|
||||
[status-im.ui.screens.wallet.components.views :as components]
|
||||
[status-im.ui.components.bottom-bar.styles :as tabs.styles]
|
||||
[status-im.react-native.resources :as resources]
|
||||
[status-im.ui.components.contact.contact :as contact-view])
|
||||
(:require-macros [status-im.utils.views :as views]))
|
||||
|
||||
(defn list-item [{:keys [browser-id] :as home-item}]
|
||||
[list/deletable-list-item {:type :browsers
|
||||
:id browser-id
|
||||
:on-delete #(do
|
||||
(re-frame/dispatch [:set-swipe-position :browsers browser-id false])
|
||||
(re-frame/dispatch [:browser.ui/remove-browser-pressed browser-id]))}
|
||||
[inner-item/home-list-browser-item-inner-view home-item]])
|
||||
|
||||
(defn- render-dapp [{:keys [dapp-url recent?] :as dapp}]
|
||||
(if recent?
|
||||
[list-item dapp]
|
||||
[contact-view/contact-view {:contact dapp
|
||||
:on-press #(re-frame/dispatch [:browser.ui/open-dapp-button-pressed dapp-url])
|
||||
:show-forward? true
|
||||
:accessibility-label :dapp-item}]))
|
||||
|
||||
(defn list-header [empty?]
|
||||
[react/view (when empty? {:flex 1})
|
||||
[react/view {:margin 16 :border-color colors/gray-lighter
|
||||
:border-width 1 :border-radius 12 :padding-vertical 16 :padding-horizontal 44
|
||||
:align-items :center}
|
||||
[components.common/image-contain {:container-style {}} {:image (:dapp-store resources/ui) :width 768 :height 333}]
|
||||
[react/text {:style {:margin-top 12 :font-size 15 :font-weight "500" :line-height 22}} "Open the ÐApp Store"]
|
||||
[react/text {:style {:color colors/blue :font-size 13 :line-height 22}} "https://discover.dapps.eth ->"]]
|
||||
(if empty?
|
||||
[react/view {:flex 1 :align-items :center :justify-content :center}
|
||||
[react/text {:style {:color colors/gray :font-size 15}} "Browsed websites will appear here."]]
|
||||
[react/view {:margin-top 14 :margin-left 16 :margin-bottom 4}
|
||||
[react/text {:style {:line-height 22 :font-size 15 :color colors/gray}} (i18n/label :t/recent)]])])
|
||||
|
||||
(views/defview open-dapp []
|
||||
(views/letsubs [browsers [:browser/browsers-vals]
|
||||
dapps [:contacts/all-dapps]
|
||||
url-text (atom nil)]
|
||||
[react/keyboard-avoiding-view {:style {:flex 1}}
|
||||
[status-bar/status-bar]
|
||||
[react/view styles/input-container
|
||||
[react/text-input {:on-change-text #(reset! url-text %)
|
||||
:on-submit-editing #(re-frame/dispatch [:browser.ui/dapp-url-submitted @url-text])
|
||||
:placeholder (i18n/label :t/enter-url)
|
||||
:auto-capitalize :none
|
||||
:auto-correct false
|
||||
:style styles/input
|
||||
:accessibility-label :dapp-url-input
|
||||
:return-key-type :go}]]
|
||||
[components/separator]
|
||||
[list/section-list {:sections (cond-> dapps
|
||||
(not (empty? browsers))
|
||||
(conj {:title (i18n/label :t/recent)
|
||||
:data (map #(assoc % :dapp-url (:url %) :recent? true) browsers)}))
|
||||
:key-fn :dapp-url
|
||||
:render-fn render-dapp
|
||||
:default-separator? true
|
||||
:enableEmptySections true
|
||||
:footer [react/view
|
||||
{:style {:height tabs.styles/tabs-diff
|
||||
:align-self :stretch}}]
|
||||
:keyboardShouldPersistTaps :always}]
|
||||
;;TODO next iteration in next PR
|
||||
#_(if (empty? browsers)
|
||||
[list-header true]
|
||||
[list/flat-list {:header [list-header false]
|
||||
:data (vals browsers)
|
||||
:footer [react/view
|
||||
{:style {:height tabs.styles/tabs-diff
|
||||
:align-self :stretch}}]
|
||||
:key-fn :browser-id
|
||||
:end-fill-color colors/white
|
||||
:render-fn list-item}])]))
|
||||
|
|
@ -42,17 +42,6 @@
|
|||
:align-items :center
|
||||
:justify-content :center})
|
||||
|
||||
(def web-view-loading
|
||||
{:flex 1
|
||||
:background-color colors/gray
|
||||
:align-items :center
|
||||
:justify-content :center
|
||||
:position :absolute
|
||||
:top 0
|
||||
:bottom 0
|
||||
:left 0
|
||||
:right 0})
|
||||
|
||||
(def web-view-error
|
||||
{:flex 1
|
||||
:justify-content :center
|
||||
|
|
@ -140,11 +129,6 @@
|
|||
:align-items :center
|
||||
:justify-content :center})
|
||||
|
||||
(def permissions-panel-d-label
|
||||
{:font-size 22
|
||||
:color colors/gray
|
||||
:font-weight :bold})
|
||||
|
||||
(def permissions-panel-ok-icon-container
|
||||
{:height 24
|
||||
:width 24
|
||||
|
|
@ -181,8 +165,3 @@
|
|||
:line-height 22
|
||||
:text-align :center
|
||||
:margin-top 9})
|
||||
|
||||
(def permissions-panel-permissions-label
|
||||
{:color colors/blue
|
||||
:font-size 14
|
||||
:margin-left 10})
|
||||
|
|
|
|||
|
|
@ -19,6 +19,12 @@
|
|||
browsers
|
||||
browsers)))
|
||||
|
||||
(re-frame/reg-sub
|
||||
:browser/browsers-vals
|
||||
:<- [:browser/browsers]
|
||||
(fn [browsers]
|
||||
(sort-by :timestamp > (vals browsers))))
|
||||
|
||||
(re-frame/reg-sub
|
||||
:get-current-browser
|
||||
:<- [:get :browser/options]
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@
|
|||
{:browser? true}
|
||||
[toolbar.view/nav-button
|
||||
(actions/back (fn []
|
||||
(re-frame/dispatch [:navigate-to :home])
|
||||
(re-frame/dispatch [:navigate-back])
|
||||
(when error?
|
||||
(re-frame/dispatch [:browser.ui/remove-browser-pressed browser-id]))))]
|
||||
[toolbar-content url url-original browser url-editing?]])
|
||||
|
|
|
|||
|
|
@ -135,8 +135,6 @@
|
|||
(spec/def :navigation.screen-params.edit-contact-group/group-type (spec/nilable any?))
|
||||
(spec/def :navigation.screen-params/edit-contact-group (spec/keys :opt-un [:navigation.screen-params.edit-contact-group/group
|
||||
:navigation.screen-params.edit-contact-group/group-type]))
|
||||
(spec/def :navigation.screen-params.dapp-description/dapp :new/open-dapp)
|
||||
(spec/def :navigation.screen-params/dapp-description map?)
|
||||
|
||||
(spec/def :navigation.screen-params/collectibles-list map?)
|
||||
|
||||
|
|
@ -150,7 +148,6 @@
|
|||
:navigation.screen-params/qr-scanner
|
||||
:navigation.screen-params/group-contacts
|
||||
:navigation.screen-params/edit-contact-group
|
||||
:navigation.screen-params/dapp-description
|
||||
:navigation.screen-params/collectibles-list
|
||||
:navigation.screen-params/show-extension
|
||||
:navigation.screen-params/selection-modal-screen
|
||||
|
|
|
|||
|
|
@ -5,19 +5,15 @@
|
|||
(re-frame/reg-sub
|
||||
:home-items
|
||||
:<- [:chats/active-chats]
|
||||
:<- [:browser/browsers]
|
||||
:<- [:search/filter]
|
||||
:<- [:search/filtered-chats]
|
||||
:<- [:search/filtered-browsers]
|
||||
(fn [[chats browsers search-filter filtered-chats filtered-browsers]]
|
||||
(fn [[chats search-filter filtered-chats]]
|
||||
(if (or (nil? search-filter)
|
||||
(and platform/desktop? (empty? search-filter)))
|
||||
{:all-home-items
|
||||
(sort-by #(-> % second :timestamp) >
|
||||
(merge chats browsers))}
|
||||
(sort-by #(-> % second :timestamp) > chats)}
|
||||
{:search-filter search-filter
|
||||
:chats filtered-chats
|
||||
:browsers filtered-browsers})))
|
||||
:chats filtered-chats})))
|
||||
|
||||
(re-frame/reg-sub
|
||||
:chain-sync-state
|
||||
|
|
|
|||
|
|
@ -59,25 +59,16 @@
|
|||
[icons/icon :main-icons/add {:color :white}])]]])
|
||||
|
||||
(defn home-list-item [[home-item-id home-item]]
|
||||
(if (= home-item-id :empty)
|
||||
[react/view
|
||||
{:style {:height tabs.styles/tabs-diff
|
||||
:align-self :stretch}}]
|
||||
(let [delete-action (if (:chat-id home-item)
|
||||
(if (and (:group-chat home-item)
|
||||
(not (:public? home-item)))
|
||||
:group-chats.ui/remove-chat-pressed
|
||||
:chat.ui/remove-chat)
|
||||
:browser.ui/remove-browser-pressed)
|
||||
inner-item-view (if (:chat-id home-item)
|
||||
inner-item/home-list-chat-item-inner-view
|
||||
inner-item/home-list-browser-item-inner-view)]
|
||||
[list/deletable-list-item {:type :chats
|
||||
:id home-item-id
|
||||
:on-delete #(do
|
||||
(re-frame/dispatch [:set-swipe-position :chats home-item-id false])
|
||||
(re-frame/dispatch [delete-action home-item-id]))}
|
||||
[inner-item-view home-item]])))
|
||||
(let [delete-action (if (and (:group-chat home-item)
|
||||
(not (:public? home-item)))
|
||||
:group-chats.ui/remove-chat-pressed
|
||||
:chat.ui/remove-chat)]
|
||||
[list/deletable-list-item {:type :chats
|
||||
:id home-item-id
|
||||
:on-delete #(do
|
||||
(re-frame/dispatch [:set-swipe-position :chats home-item-id false])
|
||||
(re-frame/dispatch [delete-action home-item-id]))}
|
||||
[inner-item/home-list-chat-item-inner-view home-item]]))
|
||||
|
||||
;;do not remove view-id and will-update or will-unmount handlers, this is how it works
|
||||
(views/defview welcome [view-id]
|
||||
|
|
@ -199,12 +190,10 @@
|
|||
[react/i18n-text {:style styles/no-chats-text :key :no-recent-chats}]])
|
||||
|
||||
(defn home-filtered-items-list
|
||||
[chats browsers]
|
||||
[chats]
|
||||
[list/section-list
|
||||
{:sections [{:title :t/chats
|
||||
:data chats}
|
||||
{:title :t/browser
|
||||
:data browsers}
|
||||
{:title :t/messages
|
||||
:data []}]
|
||||
:key-fn first
|
||||
|
|
@ -234,12 +223,12 @@
|
|||
[home-list-item home-item])}])
|
||||
|
||||
(defn home-items-view
|
||||
[search-filter chats browsers all-home-items]
|
||||
[search-filter chats all-home-items]
|
||||
(let [previous-touch (reagent/atom nil)
|
||||
scrolling-from-top? (reagent/atom true)]
|
||||
(fn [search-filter chats browsers all-home-items]
|
||||
(fn [search-filter chats all-home-items]
|
||||
(if (not-empty search-filter)
|
||||
[home-filtered-items-list chats browsers]
|
||||
[home-filtered-items-list chats]
|
||||
[react/view
|
||||
(merge {:style {:flex 1}}
|
||||
(when (and @scrolling-from-top?
|
||||
|
|
@ -263,10 +252,12 @@
|
|||
previous-position)))
|
||||
(show-search!)))
|
||||
false)}))
|
||||
[list/flat-list {:data (conj (vec all-home-items)
|
||||
[:empty {}])
|
||||
[list/flat-list {:data all-home-items
|
||||
:key-fn first
|
||||
:end-fill-color colors/white
|
||||
:footer [react/view
|
||||
{:style {:height tabs.styles/tabs-diff
|
||||
:align-self :stretch}}]
|
||||
:on-scroll-begin-drag
|
||||
(fn [e]
|
||||
(reset! scrolling-from-top?
|
||||
|
|
@ -284,7 +275,7 @@
|
|||
latest-block-number [:latest-block-number]
|
||||
rpc-network? [:current-network-uses-rpc?]
|
||||
network-initialized? [:current-network-initialized?]
|
||||
{:keys [search-filter chats browsers all-home-items]} [:home-items]]
|
||||
{:keys [search-filter chats all-home-items]} [:home-items]]
|
||||
{:component-did-mount
|
||||
(fn [this]
|
||||
(let [[_ loading?] (.. this -props -argv)]
|
||||
|
|
@ -316,7 +307,7 @@
|
|||
(if (and (not search-filter)
|
||||
(empty? all-home-items))
|
||||
[home-empty-view]
|
||||
[home-items-view search-filter chats browsers all-home-items])])
|
||||
[home-items-view search-filter chats all-home-items])])
|
||||
(when platform/android?
|
||||
[home-action-button (not logging-in?)])]]))
|
||||
|
||||
|
|
|
|||
|
|
@ -19,7 +19,11 @@
|
|||
[status-im.ui.components.icons.vector-icons :as vector-icons]
|
||||
[status-im.ui.components.chat-icon.screen :as chat-icon.screen]
|
||||
[status-im.ui.components.common.common :as components.common]
|
||||
[status-im.browser.core :as browser]))
|
||||
[status-im.ui.components.list-item.views :as list-item]
|
||||
[status-im.browser.core :as browser]
|
||||
[clojure.string :as string]
|
||||
[status-im.ui.components.chat-icon.screen :as chat-icon]
|
||||
[status-im.ui.components.bottom-bar.styles :as tabs.styles]))
|
||||
|
||||
(defview command-short-preview [message]
|
||||
(letsubs [id->command [:chats/id->command]
|
||||
|
|
@ -115,25 +119,15 @@
|
|||
:content-type last-message-content-type}]
|
||||
[unviewed-indicator chat-id]]]]]))
|
||||
|
||||
(defn home-list-browser-item-inner-view [{:keys [dapp url name browser-id] :as browser}]
|
||||
[react/touchable-highlight {:on-press #(re-frame/dispatch [:browser.ui/browser-item-selected browser-id])}
|
||||
[react/view styles/chat-container
|
||||
[react/view styles/chat-icon-container
|
||||
(if dapp
|
||||
[chat-icon.screen/dapp-icon-browser dapp 40]
|
||||
[react/view styles/browser-icon-container
|
||||
[vector-icons/icon :main-icons/browser {:color colors/gray}]])]
|
||||
[react/view styles/chat-info-container
|
||||
[react/view styles/item-upper-container
|
||||
[react/view styles/name-view
|
||||
[react/view {:flex-shrink 1}
|
||||
[react/text {:style styles/name-text
|
||||
:accessibility-label :chat-name-text
|
||||
:number-of-lines 1}
|
||||
name]]]]
|
||||
[react/view styles/item-lower-container
|
||||
[react/view styles/last-message-container
|
||||
[react/text {:style styles/last-message-text
|
||||
:accessibility-label :chat-url-text
|
||||
:number-of-lines 1}
|
||||
(or url (i18n/label :t/dapp))]]]]]])
|
||||
(defn home-list-browser-item-inner-view [{:keys [dapp url name browser-id]}]
|
||||
(let [photo-path (:photo-path dapp)]
|
||||
[list-item/list-item (merge
|
||||
{:title name
|
||||
:subtitle (or url (i18n/label :t/dapp))
|
||||
:on-press #(re-frame/dispatch [:browser.ui/browser-item-selected browser-id])}
|
||||
(if dapp
|
||||
(if (and photo-path (not (string/blank? (:photo-path dapp))))
|
||||
{:image-path photo-path}
|
||||
{:image [chat-icon/default-browser-icon name]})
|
||||
{:image [react/view styles/browser-icon-container
|
||||
[vector-icons/icon :main-icons/browser {:color colors/gray}]]}))]))
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
(ns status-im.ui.screens.routing.browser-stack)
|
||||
|
||||
(def browser-stack
|
||||
{:name :browser-stack
|
||||
:screens [:open-dapp
|
||||
:browser]
|
||||
:config {:initialRouteName :open-dapp}})
|
||||
|
|
@ -15,9 +15,6 @@
|
|||
:contact-toggle-list
|
||||
:group-chat-profile
|
||||
:new-public-chat
|
||||
:open-dapp
|
||||
:dapp-description
|
||||
:browser
|
||||
:stickers
|
||||
:stickers-pack]
|
||||
config/hardwallet-enabled?
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@
|
|||
[status-im.ui.screens.routing.chat-stack :as chat-stack]
|
||||
[status-im.ui.screens.routing.wallet-stack :as wallet-stack]
|
||||
[status-im.ui.screens.routing.profile-stack :as profile-stack]
|
||||
[status-im.ui.screens.routing.browser-stack :as browser-stack]
|
||||
[status-im.ui.screens.routing.modals :as modals]
|
||||
[status-im.ui.components.bottom-bar.core :as bottom-bar]
|
||||
[status-im.ui.components.status-bar.view :as status-bar]
|
||||
|
|
@ -186,6 +187,7 @@
|
|||
{:tabs
|
||||
{:screen (tab-navigator
|
||||
(->> [(build-screen chat-stack/chat-stack)
|
||||
(build-screen browser-stack/browser-stack)
|
||||
(build-screen wallet-stack/wallet-stack)
|
||||
(build-screen profile-stack/profile-stack)]
|
||||
(into {}))
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@
|
|||
[status-im.ui.screens.hardwallet.settings.views :as hardwallet.settings]
|
||||
[status-im.ui.screens.help-center.views :as help-center]
|
||||
[status-im.ui.screens.browser.views :as browser]
|
||||
[status-im.ui.screens.add-new.open-dapp.views :as open-dapp]
|
||||
[status-im.ui.screens.browser.open-dapp.views :as open-dapp]
|
||||
[status-im.ui.screens.intro.views :as intro]
|
||||
[status-im.ui.screens.accounts.create.views :as accounts.create]
|
||||
[status-im.ui.screens.hardwallet.authentication-method.views :as hardwallet.authentication]
|
||||
|
|
@ -85,7 +85,6 @@
|
|||
:group-chat-profile profile.group-chat/group-chat-profile
|
||||
:new-public-chat new-public-chat/new-public-chat
|
||||
:open-dapp open-dapp/open-dapp
|
||||
:dapp-description open-dapp/dapp-description
|
||||
:browser browser/browser
|
||||
:stickers stickers/packs
|
||||
:stickers-pack stickers/pack
|
||||
|
|
|
|||
|
|
@ -115,7 +115,7 @@
|
|||
},
|
||||
"status-sending": "Sending...",
|
||||
"next": "Next",
|
||||
"recent": "Recent statuses",
|
||||
"recent": "Recent",
|
||||
"status": "Status",
|
||||
"from": "From",
|
||||
"wrong-password": "Wrong password",
|
||||
|
|
|
|||
Loading…
Reference in New Issue