woocommerce / woocommerce-ios

WooCommerce iOS app
https://www.woocommerce.com/mobile
GNU General Public License v2.0
257 stars 108 forks source link

[SiOC - customer creation] Customer search: CTA and integration with existing customer selector #12654

Closed jaclync closed 1 week ago

jaclync commented 1 week ago

Closes: #12652

Why

Another way to add/edit a customer in order form other than entering the email/addresses manually is to select an existing customer. This is already supported in the app, and this PR creates a CTA based on the design and integrates with the existing customer search flow.

How

The CTA is located above the customer card, at the trailing edge of the customer section header text in OrderCustomerSection. When the search icon is tapped, it opens a sheet of the customer selector under the viewModel.showsCustomerSearch boolean. The customer selector requires a addressFormViewModel: CreateOrderAddressFormViewModel parameter, even though it isn't used in the selector internally because we disallow editing customer details by disallowCreatingCustomer: true.

While testing, I encountered a bug where selecting a customer from the selector sheet (where dismiss is called in the view controller) would close both the sheet and the order form. It turned out that because I originally reinitialized the OrderCustomerSectionViewModel in configureCustomerDataViewModel whenever the order changes, the section view model's showsCustomerSearch boolean also got reset to false (default value), and thus the sheet is hidden automatically and order form got dismissed instead. To fix this issue, I updated OrderCustomerSectionViewModel to have the same lifetime as EditableOrderViewModel / order form and synced the customer data via a published variable.

Testing instructions


Prerequisite: the store has at least two different customers

Create order

Edit order

Screenshots

https://github.com/woocommerce/woocommerce-ios/assets/1945542/3b777ec4-d9ac-4d4f-a54b-6abc5d087122


wpmobilebot commented 1 week ago

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 Numberpr12654-036c381
Version18.5
Bundle IDcom.automattic.alpha.woocommerce
Commit036c381f435a3148a39a1a99f44bfae93439d9c8
App Center BuildWooCommerce - Prototype Builds #8960

Automatticians: You can use our internal self-serve MC tool to give yourself access to App Center if needed.