diff --git a/resources/images/ui/dapp-store.png b/resources/images/ui/dapp-store.png new file mode 100644 index 0000000000..e7ef38f4ae Binary files /dev/null and b/resources/images/ui/dapp-store.png differ diff --git a/src/status_im/browser/core.cljs b/src/status_im/browser/core.cljs index bba2f13223..0a541d289c 100644 --- a/src/status_im/browser/core.cljs +++ b/src/status_im/browser/core.cljs @@ -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 diff --git a/src/status_im/react_native/resources.cljs b/src/status_im/react_native/resources.cljs index 7026f42687..762d905738 100644 --- a/src/status_im/react_native/resources.cljs +++ b/src/status_im/react_native/resources.cljs @@ -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")}) diff --git a/src/status_im/ui/components/bottom_bar/core.cljs b/src/status_im/ui/components/bottom_bar/core.cljs index 3fccceab8d..8fbac848c9 100644 --- a/src/status_im/ui/components/bottom_bar/core.cljs +++ b/src/status_im/ui/components/bottom_bar/core.cljs @@ -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]))}))) diff --git a/src/status_im/ui/components/chat_icon/screen.cljs b/src/status_im/ui/components/chat_icon/screen.cljs index 33f3983050..e17f5de33f 100644 --- a/src/status_im/ui/components/chat_icon/screen.cljs +++ b/src/status_im/ui/components/chat_icon/screen.cljs @@ -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) diff --git a/src/status_im/ui/components/list/views.cljs b/src/status_im/ui/components/list/views.cljs index 079cd51bd1..6b6c264c8d 100644 --- a/src/status_im/ui/components/list/views.cljs +++ b/src/status_im/ui/components/list/views.cljs @@ -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 diff --git a/src/status_im/ui/components/list_item/styles.cljs b/src/status_im/ui/components/list_item/styles.cljs index f536cffba4..c961922d6d 100644 --- a/src/status_im/ui/components/list_item/styles.cljs +++ b/src/status_im/ui/components/list_item/styles.cljs @@ -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 diff --git a/src/status_im/ui/components/list_item/views.cljs b/src/status_im/ui/components/list_item/views.cljs index ad04b16bc4..c4e0b94231 100644 --- a/src/status_im/ui/components/list_item/views.cljs +++ b/src/status_im/ui/components/list_item/views.cljs @@ -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] diff --git a/src/status_im/ui/components/status_bar/view.cljs b/src/status_im/ui/components/status_bar/view.cljs index a596509d33..5dc0bfc98e 100644 --- a/src/status_im/ui/components/status_bar/view.cljs +++ b/src/status_im/ui/components/status_bar/view.cljs @@ -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} diff --git a/src/status_im/ui/screens/add_new/new_chat/styles.cljs b/src/status_im/ui/screens/add_new/new_chat/styles.cljs index 629d89d3ef..42dcec8166 100644 --- a/src/status_im/ui/screens/add_new/new_chat/styles.cljs +++ b/src/status_im/ui/screens/add_new/new_chat/styles.cljs @@ -6,4 +6,10 @@ :margin-top 4 :font-size 12 :letter-spacing -0.2 - :color colors/red}) \ No newline at end of file + :color colors/red}) + +(def list-title + {:margin-top 24 + :margin-left 16 + :font-size 14 + :color colors/gray}) \ No newline at end of file diff --git a/src/status_im/ui/screens/add_new/new_chat/views.cljs b/src/status_im/ui/screens/add_new/new_chat/views.cljs index ffa24e4584..400d6272f9 100644 --- a/src/status_im/ui/screens/add_new/new_chat/views.cljs +++ b/src/status_im/ui/screens/add_new/new_chat/views.cljs @@ -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 diff --git a/src/status_im/ui/screens/add_new/open_dapp/styles.cljs b/src/status_im/ui/screens/add_new/open_dapp/styles.cljs deleted file mode 100644 index 5b258137bd..0000000000 --- a/src/status_im/ui/screens/add_new/open_dapp/styles.cljs +++ /dev/null @@ -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}) diff --git a/src/status_im/ui/screens/add_new/open_dapp/views.cljs b/src/status_im/ui/screens/add_new/open_dapp/views.cljs deleted file mode 100644 index 1530e07cb6..0000000000 --- a/src/status_im/ui/screens/add_new/open_dapp/views.cljs +++ /dev/null @@ -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}]]])) diff --git a/src/status_im/ui/screens/add_new/views.cljs b/src/status_im/ui/screens/add_new/views.cljs index d2af73a930..a6b00b0b1d 100644 --- a/src/status_im/ui/screens/add_new/views.cljs +++ b/src/status_im/ui/screens/add_new/views.cljs @@ -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 diff --git a/src/status_im/ui/screens/browser/open_dapp/styles.cljs b/src/status_im/ui/screens/browser/open_dapp/styles.cljs new file mode 100644 index 0000000000..e50797c25b --- /dev/null +++ b/src/status_im/ui/screens/browser/open_dapp/styles.cljs @@ -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}}) \ No newline at end of file diff --git a/src/status_im/ui/screens/browser/open_dapp/views.cljs b/src/status_im/ui/screens/browser/open_dapp/views.cljs new file mode 100644 index 0000000000..3226a5c300 --- /dev/null +++ b/src/status_im/ui/screens/browser/open_dapp/views.cljs @@ -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}])])) \ No newline at end of file diff --git a/src/status_im/ui/screens/browser/styles.cljs b/src/status_im/ui/screens/browser/styles.cljs index f70b25302a..3f4efd9c70 100644 --- a/src/status_im/ui/screens/browser/styles.cljs +++ b/src/status_im/ui/screens/browser/styles.cljs @@ -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 @@ -180,9 +164,4 @@ :font-size 15 :line-height 22 :text-align :center - :margin-top 9}) - -(def permissions-panel-permissions-label - {:color colors/blue - :font-size 14 - :margin-left 10}) + :margin-top 9}) \ No newline at end of file diff --git a/src/status_im/ui/screens/browser/subs.cljs b/src/status_im/ui/screens/browser/subs.cljs index 1c5dee3f1d..385c0fe5ed 100644 --- a/src/status_im/ui/screens/browser/subs.cljs +++ b/src/status_im/ui/screens/browser/subs.cljs @@ -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] diff --git a/src/status_im/ui/screens/browser/views.cljs b/src/status_im/ui/screens/browser/views.cljs index 67af93043c..74dae0c96e 100644 --- a/src/status_im/ui/screens/browser/views.cljs +++ b/src/status_im/ui/screens/browser/views.cljs @@ -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?]]) @@ -183,4 +183,4 @@ :show-tooltip show-tooltip :opt-in? opt-in? :rpc-url rpc-url - :name name}]]))) + :name name}]]))) \ No newline at end of file diff --git a/src/status_im/ui/screens/db.cljs b/src/status_im/ui/screens/db.cljs index c12f5c9b68..b7b1711325 100644 --- a/src/status_im/ui/screens/db.cljs +++ b/src/status_im/ui/screens/db.cljs @@ -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 diff --git a/src/status_im/ui/screens/home/subs.cljs b/src/status_im/ui/screens/home/subs.cljs index ba8fe6d92c..a0720dcc7e 100644 --- a/src/status_im/ui/screens/home/subs.cljs +++ b/src/status_im/ui/screens/home/subs.cljs @@ -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 diff --git a/src/status_im/ui/screens/home/views.cljs b/src/status_im/ui/screens/home/views.cljs index d78af9e605..ca37dc5b6f 100644 --- a/src/status_im/ui/screens/home/views.cljs +++ b/src/status_im/ui/screens/home/views.cljs @@ -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?)])]])) diff --git a/src/status_im/ui/screens/home/views/inner_item.cljs b/src/status_im/ui/screens/home/views/inner_item.cljs index ce3d0f5be8..690786f3d2 100644 --- a/src/status_im/ui/screens/home/views/inner_item.cljs +++ b/src/status_im/ui/screens/home/views/inner_item.cljs @@ -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}]]}))])) \ No newline at end of file diff --git a/src/status_im/ui/screens/routing/browser_stack.cljs b/src/status_im/ui/screens/routing/browser_stack.cljs new file mode 100644 index 0000000000..7826142bd9 --- /dev/null +++ b/src/status_im/ui/screens/routing/browser_stack.cljs @@ -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}}) \ No newline at end of file diff --git a/src/status_im/ui/screens/routing/chat_stack.cljs b/src/status_im/ui/screens/routing/chat_stack.cljs index 847dc86c75..f381a91bdf 100644 --- a/src/status_im/ui/screens/routing/chat_stack.cljs +++ b/src/status_im/ui/screens/routing/chat_stack.cljs @@ -15,9 +15,6 @@ :contact-toggle-list :group-chat-profile :new-public-chat - :open-dapp - :dapp-description - :browser :stickers :stickers-pack] config/hardwallet-enabled? diff --git a/src/status_im/ui/screens/routing/core.cljs b/src/status_im/ui/screens/routing/core.cljs index 10af0a91bb..1a9313fc82 100644 --- a/src/status_im/ui/screens/routing/core.cljs +++ b/src/status_im/ui/screens/routing/core.cljs @@ -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 {})) diff --git a/src/status_im/ui/screens/routing/screens.cljs b/src/status_im/ui/screens/routing/screens.cljs index fce5a3a169..9a1dbd71f4 100644 --- a/src/status_im/ui/screens/routing/screens.cljs +++ b/src/status_im/ui/screens/routing/screens.cljs @@ -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 diff --git a/translations/en.json b/translations/en.json index 91f4fdfcd7..7c2d1da468 100644 --- a/translations/en.json +++ b/translations/en.json @@ -115,7 +115,7 @@ }, "status-sending": "Sending...", "next": "Next", - "recent": "Recent statuses", + "recent": "Recent", "status": "Status", "from": "From", "wrong-password": "Wrong password",