Using multiple document level plugins in Sanity.io

8 replies
Last updated: Nov 11, 2021
Hi all! I got a question about the using multiple document level plugins. For doc level translations I'm using
sanity-plugin-intl-input
see here . But I also want to have more options on the document level. For example: live preview mode, SEO previews etc. But it seems like the translation plugin does not allow having other doc level plugins in use.. Anyone who has experience with this?
Nov 11, 2021, 11:53 AM
Like the Views and Split Panes are not showing
Nov 11, 2021, 1:46 PM
but I do have them set in the deskStructure:
if (schemaType === "homePage") {
    return S.document().views(
      S.view.form(),
      S.view.component(HomePagePreview).title("Preview"),
      S.view.component(SocialPreview()).title("Social & SEO")
    );
  }
Nov 11, 2021, 1:47 PM
Hey Jurrian, not sure if that’s a typo but
S.document().views()
takes an array, soit should be

if (schemaType === "homePage") {
    return S.document().views(
      [
        S.view.form(),
        S.view.component(HomePagePreview).title("Preview"),
        S.view.component(SocialPreview()).title("Social & SEO")
      ]
    );
  }
Nov 11, 2021, 2:42 PM
Aah yes, that's how the plugin is configured..
import * as Structure from 'sanity-plugin-intl-input/lib/structure';

// default implementation by re-exporting
export const getDefaultDocumentNode = Structure.getDefaultDocumentNode;
export default Structure.default;

// or manual implementation to use with your own custom desk structure
export const getDefaultDocumentNode = (props) => {
    if (props.schemaType === 'myschema') {
        return S.document().views(Structure.getDocumentNodeViewsForSchemaType(props.schemaType));
    }
    return S.document();
};

export default () => {
  const items = Structure.getFilteredDocumentTypeListItems();
  return S.list()
      .id('__root__')
      .title('Content')
      .items(items);
};
Nov 11, 2021, 3:09 PM
Thank you! I found a way 🤩
Nov 11, 2021, 3:12 PM
if (schemaType === "page") {
    return S.document().views([
      // just spread the regular document views
      ...I18nS.getDocumentNodeViewsForSchemaType(schemaType),
      S.view.component(ContentPagePreview).title("Page"),
      S.view
        .component(
          SocialPreview({
            // Overwrite prepareFunction to pick the right fields
            prepareFunction: ({ title, brand, mainImage, body, slug }) => {
              return {
                title: `${title} - ${beautifyString(brand?._ref)}`,
                description: body
                  ? `${toPlainText(body["en"] || body["nl"] || "").substring(
                      0,
                      160
                    )}...`
                  : "",
                ogImage: mainImage,
                siteUrl: "<https://example.com>",
                slug: `/${slug?.current ? slug?.current : ""}`,
              };
            },
          })
        )
        .title("Social &amp; SEO"),
    ]);
  }
Nov 11, 2021, 3:12 PM
neat, thanks for sharing the solution!
Nov 11, 2021, 3:14 PM

Sanity– build remarkable experiences at scale

The Sanity Composable Content Cloud is the 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?

Categorized in