From 297bf3205f62d33cc8fc54c2aaf076fe272a2387 Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Mon, 1 Nov 2021 22:26:30 +0530
Subject: [PATCH] feat: introducing gql polling

---
 .../hoppscotch-app/components/teams/index.vue |  1 +
 .../helpers/backend/GQLClient.ts              | 25 +++++++++++++++++++
 2 files changed, 26 insertions(+)

diff --git a/packages/hoppscotch-app/components/teams/index.vue b/packages/hoppscotch-app/components/teams/index.vue
index 3fb8bfcfd..b3accd2e4 100644
--- a/packages/hoppscotch-app/components/teams/index.vue
+++ b/packages/hoppscotch-app/components/teams/index.vue
@@ -112,6 +112,7 @@ const myTeams = useGQLQuery<
   MyTeamsQueryError
 >({
   query: MyTeamsDocument,
+  pollDuration: 5000,
 })
 
 watchEffect(() => {
diff --git a/packages/hoppscotch-app/helpers/backend/GQLClient.ts b/packages/hoppscotch-app/helpers/backend/GQLClient.ts
index 7104ff6af..62cd98628 100644
--- a/packages/hoppscotch-app/helpers/backend/GQLClient.ts
+++ b/packages/hoppscotch-app/helpers/backend/GQLClient.ts
@@ -141,6 +141,7 @@ type UseQueryOptions<T = any, V = object> = {
 
   updateSubs?: MaybeRef<GraphQLRequest<any, object>[]>
   defer?: boolean
+  pollDuration?: number | undefined
 }
 
 /**
@@ -171,6 +172,8 @@ export const useGQLQuery = <DocType, DocVarType, DocErrorType extends string>(
 
   const isPaused: Ref<boolean> = ref(args.defer ?? false)
 
+  const pollDuration: Ref<number | null> = ref(args.pollDuration ?? null)
+
   const request: Ref<GraphQLRequest<DocType, DocVarType>> = ref(
     createRequest<DocType, DocVarType>(
       args.query,
@@ -180,6 +183,25 @@ export const useGQLQuery = <DocType, DocVarType, DocErrorType extends string>(
 
   const source: Ref<Source<OperationResult> | undefined> = ref()
 
+  // Toggles between true and false to cause the polling operation to tick
+  const pollerTick: Ref<boolean> = ref(true)
+
+  stops.push(
+    watchEffect(
+      (onInvalidate) => {
+        if (pollDuration.value !== null && !isPaused.value) {
+          const handle = setInterval(() => {
+            pollerTick.value = !pollerTick.value
+          }, pollDuration.value)
+
+          onInvalidate(() => {
+            clearInterval(handle)
+          })
+        }
+      }
+    )
+  )
+
   stops.push(
     watchEffect(
       () => {
@@ -199,6 +221,9 @@ export const useGQLQuery = <DocType, DocVarType, DocErrorType extends string>(
   stops.push(
     watchEffect(
       () => {
+        // Just listen to the polling ticks
+        pollerTick.value
+
         source.value = !isPaused.value
           ? client.value.executeQuery<DocType, DocVarType>(request.value, {
               requestPolicy: "cache-and-network",