useSortedSelectionSet (GraphQL)

Language GraphQL

Summary

Rule available since: v2.5.0
Diagnostic Category: assist/source/useSortedSelectionSet
Sources:
- Inspired from @graphql-eslint/alphabetize

How to enable in your editor

1
{
2
  "editor.codeActionsOnSave": {
3
    "source.action.useSortedSelectionSet.biome": "explicit",
4
    "source.fixAll.biome": "explicit"
5
  }
6
}

1
{
2
  "code_actions_on_format": {
3
    "source.action.useSortedSelectionSet.biome": true,
4
    "source.fixAll.biome": true
5
  }
6
}

Use the source action code source.action.useSortedSelectionSet.biome

How to configure

1
{
2
  "assist": {
3
    "actions": {
4
      "source": {
5
        "useSortedSelectionSet": "on"
6
      }
7
    }
8
  }
9
}

Description

Sort selections inside GraphQL operations and fragments.

The action places fields first, named fragment spreads such as ...UserFields next, and inline fragments such as ... on User last. Within each group, names use natural order, which compares numbers by value.

An aliased field is sorted by its alias. For example, firstName: name is sorted under firstName, which is the name returned in the response.

Examples

Invalid

1
query {
2
  id
3
  ...bFragment
4
  firstName: name
5
  ... on Contact {
6
    phoneNumber
7
    email
8
  }
9
  age
10
  ... on Address {
11
    street
12
    city
13
  }
14
  ...aFragment
15
}

code-block.graphql ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ℹ Source action diff:
  
     1  1 │   query {
     2    │ - ··id
     3    │ - ··...bFragment
     4    │ - ··firstName:·name
     5    │ - ··...·on·Contact·{
     6    │ - ····phoneNumber
     7    │ - ····email
        2 │ + ··age
        3 │ + ··firstName:·name
        4 │ + ··id
        5 │ + ··...aFragment
        6 │ + ··...bFragment
        7 │ + ··...·on·Address·{
        8 │ + ····street
        9 │ + ····city
     8 10 │     }
     9    │ - ··age
    10    │ - ··...·on·Address·{
    11    │ - ····street
    12    │ - ····city
       11 │ + ··...·on·Contact·{
       12 │ + ····phoneNumber
       13 │ + ····email
    13 14 │     }
    14    │ - ··...aFragment
    15 15 │   }
    16 16 │   
  
code-block.graphql ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ℹ Source action diff:
  
     4  4 │     firstName: name
     5  5 │     ... on Contact {
     6    │ - ····phoneNumber
     7    │ - ····email
        6 │ + ····email
        7 │ + ····phoneNumber
     8  8 │     }
     9  9 │     age
  
code-block.graphql ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ℹ Source action diff:
  
     9  9 │     age
    10 10 │     ... on Address {
    11    │ - ····street
    12    │ - ····city
       11 │ + ····city
       12 │ + ····street
    13 13 │     }
    14 14 │     ...aFragment

Valid

1
query {
2
  age
3
  firstName: name
4
  id
5
  ...aFragment
6
  ...bFragment
7
  ... on Address {
8
    city
9
    street
10
  }
11
  ... on Contact {
12
    email
13
    phoneNumber
14
  }
15
}