From d7b3820e09b247c7d8bc5dcf28dee3a7439562fb Mon Sep 17 00:00:00 2001
From: Omar <omar.brbutovic@secomind.com>
Date: Tue, 14 Jan 2025 13:07:15 +0100
Subject: [PATCH] Enable server-side pagination existing_device_tags

Updated queries for `existing_device_tags` to support pagination.

Part of #779

Signed-off-by: Omar <omar.brbutovic@secomind.com>
---
 frontend/src/api/schema.graphql | 16 ++++++++++++++--
 frontend/src/pages/Device.tsx   |  8 ++++++--
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/frontend/src/api/schema.graphql b/frontend/src/api/schema.graphql
index e82935dbb..649ab2748 100644
--- a/frontend/src/api/schema.graphql
+++ b/frontend/src/api/schema.graphql
@@ -2875,14 +2875,26 @@ type RootQueryType {
   "Retrieves the current tenant."
   tenantInfo: TenantInfo!
 
-  "Returns Tags currently assigned to some device."
+  "Returns the list of device tags associated to some device group."
   existingDeviceTags(
     "How to sort the records in the response"
     sort: [TagSortInput]
 
     "A filter to limit the results"
     filter: TagFilterInput
-  ): [Tag!]!
+
+    "The number of records to return from the beginning. Maximum 250"
+    first: Int
+
+    "Show records before the specified keyset."
+    before: String
+
+    "Show records after the specified keyset."
+    after: String
+
+    "The number of records to return to the end. Maximum 250"
+    last: Int
+  ): TagConnection
 
   "Returns a single device group."
   deviceGroup("The id of the record" id: ID!): DeviceGroup
diff --git a/frontend/src/pages/Device.tsx b/frontend/src/pages/Device.tsx
index c8b499e7c..11813e093 100644
--- a/frontend/src/pages/Device.tsx
+++ b/frontend/src/pages/Device.tsx
@@ -375,7 +375,11 @@ const REMOVE_DEVICE_TAGS_MUTATION = graphql`
 const GET_TAGS_QUERY = graphql`
   query Device_getExistingDeviceTags_Query {
     existingDeviceTags {
-      name
+      edges {
+        node {
+          name
+        }
+      }
     }
   }
 `;
@@ -1392,7 +1396,7 @@ const DeviceContent = ({
 
   const tags = useMemo(
     () =>
-      tagsData.existingDeviceTags.map(({ name: tag }) => ({
+      tagsData.existingDeviceTags?.edges?.map(({ node: { name: tag } }) => ({
         label: tag,
         value: tag,
       })),