Gatsby-Source-Contentful: Duplicated entries on References Many field with Circular Reference

[mikehawkfish]

Description

Hey there Gatsby Team,

I am seeing duplicated entries for References Many fields under these specific circumstances:

1. References Many field with circular reference( Main nav -> Pages -> Main Nav)
2. After publishing, then .cache is cleared, duplicate and incorrect entries are returned

Querying the Contentful GraphQL API directly works perfectly fine so it's an issue with a References Many that has a circular reference with GSContentful.

I've tried filtering with (filter: {node_locale: {eq: "en-US"}}) with no luck at all looking at: https://github.com/gatsbyjs/gatsby/issues/6254

To fix the issue temporarily:

1. Go to the problem type in the Content Editor
2. Unpublish the entries
3. Republish
4. Start your build/local dev and Gatsby will have updated the entries and they will show correctly

This will fix it until you clear your .cache and it will break again.

Here's the query that works in Contentful:

query {
  pagesCollection(limit: 8) {
    items {
      componentsOnPageCollection {
        items {
          ... on MainNav {
            pagesCollection(limit: 10) {
              items {
                route
              }
            }
          }
        }
      }
    }
  }
}

Is this a regression perhaps?

Thanks for any insight!

Steps to reproduce

I'm unable to provide a repro at this time because the repo/data are private. Hoping someone can confirm with something already setup.

Steps to reproduce:

1. Have a Contentful Project with a Content Type that has a field of References Many.
2. This Ref Many field should be a circular reference. For example, I have: Main Nav -> Pages -> Main Nav relationship. Main Nav reference Pages, and Pages has a field called Components which references to Main Nav.
3. Run gatsby development or gatsby build
4. You should see duplicated, wildly inaccurate content different from what is published.
5. If that didn't work, you should run gatsby clean and restart/build again

Expected result

Entries should not be duplicated or wrong altogether. They should adhere to the rules of the graphQL query, only returning what is specified, even if the reference is circular.

"allContentfulMainNav": {
  "edges": [
    {
      "node": {
        "theme": "light",
        "pages": [
          {
            "route": "/who-we-are"
          },
          {
            "route": "/why-we-are-here"
          },
          {
            "route": "/what-we-do"
          },
          {
              "route": "external-route"
          },
          {
            "route": "/contact"
          }
        ]
      }
    },
    {
      "node": {
        "theme": "dark",
        "pages": [
          {
            "route": "/who-we-are"
          },
          {
            "route": "/what-we-do"
          },
          {
            "route": "/why-we-are-here"
          },
          {
              "route": "external-route"
          },
          {
            "route": "/contact"
          }
        ]
      }
    }
  ]
}
}

Actual result

"allContentfulMainNav": {
      "edges": [
        {
          "node": {
            "theme": "light",
            "pages": [
              {
                "route": "/who-we-are"
              },
              {
                "route": "/why-we-are-here"
              },
              {
                "route": "/what-we-do"
              },
              {
                "route": "external-route"
              },
              {
                "route": "/contact"
              },
              {
                 "route": "external-route"
              },
              {
                "route": "/what-we-do"
              },
              {
                "route": "/why-we-are-here"
              },
              {
                "route": "/privacy"
              },
              {
                "route": "/"
              }
            ]
          }
        },
        {
          "node": {
            "theme": "dark",
            "pages": [
              {
                "route": "/who-we-are"
              },
              {
                "route": "/what-we-do"
              },
              {
                "route": "/why-we-are-here"
              },
              {
                "route": "external-route"
              },
              {
                "route": "/contact"
              },
              {
                "route": "/contact"
              },
              {
                "route": "/who-we-are"
              }
            ]
          }
        }
      ]
    }
  }

Environment

System: OS: macOS 10.15.6 CPU: (8) x64 Intel(R) Core(TM) i7-8569U CPU @ 2.80GHz Shell: 5.7.1 - /bin/zsh Binaries: Node: 12.18.3 - ~/.nvm/versions/node/v12.18.3/bin/node npm: 6.14.6 - ~/.nvm/versions/node/v12.18.3/bin/npm Languages: Python: 2.7.16 - /usr/bin/python Browsers: Chrome: 84.0.4147.105 Safari: 13.1.2 npmPackages: gatsby: ^2.24.51 => 2.24.51 gatsby-image: ^2.4.9 => 2.4.9 gatsby-plugin-loadable-components-ssr: ^2.1.0 => 2.1.0 gatsby-plugin-manifest: ^2.4.14 => 2.4.14 gatsby-plugin-postcss: ^2.3.6 => 2.3.6 gatsby-plugin-react-helmet: ^3.3.6 => 3.3.6 gatsby-plugin-robots-txt: ^1.5.1 => 1.5.1 gatsby-plugin-sharp: ^2.6.14 => 2.6.14 gatsby-plugin-sitemap: ^2.4.11 => 2.4.11 gatsby-plugin-webpack-bundle-analyzer: ^1.0.5 => 1.0.5 gatsby-source-contentful: ^2.3.39 => 2.3.39 gatsby-source-filesystem: ^2.3.14 => 2.3.14 gatsby-transformer-sharp: ^2.5.7 => 2.5.7 npmGlobalPackages: gatsby-cli: 2.12.69

[vladar]

CC @axe312ger

[axe312ger]

Hey @mikehawkfish,

first of all: As you mention the Contentful GraphQL API, how do you load the Contentful data into your project? Do you use the Contentful GraphQL API or the gatsby-source-contentful plugin?

If you use gatsby-source-contentful, we introduced a fix of how content is processed before putting it into the Gatsby GraphQL DB. You may find a canary version to try out here: #25249

Let me know if the fix helps, if you work with the Contentful GraphQL API directly, we have to investigate further.

Best, Benedikt

[mikehawkfish]

@axe312ger thanks so much for your reply and help!

I'm indeed using gatsby-source-contentful. I wanted to illustrate that it was definitely an issue with the plugin and not the API.

I will give the canary version a shot and see how it goes. How stable is it?

Thanks again!

[axe312ger]

@mikehawkfish It should be pretty stable, didnt have any issues with my personal projects.

[github-actions[bot]]

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 60 days of inactivity. It’s been at least 20 days since the last update here. If we missed this issue or if you want to keep it open, please reply here. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

[github-actions[bot]]

Hey again!

It’s been 60 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it. Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to comment on this issue or create a new one if you need anything else. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community! 💪💜