Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add deposit schedule help tooltip to deposits list screen so it's consistent with Payments Overview #8263

Merged
merged 9 commits into from
Feb 28, 2024

Conversation

haszari
Copy link
Contributor

@haszari haszari commented Feb 23, 2024

Fixes #8026

Changes proposed in this Pull Request

This PR:

But why?

  • So the deposit schedule info shown in deposits list is consistent with payments overview.
Screenshot 2024-02-23 at 1 21 18 PM

Testing instructions

  • Ensure your store is onboarded & has some deposits.
  • Go to Payments > Deposits.
  • Ensure the notice is displayed (it's dismissable, so you may need to delete an option to un-dismiss it).
  • Check that the notice has:
    • accurate info about deposit schedule
    • a tooltip to explain & link out to more info
    • no ETA or specific estimated date
    • generally should be consistent with Payments > Overview

Bonus points: check with a range of schedules, and store in new-account waiting period, deposits blocked etc.


  • Run npm run changelog to add a changelog file, choose patch to leave it empty if the change is not significant. You can add multiple changelog files in one PR by running this command a few times.
  • Covered with tests (or have a good reason not to test in description ☝️)
  • Tested on mobile (or does not apply)

Post merge

Rua Haszard added 2 commits February 23, 2024 14:16
- short term fix
- this hack & component will be replaced soon (InlineNotice, #8260)
@haszari haszari requested a review from a team February 23, 2024 01:18
@haszari haszari marked this pull request as ready for review February 23, 2024 01:18
@haszari haszari changed the title Fix/8026 deposit schedule notice add tooltip Add deposit scheduled help tooltip to deposits list screen so it's consistent with Payments Overview Feb 23, 2024
@botwoo
Copy link
Collaborator

botwoo commented Feb 23, 2024

Test the build

Option 1. Jetpack Beta

  • Install and activate Jetpack Beta.
  • Use this build by searching for PR number 8263 or branch name fix/8026-deposit-schedule-notice-add-tooltip in your-test.site/wp-admin/admin.php?page=jetpack-beta&plugin=woocommerce-payments

Option 2. Jurassic Ninja - available for logged-in A12s

🚀 Launch a JN site with this branch 🚀

ℹ️ Install this Tampermonkey script to get more options.


Build info:

  • Latest commit: 86e6d51
  • Build time: 2024-02-28 22:08:53 UTC

Note: the build is updated when a new commit is pushed to this PR.

Copy link
Contributor

github-actions bot commented Feb 23, 2024

Size Change: +71 B (0%)

Total Size: 1.26 MB

Filename Size Change
release/woocommerce-payments/dist/index-rtl.css 37.2 kB +11 B (0%)
release/woocommerce-payments/dist/index.css 37.3 kB +10 B (0%)
release/woocommerce-payments/dist/index.js 291 kB +50 B (0%)
ℹ️ View Unchanged
Filename Size
release/woocommerce-payments/assets/css/admin.css 1.06 kB
release/woocommerce-payments/assets/css/admin.rtl.css 1.06 kB
release/woocommerce-payments/assets/css/success.css 158 B
release/woocommerce-payments/assets/css/success.rtl.css 158 B
release/woocommerce-payments/dist/blocks-checkout-rtl.css 1.81 kB
release/woocommerce-payments/dist/blocks-checkout.css 1.81 kB
release/woocommerce-payments/dist/blocks-checkout.js 85.2 kB
release/woocommerce-payments/dist/checkout-rtl.css 318 B
release/woocommerce-payments/dist/checkout.css 319 B
release/woocommerce-payments/dist/checkout.js 36.4 kB
release/woocommerce-payments/dist/multi-currency-analytics.js 1.05 kB
release/woocommerce-payments/dist/multi-currency-rtl.css 3.25 kB
release/woocommerce-payments/dist/multi-currency-switcher-block.js 59.4 kB
release/woocommerce-payments/dist/multi-currency.css 3.25 kB
release/woocommerce-payments/dist/multi-currency.js 54.4 kB
release/woocommerce-payments/dist/order-rtl.css 707 B
release/woocommerce-payments/dist/order.css 708 B
release/woocommerce-payments/dist/order.js 41.6 kB
release/woocommerce-payments/dist/payment-gateways-rtl.css 1.19 kB
release/woocommerce-payments/dist/payment-gateways.css 1.19 kB
release/woocommerce-payments/dist/payment-gateways.js 38.3 kB
release/woocommerce-payments/dist/payment-request-rtl.css 153 B
release/woocommerce-payments/dist/payment-request.css 153 B
release/woocommerce-payments/dist/payment-request.js 12.4 kB
release/woocommerce-payments/dist/product-details-rtl.css 149 B
release/woocommerce-payments/dist/product-details.css 149 B
release/woocommerce-payments/dist/product-details.js 1.19 kB
release/woocommerce-payments/dist/settings-rtl.css 10.2 kB
release/woocommerce-payments/dist/settings.css 10.2 kB
release/woocommerce-payments/dist/settings.js 230 kB
release/woocommerce-payments/dist/subscription-edit-page.js 669 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal-rtl.css 519 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.css 519 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.js 19.4 kB
release/woocommerce-payments/dist/subscription-product-onboarding-toast.js 710 B
release/woocommerce-payments/dist/subscriptions-empty-state-rtl.css 117 B
release/woocommerce-payments/dist/subscriptions-empty-state.css 117 B
release/woocommerce-payments/dist/subscriptions-empty-state.js 18.5 kB
release/woocommerce-payments/dist/tos-rtl.css 230 B
release/woocommerce-payments/dist/tos.css 231 B
release/woocommerce-payments/dist/tos.js 21 kB
release/woocommerce-payments/dist/woopay-direct-checkout.js 3.54 kB
release/woocommerce-payments/dist/woopay-express-button-rtl.css 153 B
release/woocommerce-payments/dist/woopay-express-button.css 153 B
release/woocommerce-payments/dist/woopay-express-button.js 52.6 kB
release/woocommerce-payments/dist/woopay-rtl.css 4.18 kB
release/woocommerce-payments/dist/woopay.css 4.19 kB
release/woocommerce-payments/dist/woopay.js 71 kB
release/woocommerce-payments/includes/subscriptions/assets/css/plugin-page.css 622 B
release/woocommerce-payments/includes/subscriptions/assets/js/plugin-page.js 812 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/i18n-loader.js 2.43 kB
release/woocommerce-payments/vendor/automattic/jetpack-assets/src/js/i18n-loader.js 1.01 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-ajax.js 522 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-callables.js 581 B
release/woocommerce-payments/vendor/automattic/jetpack-identity-crisis/babel.config.js 160 B
release/woocommerce-payments/vendor/automattic/jetpack-identity-crisis/build/index.css 2.37 kB
release/woocommerce-payments/vendor/automattic/jetpack-identity-crisis/build/index.js 13.5 kB
release/woocommerce-payments/vendor/automattic/jetpack-identity-crisis/build/index.rtl.css 2.37 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/about.css 1.03 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-empty-state.css 291 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-order-statuses.css 403 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin.css 3.6 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/checkout.css 299 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/modal.css 742 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/view-subscription.css 572 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/wcs-upgrade.css 411 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin-pointers.js 544 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin.js 9.4 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.js 6.8 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.min.js 3.83 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-coupon.js 544 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-subscription.js 2.52 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.js 22.1 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.min.js 11.6 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/payment-method-restrictions.js 1.29 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/wcs-meta-boxes-order.js 502 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/payment-methods.js 355 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/single-product.js 429 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/view-subscription.js 1.38 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/wcs-cart.js 781 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/modal.js 1.1 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/wcs-upgrade.js 1.27 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.css 392 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.js 3.05 kB

compressed-size-action

@shendy-a8c shendy-a8c changed the title Add deposit scheduled help tooltip to deposits list screen so it's consistent with Payments Overview Add deposit schedule help tooltip to deposits list screen so it's consistent with Payments Overview Feb 25, 2024
Copy link
Contributor

@shendy-a8c shendy-a8c left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changes look good and now I see help tooltip just like on Payments Overview page.

I have some feedbacks which I went ahead and made the change myself for faster iteration (I hope you don't mind).

  • Need changelog. I already add one a38dcd0. Feel free to modify.
  • There was a failed unit test which expects an empty element when deposit schedule is manual. I fixed it with 15d8774.

The other day when I set my deposit schedule to manual via Stripe dashboard, I saw a lonely tooltip like this on Payments Overview page:

Screenshot 2024-02-26 at 00 44 57

On deposits list page, it looked like this:

Screenshot 2024-02-26 at 00 45 07

Now, it's fixed.

@haszari
Copy link
Contributor Author

haszari commented Feb 28, 2024

The other day when I set my deposit schedule to manual via Stripe dashboard, I saw a lonely tooltip like this on Payments Overview page:

Thanks @shendy-a8c ! I refactored this a little since we can null out higher-level components if there is no schedule:

  • Made a util function for hasAutomaticScheduledDeposits().
  • Render null/nothing for DepositSchedule if there's no schedule. (Fallback)
  • In payments overview and deposits list, don't render deposit schedule stuff if there is no schedule (consistent with what you did, but nulling out more components).

29979d0

Thanks also for fixing the changelog & unit test 🙌🏻

I'm going to merge soon/today (assuming no problems, I have tested with schedule & manual). If you have any feedback or see issues let me know, we can handle in a follow up issue.

@haszari haszari added this pull request to the merge queue Feb 28, 2024
Merged via the queue into develop with commit eae3c17 Feb 28, 2024
22 of 26 checks passed
@haszari haszari deleted the fix/8026-deposit-schedule-notice-add-tooltip branch February 28, 2024 23:05
Jinksi pushed a commit that referenced this pull request Mar 28, 2024
…sistent with Payments Overview (#8263)

Co-authored-by: Rua Haszard <[email protected]>
Co-authored-by: Shendy <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Ensure the schedule notice in deposits list shows consistent info as Payments Overview summary
3 participants