Customizing Sanity Studio beyond the schema

import S from "@sanity/desk-tool/structure-builder";
export default () =>
  S.list() // Outermost / farthest left:  we want to create a vertical "list" pane.
    .title("Content") // Give the pane the title of 'Content' just like it has normally.
    .items([ // Define the items that will appear in this far-left pane.
      ...S.documentTypeListItems(), // Include all document types
    ]);

import S from "@sanity/desk-tool/structure-builder";
const hiddenDocTypeNames = [];
const hiddenDocTypes = (listItem) =>
  !hiddenDocTypeNames.includes(listItem.getId());
export default () =>
  S.list() // Outermost / farthest left:  we want to create a vertical "list" pane.
    .title("Content") // Give the pane the title of 'Content' just like it has normally.
    .items([ // Define the items that will appear in this far-left pane.
      ...S.documentTypeListItems() // Include all document types
        .filter(hiddenDocTypes), // Minus anything we handled by hand
    ]);

import S from "@sanity/desk-tool/structure-builder";
const hiddenDocTypes = (listItem) => !["about"].includes(listItem.getId());
export default () =>
  S.list() // Outermost / farthest left:  we want to create a vertical "list" pane.
    .title("Content") // Give the pane the title of 'Content' just like it has normally.
    .items([ // Define the items that will appear in this far-left pane.
      S.listItem() // Inside the 'items' array we create our first list item by hand.
        .title("About Me") // We give the first list item a title of 'About Me'. This is going to be where we define our singleton!
        .child(
          // This creates a new child pane when the list item is clicked on. Inside the parentheses we will define what that child pane will contain.
          S.editor() // This shows the content editor in the child pane. We specify what this editor displays with the three methods below...
            .id("about") // Set this to the name of the singleton.
            .schemaType("about") // Here we define which schema this editor will use to generate fields. We want this to use the 'about' schema so it has been filled in accordingly.
            .documentId("singleton-about") // This will create a single document with the _id of 'singleton-about' and open it in the editor.
        ),
      ...S.documentTypeListItems() // Include all document types
        .filter(hiddenDocTypes), // Minus type 'about'
    ]);

import S from "@sanity/desk-tool/structure-builder";
const hiddenDocTypes = (listItem) => !["event"].includes(listItem.getId());
export default () =>
  S.list() // Outermost / farthest left:  we want to create a vertical "list" pane.
    .title("Content") // Give the pane the title of 'Content' just like it has normally.
    .items([ // Define the items that will appear in this far-left pane.
      S.documentTypeListItem("event"), // Hand-include "event"
      ...S.documentTypeListItems() // Include all document types
        .filter(hiddenDocTypes), // Minus type 'event'
    ]);

import S from "@sanity/desk-tool/structure-builder";
import React from "react";
const hiddenDocTypes = (listItem) => !["event"].includes(listItem.getId());
export default () =>
  S.list() // Outermost / farthest left:  we want to create a vertical "list" pane.
    .title("Content") // Give the pane the title of 'Content' just like it has normally.
    .items([ // Define the items that will appear in this far-left pane.
      S.documentTypeListItem("event") // Hand-include "event"
        .child(
          S.documentTypeList("event") // Specify that when you click on "event" from the first pane, you get an event-list second pane
            .child((id) =>
              S.document() // Specify that when you click on a given "event" from the second pane, you get an "event document" with two sub-view 4th-level tab-panes -- a Sanity-delivered editing form and a simple JSON view.
                .schemaType("event")
                .documentId(id)
                .views([
                  S.view.form(), // The default form for editing an "event" document
                  S.view
                    .component(
                      (
                        { document } // A "View JSON" tab that renders the current selected document's values as JSON
                      ) => (
                        <pre>{JSON.stringify(document.displayed, null, 2)}</pre>
                      )
                    )
                    .title("View JSON"),
                ])
            )
        ),
      ...S.documentTypeListItems() // Include all document types
        .filter(hiddenDocTypes), // Minus type 'event'
    ]);

import S from "@sanity/desk-tool/structure-builder";
import React from "react";
const hiddenDocTypes = (listItem) => ![].includes(listItem.getId());
const customizeDocumentTypeList = (listItem) => {
  const listItemTypeName = listItem.getId();
  if (listItemTypeName === "event") {
    return S.documentTypeListItem(listItemTypeName).child(
      S.documentTypeList("event").child((id) =>
        S.document()
          .schemaType("event")
          .documentId(id)
          .views([
            S.view.form(), // The default form for editing an "event" document
            S.view
              .component(
                (
                  { document } // A "View JSON" tab that renders the current selected document's values as JSON
                ) => <pre>{JSON.stringify(document.displayed, null, 2)}</pre>
              )
              .title("View JSON"),
          ])
      )
    );
  }
  return S.documentTypeListItem(listItemTypeName);
};

export default () =>
  S.list() // Outermost / farthest left:  we want to create a vertical "list" pane.
    .title("Content") // Give the pane the title of 'Content' just like it has normally.
    .items([
      // Define the items that will appear in this pane.
      ...S.documentTypeListItems() // Include all document types
        .filter(hiddenDocTypes)
        .map(customizeDocumentTypeList), // Minus type 'event'
    ]);

import S from "@sanity/desk-tool/structure-builder";
import React from "react";

export default () =>
  S.list() // Outermost / farthest left:  we want to create a vertical "list" pane.
    .title("Content") // Give the pane the title of 'Content' just like it has normally.
    .items([
      // Define the items that will appear in this far-left pane.
      ...S.documentTypeListItems(), // Include all document types
    ]);

export const getDefaultDocumentNode = ({ documentId, schemaType }) => {
  if (schemaType === "event") {
    return S.document().views([
      S.view.form(), // The default form for editing an "event" document
      S.view
        .component(
          (
            { document } // A "View JSON" tab that renders the current selected document's values as JSON
          ) => <pre>{JSON.stringify(document.displayed, null, 2)}</pre>
        )
        .title("View JSON"),
    ]);
  }
};