itemData broken for CatalogItems response

[kyeshmz]

Describe the bug

The current typings or library is bugged when we

1. get a list of items using searchCatalogItems
2. Using the result of that to get items
3. Parsing the items like result.items.map((item) => item.itemData) for the itemData. This works if you manually cast it ['item_data']

This also seems to be the same for 'image_ids' where it is not apparent in the typings, but you can call for it in the response.

Albiet, this is a bit of remix code, but the fetch is working fine. everything after that seems to be failing.

Expected behavior

For the item to be returned using result.items.itemData

To Reproduce Steps to reproduce the bug:

1. Create a remix project
2. add your square creds
3. try and get a catalog and console log the body
4. try using result.items.map((item) => item.itemData) for it to be undefined

and before anyone asks if I asked the forums, this seems unresolved as of 2022. https://developer.squareup.com/forums/t/image-id-image-url-missing-from-catalog-item/5623

Square SDK version 37.1.0

[zenmasterjobo]

Hi @kyeshmz

Sorry you are running into issues, this is definitely strange

I am not running into this issue while running a typescript app locally that queries the searchCatalogItems endpoint. I can correctly console log the data stored in itemData without casting it to item_data

Can you help me understand where in your remix app you are querying the Square API? I'm not familiar with Remix myself, but looking at the documentation you can setup your own server for making calls or using the remix provided one.

The Square SDK should be used within the server part of your application. It's there you should define your client and then query the searchCatalogItems endpoint.

The code snippet you provided looks like it's in the frontend code (given the .tsx file extension). That code may be fine, so long as the method useLoaderData is querying your server which is then making the query to Square. I'd like to understand your code better because this issue could somehow be happening between the serialized communication between your server and the frontend app

Thank you :)

[kyeshmz]

@zenmasterjobo Hi Thanks for the reply.

I think that one of the reasons is that I was using body instead of result. I can see ItemData from this point on.

There are still arguments like "kitchen_name" that seem to not be interfaced by the SDK itself. I am using this for our frontend site, cause the name itself is in a different language, and I want the URL to be in English.

EDIT: ah this is undocumented. and stripped if you use result. This seems not good.

const beerPacks = await squareClient.catalogApi.searchCatalogItems({
        categoryIds: [process.env.SQUARE_BEERPACK_CATEGORY_ID!],
        archivedState: "ARCHIVED_STATE_NOT_ARCHIVED",
    });
//this resolves as not typesafe
beerPacks.body

// this is correct
beerPacks.result

[zenmasterjobo]

oh yes, I should have thought of that. I forget we return both body and result, but yes, result is where our schema matches with the types defined in the SDK.

However, I agree with you that I can't find this explicitly documented, so I will check back with our documentation team and see about highlighting this information more clearly, aside from just using result in our example code

As for kitchen_name being an undocumented field, this could have been incorrectly exposed by our APIs and shouldn't be a field that you rely on in your api calls. The body is the raw json data returned from the API but result contains our correctly supported fields.

I will bring it up with the API team that this field kitchen_name is returning in the raw response data.

Let me know if you have further questions, or feel free to reopen this ticket if you run into other issues. Thanks :)