👋 Next.js Conf 2024: Come build, party, run, and connect with us! See all events

How to use Custom Input Components on a Field of Type ‘Object’

1 replies
Last updated: Apr 14, 2020
Hello people of the sanity community! I am trying to get my head around custom input components used on an field of type ‘object’. This is the object in question, I have it as a part of my Product document.

export default {
    title: 'Product Info',
    name: 'productInfo',
    type: 'object',
    fields: [
        {
            title: 'Product Id',
            name: 'productId',
            type: 'number'
        },
        {
            title: 'Product Storage Id',
            name: 'storageId',
            type: 'number'
        },
        {
            title: 'hasAttributes',
            name: 'hasAttributes',
            type: 'boolean'
        },
        
    ]
}
The object has some more attributes but they aren’t needed for this example, so I have a custom input component that prepopulates the product names and respective values with information from our PIM, in order for the user to select a product name from a dropdown and you have all the values you want to set like this as an object:

{ productId: 90922, storageId: 29992, hasAttributes: true }
So my question is, how would I use the PatchEvent set() specified in the documentation for an more complex object than a single string or number? If I provided an object would it be able to map the keys to the fieldnames in the schema? Below is provided of the example from the documentation with the single number.

const createPatchFrom = value => PatchEvent.from(value === '' ? unset() : set(Number(value)))
Apr 13, 2020, 6:25 PM
For anyone having the same problem as I: I figured out that patches from custom input and the http api probably worked the same under the hood. So by looking at the documentation here, https://www.sanity.io/docs/http-patches , I made this work by sending in an object with keys as the field names and values as the new values that I wanted.

user Y
or someone at Sanity, Id love to help extend the documentation for https://www.sanity.io/docs/custom-input-widgets to cover objects as well! Let me know if you want me to write something up that you can look through, edit and publish!
Apr 14, 2020, 7:06 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?