Create a search field similar to the search field in the discount section?

[Ngocuongf123]

I want to create a search field that looks exactly like the search field in this discount section for my app. Can someone show me the "Polaris ingredients" I need? Thank you!

[kinngh]

If you're looking to do this for picking products, you can just use the resource picker from AppBridge. If you're looking to build your own, I'd create a new modal with a TextField that has a search / filter function on it and uses Resource Item from Polaris and manage states

[Ngocuongf123]

First of all, thanks for the suggestion to use Resource Picker. Actually, this was part of my internship test at a company that specializes in developing applications on Shopify. The other thing I'm stuck on is creating a "picker" for "productTags". Unfortunately for me there is no Resource Picker for productTags. I think the first option is to use GraphQL to upload all productTags and then put them into Polaris Combobox. This solution is difficult in that I realize I need to use the Storefront API to get productTags and I'm not very proficient, I've only dabbled in the Admin API a little. I considered the second option, which is to upload all productTags attributes when retrieving the products resource using GraphQl. Then, I will use JS's Set data type to filter out all duplicate tags. In the end I realized both options were problematic because with GraphQl it seemed impossible and undesirable to fully retrieve any resource. Like always having a condition like "first: 10", I understand this is a smart strategy for things like pagination. Anyway, I still have to complete this exercise in the most optimal way, so I want to ask you a little more.

[kinngh]

If you want to get all product tags, you need to query on the `shop` and you'll get it easily instead of going through products and running loopers on it.

{
  shop {
    productTags(first: 250) {
      edges {
        node
      }
      pageInfo {
        hasNextPage
      }
    }
  }
}

And you can build all your queries with docs on Shopify's GraphiQL interface which is available here https://shopify.dev/graphiql/admin-graphiql . Hit the `Explore` button and you're good to go!