feat: fix subscription auth refresh issues

packages/hoppscotch-app/components/teams/Invite.vue

@@ -357,14 +357,14 @@ const pendingInvites = useGQLQuery<
       ? []
       : [
           {
-            key: 3,
+            key: 4,
             query: TeamInvitationAddedDocument,
             variables: {
               teamID: props.editingTeamID,
             },
           },
           {
-            key: 4,
+            key: 5,
             query: TeamInvitationRemovedDocument,
             variables: {
               teamID: props.editingTeamID,

packages/hoppscotch-app/helpers/backend/GQLClient.ts

@@ -57,12 +57,18 @@ const subscriptionClient = new SubscriptionClient(
     : "wss://api.hoppscotch.io/graphql",
   {
     reconnect: true,
-    connectionParams: () => ({
-      authorization: `Bearer ${authIdToken$.value}`,
-    }),
+    connectionParams: () => {
+      return {
+        authorization: `Bearer ${authIdToken$.value}`,
+      }
+    },
   }
 )
 
+authIdToken$.subscribe(() => {
+  subscriptionClient.client.close()
+})
+
 export const client = createClient({
   url: BACKEND_GQL_URL,
   exchanges: [
@@ -113,6 +119,7 @@ export const client = createClient({
     }),
     fetchExchange,
     subscriptionExchange({
+      // @ts-expect-error: An issue with the Urql typing
       forwardSubscription: (operation) => subscriptionClient.request(operation),
     }),
   ],

packages/hoppscotch-app/helpers/backend/caching/updates.ts

@@ -3,7 +3,6 @@ import { GraphCacheUpdaters, MyTeamsDocument } from "../graphql"
 export const updatesDef: GraphCacheUpdaters = {
   Subscription: {
     teamMemberAdded: (_r, { teamID }, cache, _info) => {
-      debugger
       cache.invalidate(
         {
           __typename: "Team",
@@ -38,6 +37,24 @@ export const updatesDef: GraphCacheUpdaters = {
         "teamMembers"
       )
     },
+    teamInvitationAdded: (_r, { teamID }, cache, _info) => {
+      cache.invalidate(
+        {
+          __typename: "Team",
+          id: teamID,
+        },
+        "teamInvitations"
+      )
+    },
+    teamInvitationRemoved: (_r, { teamID }, cache, _info) => {
+      cache.invalidate(
+        {
+          __typename: "Team",
+          id: teamID,
+        },
+        "teamInvitations"
+      )
+    },
   },
   Mutation: {
     deleteTeam: (_r, { teamID }, cache, _info) => {