gatsby-uc / gatsby-source-strapi

Gatsby source plugin for building websites using Strapi as a data source
MIT License
354 stars 182 forks source link

Unable to make optional fileds. #350

Closed zhesha closed 1 year ago

zhesha commented 2 years ago

It's not working with optional fields. As I try to query data in my template like:

export const pageQuery = graphql`
  query Homepage($locale: String!) {
    topBar: strapiTopBar(locale: { eq: $locale }) {
      color
    }
  }
`

It gives error Cannot query field "color" on type "STRAPI_TOP_BAR". if the color field is not set in strapi. It's an optional field so I expect that it can be queried and give me null if it's not set.

It can be fixed by defining custom types, but they are not working with nested types.

createTypes(`
    type STRAPI__COMPONENT_ELEMENTS_COLOR implements Node {
        color: STRAPI__COMPONENT_ELEMENTS_COLOR
    }
    type STRAPI_TOP_BAR implements Node {
        color: String
        background: STRAPI__COMPONENT_ELEMENTS_COLOR
    }
`)

In this case, color works just fine, but background is always null. So I end up in a situation where I can't have optional fields, or when I can't reuse elements in strapi, both are not good.

gatsby-source-strapi version: 2.0.0.

It happens after updating strapi and plugin versions. I had strapi version "3.6.5", gatsby version "^3.1.2" and gatsby-source-strapi version "1.0.2", and it works fine. After updating strapi to version "4.3.9", and gatsby-source-strapi version to "^2.0.0" it stop working. It would be great if it will be fixed, or some workaround given, thanks.

everythinginjs commented 2 years ago

Hey @zhesha , I have encountered the same problem. This is the problem that can NOT be handled by gatsby source strapi but the solution that worked for me is here.

  1. do not leave optional fields and fill out all of them on your local strapi.
  2. yarn add gatsby-plugin-schema-snapshot on your gatsby project. docs.
  3. add this object into your gatsby-config file
    {
    // Path where the type definitions will be saved to
    path: `schema.gql`,
    update: true,
    }
  4. now try to build your project with yarn build after that you would see schema.gql in the root of your gatsby project.
  5. change update: true, to update: false, in the gatsby-plugin-schema-snapsho config.
  6. go ahead and make what ever you would like to be optional.

NOTE: never switch to update: true with empty fields because schema.gql would not create with all fields.

hope it works for you.

laurenskling commented 2 years ago

assuming your component is named elements-background, change to this:

createTypes(`
    type STRAPI__COMPONENT_ELEMENTS_BACKGROUND implements Node {
        color: String
    }
    type STRAPI_TOP_BAR implements Node {
        background: STRAPI__COMPONENT_ELEMENTS_BACKGROUND @link(from: "id", by: "background___NODE")
    }
`)

because the component is a relation, you need to link it

zhesha commented 2 years ago

The solution with gatsby-plugin-schema-snapshot works fine. Thanks, @everythinginjs. But I have a bunch of problems so I decided not to update, and stay in the previous version.

moonmeister commented 1 year ago

Thanks for your interest in this project. This plugin is moving into the Gatsby User Collective and this repo will be archived. Please open an issue in that repository, submit a PR if you'd like to see this implemented, or join us on Discord if you have questions!v