[Woo POS][Product Search] Pre search UI – Show recent searches

[joshheald]

Part of WOOMOB-314

Description

This PR adds a pre-search view to the search, so when you focus the search field without a search term, we show previous searches.

Tapping a search populates the search field and performs the search.

I've also added a < button to leave search mode. The button is currently a little tricky to tap but will be improved when I do more UI polish.

There's some copy pasted code relating to image sizes from the products cards. I'm going to factor that out in another PR tomorrow but it just made this one confusing to do it here, and it's already copied to various places.

Steps to reproduce

Enable the searchProductsInPOS flag

1. Launch the app and navigate to POS
2. Type a search term which matches some products
3. Tap one of the results
4. Delete your search term
5. Observe that the saved search is shown
6. Tap it; observe that it's searched again

Testing information

I took some care with the adaptivity and accessibility in this PR, but it'll change over the coming PRs when we add popular products, so don't feel you need to test that in detail just now if you don't want to. I have tested it.

One accessibility improvement I plan to explore is hiding the image at larger dynamic type sizes, as we do on the cart. I'll do that right at the end though, it may not feel right with products in this list as it's pretty important for identifying them.

I've tested on an iPad Air running iOS 17.7.3 and a simulator running iOS 18.4

Screenshots

recent.searches.mp4

---

• 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.

[dangermattic]

	1 Warning
⚠️	This PR is assigned to the milestone 22.2. This milestone is due in less than 2 days. Please make sure to get it merged by then or assign it to a milestone with a later deadline.

Generated by 🚫 Danger

[wpmobilebot]

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

	App Name	WooCommerce iOS Prototype
	Build Number	29334
	Version	PR #15511
	Bundle ID	com.automattic.alpha.woocommerce
	Commit	de604e7
	Installation URL	4eg7onejn72go

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

[Copilot]

Pull Request Overview

This PR adds a pre-search UI to the POS product search, displaying a list of recent searches when the search field is activated without any input. Key changes include:

• Introducing a FocusState and enhancing the search field with a clear/back button.
• Adding and integrating the POSRecentSearchesView to show saved searches in a responsive grid layout.

Reviewed Changes

Copilot reviewed 2 out of 3 changed files in this pull request and generated 1 comment.

File	Description
WooCommerce/Classes/POS/Presentation/ItemListView.swift	Updated search field to manage focus and display recent searches when empty.
WooCommerce/Classes/POS/Presentation/Item Search/POSRecentSearchesView.swift	Added a new view for presenting recent searches using a LazyVGrid and a dedicated RecentSearchCard UI.

Files not reviewed (1)

• WooCommerce/WooCommerce.xcodeproj/project.pbxproj: Language not supported

[staskus]

Our empty views have padding for the floating button, and it's retained when the keyboard appears. It's a minor thing but we need to create a task for it.

Simulator.Screen.Recording.-.iPad.Air.11-inch.M2.-.2025-04-17.at.13.04.05.mp4

[staskus]

The functionality works well, accessibility features as well. Also checked how it looks for VoiceOver with accessibility labels. think the list and recent searches view already works well. For further improvements likely worth adding additional hint on the search field.

[staskus]

Nice that we can use a different recent searches view, but continue using the existing list for the results.

[joshheald]

I'm not sure whether we'll keep doing that, but yeah, it's pretty flexible 😊

[joshheald]

Our empty views have padding for the floating button, and it's retained when the keyboard appears. It's a minor thing but we need to create a task for it.

Good spot. I think it's better to keep the buttons hidden by the keyboard than to start to float them to the top.