From 2f42279c43ea9fcc98382d75e1ec580d33657540 Mon Sep 17 00:00:00 2001
From: WRadoslaw <92513933+WRadoslaw@users.noreply.github.com>
Date: Wed, 7 Feb 2024 11:09:06 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=93=88=20Graphql=20response=20time=20logs?=
 =?UTF-8?q?=20(#5730)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* POC version

* Few fixes and debug log for vercel

* Make sure to set query name even if geolocation is missing

* Replace console log with a call to logs service
---
 packages/atlas/src/api/client/index.ts | 56 +++++++++++++++++++++++++-
 1 file changed, 55 insertions(+), 1 deletion(-)

diff --git a/packages/atlas/src/api/client/index.ts b/packages/atlas/src/api/client/index.ts
index b4c2b572a9..276fad64f1 100644
--- a/packages/atlas/src/api/client/index.ts
+++ b/packages/atlas/src/api/client/index.ts
@@ -5,9 +5,34 @@ import { createClient } from 'graphql-ws'
 
 import { ORION_GRAPHQL_URL, QUERY_NODE_GRAPHQL_SUBSCRIPTION_URL } from '@/config/env'
 import { useUserLocationStore } from '@/providers/userLocation'
+import { UserEventsLogger } from '@/utils/logs'
 
 import { cache } from './cache'
 
+const initializePerformanceObserver = () => {
+  try {
+    const observer = new PerformanceObserver((list) => {
+      for (const entry of list.getEntries()) {
+        if (['fetch', 'xmlhttprequest'].includes((entry as PerformanceResourceTiming).initiatorType)) {
+          const queryString = entry.name.split('?')?.[1]
+          const params = new URLSearchParams(queryString)
+          const queryType = params.get('queryName')
+          UserEventsLogger.logUserEvent('request-response-time', {
+            requestName: queryType ?? entry.name,
+            timeToComplete: entry.duration,
+          })
+        }
+      }
+    })
+    // Start listening for `resource` entries to be dispatched.
+    observer.observe({ type: 'resource', buffered: true })
+  } catch (e) {
+    // Do nothing if the browser doesn't support this API.
+  }
+}
+
+initializePerformanceObserver()
+
 const delayLink = new ApolloLink((operation, forward) => {
   const ctx = operation.getContext()
   if (!ctx.delay) {
@@ -31,11 +56,40 @@ export const createApolloClient = () => {
     })
   )
 
-  const orionLink = ApolloLink.from([delayLink, new HttpLink({ uri: ORION_GRAPHQL_URL, credentials: 'include' })])
+  const orionLink = ApolloLink.from([
+    delayLink,
+    new HttpLink({
+      uri: ORION_GRAPHQL_URL,
+      credentials: 'include',
+      fetch: async (uri, options) => {
+        const queryName = options?.headers
+          ? (options.headers?.['queryname' as keyof typeof options.headers] as string)
+          : null
+        const queryString = queryName ? `?queryName=${queryName}` : ''
+        return fetch(`${uri}${queryString}`, options)
+      },
+    }),
+  ])
 
   const operationSplitLink = split(
     ({ query, setContext }) => {
       const locationStore = useUserLocationStore.getState()
+      const firstDefinition = query.definitions[0]
+      let queryName: string | null | undefined = null
+      if (firstDefinition.kind === 'OperationDefinition' && firstDefinition.operation === 'query') {
+        queryName = firstDefinition.name?.value
+      }
+
+      if (queryName) {
+        setContext(({ headers }: Record<string, object>) => {
+          return {
+            headers: {
+              ...headers,
+              ...(queryName ? { queryName } : {}),
+            },
+          }
+        })
+      }
 
       if (
         !locationStore.disableUserLocation &&