[Tablet Orders] Update product selection header and scanner button based on size class

[iamgabrielma]

Closes #11748

Description

This PR updates the product selector header (left), along with the product scanner button within the order summary (right) so it's adapted for different size classes.

Since we've moved the scanner button from the header to the product selector for the moment, the only update to the header is the order in which we render the buttons and the search bar. So this PR mostly deals with the barcode scanner button.

Changes

• Extracted parts of the ProductSelectorView logic into separate @ViewBuilder components: productSelectorHeaderTitleRow, and productSelectorHeaderSearchRow
• Duplicated the scanner logic from the current scanProductButton into a scanProductRow component. We could reuse the existing scanProductButton but this adds quite more complexity to a view that has already plenty of conditions. Since ideally we want to also decouple the scanner from the view entirely, I'd prefer to tackle both separately from this PR.
• When using .sideBySide presentation style, we'll present the updated header, as well as the scanProductRow
• When using .modalOnModal presentation style, we'll present the default header, as well as the default scanProductButton

Testing instructions

Case 1: Feature flag false

• With sideBySideViewForOrderForm set to false, the scanner button should work as always, that is: Along the `Add product" row when no products are in the order, and in the order summary header when products can be found in the order:

Case 2: Feature flag true - iPhone

iPhone when no products in order	iPhone when products in order

This case should work as always:

• [Plus icon] Add Products [Scanner icon] is shown when no products are added to an order
• Products [Scanner icon][Plus icon] when products are added to an order

Case 3: Feature flag true - iPhone split view

iPhone when no products in order	iPhone when products in order

This case should should both the default, and the updated UI:

• Portrait: [Plus icon] Add Products [Scanner icon] is shown when no products are added to an order
• Portrait: Products [Scanner icon][Plus icon] when products are added to an order
• Landscape: Updated header
• Landscape: Updated scanner button

Case 4: Feature flag true - iPad

iPad when no products in order	iPhone when products in order

This case should show the updated UI.

[wpmobilebot]

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

	App Name	WooCommerce iOS
	Build Number	pr12033-42a3b19
	Version	17.4
	Bundle ID	com.automattic.alpha.woocommerce
	Commit	42a3b19694ff6a9d284c43a0da38edd84312932b
	App Center Build	WooCommerce - Prototype Builds #8104

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

[iamgabrielma]

A few visual issues to look at, outside this PR is fine

Those are great, thanks Josh! I logged them here https://github.com/woocommerce/woocommerce-ios/issues/12057 to tackle them separately 🙇