Skip to content
Get help on Slack

Issue with tabs plugin in Sanity causing code visibility problems

7 replies
Last updated: Feb 26, 2021
Hi! I have a problem when using tabs plugin. When I copy paste code into the field, it's not visible until I refresh the page. Is there a way of fixing it? Thanks! 🙂
Feb 26, 2021, 10:31 AM
import { MdNoteAdd as icon } from "react-icons/md"
import Tabs from "sanity-plugin-tabs"

export default {
  name: "blogPost",
  title: "Blog Posts",
  type: "document",
  icon,
  inputComponent: Tabs,
  fieldsets: [
    { name: "main", title: "Main", options: { sortOrder: 10 } },
    { name: "seo", title: "SEO", options: { sortOrder: 20 } },
  ],
  fields: [
    {
      name: "main",
      title: "Main",
      type: "blogPostMain",
      fieldset: "main",
    },
    {
      type: "seoOptions",
      name: "seo",
      title: "SEO",
      fieldset: "seo",
    },
  ],
  preview: {
    select: {
      title: "main.title",
      media: "main.featuredImage",
    },
    prepare({ title, media }) {
      return {
        title,
        media,
      }
    },
  },
}
Feb 26, 2021, 10:31 AM
Can this be related to the title being pulled from main? Is this a wrong way of doing this?
Feb 26, 2021, 10:32 AM
Hi User, thanks for reporting this! It might be a bug in the tabs plugin, as we've also seen a similar issue recently with images being pasted into a field inside of a tab. We'll tag the author and keep you posted 🙂
Feb 26, 2021, 10:41 AM
Awesome, thank you! 🙂
Feb 26, 2021, 10:41 AM
As a workaround, what you could try is nesting all your fields inside another (new) object, and moving the Tabs input component and fieldsets into it as well. Afterwards, place that object in the document. In other words, nest everything one level deeper.
Feb 26, 2021, 10:42 AM
Will try that, thank you very much 🙂
Feb 26, 2021, 10:48 AM
Hi! Also using the tabs plugin, the documentation actually calls for everything to be nested inside of a tabs object, which, unless I’m reading the code example wrong, you’re not doing, I’ve seen reports of strange behaviour when not nesting it that way, so as User said that should probably fix your issues (and since this code example is not adherent to the documentation I don’t think this should even be regarded as a bug with the plugin)
Feb 26, 2021, 4:46 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.

Get started for freeExplore the demo

Was this answer helpful?