shopify App Bridge - Product Resource Picker - search by collection

veed
Shopify Partner
6 0 2

I'm using the Shopify app bridge "product resource picker" for the Shopify app.

async productPicker() {
                let base = this;
                const productPicker = ResourcePicker.create(shopify_app_bridge, {
                    resourceType: ResourcePicker.ResourceType.Product,
                    options: {
                        selectMultiple: true,
                        showHidden: false,
                        showVariants:true,
                        initialQuery:'collection(query=title:test)',
                    },
                });
                productPicker.dispatch(ResourcePicker.Action.OPEN);
                productPicker.subscribe(ResourcePicker.Action.SELECT, ({selection}) => {
                    base.checkPush(selection);
                });
            } 

In the above function, you can see this line

initialQuery:'collection(query=title:test)',
Using product resource picker I want to search those products who are added in "test" Collection.
 
Can anybody guide me on how to write the initialQuery for collection in product resource picker?
Or is there any documentation for it?

Thank You
Veed.
Replies 4 (4)

hannachen
Shopify Staff
54 8 17

Hi Veed 👋,

From my understanding, the `initialQuery` option behaves more like a filter to search within fields available to the resource. In this case, only fields related to products are available (`title`, `published_status`, `tag`, etc), but not the collection that the products are in. So unfortunately, what your code is trying to achieve may not be possible with App Bridge on its own. We have some documentation on the search syntax (https://help.shopify.com/en/api/getting-started/search-syntax), although you may need access to GraphQL to check which fields are available for a resource type, attached is an example for the `Product` resource type:

 

Resource details viewed using GraphiQLResource details viewed using GraphiQL

 

Hope this helps!

Hanna | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

policenauts
Shopify Partner
206 10 67

@hannachen thanks for this - I know you're not responsible for the ResourcePicker, but do you know why prepending "title:" in the search bar doesn't work? Meanwhile, sku and product type both do. 

hannachen
Shopify Staff
54 8 17

Hi @policenauts,

After some investigation from the team, it does look like there are some unexpected behaviour when using the `title:` filter.

From our tests, that filter appear to be doing an exact match. If you want a partial match, you may need to append a * to the search term like so:

title:fancy hat*

Do you have some examples of the search term used and the products available? i.e. What were the products that you were looking for, and what showed up in the results?

Could you give that a try and see if it works for you?

Hanna | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

policenauts
Shopify Partner
206 10 67

Thanks @hannachen , here is a video: https://photos.app.goo.gl/rhs3k5g2ab44AQo7A. I do see that appending * works, but on a POS device that is asking a lot of a merchant in a fast-paced checkout environment.