Unlock seamless workflows and faster delivery with our latest releases - Join the deep dive

Troubleshooting a gallery block error in a page builder

14 replies
Last updated: Apr 1, 2020
hi all, currently trying to make a page builder for a client, i’m trying to make a gallery block for them that contains an object with a caption, alt text and the image. When i try add this block, i get this error:

Uncaught Error: Invalid item type: "[object Object]". Default array input can only contain objects (for now)

Is there a way around the array of arrays?
Apr 1, 2020, 9:47 AM
Hi Ste! This is to guard against multidimensional arrays until they get proper support. Wrapping the nested array in an
object
type should give you a way around it. Let me know if you need some help with this — if so, it would be helpful if you could share the gallery code 👍
Apr 1, 2020, 9:53 AM
Thank you
user M
, i’ve tried the nested object but it only seems to let me create 1 image for a
gallery
block!
Apr 1, 2020, 7:38 PM
here is my code for the 2 parts
Apr 1, 2020, 7:38 PM
export default {
  title: "Gallery",
  name: "gallery",
  type: "object",
  fields: [
    {
      name: "image",
      title: "Image",
      type: "array",
      of: [{ type: "galleryImage" }],
    },
  ],
}
Apr 1, 2020, 7:39 PM
export default {
  name: "galleryImage",
  type: "object",
  title: "Gallery Image",
  fields: [
    { name: "caption", type: "string", title: "Caption" },
    { name: "mainImage", type: "image", title: "Image" },
  ],
}
Apr 1, 2020, 7:39 PM
then at the top level, we just have this
Apr 1, 2020, 7:39 PM
export default {
  name: "pageBuilder",
  type: "array",
  title: "Content",
  of: [
    {
      name: "header",
      type: "header",
      title: "Header",
    },
    {
      name: "landingHeader",
      type: "landingHeader",
      title: "Landing Header",
    },
    {
      name: "images",
      type: "galleryImage",
      title: "Gallery",
    },
  ],
}
Apr 1, 2020, 7:39 PM
Try replacing
galleryImage
by
gallery
in your
pageBuilder
array 🙂
Apr 1, 2020, 7:45 PM
Ahhhh unsure how I missed that!!
Apr 1, 2020, 7:47 PM
thank you sosososoosso much!
Apr 1, 2020, 7:47 PM
It’s all that inception stuff clouding our minds: an object inside an array inside an object inside an array 😉 Good to go!
Apr 1, 2020, 7:48 PM
Content added! For this new field to show in my Gatsby schema, do I need a graphql deploy again? A sanity deploy doesn’t seem to have updated it
Apr 1, 2020, 8:07 PM
That’s right: any time you make changes to your schema, you’ll need to run
sanity graphql deploy
to update your GraphQL API. The alternative to this is using GROQ instead, but GraphQL makes sense for Gatsby 👍
Apr 1, 2020, 8:27 PM
wonderful! will give it a go now 🙂
Apr 1, 2020, 8:32 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?