gatsby-source-anilist

This is a Gatsby source plugin to pull data from the Anilist GraphQL API. It is heavily based on the excellent gatsby-source-github (which I aslo use and cannot recommend enough) by Dustin Schau, who as far as I know came up with this stategy of connecting graphql databases. I modified this technique to work with the Anilist API with minimal changes.

Install

npm install gatsby-source-anilist --save-dev

Usage

// In your gatsby-config.js
plugins: [
    {
      resolve: 'gatsby-source-anilist',
      options: {
        queries: [
          `
            {
              MediaListCollection(userId: 122315, type:ANIME) {
                lists {
                  name
                  entries {
                    id
                    media {
                      id
                      title {
                        romaji
                        english
                        native
                        userPreferred
                      }
                    }
                  }
                  isCustomList
                  isSplitCompletedList
                  status
                }
              }
            }
          `
        ]
      }
    },
    ...
]

Where queries is an array of valid graphql queries for Anilist. These can be tested live in AniList's GraphQL Explorer.

Querying Data

Returned results are added to Gatsby's GraphQL nodes with the renaming convention from the original gatsby-source-gtihub. See David's description here for more information.

Example

{
  resolve: 'gatsby-source-anilist',
  options: {
    queries: [
      `
        {
          MediaListCollection(userId: 122315, type:ANIME) {
            lists {
              name
              entries {
                id
                media {
                  id
                  title {
                    romaji
                    english
                    native
                    userPreferred
                  }
                }
              }
              isCustomList
              isSplitCompletedList
              status
            }
          }
        }
      `
    ]
  }
},

Produces:

{
  allAnilistMedialistcollection {
    edges {
      node {
        id
        lists {
          name
          entries {
            media {
              id
              title {
                romaji
                english
                native
                userPreferred
              }
            }
          }
          isCustomList
          isSplitCompletedList
          status
        }
      }
    }
  }
}