Issue/6586 wcs onboarding cta screen #6698

JorgeMucientes · 2022-06-03T10:17:51Z

Part of: #6586

Description

Displays new onboarding screen before triggering the WC Shipping installation flow. Designs for this screen are here 9PGX5zb3VKHMYc7qTIv30B-fi-744%3A24627

Testing instructions

To access this new screen a site eligible for shipping labels is required for the new banner to be displayed inside OrderDetail screen. Conditions for the banner to be shown:

The store is located in US.
The order currency is USD.
The products are eligible for SL (not virtual/downloadable).
The order is not eligible for IPP.
WC Shipping plugin must be uninstalled or unactive

Once the banner is shown, click on "Get WooCommerce Shipping" button and the new screen should be displayed:

OnboardingScreenFlow.mp4

peril-woocommerce · 2022-06-03T10:17:56Z

You can trigger optional UI/connected tests for these changes by visiting CircleCI here.

...rce/src/main/kotlin/com/woocommerce/android/ui/shipping/InstallWcShippingOnboardingScreen.kt

wpmobilebot · 2022-06-03T10:30:04Z

You can test the changes on this Pull Request by downloading an installable build, or scanning this QR code:

# Conflicts: # WooCommerce/src/main/res/navigation/nav_graph_orders.xml

…rderDetailViewModel

…/6586-wcs-onboarding-cta-screen # Conflicts: # WooCommerce/src/test/kotlin/com/woocommerce/android/ui/orders/OrderDetailViewModelTest.kt

peril-woocommerce · 2022-06-03T11:06:11Z

	Warnings
⚠️	PR is not assigned to a milestone.

Generated by 🚫 dangerJS

codecov-commenter · 2022-06-03T11:20:08Z

Codecov Report

Merging #6698 (4e4f088) into trunk (6726ec7) will decrease coverage by 0.11%.
The diff coverage is 4.83%.

❗ Current head 4e4f088 differs from pull request most recent head 57c908f. Consider uploading reports for the commit 57c908f to get more accurate results

@@             Coverage Diff              @@
##              trunk    #6698      +/-   ##
============================================
- Coverage     45.36%   45.25%   -0.12%     
+ Complexity     2917     2916       -1     
============================================
  Files           517      518       +1     
  Lines         28228    28279      +51     
  Branches       3718     3718              
============================================
- Hits          12806    12798       -8     
- Misses        14241    14300      +59     
  Partials       1181     1181

Impacted Files	Coverage Δ
...etails/views/OrderDetailInstallWcShippingBanner.kt	`0.00% <0.00%> (ø)`
...roid/ui/shipping/InstallWcShippingFlowViewModel.kt	`0.00% <0.00%> (ø)`
.../android/ui/orders/details/OrderDetailViewModel.kt	`69.45% <60.00%> (-0.94%)`	⬇️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 6726ec7...57c908f. Read the comment docs.

JorgeMucientes · 2022-06-03T13:39:47Z

I'll be AFK for 3 weeks. So, I won't be able to respond to feedback. Please leave all the feedback and nitpicks you find, but if there isn't anything major or blocking proceed to merge, as these changes are needed to keep working on the Onboarding Shipping Labels project. I will address any np or feedback when I come back 🙂

nbradbury · 2022-06-03T15:09:47Z

@JorgeMucientes When the device is set to a larger font size, the "Not now" button is off-screen. Can we wrap the screen in a scrollview?

Note that I can scroll the screen in landscape, but it stops scrolling before the buttons are showing.

nbradbury · 2022-06-03T15:19:06Z

@JorgeMucientes In landscape, the views aren't aligned correctly.

nbradbury · 2022-06-03T15:27:53Z

...ommerce/src/main/kotlin/com/woocommerce/android/ui/shipping/InstallWcShippingFlowFragment.kt

+    }
+
+    private fun openInBrowser(url: String) {
+        ChromeCustomTabUtils.launchUrl(requireContext(), url)


This is just a tip and it doesn't have to be implemented in this PR, or at all. I think there's a decent chance the user will tap the "What is WooCommerce Shipping" link, so it might make sense to preload WC_SHIPPING_INFO_URL as described in this comment in ChromeCustomTabUtils.

nbradbury

@JorgeMucientes I'm going to approve this since it's behind a feature flag. I went ahead and fixed the bug with the buttons being cut off because I thought that was a serious problem.

JorgeMucientes · 2022-06-04T11:02:52Z

@nbradbury thank you for reviewing this and fixing the issue with the button not being visible!
I'll open an issue to review this screen again when I'm back because we want to have the buttons anchored to the bottom and always visible and only the text content scrollable. But obviously, my implementation had several flaws 😅

JorgeMucientes added 4 commits May 31, 2022 18:46

Save banner dismissed state per site

9ed933a

Add content to new install WC shipping onboarding screen

cc9a187

Add paddings, sizes and aligments to display content matching designs

102b418

Handle click event for CTAs inside the screen

0edeef5

JorgeMucientes added type: enhancement A request for an enhancement. feature: shipping labels Related to creating, ordering, or printing shipping labels. labels Jun 3, 2022

wpmobilebot reviewed Jun 3, 2022

View reviewed changes

...rce/src/main/kotlin/com/woocommerce/android/ui/shipping/InstallWcShippingOnboardingScreen.kt Outdated Show resolved Hide resolved

wpmobilebot reviewed Jun 3, 2022

View reviewed changes

...rce/src/main/kotlin/com/woocommerce/android/ui/shipping/InstallWcShippingOnboardingScreen.kt Outdated Show resolved Hide resolved

wpmobilebot reviewed Jun 3, 2022

View reviewed changes

...rce/src/main/kotlin/com/woocommerce/android/ui/shipping/InstallWcShippingOnboardingScreen.kt Outdated Show resolved Hide resolved

Fix detekt codestyle issues

53306a3

JorgeMucientes added 2 commits June 3, 2022 12:35

Add missing link color for dark mode

8c74e78

Revert accidental change

eff7ced

JorgeMucientes requested a review from wpmobilebot June 3, 2022 10:41

JorgeMucientes added 4 commits June 3, 2022 12:42

Merge branch 'trunk' into issue/6586-wcs-onboarding-cta-screen

ffbe002

# Conflicts: # WooCommerce/src/main/res/navigation/nav_graph_orders.xml

Fix crash by removing non parcelable lambda fields from ui state in O…

860cee3

…rderDetailViewModel

Fix tests

0cd945a

Merge branch 'issue/6586-fix-crash-non-parcelable-lambdas' into issue…

4e4f088

…/6586-wcs-onboarding-cta-screen # Conflicts: # WooCommerce/src/test/kotlin/com/woocommerce/android/ui/orders/OrderDetailViewModelTest.kt

JorgeMucientes requested review from nbradbury and hafizrahman June 3, 2022 13:42

JorgeMucientes marked this pull request as ready for review June 3, 2022 13:47

nbradbury self-assigned this Jun 3, 2022

nbradbury reviewed Jun 3, 2022

View reviewed changes

Make the entire screen scrollable

57c908f

nbradbury self-requested a review June 3, 2022 16:45

nbradbury approved these changes Jun 3, 2022

View reviewed changes

nbradbury enabled auto-merge June 3, 2022 16:47

nbradbury merged commit c79b56b into trunk Jun 3, 2022

nbradbury deleted the issue/6586-wcs-onboarding-cta-screen branch June 3, 2022 16:47

hichamboushaba mentioned this pull request Jun 10, 2022

Shipping Labels Onboarding CTA screen #6586

Open

4 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Issue/6586 wcs onboarding cta screen #6698

Issue/6586 wcs onboarding cta screen #6698

JorgeMucientes commented Jun 3, 2022 •

edited by hichamboushaba

Loading

peril-woocommerce bot commented Jun 3, 2022 •

edited

Loading

wpmobilebot commented Jun 3, 2022 •

edited

Loading

peril-woocommerce bot commented Jun 3, 2022 •

edited

Loading

codecov-commenter commented Jun 3, 2022 •

edited

Loading

JorgeMucientes commented Jun 3, 2022 •

edited

Loading

nbradbury commented Jun 3, 2022 •

edited

Loading

nbradbury commented Jun 3, 2022

nbradbury Jun 3, 2022

nbradbury left a comment •

edited

Loading

JorgeMucientes commented Jun 4, 2022

Issue/6586 wcs onboarding cta screen #6698

Issue/6586 wcs onboarding cta screen #6698

Conversation

JorgeMucientes commented Jun 3, 2022 • edited by hichamboushaba Loading

Description

Testing instructions

peril-woocommerce bot commented Jun 3, 2022 • edited Loading

wpmobilebot commented Jun 3, 2022 • edited Loading

peril-woocommerce bot commented Jun 3, 2022 • edited Loading

codecov-commenter commented Jun 3, 2022 • edited Loading

Codecov Report

JorgeMucientes commented Jun 3, 2022 • edited Loading

nbradbury commented Jun 3, 2022 • edited Loading

nbradbury commented Jun 3, 2022

nbradbury Jun 3, 2022

Choose a reason for hiding this comment

nbradbury left a comment • edited Loading

Choose a reason for hiding this comment

JorgeMucientes commented Jun 4, 2022

JorgeMucientes commented Jun 3, 2022 •

edited by hichamboushaba

Loading

peril-woocommerce bot commented Jun 3, 2022 •

edited

Loading

wpmobilebot commented Jun 3, 2022 •

edited

Loading

peril-woocommerce bot commented Jun 3, 2022 •

edited

Loading

codecov-commenter commented Jun 3, 2022 •

edited

Loading

JorgeMucientes commented Jun 3, 2022 •

edited

Loading

nbradbury commented Jun 3, 2022 •

edited

Loading

nbradbury left a comment •

edited

Loading