Add ability to sort groups

[LegNeato]

Feature request: ability to sort groups

It appears there is no way to specify the sort order of groups: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/schema/build-connection-fields.js#L97

[calcsam]

We have the ability to sort and filter in GraphQL as the docs specify:

https://www.gatsbyjs.org/tutorial/part-four/#build-a-page-with-a-graphql-query

However we need more information on this so I've opened a PR to add additional info:

#3687

[KyleAMathews]

@calcsam this is a different issue — Gatsby lets you group connections by a field e.g. query a list of authors and group by "hometown".

@LegNeato how would you like to sort the groups I'm curious? Groups are returned as an object correct? Objects can't be sorted.

[LegNeato]

@KyleAMathews Ah, yeah. Hmmm, perhaps I mean edges? Let me explain what I am trying to do...

I am trying to group my pages into sections, and in those sections have an order (for a menu).

The query I am using is:

{
  allJsFrontmatter {
    group(field: data___section) {
      fieldValue
      edges {
        node {
          menuLabel,
          positionInSection,
        }
      }
    }
  }
}

This correctly groups by section, but doesn't order the resulting edges/nodes in any meaningful sense. I want the edges sorted by positionInSection, but the group can't be sorted (hence this issue) and I don't think I can specify it on edges either. I tried sorting via allJSFrontmatter(sort: ...) and it didn't appear to work either.

I can of course post-process the result of the query and sort...but I feel like I am missing something obvious here at the GraphQL layer.

After looking around this may actually be related to #3190 ?

[KyleAMathews]

Gatsby's GraphQL layer is custom to Gatsby so there's missing features and you ran into one of them :-)

I think it makes a lot of sense for items in groups to respect the sort (and filter, skip, and limit?) arguments passed to the connection. I'd love a PR adding this!

This is where we resolve the groups

gatsby/packages/gatsby/src/schema/build-connection-fields.js

Line 70 in 524ff17

// Do a custom grouping for arrays (w/ a group per array value)

[LegNeato]

Excellent, I'll take a look into putting up a PR...thanks for the quick response!

[Destroy666x]

Would love to see this too.

[pgegenfurtner]

Any updates on this issue? Ran into the same use case today

[KyleAMathews]

Due to the high volume of issues, we're closing out older ones without recent activity. Please open a new issue if you need help!