Previewing the title in a string options list in Sanity and the front-end.
1 replies
Last updated: Oct 4, 2021
C
Hey guys, I'm wondering how do you preview the
This list example from the
String Schema Type Docs shows how to preview the lowercase string value, but I'm wondering if there is a way to preview the title string instead, since the title string is more human-readable?
In the sanity-gatsby-portfolio starter, the projectMember object has a list of roles that are selectable for each person that you add as a projectMember to a project. The preview property looks like this:
I've tried
titlein a string options list in both sanity, and also in the front-end?
This list example from the
String Schema Type Docs shows how to preview the lowercase string value, but I'm wondering if there is a way to preview the title string instead, since the title string is more human-readable?
In the sanity-gatsby-portfolio starter, the projectMember object has a list of roles that are selectable for each person that you add as a projectMember to a project. The preview property looks like this:
//studio/schemas/objects/projectMember.js export default { type: 'object', name: 'projectMember', title: 'Project Member', fields: [ { title: 'Person', name: 'person', type: 'reference', to: {type: 'person'} }, { title: 'Roles', name: 'roles', type: 'array', of: [{type: 'string'}], options: { layout: 'radio', list: [ {title: 'Content Designer', value: 'content'}, {title: 'Director', value: 'director'}, {title: 'Engineer', value: 'engineer'}, {title: 'Engineering Manager', value: 'engineeringManager'}, {title: 'Product Designer', value: 'designer'}, {title: 'Product Manager', value: 'manager'}, {title: 'Subject Matter Expert', value: 'sme'}, {title: 'Technical Writer', value: 'technicalWriter'}, {title: 'UX Researcher', value: 'researcher'} ] } } ], preview: { select: { personName: 'person.name', roles: 'roles', media: 'person.image' }, prepare (data) { return { ...data, title: data.personName, subtitle: data.roles && data.roles.join('/') } } } }
data.roles.titleand passing
roles.titleinto the select object but they both don't return anything. When I try and inspect the document, the value is only shown, and the title isn't available, which begs the question if the title field is even able to be passed into other previews or onto the front-end. If not, then should we maintain the value field as lowercase or can we use display formatting in those fields?
Oct 2, 2021, 1:22 AM
K
Hi
You
can write whatever value you want into the
user R
- unfortunately, you'll have to either duplicate these titles, or create a common enum that both the front-end and studio can use. The titleis only decorative and for studio use.
You
can write whatever value you want into the
valuefield, but "best practice" is to keep those values simple and translatable, by using enums.
Oct 4, 2021, 5:58 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.