feat: show connection upon verification

packages/web/src/graphql/cache.ts

@@ -1,6 +1,10 @@
 import { InMemoryCache } from '@apollo/client';
 import offsetLimitPagination from './pagination';
 
+interface IRef {
+  __ref: string;
+}
+
 const cache = new InMemoryCache({
   typePolicies: {
     App: {
@@ -9,9 +13,9 @@ const cache = new InMemoryCache({
     Mutation: {
       mutationType: true,
       fields: {
-        createConnection: {
+        verifyConnection: {
-          merge(existing, newConnection, { readField, cache }) {
+          merge(existing, verifiedConnection, { readField, cache }) {
-            const appKey = readField('key', newConnection);
+            const appKey = readField('key', verifiedConnection);
             const appCacheId = cache.identify({
               __typename: 'App',
               key: appKey,
@@ -21,12 +25,22 @@ const cache = new InMemoryCache({
               id: appCacheId,
               fields: {
                 connections: (existingConnections) => {
-                  return [...existingConnections, newConnection];
+                  const existingConnectionIndex = existingConnections.findIndex((connection: IRef) => {
+                    return connection.__ref === verifiedConnection.__ref;
+                  });
+                  const connectionExists = existingConnectionIndex !== -1;
+
+                  // newly created and verified connection
+                  if (!connectionExists) {
+                    return [verifiedConnection, ...existingConnections];
+                  }
+
+                  return existingConnections;
                 }
               }
             });
 
-            return newConnection;
+            return verifiedConnection;
           }
         }
       }

packages/web/src/graphql/mutations/create-connection.ts

@@ -11,9 +11,6 @@ export const CREATE_CONNECTION = gql`
       formattedData {
         screenName
       }
-      app {
-        key
-      }
     }
   }
 `;

packages/web/src/graphql/mutations/verify-connection.ts

@@ -4,10 +4,15 @@ export const VERIFY_CONNECTION = gql`
   mutation VerifyConnection($input: VerifyConnectionInput) {
     verifyConnection(input: $input) {
       id
+      key
       verified
       formattedData {
         screenName
       }
+      createdAt
+      app {
+        key
+      }
     }
   }
 `;