shopify App Bridge - Product Resource Picker - search by collection

[veed]

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.

[hannachen]

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 GraphiQL

Hope this helps!

[Filljoy]

@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]

Hi @Filljoy,

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?

[Filljoy]

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.