How to iterate on all Strapi.js enum in Gatsby and Graphql

Questions and Answers
1

I have a field on my Strapi.js admin called category.

CRS
CRS924Ă—591 21.4 KB

I tried to research on how to get all the values of category, I did tried this:

Object.values(category);

But this did not work instead it threw me a bunch of Module Errors.

export const query = graphql`
  {
    allStrapiWorks {
      nodes {
        id
        name
        slug
        category
        stack {
          stack_name
          id
        }
        featured_image {
          childImageSharp {
            fluid {
              ...GatsbyImageSharpFluid_withWebp
            }
          }
        }
      }
    }
  }
`

If I called works.category it will just show undefined but if I map through the works it will show each category per piece not as a collection along with all other fields within an object.

Is there anyway to map or iterate through all of the enums on strapi.js?

Please help!

2

As the enumeration values are statically typed (stored in the model config) we don’t have a method for fetching those values as it’s generally expected the frontend also would have them statically typed.

To fetch those you will either need to make a custom GraphQL resolve or a custom REST route/controller to fetch the data from the model information.

3

Hi @DMehaffy, I also have the same need and I do not agree with your first solution that we should store enum values on both frontend & backend, no one wants to maintain two lists for several reasons.
The second solution solves this issue but it would be nice to consider to add a convenient way to query enum values.
Thanks

4

I do agree with you that it doesn’t fit every need. The specifics was more so done via the definition of “enumeration” values and how they are treated in programming.

I’ll link a related discussion to this:
https://github.com/strapi/strapi/issues/784

5

I was trying to find a solution to the same issue and found this “hacky” way to get enum values from Strapi, by making a GET request on the /content-type-builder/content-types/:uid endpoint which you’ll find in the Content-Type-Builder section of the User & Permissions Plugin

image
image1228Ă—901 60.7 KB

This returns the model schema as a JSON object, and you can then iterate through the values of your enum field

image
image1697Ă—841 74.8 KB

6

I did something similar as a prototype to test with:

1 Like
7

Oh wow.

So you wrote a custom controller that returns strapi.models[ctx.query.model].allAttributes after checking to ensure that the user has queried an existing model and whether the user has the requisite permissions.

Did I get that right?

8

More or less yes, I have mine hard coded to check a specific role’s permissions (public) but you could check the ctx.state.user.role.id and query based on that.

1 Like
9

@RobertJohnson not quite sure if that would solve it for you, but you can have a look at graphql-codegen GitHub - dotansimha/graphql-code-generator: A tool for generating code based on a GraphQL schema and GraphQL operations (query/mutation/subscription), with flexible support for custom plugins.

It creates a type definition file (on build or whenever you call it) directly from the schema which is pulled from strapis graphql endpoint, allowing you to iterate over the enum type in the frontend, without having you maintain multiple lists. I hope this helps.

10

I am using this one - and it does generate the enum types - but there is one problem.

It generates enum types as:

export enum Enum_Example {
  Option1 = 'OPTION1',
  Option2 = 'OPTION2',
}

But when we try to import this enum into a *.ts file, we get this error:

Module not found: Can't resolve 'graphql/generated/types'

And this specifically happens when we are using the TS Declaration file (types.d.ts) for type generation.