remove old bottom sheet (#19689)

This commit is contained in:
flexsurfer 2024-04-19 16:17:06 +02:00 committed by GitHub
parent 59f536c479
commit 702899a9cf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
21 changed files with 25 additions and 433 deletions

View File

@ -1,31 +0,0 @@
(ns legacy.status-im.bottom-sheet.events
(:require
[utils.re-frame :as rf]))
(rf/defn show-bottom-sheet-old
[{:keys [db]} {:keys [view options]}]
{:dismiss-keyboard nil
:show-bottom-sheet-overlay-old nil
:db (assoc db
:bottom-sheet/show? true
:bottom-sheet/view view
:bottom-sheet/options options)})
(rf/defn show-bottom-sheet-event
{:events [:bottom-sheet/show-sheet-old]}
[cofx view options]
(show-bottom-sheet-old
cofx
{:view view
:options options}))
(rf/defn hide-bottom-sheet-old
{:events [:bottom-sheet/hide-old]}
[{:keys [db]}]
{:db (assoc db :bottom-sheet/show? false)
:dismiss-bottom-sheet-overlay-old nil})
(rf/defn hide-bottom-sheet-navigation-overlay
{:events [:bottom-sheet/hide-old-navigation-overlay]}
[{}]
{:dismiss-bottom-sheet-overlay-old nil})

View File

@ -1,37 +0,0 @@
(ns legacy.status-im.bottom-sheet.sheets
(:require
[legacy.status-im.bottom-sheet.view :as bottom-sheet]
[legacy.status-im.ui.screens.about-app.views :as about-app]
[legacy.status-im.ui.screens.mobile-network-settings.view :as mobile-network-settings]
[quo.theme]
[react-native.core :as rn]
[utils.re-frame :as rf]))
(defn bottom-sheet
[]
(let [dismiss-bottom-sheet-callback (fn []
(rf/dispatch [:bottom-sheet/hide-old])
true)
{:keys [show? view options]} (rf/sub [:bottom-sheet-old])
{:keys [content]
:as opts}
(cond-> {:visible? show?}
(map? view)
(merge view)
(= view :mobile-network-offline)
(merge mobile-network-settings/offline-sheet)
(= view :learn-more)
(merge about-app/learn-more))]
[:f>
(fn []
(rn/use-mount (fn []
(rn/hw-back-add-listener dismiss-bottom-sheet-callback)
(fn []
(rn/hw-back-remove-listener dismiss-bottom-sheet-callback))))
[quo.theme/provider (or (:theme options))
[bottom-sheet/bottom-sheet opts
(when content
[content (when options options)])]])]))

View File

@ -1,59 +0,0 @@
(ns legacy.status-im.bottom-sheet.styles
(:require
[quo.foundations.colors :as colors]))
(def border-radius 20)
(defn handle
[override-theme]
{:position :absolute
:top 8
:width 32
:height 4
:background-color (colors/theme-colors colors/neutral-100 colors/white override-theme)
:opacity 0.1
:border-radius 100
:align-self :center})
(def backdrop
{:position :absolute
:left 0
:right 0
:bottom 0
:top 0})
(def backdrop-color
{:background-color colors/neutral-100})
(def container
{:position :absolute
:left 0
:right 0
:top 0
:bottom 0
:overflow :hidden})
(defn content-style
[insets bottom-safe-area-spacing?]
{:position :absolute
:left 0
:right 0
:top 0
:padding-top border-radius
:padding-bottom (if bottom-safe-area-spacing? (:bottom insets) 0)})
(defn selected-background
[override-theme]
{:border-radius 12
:padding-left 12
:margin-horizontal 8
:margin-bottom 10
:height 48
:background-color (colors/theme-colors colors/white colors/neutral-90 override-theme)})
(defn background
[override-theme]
{:background-color (colors/theme-colors colors/white colors/neutral-95 override-theme)
:flex 1
:border-top-left-radius border-radius
:border-top-right-radius border-radius})

View File

@ -1,240 +0,0 @@
(ns legacy.status-im.bottom-sheet.view
(:require
[legacy.status-im.bottom-sheet.styles :as styles]
[oops.core :refer [oget]]
[re-frame.core :as re-frame]
[react-native.background-timer :as timer]
[react-native.core :as react]
[react-native.core :as rn]
[react-native.gesture :as gesture]
[react-native.hooks :as hooks]
[react-native.platform :as platform]
[react-native.reanimated :as reanimated]
[react-native.safe-area :as safe-area]
[reagent.core :as reagent]
[utils.worklets.bottom-sheet :as worklets.bottom-sheet]))
(def animation-delay 450)
(defn with-animation
[value]
(reanimated/with-spring
value
(clj->js {:mass 2
:stiffness 500
:damping 200})))
(defn get-bottom-sheet-gesture
[pan-y translate-y bg-height bg-height-expanded
window-height keyboard-shown disable-drag? expandable?
show-bottom-sheet? expanded? close-bottom-sheet gesture-running?]
(-> (gesture/gesture-pan)
(gesture/on-start
(fn [_]
(reset! gesture-running? true)
(when (and keyboard-shown (not disable-drag?) show-bottom-sheet?)
(re-frame/dispatch [:dismiss-keyboard]))))
(gesture/on-update
(fn [evt]
(when (and (not disable-drag?) show-bottom-sheet?)
(let [max-pan-up (if (or @expanded? (not expandable?))
0
(- (- bg-height-expanded bg-height)))
max-pan-down (if @expanded?
bg-height-expanded
bg-height)]
(reanimated/set-shared-value pan-y
(max
(min
(.-translationY evt)
max-pan-down)
max-pan-up))))))
(gesture/on-end
(fn [_]
(reset! gesture-running? false)
(when (and (not disable-drag?) show-bottom-sheet?)
(let [end-pan-y (- window-height (.-value translate-y))
expand-threshold (min (* bg-height 1.1) (+ bg-height 50))
collapse-threshold (max (* bg-height-expanded 0.9) (- bg-height-expanded 50))
should-close-bottom-sheet? (< end-pan-y (max (* bg-height 0.7) 50))]
(cond
should-close-bottom-sheet?
(close-bottom-sheet)
(and (not @expanded?) (> end-pan-y expand-threshold))
(reset! expanded? true)
(and @expanded? (< end-pan-y collapse-threshold))
(reset! expanded? false))))))))
(defn handle-view
[window-width override-theme]
[rn/view
{:style {:width window-width
:position :absolute
:background-color :transparent
:top 0
:height 20}}
[rn/view {:style (styles/handle override-theme)}]])
(defn bottom-sheet
[props children]
(let [{on-cancel :on-cancel
disable-drag? :disable-drag?
show-handle? :show-handle?
visible? :visible?
backdrop-dismiss? :backdrop-dismiss?
expandable? :expandable?
bottom-safe-area-spacing? :bottom-safe-area-spacing?
selected-item :selected-item
is-initially-expanded? :expanded?
override-theme :override-theme
:or {show-handle? true
backdrop-dismiss? true
expandable? false
bottom-safe-area-spacing? true
is-initially-expanded? false}}
props
content-height (reagent/atom nil)
show-bottom-sheet? (reagent/atom nil)
keyboard-was-shown? (reagent/atom false)
expanded? (reagent/atom is-initially-expanded?)
gesture-running? (reagent/atom false)
reset-atoms (fn []
(reset! show-bottom-sheet? nil)
(reset! content-height nil)
(reset! expanded? false)
(reset! keyboard-was-shown? false)
(reset! gesture-running? false))
close-bottom-sheet (fn []
(reset! show-bottom-sheet? false)
(when (fn? on-cancel) (on-cancel))
(timer/set-timeout
#(do
(re-frame/dispatch [:bottom-sheet/hide-old-navigation-overlay])
(reset-atoms))
animation-delay))]
[:f>
(fn []
(let [{height :height
window-width :width}
(rn/get-window)
window-height (if selected-item (- height 72) height)
{:keys [keyboard-shown]} (hooks/use-keyboard)
insets (safe-area/get-insets)
bg-height-expanded (- window-height (:top insets))
bg-height (max (min @content-height bg-height-expanded) 109)
bottom-sheet-dy (reanimated/use-shared-value 0)
pan-y (reanimated/use-shared-value 0)
translate-y (worklets.bottom-sheet/use-translate-y window-height bottom-sheet-dy pan-y)
bg-opacity
(worklets.bottom-sheet/use-background-opacity translate-y bg-height window-height 0.7)
on-content-layout (fn [evt]
(let [height (oget evt "nativeEvent" "layout" "height")]
(reset! content-height height)))
on-expanded (fn []
(reanimated/set-shared-value bottom-sheet-dy bg-height-expanded)
(reanimated/set-shared-value pan-y 0))
on-collapsed (fn []
(reanimated/set-shared-value bottom-sheet-dy bg-height)
(reanimated/set-shared-value pan-y 0))
bottom-sheet-gesture (get-bottom-sheet-gesture
pan-y
translate-y
bg-height
bg-height-expanded
window-height
keyboard-shown
disable-drag?
expandable?
show-bottom-sheet?
expanded?
close-bottom-sheet
gesture-running?)
handle-comp [gesture/gesture-detector {:gesture bottom-sheet-gesture}
[handle-view window-width override-theme]]]
(react/use-effect #(do
(cond
(and
(nil? @show-bottom-sheet?)
visible?
(some? @content-height)
(> @content-height 0))
(reset! show-bottom-sheet? true)
(and @show-bottom-sheet? (not visible?))
(close-bottom-sheet)))
[@show-bottom-sheet? @content-height visible?])
(react/use-effect #(do
(when @show-bottom-sheet?
(cond
keyboard-shown
(do
(reset! keyboard-was-shown? true)
(reset! expanded? true))
(and @keyboard-was-shown? (not keyboard-shown))
(reset! expanded? false))))
[@show-bottom-sheet? @keyboard-was-shown? keyboard-shown])
(react/use-effect #(do
(when-not @gesture-running?
(cond
@show-bottom-sheet?
(if @expanded?
(do
(reanimated/set-shared-value
bottom-sheet-dy
(with-animation (+ bg-height-expanded (.-value pan-y))))
;; Workaround for
;; https://github.com/software-mansion/react-native-reanimated/issues/1758#issue-817145741
;; withTiming/withSpring callback not working on-expanded
;; should be called as a callback of with-animation instead,
;; once this issue has been resolved
(timer/set-timeout on-expanded animation-delay))
(do
(reanimated/set-shared-value
bottom-sheet-dy
(with-animation (+ bg-height (.-value pan-y))))
;; Workaround for
;; https://github.com/software-mansion/react-native-reanimated/issues/1758#issue-817145741
;; withTiming/withSpring callback not working on-collapsed
;; should be called as a callback of with-animation instead,
;; once this issue has been resolved
(timer/set-timeout on-collapsed animation-delay)))
(= @show-bottom-sheet? false)
(reanimated/set-shared-value bottom-sheet-dy (with-animation 0)))))
[@show-bottom-sheet? @expanded? @gesture-running?])
[:<>
[rn/pressable
{:on-press (when backdrop-dismiss? close-bottom-sheet)
:style styles/backdrop}
[reanimated/view
{:style (reanimated/apply-animations-to-style
{:opacity bg-opacity}
styles/backdrop-color)}]]
(cond->> [reanimated/view
{:style (reanimated/apply-animations-to-style
{:transform [{:translateY translate-y}]}
{:width window-width
:height window-height})}
[rn/view {:style styles/container}
(when selected-item
[rn/view {:style (styles/selected-background override-theme)}
[selected-item]])
[rn/view {:style (styles/background override-theme)}
[rn/keyboard-avoiding-view
{:behaviour (if platform/ios? :padding :height)
:style {:flex 1}}
[rn/view
{:style (styles/content-style insets bottom-safe-area-spacing?)
:on-layout (when-not (and
(some? @content-height)
(> @content-height 0))
on-content-layout)}
children]]
(when show-handle?
handle-comp)]]]
(not show-handle?)
(conj [gesture/gesture-detector {:gesture bottom-sheet-gesture}]))]))]))

View File

@ -2,7 +2,6 @@
(:require
["eth-phishing-detect" :as eth-phishing-detect]
[clojure.string :as string]
[legacy.status-im.bottom-sheet.events :as bottom-sheet]
[legacy.status-im.browser.permissions :as browser.permissions]
[legacy.status-im.browser.webview-ref :as webview-ref]
[legacy.status-im.ethereum.ens :as ens]
@ -519,7 +518,7 @@
[{:keys [db] :as cofx} address]
(rf/merge cofx
{:browser/clear-web-data nil}
(bottom-sheet/hide-bottom-sheet-old)
(navigation/hide-bottom-sheet)
(browser.permissions/clear-dapps-permissions)
(multiaccounts.update/multiaccount-update :dapps-address address {})
#(when (= (:view-id db) :browser)

View File

@ -1,7 +1,6 @@
(ns legacy.status-im.communities.core
(:require
[clojure.set :as set]
[legacy.status-im.bottom-sheet.events :as bottom-sheet]
legacy.status-im.communities.e2e
[re-frame.core :as re-frame]
[status-im.contexts.shell.activity-center.events :as activity-center]
@ -34,18 +33,11 @@
(navigation/navigate-back)
(handle-response response-js)))
(re-frame/reg-event-fx ::member-banned
(fn [{:keys [db]} [response-js]]
{:db (assoc db :bottom-sheet/show? false)
:fx [[:dismiss-bottom-sheet-overlay-old]
[:sanitize-messages-and-process-response response-js]
[:activity-center.notifications/fetch-unread-count]]}))
(rf/defn member-banned
{:events [::member-banned]}
[cofx response-js]
(rf/merge cofx
(bottom-sheet/hide-bottom-sheet-old)
(navigation/hide-bottom-sheet)
(handle-response response-js)
(activity-center/notifications-fetch-unread-count)))
@ -66,7 +58,7 @@
{:events [::member-kicked]}
[cofx response-js]
(rf/merge cofx
(bottom-sheet/hide-bottom-sheet-old)
(navigation/hide-bottom-sheet)
(handle-response response-js)))
(rf/defn member-kick
@ -100,7 +92,7 @@
{:events [:community.member/role-updated]}
[cofx response-js]
(rf/merge cofx
(bottom-sheet/hide-bottom-sheet-old)
(navigation/hide-bottom-sheet)
(handle-response response-js)))
(rf/defn add-role-to-member

View File

@ -3,7 +3,6 @@
(:require
[clojure.set :as set]
[clojure.string :as string]
[legacy.status-im.bottom-sheet.events :as bottom-sheet]
[legacy.status-im.ethereum.ens :as ens]
[legacy.status-im.multiaccounts.update.core :as multiaccounts.update]
[legacy.status-im.utils.random :as random]
@ -288,7 +287,7 @@
[{:keys [db] :as cofx} _ {:keys [address]}]
(rf/merge cofx
{:db (assoc-in db [:ens/registration :address] address)}
(bottom-sheet/hide-bottom-sheet-old)))
(navigation/hide-bottom-sheet)))
(rf/defn save-preferred-name
{:events [::save-preferred-name]}

View File

@ -1,6 +1,5 @@
(ns legacy.status-im.mobile-sync-settings.core
(:require
[legacy.status-im.bottom-sheet.events :as bottom-sheet]
[legacy.status-im.mailserver.core :as mailserver]
[legacy.status-im.multiaccounts.model :as multiaccounts.model]
[legacy.status-im.multiaccounts.update.core :as multiaccounts.update]
@ -31,7 +30,7 @@
(assoc :mailserver/current-request true))
:fx [(when fetch-historic-messages?
[:mailserver/request-all-historic-messages])
[:dismiss-bottom-sheet-overlay-old]
[:dispatch [:hide-bottom-sheet]]
(when previously-initialized?
(let [new-identity-input (get-in db [:contacts/new-identity :input])]
[:dispatch [:contacts/set-new-identity {:input new-identity-input}]]))]}
@ -101,10 +100,10 @@
[cofx]
(rf/merge
cofx
(bottom-sheet/hide-bottom-sheet-old)
(navigation/hide-bottom-sheet)
(navigation/navigate-to :mobile-network-settings nil)))
(rf/defn mobile-network-show-offline-sheet
{:events [:mobile-network/show-offline-sheet]}
[cofx]
(bottom-sheet/hide-bottom-sheet-old cofx))
(navigation/hide-bottom-sheet cofx))

View File

@ -31,7 +31,7 @@
:on-press #(re-frame/dispatch [:browser.ui/open-url url])
:on-long-press (fn []
(re-frame/dispatch
[:bottom-sheet/show-sheet-old
[:show-bottom-sheet
{:content (fn []
[react/view {:flex 1}
[list.item/list-item
@ -110,7 +110,7 @@
[quo/button
{:accessibility-label :select-account
:type :scale
:on-press #(re-frame/dispatch [:bottom-sheet/show-sheet-old
:on-press #(re-frame/dispatch [:show-bottom-sheet
{:content (accounts/accounts-list accounts
dapps-account)}])}
[react/view (styles/dapps-account color)

View File

@ -91,7 +91,7 @@
[icons/icon :main-icons/arrow-right {:color colors/black}]]
[react/touchable-highlight
{:accessibility-label :select-account
:on-press #(re-frame/dispatch [:bottom-sheet/show-sheet-old
:on-press #(re-frame/dispatch [:show-bottom-sheet
{:content (accounts/accounts-list accounts
dapps-account)}])}
[chat-icon/custom-icon-view-list (:name dapps-account) (:color dapps-account) 32]]
@ -108,7 +108,7 @@
[icons/icon :main-icons/qr {:color colors/black}]]
[react/touchable-highlight
{:on-press #(re-frame/dispatch
[:bottom-sheet/show-sheet-old
[:show-bottom-sheet
{:content (options/browser-options
url
dapps-account
@ -162,7 +162,7 @@
(defn request-resources-access-for-page
[resources url webview-ref]
(re-frame/dispatch
[:bottom-sheet/show-sheet-old
[:show-bottom-sheet
{:content (fn [] [request-resources-panel resources url webview-ref])
:show-handle? false
:backdrop-dismiss? false
@ -172,7 +172,7 @@
(defn block-resources-access-and-notify-user
[url]
(.answerPermissionRequest ^js @webview-ref/webview-ref false)
(re-frame/dispatch [:bottom-sheet/show-sheet-old
(re-frame/dispatch [:show-bottom-sheet
{:content (fn [] [block-resources-panel url])}]))
;; should-component-update is called only when component's props are changed,

View File

@ -73,7 +73,7 @@
:accessory (when (not= public-key my-public-key)
[quo/button
{:on-press
#(rf/dispatch [:bottom-sheet/show-sheet-old
#(rf/dispatch [:show-bottom-sheet
{:content (fn []
[member-sheet primary-name member community-id
can-kick-users? can-manage-users? admin?])}])

View File

@ -757,7 +757,7 @@
[profile.components/settings-item
{:label-kw :ens-primary-username
:value preferred-name
:action-fn #(re-frame/dispatch [:bottom-sheet/show-sheet-old
:action-fn #(re-frame/dispatch [:show-bottom-sheet
{:content
(fn [] (name-list names preferred-name))}])}]])]]])

View File

@ -74,7 +74,7 @@
(not= public-key current-user-identity))
{:accessory [quo/button
{:on-press #(re-frame/dispatch
[:bottom-sheet/show-sheet-old
[:bottom-sheet/show-sheet
{:content (fn []
[member-sheet chat-id member admin?])}])
:type :icon
@ -146,7 +146,7 @@
[list.item/list-item
{:title (profile.utils/displayed-name contact)
:icon [chat-icon/contact-icon-contacts-tab contact]
:on-press #(re-frame/dispatch [:bottom-sheet/show-sheet-old
:on-press #(re-frame/dispatch [:show-bottom-sheet
{:content (fn []
[invitation-sheet invitation contact])}])}]))

View File

@ -218,7 +218,7 @@
:use-insets true
:extended-header (profile-header/extended-header
{:on-press on-share
:on-edit #(re-frame/dispatch [:bottom-sheet/show-sheet-old
:on-edit #(re-frame/dispatch [:show-bottom-sheet
{:content (edit/bottom-sheet
has-picture)}])
:color (user-avatar.style/customization-color customization-color

View File

@ -2,7 +2,6 @@
(:require
[clojure.string :as string]
[goog.string :as gstring]
[legacy.status-im.bottom-sheet.events :as bottom-sheet]
[legacy.status-im.ui.components.react :as react]
[legacy.status-im.utils.build :as build]
[legacy.status-im.utils.deprecated-types :as types]
@ -13,6 +12,7 @@
[status-im.common.json-rpc.events :as json-rpc]
[status-im.common.log :as log]
[status-im.config :as config]
[status-im.navigation.events :as navigation]
[utils.datetime :as datetime]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
@ -226,7 +226,7 @@
{:db (assoc db :bug-report/description-error error)}
(rf/merge
cofx
(bottom-sheet/hide-bottom-sheet-old)
(navigation/hide-bottom-sheet)
(send-logs :email))))
(re-frame/reg-fx
@ -254,5 +254,5 @@
(rf/merge
cofx
{:db (dissoc db :bug-report/details)}
(bottom-sheet/hide-bottom-sheet-old)
(navigation/hide-bottom-sheet)
(submit-issue)))

View File

@ -114,7 +114,7 @@
:params [key-uid (string/replace-first path #"file://" "") ax ay bx
by]
:on-success [:profile.settings/update-local-picture]}]]
[:dismiss-bottom-sheet-overlay-old]]})))
[:dispatch [:hide-bottom-sheet]]]})))
(rf/reg-event-fx :profile.settings/save-profile-picture-from-url
(fn [{:keys [db]} [url]]
@ -126,7 +126,7 @@
:params [key-uid url]
:on-error #(log/error "::save-profile-picture-from-url error" %)
:on-success [:profile.settings/update-local-picture]}]]
[:dismiss-bottom-sheet-overlay-old]]})))
[:dispatch [:hide-bottom-sheet]]]})))
(rf/reg-event-fx :profile.settings/delete-profile-picture
(fn [{:keys [db]}]
@ -140,7 +140,7 @@
;; NOTE: In case of an error we could fallback to previous image in
;; UI with a toast error
:on-success #(log/info "[profile] Delete profile image" %)}]]
[:dismiss-bottom-sheet-overlay-old]]})))
[:dispatch [:hide-bottom-sheet]]]})))
(rf/reg-event-fx :profile.settings/update-local-picture
(fn [{:keys [db]} [images]]

View File

@ -1,6 +1,5 @@
(ns status-im.events
(:require
[legacy.status-im.bottom-sheet.events]
status-im.common.alert-banner.events
status-im.common.alert.effects
status-im.common.async-storage.effects

View File

@ -86,10 +86,6 @@
(fn [] views/alert-banner))
;;;; LEGACY (should be removed in status 2.0)
(navigation/register-component
"bottom-sheet-old"
(fn [] (gesture/gesture-handler-root-hoc views/sheet-comp-old))
(fn [] views/sheet-comp-old))
(navigation/register-component
"popover"

View File

@ -285,12 +285,6 @@
(rf/reg-fx :hide-visibility-status-popover
(fn [] (navigation/dissmiss-overlay "visibility-status-popover")))
(rf/reg-fx :show-bottom-sheet-overlay-old
(fn [] (show-overlay "bottom-sheet-old")))
(rf/reg-fx :dismiss-bottom-sheet-overlay-old
(fn [] (navigation/dissmiss-overlay "bottom-sheet-old")))
(rf/reg-fx :show-wallet-connect-sheet
(fn [] (show-overlay "wallet-connect-sheet")))

View File

@ -1,6 +1,5 @@
(ns status-im.navigation.view
(:require
[legacy.status-im.bottom-sheet.sheets :as bottom-sheets-old]
[legacy.status-im.ui.screens.popover.views :as popover]
[quo.foundations.colors :as colors]
[quo.theme]
@ -123,14 +122,6 @@
functional-compiler))
;; LEGACY (should be removed in status 2.0)
(def sheet-comp-old
(reagent/reactify-component
(fn []
^{:key (str "sheet-old" @reloader/cnt)}
[:<>
[inactive]
[bottom-sheets-old/bottom-sheet]])
functional-compiler))
(def popover-comp
(reagent/reactify-component

View File

@ -139,16 +139,6 @@
(fn [seed]
(or seed {:step :intro})))
(re-frame/reg-sub
:bottom-sheet-old
:<- [:bottom-sheet/show?]
:<- [:bottom-sheet/view]
:<- [:bottom-sheet/options]
(fn [[show? view options]]
{:show? show?
:view view
:options options}))
(re-frame/reg-sub
:is-contact-selected?
:<- [:group/selected-contacts]