No value attribute for image and gallery field type

fikaproductions / fika-gatsby-source-cockpit

This is a Gatsby version 2.\*.\* source plugin that feeds the GraphQL tree with Cockpit Headless CMS collections and singletons data. Actually, it supports querying raw texts (and any trivial field types), Markdown, images, galleries, assets, sets, repeaters, layout(-grid)s (currently only without nested images/assets), objects, linked collections and internationalization.

GNU General Public License v3.0

23 stars 22 forks source link

Hello. I'm trying to get image and use gatsby-transformer-sharp plugin like in your example from the plugin docs:

{
  allCockpitTeamMember {
    edges {
      node {
        Portrait {
          value {
            publicURL // (1)
            childImageSharp {
              fluid {
                ...GatsbyImageSharpFluid
              }
            }
          }
        }
      }
    }
  }
}

But in my GraphiQL i don't see the value attribute for image field type and can't use childImageSharp. I only have type attribute. The same problem is in gallery field type.

The value attribute is available in file filed type but I can't use childImageSharp too.

This is screenshot from my GraphiQL:

And this is my gatsby-config.json code:


module.exports = {
  siteMetadata: {
    title: `Example gatsby app`,
    langs: ['pl', 'en'],
    defaultLangKey: 'pl'
  },
  plugins: [
    `gatsby-plugin-react-helmet`,
    {
      resolve: 'gatsby-plugin-i18n',
      options: {
        langKeyForNull: "any",
        langKeyDefault: 'pl',
        useLangKeyLayout: false,
        prefixDefault: false,
        pagesPaths: ['/src/pages/pl', '/src/pages/en']
      }
    },
    {
      resolve: `gatsby-source-graphql`,
      options: {
        typeName: `Cockpit`,
        fieldName: `cmsAPI`,
        url: `***my-api-url***`
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `src`,
        path: `${__dirname}/src`,
      },
    },
    {
      resolve: '@fika/gatsby-source-cockpit',
      options: {
        token: '***my-token***',
        baseUrl: 'http://***my-domain***.pl/cockpit',
        locales: ['pl', 'en']
      },
    },
    `gatsby-plugin-sharp`,
    `gatsby-transformer-sharp`,
    {
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: `Example gatsby app`,
        short_name: `App`,
        description: ``,
        lang: `pl`,
        start_url: `/`,
        background_color: `#663399`,
        theme_color: `#663399`,
        display: `minimal-ui`,
        icon: `src/assets/images/icon_black.svg`,
      },
    },
    `gatsby-plugin-offline`
  ],
}

I found where is the problem.

When I upload image in cockpit panel and add this to image field by 'Select Image' in image url I get only file name with extention e.g. image.jpg.

When I add image by 'Select Asset' in image url I get full url for image but starting from cockpit directory e.g. /cockpit/storage/uploads/2019/10/24/image.jpg.

Value attribute for image filed in graphql query is invisible when the image url is incorrect. When i set image url by 'Enter Image Url' to /storage/uploads/2019/10/24/image.jpg everyting works great and value attribute with publicPath and childImageSharp and others attributes appears in graphql query and it works, image loads with lazy loading and blur effect.

But when i set image url to /storage/uploads/2019/10/24/image.jpg image preview diasppears in cockpit panel.

This same problem is with gallery field type but in this case I cant set image url by 'Enter Image Url' because this option in unavailable in gallery field.

So i think that problem is in cockpit side.

fikaproductions / fika-gatsby-source-cockpit

No value attribute for image and gallery field type #47