From c003db42ae4b0b4469043cbd13aece66e1862176 Mon Sep 17 00:00:00 2001 From: mmilad75 <55688834+mmilad75@users.noreply.github.com> Date: Fri, 22 Mar 2024 17:30:35 +0000 Subject: [PATCH] Create Navigation mechanism for wizard type flows #19059 (#19123) --- .../contexts/wallet/account/view.cljs | 4 +- .../wallet/common/token_value/view.cljs | 5 +- .../contexts/wallet/common/wizard.cljs | 22 +++++++++ .../contexts/wallet/send/events.cljs | 48 ++++++++++--------- .../contexts/wallet/send/flow_config.cljs | 11 +++++ .../wallet/send/select_address/tabs/view.cljs | 1 - .../wallet/send/select_address/view.cljs | 3 -- .../wallet/send/select_asset/view.cljs | 5 +- .../wallet/send/send_amount/view.cljs | 5 +- .../send/transaction_confirmation/view.cljs | 4 +- src/status_im/events.cljs | 1 + 11 files changed, 73 insertions(+), 36 deletions(-) create mode 100644 src/status_im/contexts/wallet/common/wizard.cljs create mode 100644 src/status_im/contexts/wallet/send/flow_config.cljs diff --git a/src/status_im/contexts/wallet/account/view.cljs b/src/status_im/contexts/wallet/account/view.cljs index 74e10a22e1..e597fb3db1 100644 --- a/src/status_im/contexts/wallet/account/view.cljs +++ b/src/status_im/contexts/wallet/account/view.cljs @@ -50,7 +50,9 @@ [quo/wallet-ctas {:send-action (fn [] (rf/dispatch [:wallet/clean-send-data]) - (rf/dispatch [:open-modal :screen/wallet.select-address])) + (rf/dispatch [:wallet/wizard-navigate-forward + {:start-flow? true + :flow-id :wallet-flow}])) :receive-action #(rf/dispatch [:open-modal :screen/wallet.share-address {:status :receive}]) :buy-action #(rf/dispatch [:show-bottom-sheet {:content buy-drawer}]) diff --git a/src/status_im/contexts/wallet/common/token_value/view.cljs b/src/status_im/contexts/wallet/common/token_value/view.cljs index d4598f99b5..08b53e6ff6 100644 --- a/src/status_im/contexts/wallet/common/token_value/view.cljs +++ b/src/status_im/contexts/wallet/common/token_value/view.cljs @@ -19,8 +19,9 @@ :on-press (fn [] (rf/dispatch [:hide-bottom-sheet]) (rf/dispatch [:wallet/clean-send-data]) - (rf/dispatch [:wallet/send-select-token-drawer {:token token-data}]) - (rf/dispatch [:open-modal :screen/wallet.select-address]))} + (rf/dispatch [:wallet/send-select-token + {:token token-data + :start-flow? true}]))} {:icon :i/receive :accessibility-label :receive :label (i18n/label :t/receive) diff --git a/src/status_im/contexts/wallet/common/wizard.cljs b/src/status_im/contexts/wallet/common/wizard.cljs new file mode 100644 index 0000000000..3ef8c2b27d --- /dev/null +++ b/src/status_im/contexts/wallet/common/wizard.cljs @@ -0,0 +1,22 @@ +(ns status-im.contexts.wallet.common.wizard + (:require [status-im.contexts.wallet.send.flow-config :as wallet-flow] + [utils.re-frame :as rf])) + +(defn- wizard-find-next-screen + [db flow-id current-screen] + (let [flow-config (case flow-id + :wallet-flow wallet-flow/steps + nil)] + (first (filter (fn [{:keys [skip-step? screen-id]}] + (and (not= screen-id current-screen) + (not (and (fn? skip-step?) (skip-step? db))))) + flow-config)))) + +(rf/reg-event-fx + :wallet/wizard-navigate-forward + (fn [{:keys [db]} [{:keys [current-screen flow-id start-flow?]}]] + (let [next-screen (wizard-find-next-screen db flow-id current-screen)] + {:fx [[:dispatch + (if start-flow? + [:open-modal (:screen-id next-screen)] + [:navigate-to-within-stack [(:screen-id next-screen) current-screen]])]]}))) diff --git a/src/status_im/contexts/wallet/send/events.cljs b/src/status_im/contexts/wallet/send/events.cljs index b0f239d323..57d56db29c 100644 --- a/src/status_im/contexts/wallet/send/events.cljs +++ b/src/status_im/contexts/wallet/send/events.cljs @@ -51,7 +51,7 @@ (rf/reg-event-fx :wallet/select-send-address - (fn [{:keys [db]} [{:keys [address token? recipient stack-id]}]] + (fn [{:keys [db]} [{:keys [address recipient stack-id start-flow?]}]] (let [[prefix to-address] (utils/split-prefix-and-address address) test-net? (get-in db [:profile/profile :test-networks-enabled?]) goerli-enabled? (get-in db [:profile/profile :is-goerli-enabled?]) @@ -65,10 +65,10 @@ (assoc-in [:wallet :ui :send :address-prefix] prefix) (assoc-in [:wallet :ui :send :selected-networks] selected-networks)) :fx [[:dispatch - [:navigate-to-within-stack - (if token? - [:screen/wallet.send-input-amount stack-id] - [:screen/wallet.select-asset stack-id])]]]}))) + [:wallet/wizard-navigate-forward + {:current-screen stack-id + :start-flow? start-flow? + :flow-id :wallet-flow}]]]}))) (rf/reg-event-fx :wallet/update-receiver-networks @@ -76,17 +76,16 @@ {:db (assoc-in db [:wallet :ui :send :selected-networks] selected-networks)})) (rf/reg-event-fx :wallet/send-select-token - (fn [{:keys [db]} [{:keys [token stack-id]}]] + (fn [{:keys [db]} [{:keys [token stack-id start-flow?]}]] {:db (-> db (update-in [:wallet :ui :send] dissoc :collectible) (assoc-in [:wallet :ui :send :token] token)) :fx [[:dispatch [:wallet/clean-suggested-routes]] - [:dispatch [:navigate-to-within-stack [:screen/wallet.send-input-amount stack-id]]]]})) - -(rf/reg-event-fx - :wallet/send-select-token-drawer - (fn [{:keys [db]} [{:keys [token]}]] - {:db (assoc-in db [:wallet :ui :send :token] token)})) + [:dispatch + [:wallet/wizard-navigate-forward + {:current-screen stack-id + :start-flow? start-flow? + :flow-id :wallet-flow}]]]})) (rf/reg-event-fx :wallet/clean-selected-token (fn [{:keys [db]}] @@ -113,9 +112,13 @@ [:navigate-to-within-stack [:screen/wallet.transaction-confirmation stack-id]]]})) (rf/reg-event-fx :wallet/send-select-amount - (fn [{:keys [db]} [{:keys [amount stack-id]}]] + (fn [{:keys [db]} [{:keys [amount stack-id start-flow?]}]] {:db (assoc-in db [:wallet :ui :send :amount] amount) - :fx [[:dispatch [:navigate-to-within-stack [:screen/wallet.transaction-confirmation stack-id]]]]})) + :fx [[:dispatch + [:wallet/wizard-navigate-forward + {:current-screen stack-id + :start-flow? start-flow? + :flow-id :wallet-flow}]]]})) (rf/reg-event-fx :wallet/get-suggested-routes (fn [{:keys [db now]} [{:keys [amount]}]] @@ -184,12 +187,17 @@ (assoc-in [:wallet :transactions] transaction-details) (assoc-in [:wallet :ui :send :transaction-ids] transaction-ids)) :fx [[:dispatch - [:navigate-to-within-stack - [:screen/wallet.transaction-progress :screen/wallet.transaction-confirmation]]]]}))) + [:wallet/wizard-navigate-forward + {:current-screen :screen/wallet.transaction-confirmation + :flow-id :wallet-flow}]]]}))) (rf/reg-event-fx :wallet/close-transaction-progress-page (fn [_] - {:fx [[:dispatch [:dismiss-modal :screen/wallet.transaction-progress]]]})) + {:fx [[:dispatch [:wallet/clean-scanned-address]] + [:dispatch [:wallet/clean-local-suggestions]] + [:dispatch [:wallet/clean-send-address]] + [:dispatch [:wallet/select-address-tab nil]] + [:dispatch [:dismiss-modal :screen/wallet.transaction-progress]]]})) (defn- transaction-data [{:keys [from-address to-address token-address route data eth-transfer?]}] @@ -331,11 +339,7 @@ :params request-params :on-success (fn [result] (rf/dispatch [:hide-bottom-sheet]) - (rf/dispatch [:wallet/add-authorized-transaction result]) - (rf/dispatch [:wallet/clean-scanned-address]) - (rf/dispatch [:wallet/clean-local-suggestions]) - (rf/dispatch [:wallet/clean-send-address]) - (rf/dispatch [:wallet/select-address-tab nil])) + (rf/dispatch [:wallet/add-authorized-transaction result])) :on-error (fn [error] (log/error "failed to send transaction" {:event :wallet/send-transaction diff --git a/src/status_im/contexts/wallet/send/flow_config.cljs b/src/status_im/contexts/wallet/send/flow_config.cljs new file mode 100644 index 0000000000..c5e359e815 --- /dev/null +++ b/src/status_im/contexts/wallet/send/flow_config.cljs @@ -0,0 +1,11 @@ +(ns status-im.contexts.wallet.send.flow-config) + +(def steps + [{:screen-id :screen/wallet.select-address + :skip-step? (fn [db] (some? (get-in db [:wallet :ui :send :recipient])))} + {:screen-id :screen/wallet.select-asset + :skip-step? (fn [db] (some? (get-in db [:wallet :ui :send :token])))} + {:screen-id :screen/wallet.send-input-amount + :skip-step? (fn [db] (some? (get-in db [:wallet :ui :send :amount])))} + {:screen-id :screen/wallet.transaction-confirmation} + {:screen-id :screen/wallet.transaction-progress}]) diff --git a/src/status_im/contexts/wallet/send/select_address/tabs/view.cljs b/src/status_im/contexts/wallet/send/select_address/tabs/view.cljs index f728ce1224..461e613540 100644 --- a/src/status_im/contexts/wallet/send/select_address/tabs/view.cljs +++ b/src/status_im/contexts/wallet/send/select_address/tabs/view.cljs @@ -14,7 +14,6 @@ {:account-props (assoc account :customization-color color) :on-press #(rf/dispatch [:wallet/select-send-address {:address address - :token? false :recipient account :stack-id :screen/wallet.select-address}])}]) diff --git a/src/status_im/contexts/wallet/send/select_address/view.cljs b/src/status_im/contexts/wallet/send/select_address/view.cljs index 093fbdb0fd..a602cce69e 100644 --- a/src/status_im/contexts/wallet/send/select_address/view.cljs +++ b/src/status_im/contexts/wallet/send/select_address/view.cljs @@ -93,7 +93,6 @@ (when-not ens (rf/dispatch [:wallet/select-send-address {:address address - :token? false :recipient local-suggestion :stack-id :screen/wallet.select-address}])))) :active-state? false}] @@ -140,7 +139,6 @@ input-focused? (reagent/atom false)] (fn [] (let [selected-tab (or (rf/sub [:wallet/send-tab]) (:id (first tabs-data))) - token (rf/sub [:wallet/wallet-send-token]) valid-ens-or-address? (boolean (rf/sub [:wallet/valid-ens-or-address?])) {:keys [color]} (rf/sub [:wallet/current-viewing-account])] [floating-button-page/view @@ -157,7 +155,6 @@ :on-press #(rf/dispatch [:wallet/select-send-address {:address @input-value - :token? (some? token) :stack-id :screen/wallet.select-address}]) :customization-color color} diff --git a/src/status_im/contexts/wallet/send/select_asset/view.cljs b/src/status_im/contexts/wallet/send/select_asset/view.cljs index fe451d5b03..212c7f3d75 100644 --- a/src/status_im/contexts/wallet/send/select_asset/view.cljs +++ b/src/status_im/contexts/wallet/send/select_asset/view.cljs @@ -63,7 +63,10 @@ search-text (reagent/atom "") on-change-text #(reset! search-text %) on-change-tab #(reset! selected-tab %) - on-close #(rf/dispatch [:navigate-back])] + on-close (fn [] + (rf/dispatch [:wallet/clean-selected-token]) + (rf/dispatch [:wallet/clean-selected-collectible]) + (rf/dispatch [:navigate-back]))] (fn [] [rn/safe-area-view {:style style/container} [account-switcher/view diff --git a/src/status_im/contexts/wallet/send/send_amount/view.cljs b/src/status_im/contexts/wallet/send/send_amount/view.cljs index a48332a7d3..3e8e5d7591 100644 --- a/src/status_im/contexts/wallet/send/send_amount/view.cljs +++ b/src/status_im/contexts/wallet/send/send_amount/view.cljs @@ -10,9 +10,6 @@ [input-amount/view {:current-screen-id :screen/wallet.send-input-amount :button-one-label (i18n/label :t/confirm) - :on-navigate-back (fn [] - (rf/dispatch [:wallet/clean-selected-token]) - (rf/dispatch [:wallet/clean-selected-collectible]) - (rf/dispatch [:navigate-back]))}]) + :on-navigate-back #(rf/dispatch [:navigate-back])}]) (def view (quo.theme/with-theme view-internal)) diff --git a/src/status_im/contexts/wallet/send/transaction_confirmation/view.cljs b/src/status_im/contexts/wallet/send/transaction_confirmation/view.cljs index 91c505675d..ebd1753ec6 100644 --- a/src/status_im/contexts/wallet/send/transaction_confirmation/view.cljs +++ b/src/status_im/contexts/wallet/send/transaction_confirmation/view.cljs @@ -245,9 +245,9 @@ (defn- view-internal [_] (let [on-close (fn [] - (rf/dispatch [:navigate-back]) (rf/dispatch [:wallet/clean-suggested-routes]) - (rf/dispatch [:wallet/clean-selected-collectible]))] + (rf/dispatch [:wallet/clean-selected-collectible]) + (rf/dispatch [:navigate-back]))] (fn [{:keys [theme]}] (let [send-transaction-data (rf/sub [:wallet/wallet-send]) token (:token send-transaction-data) diff --git a/src/status_im/events.cljs b/src/status_im/events.cljs index c38979e044..7c2ff624fb 100644 --- a/src/status_im/events.cljs +++ b/src/status_im/events.cljs @@ -28,6 +28,7 @@ status-im.contexts.profile.settings.events status-im.contexts.shell.share.events status-im.contexts.syncing.events + status-im.contexts.wallet.common.wizard status-im.contexts.wallet.create-account.events status-im.contexts.wallet.effects status-im.contexts.wallet.events