status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/legacy/status_im/multiaccounts/create/core.cljs
View File

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

4
src/quo/components/inputs/recovery_phrase/style.cljs
View File

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

2
src/quo/components/inputs/recovery_phrase/view.cljs
View File

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

33
src/quo/components/notifications/notification/view.cljs
View File

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

3
src/quo/components/notifications/toast/view.cljs
View File

@ -72,7 +72,8 @@
"
[{:keys [type icon title text action undo-duration undo-on-press container-style theme user]
: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
:positive (if (= theme :light)
:i/correct

62
src/quo/components/tags/context_tag/view.cljs
View File

@ -16,19 +16,21 @@
[schema.core :as schema]))
(defn- tag-skeleton
[{:keys [theme size text] :or {size 24}} logo-component]
[rn/view {:style (style/tag-container size)}
logo-component
[rn/view {:style (style/tag-spacing size)}
[text/text
{:style (style/text theme)
:weight :medium
:size (if (= size 24) :paragraph-2 :paragraph-1)}
text]]])
[{:keys [size text] :or {size 24}} logo-component]
(let [theme (quo.theme/use-theme)]
[rn/view {:style (style/tag-container size)}
logo-component
[rn/view {:style (style/tag-spacing size)}
[text/text
{:style (style/text theme)
:weight :medium
:size (if (= size 24) :paragraph-2 :paragraph-1)}
text]]]))
(defn- communities-tag
[{:keys [theme size community-logo community-name blur? channel? channel-name]}]
(let [text-size (if (= size 24) :paragraph-2 :paragraph-1)
[{:keys [size community-logo community-name blur? channel? channel-name]}]
(let [theme (quo.theme/use-theme)
text-size (if (= size 24) :paragraph-2 :paragraph-1)
icon-size (if (= size 24) 16 20)]
[rn/view {:style (style/tag-container size)}
[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))))
(defn- address-tag
[{:keys [theme size address]}]
[rn/view {:style (style/address size)}
[text/text
{:style (style/text theme)
:weight :monospace ;; TODO: fix this style (issue #17009)
:size (if (= size 24) :paragraph-2 :paragraph-1)}
(trim-public-key address)]])
[{:keys [size address]}]
(let [theme (quo.theme/use-theme)]
[rn/view {:style (style/address size)}
[text/text
{:style (style/text theme)
:weight :monospace ;; TODO: fix this style (issue #17009)
:size (if (= size 24) :paragraph-2 :paragraph-1)}
(trim-public-key address)]]))
(defn- icon-tag
[{:keys [theme size icon blur? context]}]
[rn/view {:style (style/icon size)}
[icons/icon icon
{:color (style/context-tag-icon-color theme blur?)
:size (if (= size 24) 12 20)}]
[rn/view {:style (style/icon-spacing size)}
[text/text
{:style (style/text theme)
:weight :medium
:size (if (= size 24) :paragraph-2 :paragraph-1)}
context]]])
[{:keys [size icon blur? context]}]
(let [theme (quo.theme/use-theme)]
[rn/view {:style (style/icon size)}
[icons/icon icon
{:color (style/context-tag-icon-color theme blur?)
:size (if (= size 24) 12 20)}]
[rn/view {:style (style/icon-spacing size)}
[text/text
{:style (style/text theme)
:weight :medium
:size (if (= size 24) :paragraph-2 :paragraph-1)}
context]]]))
(defn- view-internal
[{:keys [type size state blur? customization-color profile-picture full-name users

58
src/quo/components/wallet/token_input/view.cljs
View File

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

93
src/quo/components/wallet/wallet_overview/view.cljs
View File

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

47
src/status_im/common/emoji_picker/view.cljs
View File

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

90
src/status_im/common/scroll_page/view.cljs
View File

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

3
src/status_im/contexts/communities/discover/view.cljs
View File

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

2
src/status_im/contexts/shell/jump_to/events.cljs
View File

@ -147,7 +147,7 @@
(:current-chat-id db))
(conj [:chat/close]))})
{: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
{:events [:shell/navigate-back]}

6
src/status_im/navigation/core.cljs
View File

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

16
src/status_im/navigation/effects.cljs
View File

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

11
src/status_im/navigation/events.cljs
View File

@ -37,7 +37,7 @@
(all-screens-params component screen-params))
:fx [[:dispatch [:hide-bottom-sheet]]
[:dispatch [:dismiss-keyboard]]
[:open-modal-fx component]]}))
[:open-modal-fx [component (:theme db)]]]}))
(rf/defn dismiss-modal
{:events [:dismiss-modal]}
@ -80,15 +80,6 @@
{:db (assoc db :view-id 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
{:events [:hide-bottom-sheet]}
[{:keys [db]}]