๐Ÿ”ฎ Sanity Create is here. Writing is reinvented. Try now, no developer setup

Adding custom views to a document using the orderable-document-list plugin

13 replies
Last updated: Mar 4, 2023
Hi! I am using: https://github.com/sanity-io/orderable-document-list
Anyone knows how to add different views for the document? Eg. Editor, Preview, Json.
Mar 2, 2023, 1:51 PM
You could use this to add a custom view.
Mar 3, 2023, 12:34 PM
You mean this?
export const getDefaultDocumentNode = ({documentId, schemaType}) => {
  // Render the JSON preview only on posts or the siteSettings document
  if (schemaType === "post" || documentId === "siteSettings") {
    return S.document().views([
Didnt work for the plugin i am using. But i fixed the problem by adjusting the plugin:

Called function from desk structure.
export function orderableDocumentListDeskItem(config: OrderableListConfig, views) {

return S.listItem()





Object.assign(S.documentTypeList(type).serialize(), {

// Prevents the component from re-rendering when switching documents

__preserveInstance: true,

// Prevents the component from NOT re-rendering when switching listItems

key: listId,

type: 'component',

component: OrderableDocumentList,

options: { type, filter, params, client },

I added this. Where i pass in the views i want to the plugin
child: (documentId: any) =>





menuItems: [

Create new ${typeTitle}
.intent({ type: 'create', params: { type } })

Reset Order 2
).serialize(),` `S.menuItem().title(
Show Increments



Mar 3, 2023, 12:37 PM
Glad you figured it out! ๐Ÿ˜Š
Mar 3, 2023, 1:13 PM
Thanks for the help thou:)
Mar 3, 2023, 1:14 PM
It worked straight with mine, although I think my configuration is pretty much simpler than yours. I just did a quick try.
Mar 3, 2023, 1:15 PM
But the good thing is I learned from your example that you could filter it out to show only on specific schema. That was some question I had before I saw your example.
Mar 3, 2023, 1:16 PM
hmm. Maybe i made a mistake in the default document node.
Mar 3, 2023, 1:16 PM
Ah, yes, I remember, I had to move out the
component because it canโ€™t seem to compile. I had to create a
file for that component
Mar 3, 2023, 1:17 PM
Yea sure!I like to do everything in the structure to get full control so i add view like this:





Mar 3, 2023, 1:17 PM
Yea all components used in views has to be a react component.
Mar 3, 2023, 1:18 PM
Right. Iโ€™m with you in doing it in desk structure. ๐Ÿ˜‰
Mar 3, 2023, 1:20 PM
Checked out your website. Very cool! And thanks for teaching webdev to others ๐Ÿ™‚
Mar 3, 2023, 1:24 PM
thank you
user J
. it means a lot. ๐Ÿ˜Š
Mar 4, 2023, 1:17 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?