Implementation of new UI toggle (#13384)
This commit is contained in:
parent
8aee3cfbbd
commit
1ccb01532e
|
@ -16,6 +16,7 @@
|
|||
[status-im.utils.universal-links.core :as utils.universal-links]
|
||||
[status-im.i18n.i18n :as i18n]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.async-storage.core :as async-storage]
|
||||
["react-native" :refer (DevSettings LogBox)]
|
||||
["react-native-languages" :default react-native-languages]
|
||||
["react-native-shake" :as react-native-shake]))
|
||||
|
@ -39,6 +40,9 @@
|
|||
|
||||
(utils.universal-links/initialize)
|
||||
|
||||
(when config/quo-preview-enabled?
|
||||
(async-storage/get-item :new-ui-enabled? #(reset! config/new-ui-enabled? %)))
|
||||
|
||||
;;DEV
|
||||
(snoopy/subscribe!)
|
||||
(when (and js/goog.DEBUG platform/ios? DevSettings)
|
||||
|
|
|
@ -472,7 +472,7 @@
|
|||
"Decides which root should be initialised depending on user and app state"
|
||||
[db]
|
||||
(if (get db :tos/accepted?)
|
||||
(re-frame/dispatch [:init-root :chat-stack])
|
||||
(re-frame/dispatch [:init-root (if @config/new-ui-enabled? :home-stack :chat-stack)])
|
||||
(re-frame/dispatch [:init-root :tos])))
|
||||
|
||||
(fx/defn login-only-events
|
||||
|
|
|
@ -2,7 +2,8 @@
|
|||
(:require [quo.design-system.colors :as colors]
|
||||
[status-im.utils.platform :as platform]
|
||||
[status-im.ui.components.icons.icons :as icons]
|
||||
[status-im.ui.screens.views :as views]))
|
||||
[status-im.ui.screens.views :as views]
|
||||
[status-im.navigation2.roots :as nav2-roots]))
|
||||
|
||||
(defn status-bar-options []
|
||||
(if platform/android?
|
||||
|
@ -65,6 +66,7 @@
|
|||
;;TODO problem here is that we have two places for screens, here and in screens ns, and we have handler in navigate
|
||||
(defn roots []
|
||||
;;TABS
|
||||
(merge
|
||||
{:chat-stack
|
||||
{:root
|
||||
{:bottomTabs
|
||||
|
@ -187,4 +189,5 @@
|
|||
:options (get-screen-options :force-accept-tos)}}]
|
||||
:options (merge (default-root)
|
||||
(status-bar-options)
|
||||
{:topBar (assoc (topbar-options) :visible false)})}}}})
|
||||
{:topBar (assoc (topbar-options) :visible false)})}}}}
|
||||
(nav2-roots/roots)))
|
||||
|
|
|
@ -1,9 +1,20 @@
|
|||
(ns status-im.navigation2
|
||||
(:require [status-im.utils.fx :as fx]
|
||||
[status-im.utils.datetime :as datetime]))
|
||||
[status-im.reloader :as reloader]
|
||||
[status-im.utils.config :as config]
|
||||
[status-im.utils.datetime :as datetime]
|
||||
[status-im.async-storage.core :as async-storage]))
|
||||
|
||||
(def parent-stack (atom :home-stack))
|
||||
|
||||
(fx/defn toggle-new-ui
|
||||
{:events [:toggle-new-ui]}
|
||||
[_]
|
||||
(swap! config/new-ui-enabled? not)
|
||||
(reloader/reload)
|
||||
{:dispatch [:init-root (if @config/new-ui-enabled? :home-stack :chat-stack)]
|
||||
::async-storage/set! {:new-ui-enabled? @config/new-ui-enabled?}})
|
||||
|
||||
(fx/defn init-root-nav2
|
||||
{:events [:init-root-nav2]}
|
||||
[_ root-id]
|
||||
|
@ -38,7 +49,7 @@
|
|||
[{:keys [db] :as cofx} go-to-view-id id screen-params from-switcher?]
|
||||
(let [view-id (:view-id db)
|
||||
stacks (:navigation2/navigation2-stacks db)
|
||||
from-home? (= view-id :home-stack)]
|
||||
from-home? (= view-id :chat-stack)]
|
||||
(if from-switcher?
|
||||
(navigate-from-switcher go-to-view-id id db from-home?)
|
||||
(if from-home?
|
||||
|
|
|
@ -4,7 +4,8 @@
|
|||
[status-im.switcher.switcher :as switcher]
|
||||
[status-im.ui.screens.home.views :as home]
|
||||
[status-im.switcher.constants :as switcher-constants]
|
||||
[status-im.ui.screens.browser.empty-tab.views :as empty-tab]
|
||||
[status-im.ui.screens.profile.user.views :as profile.user]
|
||||
;; [status-im.ui.screens.browser.empty-tab.views :as empty-tab]
|
||||
[status-im.ui.screens.wallet.accounts.views :as wallet.accounts]
|
||||
[status-im.switcher.bottom-tabs :as bottom-tabs]))
|
||||
|
||||
|
@ -18,7 +19,8 @@
|
|||
:chats-stack [home/home]
|
||||
:communities-stack [quo2.preview/main-screen]
|
||||
:wallet-stack [wallet.accounts/accounts-overview]
|
||||
:browser-stack [empty-tab/empty-tab])]))
|
||||
;;:browser-stack [empty-tab/empty-tab])]))
|
||||
:browser-stack [profile.user/my-profile])]))
|
||||
|
||||
(defn home []
|
||||
[:<>
|
||||
|
|
|
@ -4,6 +4,6 @@
|
|||
{:home-stack
|
||||
{:root
|
||||
{:stack {:id :home-stack
|
||||
:children [{:component {:name :home-stack
|
||||
:id :home-stack
|
||||
:children [{:component {:name :chat-stack
|
||||
:id :chat-stack
|
||||
:options {:topBar {:visible false}}}}]}}}})
|
||||
|
|
|
@ -1,6 +1,14 @@
|
|||
(ns status-im.navigation2.screens
|
||||
(:require [status-im.navigation2.home-stack :as home-stack]))
|
||||
(:require [status-im.ui.screens.chat.views :as chat]
|
||||
[status-im.navigation2.home-stack :as home-stack]
|
||||
[status-im.navigation2.stack-with-switcher :as stack-with-switcher]))
|
||||
|
||||
(def screens [{:name :home-stack
|
||||
;; We have to use the home screen name :chat-stack for now, for compatibility with navigation.cljs
|
||||
(def screens [{:name :chat-stack ;; TODO(parvesh) - rename to home-stack
|
||||
:insets {:top false}
|
||||
:component home-stack/home}])
|
||||
|
||||
;; These screens will overwrite navigation/screens.cljs screens on enabling new UI toggle
|
||||
(def screen-overwrites
|
||||
[{:name :chat
|
||||
:component #(stack-with-switcher/overlap-stack chat/chat :chat)}])
|
||||
|
|
|
@ -1538,7 +1538,8 @@
|
|||
:<- [:view-id]
|
||||
:<- [:home-items-show-number]
|
||||
(fn [[search-filter filtered-chats communities view-id home-items-show-number]]
|
||||
(if (= view-id :home)
|
||||
(if (or (= view-id :home)
|
||||
(and config/new-ui-enabled? (= view-id :chat-stack)))
|
||||
(let [communities-count (count communities)
|
||||
chats-count (count filtered-chats)
|
||||
;; If we have both communities & chats we want to display
|
||||
|
|
|
@ -31,7 +31,7 @@
|
|||
:justify-content :space-around
|
||||
:height (constants/bottom-tabs-height)
|
||||
:position :absolute
|
||||
:bottom 0
|
||||
:bottom -1
|
||||
:right 0
|
||||
:left 0
|
||||
:opacity animation/bottom-tabs-opacity
|
||||
|
|
|
@ -14,7 +14,8 @@
|
|||
wakuv2-flag
|
||||
current-fleet
|
||||
webview-debug
|
||||
wallet-connect-enabled?]}]
|
||||
wallet-connect-enabled?
|
||||
new-ui-enabled?]}]
|
||||
(keep
|
||||
identity
|
||||
[{:size :small
|
||||
|
@ -115,7 +116,15 @@
|
|||
#(re-frame/dispatch
|
||||
[:multiaccounts.ui/switch-wallet-connect-enabled (not wallet-connect-enabled?)])
|
||||
:accessory :switch
|
||||
:active wallet-connect-enabled?}]))
|
||||
:active wallet-connect-enabled?}
|
||||
(when config/quo-preview-enabled?
|
||||
{:size :small
|
||||
:title (i18n/label :t/new-ui)
|
||||
:accessibility-label :new-ui-toggle
|
||||
:container-margin-bottom 8
|
||||
:on-press #(re-frame/dispatch [:toggle-new-ui])
|
||||
:accessory :switch
|
||||
:active new-ui-enabled?})]))
|
||||
|
||||
(defn- flat-list-data [options]
|
||||
(normal-mode-settings-data options))
|
||||
|
@ -146,6 +155,7 @@
|
|||
:wakuv2-flag wakuv2-flag
|
||||
:waku-bloom-filter-mode waku-bloom-filter-mode
|
||||
:webview-debug webview-debug
|
||||
:wallet-connect-enabled? wallet-connect-enabled?})
|
||||
:wallet-connect-enabled? wallet-connect-enabled?
|
||||
:new-ui-enabled? @config/new-ui-enabled?})
|
||||
:key-fn (fn [_ i] (str i))
|
||||
:render-fn render-item}]))
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
[status-im.ui.screens.home.views.inner-item :as inner-item]
|
||||
[quo.design-system.colors :as colors]
|
||||
[quo.core :as quo]
|
||||
[quo.platform :as platform]
|
||||
[status-im.add-new.core :as new-chat]
|
||||
[status-im.ui.components.search-input.view :as search-input]
|
||||
[status-im.add-new.db :as db]
|
||||
|
@ -22,7 +23,8 @@
|
|||
[status-im.ui.screens.chat.sheets :as sheets]
|
||||
[status-im.ui.components.tabbar.core :as tabbar]
|
||||
["react-native-navigation" :refer (Navigation)]
|
||||
[status-im.ui.components.invite.views :as invite])
|
||||
[status-im.ui.components.invite.views :as invite]
|
||||
[status-im.utils.config :as config])
|
||||
(:require-macros [status-im.utils.views :as views]))
|
||||
|
||||
(defn home-tooltip-view []
|
||||
|
@ -102,7 +104,9 @@
|
|||
home-item
|
||||
{:on-press (fn []
|
||||
(re-frame/dispatch [:dismiss-keyboard])
|
||||
(re-frame/dispatch [:chat.ui/navigate-to-chat chat-id])
|
||||
(if (and @config/new-ui-enabled? platform/android?)
|
||||
(re-frame/dispatch [:chat.ui/navigate-to-chat-nav2 chat-id])
|
||||
(re-frame/dispatch [:chat.ui/navigate-to-chat chat-id]))
|
||||
(re-frame/dispatch [:search/home-filter-changed nil])
|
||||
(re-frame/dispatch [:accept-all-activity-center-notifications-from-chat chat-id]))
|
||||
:on-long-press #(re-frame/dispatch [:bottom-sheet/show-sheet
|
||||
|
|
|
@ -123,7 +123,6 @@
|
|||
:accessibility-label :appearance-settings-button
|
||||
:chevron true
|
||||
:on-press #(re-frame/dispatch [:navigate-to :quo2-preview])}])
|
||||
;; :on-press #(re-frame/dispatch [:init-root-nav2 :home-stack])}])
|
||||
[quo/list-item
|
||||
{:icon :main-icons/appearance
|
||||
:title (i18n/label :t/appearance)
|
||||
|
|
|
@ -120,7 +120,6 @@
|
|||
[quo2.screens.main :as quo2.preview]
|
||||
[status-im.utils.config :as config]
|
||||
[status-im.navigation2.screens :as navigation2.screens]))
|
||||
;[status-im.navigation2.stack-with-switcher :as stack-with-switcher]))
|
||||
;[quo2.foundations.colors :as quo2.colors]))
|
||||
|
||||
(def components
|
||||
|
@ -131,7 +130,7 @@
|
|||
{:id id
|
||||
:icon (icons/icon-source icon)})
|
||||
|
||||
(def screens
|
||||
(defn screens []
|
||||
(concat [;;INTRO, ONBOARDING, LOGIN
|
||||
|
||||
;Multiaccounts
|
||||
|
@ -228,7 +227,6 @@
|
|||
:rightButtons (right-button-options :chat :more)}}
|
||||
:right-handler chat/topbar-button
|
||||
:component chat/chat}
|
||||
;; :component #(stack-with-switcher/overlap-stack chat/chat :chat)}
|
||||
|
||||
;Pinned messages
|
||||
{:name :chat-pinned-messages
|
||||
|
@ -897,5 +895,7 @@
|
|||
quo2.preview/screens)
|
||||
(when config/quo-preview-enabled?
|
||||
navigation2.screens/screens)
|
||||
(when @config/new-ui-enabled?
|
||||
navigation2.screens/screen-overwrites)
|
||||
(when config/quo-preview-enabled?
|
||||
quo2.preview/main-screens)))
|
||||
|
|
|
@ -21,7 +21,7 @@
|
|||
(fn [acc screen]
|
||||
(assoc acc (:name screen) screen))
|
||||
{}
|
||||
screens/screens))
|
||||
(screens/screens)))
|
||||
|
||||
;;we need this for hot reload (for some reason it doesn't reload, so we have to call get-screens if debug true)
|
||||
(def screens (get-screens))
|
||||
|
@ -58,7 +58,11 @@
|
|||
(defn screen [key]
|
||||
(reagent.core/reactify-component
|
||||
(fn []
|
||||
(let [{:keys [component insets]} (get (if js/goog.DEBUG (get-screens) screens) (keyword key))]
|
||||
(let [{:keys [component insets]} (get
|
||||
(if (or js/goog.DEBUG @config/new-ui-enabled?)
|
||||
(get-screens)
|
||||
screens)
|
||||
(keyword key))]
|
||||
^{:key (str "root" key @reloader/cnt)}
|
||||
[react/safe-area-provider
|
||||
[react/safe-area-consumer
|
||||
|
|
|
@ -172,3 +172,5 @@
|
|||
:icons ["https://statusnetwork.com/img/press-kit-status-logo.svg"]})
|
||||
|
||||
(def wallet-connect-project-id "87815d72a81d739d2a7ce15c2cfdefb3")
|
||||
|
||||
(def new-ui-enabled? (atom false))
|
||||
|
|
|
@ -1737,5 +1737,6 @@
|
|||
"manage-connections": "Manage connections from within Application Connections",
|
||||
"wallet-manage-app-connections": "Manage app connections",
|
||||
"connection-request": "Connection Request",
|
||||
"disconnect": "Disconnect"
|
||||
"disconnect": "Disconnect",
|
||||
"new-ui": "New UI"
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue