woocommerce-ios icon indicating copy to clipboard operation
woocommerce-ios copied to clipboard

[Woo POS] Use x to close POS reader modals

Open joshheald opened this issue 1 year ago • 2 comments

Part of: #13731 Merge after: #13770

Description

This is part of a series of PRs to improve the card reader connnection screens. You may want to test at the end of the series, as it could get quite repetitive, but doing it all in one was quite big. Up to you! The last one is #13775

As per the new designs, this uses x to close the modals instead of a cancel button, in most cases.

I have used some judgement here – if it feels like you're taking more of an action, e.g. after a reader update fails, I've left it as a cancel button.

The cancel handler doesn't update the UI immediately – that hasn't changed, but it does feel a little strange to have to wait for it to close. I think sorting that's outside the scope of this change though.

Steps to reproduce

  1. Launch the app
  2. Enter the POS
  3. Tap Connect your reader
  4. Tap x to cancel

Using a physical reader to test error states:

  1. Launch the app
  2. Enter the POS
  3. Tap Connect your reader
  4. Turn off Bluetooth
  5. Observe that an error is shown, tap x to close it

Testing information

I've tested these on an iPad running iOS 16, and run through each modal to check that the button does the same as the previous cancel button did.

No unit tests as this is UI only

Screenshots

Note that this video is from this branch – if you test later on, the rest of the modal UI will look a bit different.

https://github.com/user-attachments/assets/c1d62a92-6158-464f-ac56-406b9853c103


  • [x] I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

Reviewer (or Author, in the case of optional code reviews):

Please make sure these conditions are met before approving the PR, or request changes if the PR needs improvement:

  • [ ] The PR is small and has a clear, single focus, or a valid explanation is provided in the description. If needed, please request to split it into smaller PRs.
  • [ ] Ensure Adequate Unit Test Coverage: The changes are reasonably covered by unit tests or an explanation is provided in the PR description.
  • [ ] Manual Testing: The author listed all the tests they ran, including smoke tests when needed (e.g., for refactorings). The reviewer confirmed that the PR works as expected on all devices (phone/tablet) and no regressions are added.

joshheald avatar Aug 28 '24 14:08 joshheald

1 Warning
:warning: View files have been modified, but no screenshot or video is included in the pull request. Consider adding some for clarity.
1 Message
:book: This PR is still a Draft: some checks will be skipped.

Generated by :no_entry_sign: Danger

dangermattic avatar Aug 28 '24 14:08 dangermattic

WooCommerce iOS📲 You can test the changes from this Pull Request in WooCommerce iOS by scanning the QR code below to install the corresponding build.

App NameWooCommerce iOS WooCommerce iOS
Build Numberpr13771-cac61db
Version20.1
Bundle IDcom.automattic.alpha.woocommerce
Commitcac61dbda231bcb84d8c8c79b3ce6b14451830da
App Center BuildWooCommerce - Prototype Builds #10622
Automatticians: You can use our internal self-serve MC tool to give yourself access to App Center if needed.

wpmobilebot avatar Aug 28 '24 14:08 wpmobilebot