Merge branch 'load-labels-count-instead-of-labels-for-throughput-table' into 'master'

Load labels count instead of labels for throughput table

See merge request gitlab-org/gitlab!43423

app/graphql/types/label_type.rb

@@ -4,6 +4,8 @@ module Types
   class LabelType < BaseObject
     graphql_name 'Label'
 
+    connection_type_class(Types::CountableConnectionType)
+
     authorize :read_label
 
     field :id, GraphQL::ID_TYPE, null: false,

doc/api/graphql/reference/gitlab_schema.graphql

@@ -9851,6 +9851,11 @@ type Label {
 The connection type for Label.
 """
 type LabelConnection {
+  """
+  Total count of collection
+  """
+  count: Int!
+
   """
   A list of edges.
   """

doc/api/graphql/reference/gitlab_schema.json

@@ -27142,6 +27142,24 @@
           "name": "LabelConnection",
           "description": "The connection type for Label.",
           "fields": [
+            {
+              "name": "count",
+              "description": "Total count of collection",
+              "args": [
+
+              ],
+              "type": {
+                "kind": "NON_NULL",
+                "name": null,
+                "ofType": {
+                  "kind": "SCALAR",
+                  "name": "Int",
+                  "ofType": null
+                }
+              },
+              "isDeprecated": false,
+              "deprecationReason": null
+            },
             {
               "name": "edges",
               "description": "A list of edges.",

ee/app/assets/javascripts/analytics/merge_request_analytics/components/throughput_table.vue

@@ -283,10 +283,10 @@ export default {
               </li>
               <li
                 class="gl-mr-3 gl-display-flex gl-align-items-center"
-                :class="{ 'gl-opacity-5': !item.labels.nodes.length }"
+                :class="{ 'gl-opacity-5': !item.labels.count }"
                 :data-testid="$options.testIds.LABEL_DETAILS"
               >
-                <gl-icon name="label" class="gl-mr-1" /><span>{{ item.labels.nodes.length }}</span>
+                <gl-icon name="label" class="gl-mr-1" /><span>{{ item.labels.count }}</span>
               </li>
               <li
                 class="gl-mr-3 gl-display-flex gl-align-items-center"

ee/app/assets/javascripts/analytics/merge_request_analytics/graphql/queries/throughput_table.query.graphql

@@ -54,10 +54,8 @@ query getThroughputTableData(
           additions
           deletions
         }
-        labels {
-          nodes {
-            title
-          }
+        labels(first: 0) {
+          count
         }
         pipelines {
           nodes {

ee/spec/frontend/analytics/merge_request_analytics/components/throughput_table_spec.js

@@ -215,7 +215,7 @@ describe('ThroughputTable', () => {
         it('includes an active label icon and count when available', async () => {
           additionalData({
             labels: {
-              nodes: [{ title: 'Brinix' }],
+              count: 1,
             },
           });
 

ee/spec/frontend/analytics/merge_request_analytics/mock_data.js

@@ -84,7 +84,7 @@ export const throughputTableData = [
     },
     diffStatsSummary: { additions: 2, deletions: 1 },
     labels: {
-      nodes: [],
+      count: 0,
     },
     pipelines: {
       nodes: [],