Understanding custom input components for complex objects in Sanity.io

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.

Get started for free Explore the demo

Understanding custom input components for complex objects in Sanity.io

Sanity– build remarkable experiences at scale

Was this answer helpful?