Reagent atom from theme regression #19729 (#19735)

This commit is contained in:
flexsurfer 2024-04-24 15:05:53 +02:00 committed by GitHub
parent 9db49b8ca0
commit 3794742c8f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
15 changed files with 214 additions and 218 deletions

View File

@ -59,7 +59,7 @@
:selected-storage-type :default :selected-storage-type :default
:selected-id (-> result first :id) :selected-id (-> result first :id)
:step :choose-key)))) :step :choose-key))))
:navigate-to :choose-name}) :navigate-to [:choose-name (:theme db)]})
(rf/defn generate-and-derive-addresses (rf/defn generate-and-derive-addresses
{:events [:generate-and-derive-addresses]} {:events [:generate-and-derive-addresses]}

View File

@ -12,8 +12,8 @@
container-style)) container-style))
(defn input (defn input
[] [theme]
(assoc (text/text-style {} nil) (assoc (text/text-style {} theme)
:height 32 :height 32
:flex-grow 1 :flex-grow 1
:padding-vertical 5 :padding-vertical 5

View File

@ -61,7 +61,7 @@
[rn/view {:style (style/container container-style)} [rn/view {:style (style/container container-style)}
[rn/text-input [rn/text-input
(merge {:accessibility-label :recovery-phrase-input (merge {:accessibility-label :recovery-phrase-input
:style (style/input) :style (style/input theme)
:placeholder-text-color (style/placeholder-color state theme blur?) :placeholder-text-color (style/placeholder-color state theme blur?)
:cursor-color (style/cursor-color customization-color theme) :cursor-color (style/cursor-color customization-color theme)
:keyboard-appearance theme :keyboard-appearance theme

View File

@ -63,22 +63,23 @@
(defn notification (defn notification
[{title-text :title :keys [avatar user header title-weight text body container-style theme]}] [{title-text :title :keys [avatar user header title-weight text body container-style theme]}]
(let [theme theme (let [context-theme (quo.theme/use-theme)
body (or body (when text [message text theme])) theme (or theme context-theme)
header (or header body (or body (when text [message text theme]))
(when title-text header (or header
[title (when title-text
{:text title-text [title
:weight title-weight {:text title-text
:theme theme :weight title-weight
:multiline? (some? body)}])) :theme theme
header (when header [header-container header]) :multiline? (some? body)}]))
body (when body [body-container body]) header (when header [header-container header])
user-avatar (or avatar (when user (user-avatar/user-avatar user))) body (when body [body-container body])
avatar (when user-avatar user-avatar (or avatar (when user (user-avatar/user-avatar user)))
[avatar-container avatar (when user-avatar
{:multiline? (and header body)} [avatar-container
user-avatar])] {:multiline? (and header body)}
user-avatar])]
[quo.theme/provider theme [quo.theme/provider theme
[notification-container [notification-container
{:avatar avatar {:avatar avatar

View File

@ -72,7 +72,8 @@
" "
[{:keys [type icon title text action undo-duration undo-on-press container-style theme user] [{:keys [type icon title text action undo-duration undo-on-press container-style theme user]
:or {type :neutral icon :i/placeholder}}] :or {type :neutral icon :i/placeholder}}]
(let [context-theme theme (let [context-theme (quo.theme/use-theme)
context-theme (or theme context-theme)
icon-name (case type icon-name (case type
:positive (if (= theme :light) :positive (if (= theme :light)
:i/correct :i/correct

View File

@ -16,19 +16,21 @@
[schema.core :as schema])) [schema.core :as schema]))
(defn- tag-skeleton (defn- tag-skeleton
[{:keys [theme size text] :or {size 24}} logo-component] [{:keys [size text] :or {size 24}} logo-component]
[rn/view {:style (style/tag-container size)} (let [theme (quo.theme/use-theme)]
logo-component [rn/view {:style (style/tag-container size)}
[rn/view {:style (style/tag-spacing size)} logo-component
[text/text [rn/view {:style (style/tag-spacing size)}
{:style (style/text theme) [text/text
:weight :medium {:style (style/text theme)
:size (if (= size 24) :paragraph-2 :paragraph-1)} :weight :medium
text]]]) :size (if (= size 24) :paragraph-2 :paragraph-1)}
text]]]))
(defn- communities-tag (defn- communities-tag
[{:keys [theme size community-logo community-name blur? channel? channel-name]}] [{:keys [size community-logo community-name blur? channel? channel-name]}]
(let [text-size (if (= size 24) :paragraph-2 :paragraph-1) (let [theme (quo.theme/use-theme)
text-size (if (= size 24) :paragraph-2 :paragraph-1)
icon-size (if (= size 24) 16 20)] icon-size (if (= size 24) 16 20)]
[rn/view {:style (style/tag-container size)} [rn/view {:style (style/tag-container size)}
[fast-image/fast-image {:style (style/circle-logo size) :source community-logo}] [fast-image/fast-image {:style (style/circle-logo size) :source community-logo}]
@ -54,26 +56,28 @@
(str (subs pk 0 5) "..." (subs pk (- (count pk) 3)))) (str (subs pk 0 5) "..." (subs pk (- (count pk) 3))))
(defn- address-tag (defn- address-tag
[{:keys [theme size address]}] [{:keys [size address]}]
[rn/view {:style (style/address size)} (let [theme (quo.theme/use-theme)]
[text/text [rn/view {:style (style/address size)}
{:style (style/text theme) [text/text
:weight :monospace ;; TODO: fix this style (issue #17009) {:style (style/text theme)
:size (if (= size 24) :paragraph-2 :paragraph-1)} :weight :monospace ;; TODO: fix this style (issue #17009)
(trim-public-key address)]]) :size (if (= size 24) :paragraph-2 :paragraph-1)}
(trim-public-key address)]]))
(defn- icon-tag (defn- icon-tag
[{:keys [theme size icon blur? context]}] [{:keys [size icon blur? context]}]
[rn/view {:style (style/icon size)} (let [theme (quo.theme/use-theme)]
[icons/icon icon [rn/view {:style (style/icon size)}
{:color (style/context-tag-icon-color theme blur?) [icons/icon icon
:size (if (= size 24) 12 20)}] {:color (style/context-tag-icon-color theme blur?)
[rn/view {:style (style/icon-spacing size)} :size (if (= size 24) 12 20)}]
[text/text [rn/view {:style (style/icon-spacing size)}
{:style (style/text theme) [text/text
:weight :medium {:style (style/text theme)
:size (if (= size 24) :paragraph-2 :paragraph-1)} :weight :medium
context]]]) :size (if (= size 24) :paragraph-2 :paragraph-1)}
context]]]))
(defn- view-internal (defn- view-internal
[{:keys [type size state blur? customization-color profile-picture full-name users [{:keys [type size state blur? customization-color profile-picture full-name users

View File

@ -92,36 +92,36 @@
(oops/oget "nativeEvent.selection") (oops/oget "nativeEvent.selection")
(js->clj :keywordize-keys true) (js->clj :keywordize-keys true)
(on-selection-change))))] (on-selection-change))))]
(fn [{:keys [theme token customization-color show-keyboard? crypto? currency value error? (fn [{:keys [token customization-color show-keyboard? crypto? currency value error? selection]
selection]
:or {show-keyboard? true}}] :or {show-keyboard? true}}]
[rn/view {:style {:flex 1}} (let [theme (quo.theme/use-theme)]
[rn/pressable {:on-press on-token-press} [rn/view {:style {:flex 1}}
[token/view [rn/pressable {:on-press on-token-press}
{:token token [token/view
:size :size-32}]] {:token token
[rn/pressable :size :size-32}]]
{:style style/text-input-container [rn/pressable
:on-press focus-input} {:style style/text-input-container
[rn/text-input :on-press focus-input}
(cond-> {:style (style/text-input theme error?) [rn/text-input
:placeholder-text-color (style/placeholder-text theme) (cond-> {:style (style/text-input theme error?)
:auto-focus true :placeholder-text-color (style/placeholder-text theme)
:ref set-ref :auto-focus true
:placeholder "0" :ref set-ref
:keyboard-type :numeric :placeholder "0"
:max-length 12 :keyboard-type :numeric
:on-change-text handle-on-change-text :max-length 12
:selection-color customization-color :on-change-text handle-on-change-text
:show-soft-input-on-focus show-keyboard? :selection-color customization-color
:on-selection-change handle-selection-change :show-soft-input-on-focus show-keyboard?
:selection (clj->js selection)} :on-selection-change handle-selection-change
controlled-input? (assoc :value value) :selection (clj->js selection)}
(not controlled-input?) (assoc :default-value value-internal))]] controlled-input? (assoc :value value)
[token-label (not controlled-input?) (assoc :default-value value-internal))]]
{:theme theme [token-label
:text (if crypto? token currency) {:theme theme
:value (if controlled-input? value value-internal)}]]))) :text (if crypto? token currency)
:value (if controlled-input? value value-internal)}]]))))
(defn- view-internal (defn- view-internal
[{:keys [container-style value on-swap] :as props}] [{:keys [container-style value on-swap] :as props}]

View File

@ -66,52 +66,53 @@
(defn- view-info-bottom (defn- view-info-bottom
[{:keys [state time-frame metrics date begin-date end-date [{:keys [state time-frame metrics date begin-date end-date
currency-change percentage-change theme]}] currency-change percentage-change]}]
[rn/view {:style style/container-info-bottom} (let [theme (quo.theme/use-theme)]
(when (= state :loading) [rn/view {:style style/container-info-bottom}
[rn/view (when (= state :loading)
{:style {:flex-direction :row [rn/view
:align-items :center}} {:style {:flex-direction :row
(loading-bars [{:width 32 :height 10 :margin 8} :align-items :center}}
{:width 32 :height 10 :margin 2} (loading-bars [{:width 32 :height 10 :margin 8}
{:width 62 :height 10 :margin 4} {:width 32 :height 10 :margin 2}
{:width 10 :height 10 :margin 0}] {:width 62 :height 10 :margin 4}
theme)]) {:width 10 :height 10 :margin 0}]
(when (and (= state :default) (= time-frame :selected)) theme)])
[text/text (when (and (= state :default) (= time-frame :selected))
{:weight :medium [text/text
:size :paragraph-2 {:weight :medium
:style (style/style-text-paragraph theme)} :size :paragraph-2
date]) :style (style/style-text-paragraph theme)}
(when (and (= state :default) (= time-frame :custom)) date])
[rn/view {:style {:flex-direction :row}} (when (and (= state :default) (= time-frame :custom))
[text/text [rn/view {:style {:flex-direction :row}}
{:weight :medium [text/text
:size :paragraph-2 {:weight :medium
:style (style/style-text-paragraph theme)} :size :paragraph-2
begin-date] :style (style/style-text-paragraph theme)}
[icon/icon :i/positive-right begin-date]
{:color (style/color-text-paragraph theme) [icon/icon :i/positive-right
:size 16}] {:color (style/color-text-paragraph theme)
[text/text :size 16}]
{:weight :medium [text/text
:size :paragraph-2 {:weight :medium
:style (style/style-text-paragraph theme)} :size :paragraph-2
end-date]]) :style (style/style-text-paragraph theme)}
(when (and (= state :default) (not (#{:none :selected} time-frame))) end-date]])
[rn/view {:style {:flex-direction :row}} (when (and (= state :default) (not (#{:none :selected} time-frame)))
[text/text [rn/view {:style {:flex-direction :row}}
{:weight :medium [text/text
:size :paragraph-2 {:weight :medium
:style {:color (style/color-text-paragraph theme) :size :paragraph-2
:margin-right 8}} :style {:color (style/color-text-paragraph theme)
(time-frame time-frames)] :margin-right 8}}
(when (and (= state :default) (not= metrics :none)) (time-frame time-frames)]
[view-metrics (when (and (= state :default) (not= metrics :none))
{:metrics metrics [view-metrics
:currency-change currency-change {:metrics metrics
:percentage-change percentage-change :currency-change currency-change
:theme theme}])])]) :percentage-change percentage-change
:theme theme}])])]))
(defn- view-internal (defn- view-internal
[props] [props]

View File

@ -94,30 +94,31 @@
:container-style style/empty-results}]) :container-style style/empty-results}])
(defn- render-list (defn- render-list
[{:keys [theme filtered-data on-viewable-items-changed scroll-enabled? on-scroll [{:keys [filtered-data on-viewable-items-changed scroll-enabled? on-scroll
on-select set-scroll-ref close sheet-animating?]}] on-select set-scroll-ref close sheet-animating?]}]
[gesture/flat-list (let [theme (quo.theme/use-theme)]
{:ref set-scroll-ref [gesture/flat-list
:scroll-enabled @scroll-enabled? {:ref set-scroll-ref
:data (or filtered-data emoji-picker.data/flatten-data) :scroll-enabled @scroll-enabled?
:initial-num-to-render 14 :data (or filtered-data emoji-picker.data/flatten-data)
:max-to-render-per-batch 10 :initial-num-to-render 14
:render-fn render-item :max-to-render-per-batch 10
:get-item-layout get-item-layout :render-fn render-item
:keyboard-dismiss-mode :on-drag :get-item-layout get-item-layout
:keyboard-should-persist-taps :handled :keyboard-dismiss-mode :on-drag
:shows-vertical-scroll-indicator false :keyboard-should-persist-taps :handled
:on-scroll-to-index-failed identity :shows-vertical-scroll-indicator false
:empty-component [empty-result] :on-scroll-to-index-failed identity
:on-scroll on-scroll :empty-component [empty-result]
:render-data {:close close :on-scroll on-scroll
:theme theme :render-data {:close close
:on-select on-select} :theme theme
:content-container-style style/list-container :on-select on-select}
:viewability-config {:item-visible-percent-threshold 100 :content-container-style style/list-container
:minimum-view-time 200} :viewability-config {:item-visible-percent-threshold 100
:on-viewable-items-changed on-viewable-items-changed :minimum-view-time 200}
:window-size (if @sheet-animating? 1 10)}]) :on-viewable-items-changed on-viewable-items-changed
:window-size (if @sheet-animating? 1 10)}]))
(defn- footer (defn- footer
[{:keys [active-category scroll-ref]}] [{:keys [active-category scroll-ref]}]

View File

@ -101,50 +101,52 @@
(defn scroll-page (defn scroll-page
[_ _ _] [_ _ _]
(let [scroll-height (reagent/atom negative-scroll-position-0)] (let [scroll-height (reagent/atom negative-scroll-position-0)]
(fn [{:keys [theme cover-image cover-color logo on-scroll (fn [{:keys [cover-image cover-color logo on-scroll
collapsed? height top-nav title-colum background-color navigate-back? page-nav-props collapsed? height top-nav title-colum background-color navigate-back? page-nav-props
overlay-shown? sticky-header children-style]} overlay-shown? sticky-header children-style]}
children] children]
[:<> (let [theme (quo.theme/use-theme)]
[:f> f-scroll-page-header [:<>
{:scroll-height @scroll-height [:f> f-scroll-page-header
:height height {:scroll-height @scroll-height
:sticky-header sticky-header :height height
:top-nav top-nav :sticky-header sticky-header
:title-colum title-colum :top-nav top-nav
:navigate-back? navigate-back? :title-colum title-colum
:collapsed? collapsed? :navigate-back? navigate-back?
:page-nav-props page-nav-props :collapsed? collapsed?
:overlay-shown? overlay-shown?}] :page-nav-props page-nav-props
[rn/scroll-view :overlay-shown? overlay-shown?}]
{:content-container-style {:flex-grow 1} [rn/scroll-view
:content-inset-adjustment-behavior :never {:content-container-style {:flex-grow 1}
:shows-vertical-scroll-indicator false :content-inset-adjustment-behavior :never
:scroll-event-throttle 16 :shows-vertical-scroll-indicator false
:on-scroll (fn [^js event] :scroll-event-throttle 16
(reset! scroll-height (int :on-scroll (fn [^js event]
(oops/oget (reset! scroll-height (int
event (oops/oget
"nativeEvent.contentOffset.y"))) event
(when on-scroll "nativeEvent.contentOffset.y")))
(on-scroll @scroll-height)))} (when on-scroll
(when cover-color (on-scroll @scroll-height)))}
[rn/view {:style (style/cover-background cover-color)}]) (when cover-color
(when cover-image [rn/view {:style (style/cover-background cover-color)}])
[rn/view {:style {:height (if collapsed? 110 151)}} (when cover-image
[rn/image [rn/view {:style {:height (if collapsed? 110 151)}}
{:source cover-image [rn/image
;; Using negative margin-bottom as a workaround because on Android, {:source cover-image
;; ScrollView clips its children despite setting overflow: 'visible'. ;; Using negative margin-bottom as a workaround because on Android,
;; Related issue: https://github.com/facebook/react-native/issues/31218 ;; ScrollView clips its children despite setting overflow: 'visible'.
:style {:margin-bottom -16 ;; Related issue: https://github.com/facebook/react-native/issues/31218
:flex 1}}]]) :style {:margin-bottom -16
(when children :flex 1}}]])
[rn/view (when children
{:style (style/children-container (merge [rn/view
children-style {:style (style/children-container
{:border-radius (diff-with-max-min @scroll-height 16 0) (merge
:background-color background-color}))} children-style
(when (and (not collapsed?) cover-image) {:border-radius (diff-with-max-min @scroll-height 16 0)
[:f> f-display-picture @scroll-height logo theme]) :background-color background-color}))}
children])]]))) (when (and (not collapsed?) cover-image)
[:f> f-display-picture @scroll-height logo theme])
children])]]))))

View File

@ -209,8 +209,7 @@
featured-communities-count (count featured-communities)] featured-communities-count (count featured-communities)]
(fn [] (fn []
[scroll-page/scroll-page [scroll-page/scroll-page
{:theme theme {:on-scroll #(reset! scroll-height %)
:on-scroll #(reset! scroll-height %)
:page-nav-props {:background :blur} :page-nav-props {:background :blur}
:navigate-back? :true :navigate-back? :true
:height (if (> @scroll-height 360) :height (if (> @scroll-height 360)

View File

@ -147,7 +147,7 @@
(:current-chat-id db)) (:current-chat-id db))
(conj [:chat/close]))}) (conj [:chat/close]))})
{:db (assoc db :view-id go-to-view-id) {:db (assoc db :view-id go-to-view-id)
:navigate-to go-to-view-id})) :navigate-to [go-to-view-id (:theme db)]}))
(rf/defn shell-navigate-back (rf/defn shell-navigate-back
{:events [:shell/navigate-back]} {:events [:shell/navigate-back]}

View File

@ -54,10 +54,10 @@
(reset! state/modals (vec (butlast @state/modals))) (reset! state/modals (vec (butlast @state/modals)))
(reset! state/modals [])) (reset! state/modals []))
(let [component @state/dissmissing] (let [dissmissing @state/dissmissing]
(reset! state/dissmissing false) (reset! state/dissmissing false)
(when (keyword? component) (when (vector? dissmissing)
(effects/open-modal component))))) (effects/open-modal dissmissing)))))
;;;; Toast ;;;; Toast

View File

@ -86,14 +86,14 @@
;;;; Navigate to ;;;; Navigate to
(defn- navigate (defn- navigate
[component] [[component theme]]
(let [{:keys [options]} (get views/screens component)] (let [{:keys [options]} (get views/screens component)]
(dismiss-all-modals) (dismiss-all-modals)
(navigation/push (navigation/push
(name @state/root-id) (name @state/root-id)
{:component {:id component {:component {:id component
:name component :name component
:options (merge (options/root-options {:theme (:theme options)}) :options (merge (options/root-options {:theme (or (:theme options) theme)})
options)}}) options)}})
(state/navigation-state-push {:id component (state/navigation-state-push {:id component
:type :stack :type :stack
@ -139,11 +139,6 @@
(rf/reg-fx :navigate-back navigate-back) (rf/reg-fx :navigate-back navigate-back)
(rf/reg-fx :navigate-replace-fx
(fn [view-id]
(navigate-back)
(navigate view-id)))
(rf/reg-fx :navigate-back-to (rf/reg-fx :navigate-back-to
(fn [comp-id] (fn [comp-id]
(navigation/pop-to (name comp-id)) (navigation/pop-to (name comp-id))
@ -164,18 +159,19 @@
;;;; Modal ;;;; Modal
(defn open-modal (defn open-modal
[component] [[component theme]]
(let [{:keys [options]} (get views/screens component) (let [{:keys [options]} (get views/screens component)
sheet? (:sheet? options)] sheet? (:sheet? options)]
(if @state/dissmissing (if @state/dissmissing
(reset! state/dissmissing component) (reset! state/dissmissing [component theme])
(do (do
(swap! state/modals conj component) (swap! state/modals conj component)
(navigation/show-modal (navigation/show-modal
{:stack {:children [{:component {:stack {:children [{:component
{:name component {:name component
:id component :id component
:options (merge (options/root-options {:theme (:theme options)}) :options (merge (options/root-options {:theme (or (:theme options)
theme)})
options options
(when sheet? (when sheet?
options/sheet-options))}}]}}))) options/sheet-options))}}]}})))

View File

@ -37,7 +37,7 @@
(all-screens-params component screen-params)) (all-screens-params component screen-params))
:fx [[:dispatch [:hide-bottom-sheet]] :fx [[:dispatch [:hide-bottom-sheet]]
[:dispatch [:dismiss-keyboard]] [:dispatch [:dismiss-keyboard]]
[:open-modal-fx component]]})) [:open-modal-fx [component (:theme db)]]]}))
(rf/defn dismiss-modal (rf/defn dismiss-modal
{:events [:dismiss-modal]} {:events [:dismiss-modal]}
@ -80,15 +80,6 @@
{:db (assoc db :view-id stack-id) {:db (assoc db :view-id stack-id)
:effects.shell/change-tab stack-id}) :effects.shell/change-tab stack-id})
(rf/defn navigate-replace
{:events [:navigate-replace]}
[{:keys [db]} go-to-view-id screen-params]
(let [db (cond-> (assoc db :view-id go-to-view-id)
(seq screen-params)
(assoc-in [:navigation/screen-params go-to-view-id] screen-params))]
{:db db
:navigate-replace-fx go-to-view-id}))
(rf/defn hide-bottom-sheet (rf/defn hide-bottom-sheet
{:events [:hide-bottom-sheet]} {:events [:hide-bottom-sheet]}
[{:keys [db]}] [{:keys [db]}]