[#19410] wizard send collectibles #19515

ulisesmac · 2024-04-03T19:42:09Z

fixes #19410
fixes #16990

The bridge feature will be addressed in

Wallet - Skip steps while bridging an asset picked from an account overview #19516

Summary

This PR uses the wizard mechanism to unify the send token and send collectible flows, making able to skip some steps for the sending of collectibles.

Video containing the regular flow and the flow of first picking a collectible (skips select asset screen):

Screencast.from.2024-04-03.13-13-04.webm

Flow from home wallet screen (adds from step and skips sleect asset):

Screencast.from.2024-04-03.13-14-38.webm

Additionally, solves the following error when going back in the navigation:

Screencast.from.2024-04-03.13-02-27.webm

Testing notes

This PR focuses on the flow, there may be some other areas that still need to be polished/adjusted.

Platforms

Android
iOS

Steps to test

Open Status
Use/Recover an account owning some collectibles
Go to the account details
Move to Collectibles tab
Press any collectible
Press "Send" and complete the send flow.

status: ready

status-im-auto · 2024-04-03T19:49:40Z

Jenkins Builds

Click to see older builds (24)

❔	Commit	#️⃣	Finished (UTC)	Duration	Platform	Result
✔️	`1b71e41`	#2	2024-04-03 19:49:39	~5 min	`android-e2e`	🤖`apk` 📲
✔️	`1b71e41`	#2	2024-04-03 19:51:52	~8 min	`android`	🤖`apk` 📲
✔️	`1b71e41`	#2	2024-04-03 20:00:25	~16 min	`ios`	📱`ipa` 📲
✔️	`1b71e41`	#3	2024-04-03 21:16:23	~1 min	`tests`	📄`log`

❌	`be7c8c8`	#4	2024-04-05 21:15:19	~2 min	`tests`	📄`log`
✔️	`be7c8c8`	#3	2024-04-05 21:18:23	~5 min	`android-e2e`	🤖`apk` 📲
✔️	`be7c8c8`	#3	2024-04-05 21:19:46	~7 min	`android`	🤖`apk` 📲

❌	`fe4a107`	#5	2024-04-05 21:23:47	~2 min	`tests`	📄`log`

✔️	`e313300`	#6	2024-04-05 21:28:05	~4 min	`tests`	📄`log`
✔️	`e313300`	#5	2024-04-05 21:29:27	~5 min	`android-e2e`	🤖`apk` 📲
✔️	`e313300`	#5	2024-04-05 21:30:56	~7 min	`android`	🤖`apk` 📲
✔️	`e313300`	#5	2024-04-05 21:33:18	~9 min	`ios`	📱`ipa` 📲

✔️	`87ffb36`	#7	2024-04-08 18:57:39	~4 min	`tests`	📄`log`
✔️	`87ffb36`	#6	2024-04-08 19:00:03	~6 min	`android-e2e`	🤖`apk` 📲
✔️	`87ffb36`	#6	2024-04-08 19:00:19	~7 min	`android`	🤖`apk` 📲
✔️	`87ffb36`	#6	2024-04-08 19:01:49	~8 min	`ios`	📱`ipa` 📲

✔️	`3aa2593`	#8	2024-04-11 23:45:26	~4 min	`tests`	📄`log`
✔️	`3aa2593`	#7	2024-04-11 23:46:39	~5 min	`android-e2e`	🤖`apk` 📲
✔️	`3aa2593`	#7	2024-04-11 23:47:54	~6 min	`android`	🤖`apk` 📲
✔️	`3aa2593`	#7	2024-04-11 23:49:24	~8 min	`ios`	📱`ipa` 📲

❌	`3959259`	#9	2024-04-26 08:22:14	~4 min	`tests`	📄`log`
✔️	`3959259`	#8	2024-04-26 08:27:21	~9 min	`ios`	📱`ipa` 📲
✔️	`3959259`	#8	2024-04-26 08:29:29	~12 min	`android-e2e`	🤖`apk` 📲
✔️	`3959259`	#8	2024-04-26 08:29:35	~12 min	`android`	🤖`apk` 📲

❔	Commit	#️⃣	Finished (UTC)	Duration	Platform	Result
✔️	`531a240`	#10	2024-05-13 23:30:55	~5 min	`tests`	📄`log`
✔️	`531a240`	#9	2024-05-13 23:31:04	~5 min	`android-e2e`	🤖`apk` 📲
✔️	`531a240`	#9	2024-05-13 23:33:43	~8 min	`ios`	📱`ipa` 📲
✔️	`531a240`	#9	2024-05-13 23:34:24	~9 min	`android`	🤖`apk` 📲

✔️	`4afe430`	#11	2024-05-13 23:51:15	~6 min	`tests`	📄`log`
✔️	`4afe430`	#10	2024-05-13 23:52:35	~8 min	`ios`	📱`ipa` 📲
✔️	`4afe430`	#10	2024-05-13 23:56:30	~12 min	`android-e2e`	🤖`apk` 📲
✔️	`4afe430`	#10	2024-05-13 23:56:41	~12 min	`android`	🤖`apk` 📲

ulisesmac · 2024-04-03T19:52:46Z

src/status_im/contexts/wallet/collectible/view.cljs

-(defn f-view-internal
-  [{:keys [theme] :as _props}]
+(defn view-internal
+  [_]
  (let [selected-tab  (reagent/atom :overview)
        on-tab-change #(reset! selected-tab %)]
-    (fn []
+    (fn [{:keys [theme] :as _props}]


An additional fix, we were receiving the theme in the wrong place, the component wouldn't re-render if it changed

can also use the hook directly, if you prefer 👍

ulisesmac · 2024-04-03T19:55:36Z

src/status_im/contexts/wallet/send/events.cljs

-(rf/reg-event-fx :wallet/send-collectibles-amount
- (fn [{:keys [db]} [{:keys [collectible stack-id amount]}]]
-   {:db (-> db
-            (update-in [:wallet :ui :send] dissoc :token)
-            (assoc-in [:wallet :ui :send :collectible] collectible)
-            (assoc-in [:wallet :ui :send :tx-type] :collectible)
-            (assoc-in [:wallet :ui :send :amount] amount))
-    :fx [[:dispatch [:wallet/get-suggested-routes {:amount amount}]]
-         [:navigate-to-within-stack [:screen/wallet.transaction-confirmation stack-id]]]}))
+(rf/reg-event-fx
+ :wallet/set-collectible-to-send
+ (fn [{db :db} [{:keys [collectible current-screen]}]]
+   (let [one-collectible? (= (collectible.utils/collectible-balance collectible) 1)
+         collectible-tx   (-> db
+                              (update-in [:wallet :ui :send] dissoc :token)
+                              (assoc-in [:wallet :ui :send :collectible] collectible)
+                              (assoc-in [:wallet :ui :send :tx-type] :collectible))]
+     {:db (cond-> collectible-tx
+            one-collectible? (assoc-in [:wallet :ui :send :amount] 1))
+      :fx [(when one-collectible?
+             [:dispatch [:wallet/get-suggested-routes {:amount 1}]])
+           [:dispatch
+            [:wallet/wizard-navigate-forward
+             {:current-screen current-screen
+              :flow-id        :wallet-flow}]]]})))

-(rf/reg-event-fx :wallet/select-collectibles-amount
- (fn [{:keys [db]} [{:keys [collectible stack-id]}]]
-   {:db (-> db
-            (update-in [:wallet :ui :send] dissoc :token)
-            (assoc-in [:wallet :ui :send :collectible] collectible)
-            (assoc-in [:wallet :ui :send :tx-type] :collectible))
-    :fx [[:navigate-to-within-stack [:screen/wallet.select-collectible-amount stack-id]]]}))
+(rf/reg-event-fx
+ :wallet/set-collectible-amount-to-send
+ (fn [{db :db} [{:keys [stack-id amount]}]]
+   {:db (assoc-in db [:wallet :ui :send :amount] amount)
+    :fx [[:dispatch [:wallet/get-suggested-routes {:amount amount}]]
+         [:dispatch
+          [:wallet/wizard-navigate-forward
+           {:current-screen stack-id
+            :flow-id        :wallet-flow}]]]}))


Redefined these events to handle the wizard flow, and changed their names.

send-collectibles-amount -> set-collectible-to-send
select-collectibles-amount -> set-collectible-amount-to-send

Given the functionality changed and the places where they are being used, the new names match better

ulisesmac · 2024-04-03T19:56:17Z

src/status_im/contexts/wallet/send/events.cljs

-(rf/reg-event-fx :wallet/send-select-amount
+(rf/reg-event-fx
+ :wallet/set-token-amount-to-send


According to the previous mentioned renaming, and given that this even is specific for tokens and not collectibles, I performed this rename

ulisesmac · 2024-04-03T19:57:06Z

src/status_im/contexts/wallet/send/select_asset/view.cljs

-(defn- view-internal
-  []
-  [:f> f-view-internal])


Just removed this (now unnecessary) wrapper

ulisesmac · 2024-04-03T19:57:54Z

src/status_im/contexts/wallet/send/events.cljs

-                     (when (= transaction-type :collecible) :tx-type))})))
+                     (when (= transaction-type :collectible) :tx-type))})))


This fix is not directly related, but noticed we had a typo here 👀

OmarBasem · 2024-04-03T20:13:26Z

src/status_im/contexts/wallet/send/events.cljs

+(rf/reg-event-fx
+ :wallet/set-collectible-to-send
+ (fn [{db :db} [{:keys [collectible current-screen]}]]
+   (let [one-collectible? (= (collectible.utils/collectible-balance collectible) 1)
+         collectible-tx   (-> db
+                              (update-in [:wallet :ui :send] dissoc :token)
+                              (assoc-in [:wallet :ui :send :collectible] collectible)
+                              (assoc-in [:wallet :ui :send :tx-type] :collectible))]
+     {:db (cond-> collectible-tx
+            one-collectible? (assoc-in [:wallet :ui :send :amount] 1))
+      :fx [(when one-collectible?
+             [:dispatch [:wallet/get-suggested-routes {:amount 1}]])
+           [:dispatch
+            [:wallet/wizard-navigate-forward
+             {:current-screen current-screen
+              :flow-id        :wallet-flow}]]]})))

-(rf/reg-event-fx :wallet/select-collectibles-amount
- (fn [{:keys [db]} [{:keys [collectible stack-id]}]]
-   {:db (-> db
-            (update-in [:wallet :ui :send] dissoc :token)
-            (assoc-in [:wallet :ui :send :collectible] collectible)
-            (assoc-in [:wallet :ui :send :tx-type] :collectible))
-    :fx [[:navigate-to-within-stack [:screen/wallet.select-collectible-amount stack-id]]]}))
+(rf/reg-event-fx
+ :wallet/set-collectible-amount-to-send


I think we can have tests for these events

J-Son89 · 2024-04-04T08:04:32Z

@ulisesmac - I tested out this branch.
It works great for sending an asset.
One thought - there is also sending an asset from the home page by long press on a collectible.
@mmilad75 has added the "Select From" page for this flow already so it should be rather straightforward to include that.
Shall we add it here too? 🤔

src/status_im/contexts/wallet/send/flow_config.cljs

src/status_im/contexts/wallet/send/events.cljs

ulisesmac · 2024-04-04T15:45:08Z

@ulisesmac - I tested out this branch.
It works great for sending an asset.
One thought - there is also sending an asset from the home page by long press on a collectible.
@mmilad75 has added the "Select From" page for this flow already so it should be rather straightforward to include that.
Shall we add it here too? 🤔

Sure!, I'll add it :)

ulisesmac · 2024-04-05T21:13:32Z

@ulisesmac - I tested out this branch.
It works great for sending an asset.
One thought - there is also sending an asset from the home page by long press on a collectible.
@mmilad75 has added the "Select From" page for this flow already so it should be rather straightforward to include that.
Shall we add it here too? 🤔

Sure!, I'll add it :)

I already added it, it wasn't as straightforward as I thought but it's not too complex, I added two comments in the code to make this more clear.

ulisesmac · 2024-04-08T18:51:05Z

@OmarBasem @J-Son89
Can you please review again?
additionally, I think QA can be skipped, wdyt?

J-Son89 · 2024-04-08T18:53:20Z

@OmarBasem @J-Son89 Can you please review again? additionally, I think QA can be skipped, wdyt?

I tend to disagree, I think this will benefit from QA. Send is quite an important area and we're making quite a number of changes which can break it, no?

ulisesmac · 2024-04-08T18:58:00Z

@OmarBasem @J-Son89 Can you please review again? additionally, I think QA can be skipped, wdyt?

I tend to disagree, I think this will benefit from QA. Send is quite an important area and we're making quite a number of changes which can break it, no?

I thought this was kind of just connecting existing features, but I agree, let's ask for QA then 👍

VolodLytvynenko · 2024-04-12T14:34:20Z

PR_ISSUE 3: The select assets screen is shown when a watch-only token is going to be sent

Steps to reproduce:

Add watch only an account with some assets that are not available on the regular accounts (example: 0x8d2413447ff297d30bdc475f6d5cb00254685aae)
Long tap on the asset that is available only within the current watch-only account
Select an address to 'send to'
Check next page

Actual result:

The 'Select assets' page is shown, even though the asset has already been selected in step 2.

select_as_page.mp4

Expected result:

Potential solutions:

The 'Select assets' page should not be shown since the asset has already been selected.
probably if the asset is related only to a watch-only account, the drawer should not be shown. Let's wait for the design team's response https://discord.com/channels/624634427930312714/852533718790570015/1228346181097230539

OS:

IOS, Android

Devices:

Pixel 7a, Android 13
iPhone 11 Pro Max, IOS 17

VolodLytvynenko · 2024-04-12T14:53:31Z

PR_ISSUE 4: The 'From' page is shown after sending the collectible from the account overview page

Steps:

Restore the account with collectibles
Long tap collectible on the account overview page
Tap 'send'

Actual result:

The 'from' screen is shown

collectible_sending.mp4

Expected result:

the 'from' screen is missed for collectibles sending flow

OS:

IOS, Android

Devices:

Pixel 7a, Android 13
iPhone 11 Pro Max, IOS 17

VolodLytvynenko · 2024-04-12T15:00:48Z

PR_ISSUE 5: The routes are not found when attempting to send a collectible using the 'send' button in the opened collectible

Steps:

Restore the account with collectibles
Long tap collectible
Tap 'send'

Actual result:

The routes are not found

routes_collectible.mp4

Expected result:

The routes are found

Logs:

Status-debug-logs (8).zip

ulisesmac · 2024-04-15T15:12:49Z

Hey @VolodLytvynenko
sorry for the late response.

Issue 1

This is due to the relogin issue, so I'd say it's out of scope of this one

Issue 2 and 3

This PR is not focused on fixing UI things, so they need to be addressed but preferably in a separate one.

Issue 4

This issue is also related to the recovery and relogin one, so I think we should address it separately.

Issue 5

We don't know the exact reason for routes not being found, but it's out of scope of this PR.

So, this PR is about connecting some flows, but they may still be buggy for various reasons, we'll address them separately.

VolodLytvynenko · 2024-04-16T06:17:47Z

Hi @ulisesmac thank you for clarification. PR is ready to be merged

VolodLytvynenko · 2024-04-16T06:19:28Z

@ulisesmac please let me know if any additional tests are needed after resolving the conflicts in this PR. I can quickly check everything

…points

ulisesmac · 2024-05-14T00:02:52Z

@VolodLytvynenko I solved the conflicts and merged the PR, I'll open issues for the points you pointed out and I'll be opening PRs to address them. Thank you!

ulisesmac · 2024-05-16T16:43:27Z

PR_ISSUE 3: The select assets screen is shown when a watch-only token is going to be sent

Steps to reproduce:
1. Add watch only an account with some assets that are not available on the regular accounts (example: `0x8d2413447ff297d30bdc475f6d5cb00254685aae`)

2. Long tap on the asset that is available only within the current watch-only account

3. Select an address to 'send to'

4. Check next page
Actual result:

The 'Select assets' page is shown, even though the asset has already been selected in step 2.
select_as_page.mp4

Expected result:

Potential solutions:
* The 'Select assets' page should not be shown since the asset has already been selected.

* probably if the asset is related only to a watch-only account, the drawer should not be shown. Let's wait for the design team's response https://discord.com/channels/624634427930312714/852533718790570015/1228346181097230539
OS:

IOS, Android

Devices:
* Pixel 7a, Android 13

* iPhone 11 Pro Max, IOS 17

An update @VolodLytvynenko

This is being addressed by @mmilad75 in:

The select assets screen is shown when token is going to be sent which available on both watch-only and regular account #19745 #20050

ulisesmac · 2024-05-22T21:09:15Z

@VolodLytvynenko Another update on the issues, I've tested them on latest develop:

PR_ISSUE 1: The assets can't be sent on 'send to' page when an asset is selected on account overview page

No longer reproducible.

PR_ISSUE 2: 'Send' button is shown for watch-only collectibles and can navigate to the 'send' flow

No longer reproducible.

PR_ISSUE 3: The select assets screen is shown when a watch-only token is going to be sent

As said above @mmilad75 is solving it.

PR_ISSUE 4: The 'From' page is shown after sending the collectible from the account overview page

No longer reproducible.

PR_ISSUE 5: The routes are not found when attempting to send a collectible using the 'send' button in the opened collectible

No longer reproducible. Maybe it was happening because the collectible didn't support sending, you didn't have enough eth or it was a side issue and now it's solved.

So there's nothing else pending from this PR, thank you for taking the time to test!

VolodLytvynenko · 2024-05-27T09:15:31Z

The select assets screen is shown when token is going to be sent which available on both watch-only and regular account #19745

Hi @ulisesmac thank you for the update. I confirm this. Issues you mentioned are fixed

ulisesmac requested review from vkjr, briansztamfater, J-Son89, OmarBasem, mmilad75 and a team April 3, 2024 19:42

ulisesmac self-assigned this Apr 3, 2024

status-github-bot bot added this to REVIEW in Pipeline for QA Apr 3, 2024

ulisesmac force-pushed the 19410-wizard-send-collectibles branch from 49ae5b5 to 1b71e41 Compare April 3, 2024 19:43

ulisesmac changed the title ~~19410 wizard send collectibles~~ [#19410] wizard send collectibles Apr 3, 2024

ulisesmac commented Apr 3, 2024

View reviewed changes

OmarBasem reviewed Apr 3, 2024

View reviewed changes

J-Son89 reviewed Apr 4, 2024

View reviewed changes

src/status_im/contexts/wallet/send/flow_config.cljs Show resolved Hide resolved

J-Son89 reviewed Apr 4, 2024

View reviewed changes

src/status_im/contexts/wallet/send/events.cljs Outdated Show resolved Hide resolved

ulisesmac force-pushed the 19410-wizard-send-collectibles branch from 1b71e41 to be7c8c8 Compare April 5, 2024 21:12

ulisesmac moved this from REVIEW to E2E Tests in Pipeline for QA Apr 8, 2024

ulisesmac force-pushed the 19410-wizard-send-collectibles branch from e313300 to 87ffb36 Compare April 8, 2024 18:52

ulisesmac moved this from E2E Tests to REVIEW in Pipeline for QA Apr 8, 2024

ulisesmac added the request-manual-qa label Apr 8, 2024

VolodLytvynenko added the Tested - Issues label Apr 12, 2024

VolodLytvynenko moved this from IN TESTING to CONTRIBUTOR in Pipeline for QA Apr 12, 2024

VolodLytvynenko added the test cases required label Apr 12, 2024

VolodLytvynenko added Tested - OK and removed Tested - Issues labels Apr 16, 2024

VolodLytvynenko moved this from CONTRIBUTOR to MERGE in Pipeline for QA Apr 16, 2024

ulisesmac force-pushed the 19410-wizard-send-collectibles branch from 3aa2593 to 3959259 Compare April 26, 2024 08:17

ulisesmac force-pushed the 19410-wizard-send-collectibles branch from 3959259 to 531a240 Compare May 13, 2024 23:24

ulisesmac added 3 commits May 13, 2024 17:43

Fix typo :collecible -> :collectible

4823bcd

Extend the wallet-send-flow for collectibles and tokens in all entry …

8c60c84

…points

Lint fix

4afe430

ulisesmac force-pushed the 19410-wizard-send-collectibles branch from 531a240 to 4afe430 Compare May 13, 2024 23:44

ulisesmac merged commit 88df609 into develop May 14, 2024
6 checks passed

Pipeline for QA automation moved this from MERGE to DONE May 14, 2024

ulisesmac deleted the 19410-wizard-send-collectibles branch May 14, 2024 00:01

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[#19410] wizard send collectibles #19515

[#19410] wizard send collectibles #19515

ulisesmac commented Apr 3, 2024 •

edited

status-im-auto commented Apr 3, 2024 •

edited

ulisesmac Apr 3, 2024

J-Son89 Apr 8, 2024

ulisesmac Apr 3, 2024

ulisesmac Apr 3, 2024

ulisesmac Apr 3, 2024

ulisesmac Apr 3, 2024

OmarBasem Apr 3, 2024

J-Son89 commented Apr 4, 2024

ulisesmac commented Apr 4, 2024

ulisesmac commented Apr 5, 2024

ulisesmac commented Apr 8, 2024

J-Son89 commented Apr 8, 2024

ulisesmac commented Apr 8, 2024

VolodLytvynenko commented Apr 12, 2024 •

edited

VolodLytvynenko commented Apr 12, 2024

VolodLytvynenko commented Apr 12, 2024

ulisesmac commented Apr 15, 2024

VolodLytvynenko commented Apr 16, 2024

VolodLytvynenko commented Apr 16, 2024

ulisesmac commented May 14, 2024

ulisesmac commented May 16, 2024

PR_ISSUE 3: The select assets screen is shown when a watch-only token is going to be sent

Steps to reproduce:

Actual result:

Expected result:

OS:

Devices:

ulisesmac commented May 22, 2024

VolodLytvynenko commented May 27, 2024

		(when (= transaction-type :collecible) :tx-type))})))
		(when (= transaction-type :collectible) :tx-type))})))

[#19410] wizard send collectibles #19515

[#19410] wizard send collectibles #19515

Conversation

ulisesmac commented Apr 3, 2024 • edited

Summary

Testing notes

Platforms

Steps to test

status-im-auto commented Apr 3, 2024 • edited

Jenkins Builds

ulisesmac Apr 3, 2024

Choose a reason for hiding this comment

J-Son89 Apr 8, 2024

Choose a reason for hiding this comment

ulisesmac Apr 3, 2024

Choose a reason for hiding this comment

ulisesmac Apr 3, 2024

Choose a reason for hiding this comment

ulisesmac Apr 3, 2024

Choose a reason for hiding this comment

ulisesmac Apr 3, 2024

Choose a reason for hiding this comment

OmarBasem Apr 3, 2024

Choose a reason for hiding this comment

J-Son89 commented Apr 4, 2024

ulisesmac commented Apr 4, 2024

ulisesmac commented Apr 5, 2024

ulisesmac commented Apr 8, 2024

J-Son89 commented Apr 8, 2024

ulisesmac commented Apr 8, 2024

VolodLytvynenko commented Apr 12, 2024 • edited

PR_ISSUE 3: The select assets screen is shown when a watch-only token is going to be sent

Steps to reproduce:

Actual result:

Expected result:

OS:

Devices:

VolodLytvynenko commented Apr 12, 2024

PR_ISSUE 4: The 'From' page is shown after sending the collectible from the account overview page

Steps:

Actual result:

Expected result:

OS:

Devices:

VolodLytvynenko commented Apr 12, 2024

PR_ISSUE 5: The routes are not found when attempting to send a collectible using the 'send' button in the opened collectible

Steps:

Actual result:

Expected result:

Logs:

ulisesmac commented Apr 15, 2024

Issue 1

Issue 2 and 3

Issue 4

Issue 5

VolodLytvynenko commented Apr 16, 2024

VolodLytvynenko commented Apr 16, 2024

ulisesmac commented May 14, 2024

ulisesmac commented May 16, 2024

PR_ISSUE 3: The select assets screen is shown when a watch-only token is going to be sent

Steps to reproduce:

Actual result:

Expected result:

OS:

Devices:

ulisesmac commented May 22, 2024

VolodLytvynenko commented May 27, 2024

ulisesmac commented Apr 3, 2024 •

edited

status-im-auto commented Apr 3, 2024 •

edited

VolodLytvynenko commented Apr 12, 2024 •

edited