The Studio

Shaping the desk

Singletons pinned to a fixed id, grouped lists, filtered panes and custom orderings — with the structure builder rather than a fixed sidebar.

The default document-type list is alphabetical, which puts author first and the home page fourth. Nobody works that way. The structure builder replaces it.

structure/index.tsts
export const structure = (S) =>
  S.list()
    .title('Content')
    .items([
      S.listItem()
        .title('Site settings')
        .id('siteSettings')
        .child(S.document().schemaType('siteSettings').documentId('siteSettings')),
      S.divider(),
      S.documentTypeListItem('page').title('Pages'),
      S.listItem()
        .title('Documentation')
        .child(
          S.list().items([
            S.documentTypeListItem('docCategory').title('Categories'),
            S.listItem()
              .title('All articles')
              .child(
                S.documentTypeList('docArticle').defaultOrdering([
                  { field: 'category._ref', direction: 'asc' },
                  { field: 'order', direction: 'asc' },
                ]),
              ),
          ]),
        ),
      S.divider(),
      S.listItem()
        .title('Drafts')
        .child(S.documentList().filter('_id in path("drafts.**")')),
    ])

The four things worth doing

  1. Pin singletons. A settings document that appears in a list of one is a settings document somebody will eventually create a second copy of.
  2. Group by workflow, not by type. "Documentation" holding categories and articles beats two top-level entries eight rows apart.
  3. Order lists by what they mean. An order field sorted ascending, not the title.
  4. Add filtered panes. "Drafts" and "Recently updated" are two GROQ filters, and they are the panes an editor actually opens.