Backend: Add GraphQL query to fetch group environment scopes

Summary

In order to unblock #388952 (closed) and implement CI variables pagination properly in #388952 (closed), the frontend needs a GraphQL query for fetching and searching group environment scopes.

This issue and variables pagination is needed to lessen the load of fetching ALL environments (and variables), which would sometimes lead to 503s when the group has too many environments/variables.

See #388827 (comment 1299666244) for the start of this discussion.

Current situation

How does the environment dropdown work right now?

There is no dedicated query for group environment scopes, so the frontend gets the list through the the fetch query for group variables. By default (without enabling a feature flag) the variables query returns ALL variables. From there, the dropdown list is populated with all the environments associated with variables.

Environment search is done entirely on the frontend (client-side) using this list.

Variable pagination is developed under the ci_variables_pages feature flag.

Why is this a problem?

We have plans to paginate the variables query. This means that the environments dropdown will only show environment scopes for the variables present in the current page. If the user goes to the next page, the list of environments will also change.

Since the frontend no longer has the full list of environments, it can no longer do a proper search.

Limiting the number of environments we fetch/search is developed under the ci_limit_environment_scope feature flag. We can enable this feature first before continuing development on variables pagination.

group_variables

Proposal

• Add GraphQL query to fetch group environment scopes
• Add a new index if needed?
• Verify performance implication

This query doesn't exist yet, but it should look similar to the query we use for projects, if possible. For example:

query {
  group(fullPath: "path/to/group") {
    id
    environments(first: 20, search: "") {
      nodes {
        id
        name
      }
    }
  }
}

frontend will always limit the search and fetch request to get only 30 environments, as proposed in #388952 (closed). The initial fetch query will get the first 30 environments, and each search result can also be limited to 30. The dropdown has a note to inform the user about this so they can specify their search if they can't find the environment they need.