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

Use 'Withdrawal' and 'Deducted' labels when referring to withdrawal deposits, to more accurately communicate the type of transaction that has occurred #9500

Open
wants to merge 13 commits into
base: develop
Choose a base branch
from

Conversation

Jinksi
Copy link
Member

@Jinksi Jinksi commented Sep 27, 2024

Fixes #7802

Changes proposed in this Pull Request

When viewing a 'withdrawal' deposit, the following labels are used:

  • Deducted instead of Paid
  • Withdrawal instead of Deposit

This applies to the following screens and components:

  • Deposit details screen
  • Deposit list screen
  • Deposit list screen advanced filters
  • Payments → Overview → Recent deposits list

TODO

  • Add tests to cover the "Withdrawal" rendering
    • Deposits list
    • Deposits list advanced filters
    • Deposit details
    • Recent deposits list

Deposit details screen:

image

Deposit list screen:

image

Deposit list screen advanced filters:

The option for paid now shows Paid / Deducted. Note that we don't support filtering by Deducted, since it is a display/label only and not a status recognised by the WooPayments Server.

image

Payments overview recent deposits list:

image

Testing instructions

  • Change to this branch and run npm run build
  • Hopefully your store has at least one deposit and one withdrawal deposit. If not:
    • You can create withdrawal deposits by creating one or more disputed transactions using the Stripe test card 4000000000000259
    • Ensure your store has a Daily deposit schedule – Payments → Settings → Deposit schedule
    • Then wait around 24h for the withdrawal to occur
  • View the Deposit list screen.
    • On trunk withdrawal deposits will appear as type Deposit with a Paid status
    • On this branch, ensure that withdrawal deposits appear as type Withdrawal with a Deducted status (see screenshot above)
    • Open advanced filters and choose Status. The Paidoption has been re-labelled toPaid / Deducted. Note that we don't support filtering by Deducted`, since it is a display/label only and not a status recognised by the WooPayments Server.
  • Ensure the Deducted status appears next to withdrawals on the Payments → Overview recent deposits list.
  • From the deposit list screen, click a withdrawal to view the deposit details screen
    • Ensure you see Withdrawal date, Deducted and Withdrawal transactions (see screenshot above)
  • From the deposit list screen, click a deposit to view the deposit details screen
    • Ensure you see Deposit date, Paid and Deposit transactions

  • 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

@Jinksi Jinksi changed the title Show paid withdrawals as 'Deducted' in deposit status chip Use 'Withdrawal' and 'Deducted' labels when referencing withdrawals, to help communicate the transactions that has occurred Sep 27, 2024
@Jinksi Jinksi changed the title Use 'Withdrawal' and 'Deducted' labels when referencing withdrawals, to help communicate the transactions that has occurred Use 'Withdrawal' and 'Deducted' labels when referencing withdrawals, to help communicate the transaction that has occurred Sep 27, 2024
@botwoo
Copy link
Collaborator

botwoo commented Sep 27, 2024

Test the build

Option 1. Jetpack Beta

  • Install and activate Jetpack Beta.
  • Use this build by searching for PR number 9500 or branch name fix/7802-deposit-withdrawal-text-changes 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: 2db4e34
  • Build time: 2024-10-01 07:16:16 UTC

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

Copy link
Contributor

github-actions bot commented Sep 27, 2024

Size Change: +188 B (0%)

Total Size: 1.33 MB

Filename Size Change
release/woocommerce-payments/dist/index.js 302 kB +188 B (0%)
ℹ️ View Unchanged
Filename Size
release/woocommerce-payments/assets/css/admin.css 1.08 kB
release/woocommerce-payments/assets/css/admin.rtl.css 1.08 kB
release/woocommerce-payments/assets/css/success.css 173 B
release/woocommerce-payments/assets/css/success.rtl.css 173 B
release/woocommerce-payments/dist/blocks-checkout-rtl.css 2.64 kB
release/woocommerce-payments/dist/blocks-checkout.css 2.64 kB
release/woocommerce-payments/dist/blocks-checkout.js 66.6 kB
release/woocommerce-payments/dist/cart-block.js 16.2 kB
release/woocommerce-payments/dist/cart.js 5.73 kB
release/woocommerce-payments/dist/checkout-rtl.css 927 B
release/woocommerce-payments/dist/checkout.css 927 B
release/woocommerce-payments/dist/checkout.js 32.4 kB
release/woocommerce-payments/dist/express-checkout-rtl.css 230 B
release/woocommerce-payments/dist/express-checkout.css 230 B
release/woocommerce-payments/dist/express-checkout.js 14.2 kB
release/woocommerce-payments/dist/frontend-tracks.js 858 B
release/woocommerce-payments/dist/index-rtl.css 39.3 kB
release/woocommerce-payments/dist/index.css 39.2 kB
release/woocommerce-payments/dist/multi-currency-analytics.js 1.08 kB
release/woocommerce-payments/dist/multi-currency-rtl.css 3.41 kB
release/woocommerce-payments/dist/multi-currency-switcher-block.js 60.6 kB
release/woocommerce-payments/dist/multi-currency.css 3.41 kB
release/woocommerce-payments/dist/multi-currency.js 55.6 kB
release/woocommerce-payments/dist/order-rtl.css 730 B
release/woocommerce-payments/dist/order.css 730 B
release/woocommerce-payments/dist/order.js 42.7 kB
release/woocommerce-payments/dist/payment-gateways-rtl.css 1.35 kB
release/woocommerce-payments/dist/payment-gateways.css 1.35 kB
release/woocommerce-payments/dist/payment-gateways.js 39.3 kB
release/woocommerce-payments/dist/payment-request-rtl.css 230 B
release/woocommerce-payments/dist/payment-request.css 230 B
release/woocommerce-payments/dist/payment-request.js 13.6 kB
release/woocommerce-payments/dist/plugins-page-rtl.css 386 B
release/woocommerce-payments/dist/plugins-page.css 386 B
release/woocommerce-payments/dist/plugins-page.js 20.1 kB
release/woocommerce-payments/dist/product-details-rtl.css 433 B
release/woocommerce-payments/dist/product-details.css 436 B
release/woocommerce-payments/dist/product-details.js 11.5 kB
release/woocommerce-payments/dist/settings-rtl.css 11.6 kB
release/woocommerce-payments/dist/settings.css 11.5 kB
release/woocommerce-payments/dist/settings.js 224 kB
release/woocommerce-payments/dist/subscription-edit-page.js 703 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal-rtl.css 524 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.css 524 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.js 20.2 kB
release/woocommerce-payments/dist/subscription-product-onboarding-toast.js 730 B
release/woocommerce-payments/dist/subscriptions-empty-state-rtl.css 120 B
release/woocommerce-payments/dist/subscriptions-empty-state.css 120 B
release/woocommerce-payments/dist/subscriptions-empty-state.js 19.3 kB
release/woocommerce-payments/dist/tokenized-payment-request-rtl.css 230 B
release/woocommerce-payments/dist/tokenized-payment-request.css 230 B
release/woocommerce-payments/dist/tokenized-payment-request.js 14.4 kB
release/woocommerce-payments/dist/tos-rtl.css 235 B
release/woocommerce-payments/dist/tos.css 235 B
release/woocommerce-payments/dist/tos.js 21.8 kB
release/woocommerce-payments/dist/woopay-direct-checkout.js 6.14 kB
release/woocommerce-payments/dist/woopay-express-button.js 24 kB
release/woocommerce-payments/dist/woopay-rtl.css 4.52 kB
release/woocommerce-payments/dist/woopay.css 4.49 kB
release/woocommerce-payments/dist/woopay.js 71.6 kB
release/woocommerce-payments/includes/subscriptions/assets/css/plugin-page.css 625 B
release/woocommerce-payments/includes/subscriptions/assets/js/plugin-page.js 814 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/i18n-loader.js 2.46 kB
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/jetpack-script-data.js 735 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/react-jsx-runtime.js 553 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/src/js/i18n-loader.js 1.02 kB
release/woocommerce-payments/vendor/automattic/jetpack-assets/src/js/script-data.js 69 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/babel.config.js 163 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.css 2.45 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.js 14.2 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.rtl.css 2.45 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.css 198 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.js 280 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.rtl.css 198 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.css 625 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.js 333 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.rtl.css 626 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-users.js 417 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-ajax.js 521 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-callables.js 584 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-admin-create-user.css 215 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-admin-create-user.js 521 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-login.css 721 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-login.js 412 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-users.js 621 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/about.css 1.04 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-empty-state.css 294 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-order-statuses.css 408 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin.css 3.59 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/checkout.css 301 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/modal.css 746 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/view-subscription.css 574 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/wcs-upgrade.css 414 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin-pointers.js 543 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.78 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.min.js 3.84 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-coupon.js 545 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.2 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.min.js 11.7 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 507 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/payment-methods.js 358 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/single-product.js 428 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 782 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/modal.js 1.09 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/wcs-upgrade.js 1.26 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.css 391 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.js 3.04 kB

compressed-size-action

@Jinksi Jinksi changed the title Use 'Withdrawal' and 'Deducted' labels when referencing withdrawals, to help communicate the transaction that has occurred Use 'Withdrawal' and 'Deducted' labels when referring to withdrawal deposits, to more accurately communicate the type of transaction that has occurred Oct 1, 2024
@Jinksi Jinksi added needs tests The issue/PR needs tests before it can move forward. pr: needs review and removed pr: in progress labels Oct 1, 2024
@Jinksi Jinksi requested a review from a team October 1, 2024 06:50
@Jinksi Jinksi marked this pull request as ready for review October 1, 2024 06:50
@Jinksi
Copy link
Member Author

Jinksi commented Oct 1, 2024

Ready for review – note I'll be adding some additional integration tests to ensure the new withdrawal labels are rendered correctly, as mentioned in the PR description TODO.

placeholder=""
role="combobox"
type="text"
value=""
/>
<span
class="screen-reader-text"
id="search-inline-input-15"
id="search-inline-input-16"
Copy link
Member Author

@Jinksi Jinksi Oct 1, 2024

Choose a reason for hiding this comment

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

These snapshot changes to the rendered HTML id numbers can be ignored – this occurs because I've added a new test case being rendered, bumping many of these ids by +1.

@Jinksi
Copy link
Member Author

Jinksi commented Oct 1, 2024

PHP/e2e GH actions failing due to error when downloading from https://develop.svn.wordpress.org/: see slack thread p1727686155235229-slack-C02AVAR9B.

@Jinksi
Copy link
Member Author

Jinksi commented Oct 1, 2024

image

Apologies for the large diff – rest assured this is not as large as it seems, once you see past the new test snapshots introduced.

@nagpai
Copy link
Contributor

nagpai commented Oct 1, 2024

Manual test

The changes test well on a manual test 🥇

  • ✅ - Withdrawal deposits appear as type Withdrawal with a Deducted status

  • ✅ - Open advanced filters and choose Status. The Paidoption has been re-labelled toPaid / Deducted`.

  • ✅ - Ensure the Deducted status appears next to withdrawals on the Payments → Overview recent deposits list.

  • ✅ From the deposit list screen, click a withdrawal to view the deposit details screen

    • Ensure you see Withdrawal date, Deducted and Withdrawal transactions (see screenshot above)
  • ✅ - From the deposit list screen, click a deposit to view the deposit details screen

    • Ensure you see Deposit date, Paid and Deposit transactions

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
needs tests The issue/PR needs tests before it can move forward. pr: needs review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Deposit details shows "paid" and "deposit date" for withdrawals
3 participants