Remove requirement of toplevelAwait for graphqlSsrClient and solve lo…

…gging issue in cli
graphcommerce-org · Nov 13, 2023 · 6f5f72f · 6f5f72f
1 parent 9a92d66
commit 6f5f72f
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 53 deletions.
diff --git a/.changeset/fifty-parents-move.md b/.changeset/fifty-parents-move.md
@@ -0,0 +1,5 @@
+---
+'@graphcommerce/graphql-mesh': patch
+---
+
+Remove requirement of toplevelAwait for graphqlSsrClient and solve logging issue in cli
diff --git a/examples/magento-graphcms/lib/graphql/graphqlSsrClient.ts b/examples/magento-graphcms/lib/graphql/graphqlSsrClient.ts
@@ -14,8 +14,6 @@ import { MeshApolloLink, getBuiltMesh } from '@graphcommerce/graphql-mesh'
 import { storefrontConfig, storefrontConfigDefault } from '@graphcommerce/next-ui'
 import { i18nSsrLoader } from '../i18n/I18nProvider'
 
-const mesh = await getBuiltMesh()
-
 function client(locale: string | undefined, fetchPolicy: FetchPolicy = 'no-cache') {
   const config = graphqlConfig({
     storefront: storefrontConfig(locale) ?? storefrontConfigDefault(),
@@ -26,7 +24,7 @@ function client(locale: string | undefined, fetchPolicy: FetchPolicy = 'no-cache
       measurePerformanceLink,
       errorLink,
       ...config.links,
-      new MeshApolloLink(mesh),
+      new MeshApolloLink(getBuiltMesh()),
     ]),
     cache: new InMemoryCache({
       possibleTypes: fragments.possibleTypes,

diff --git a/packages/graphql-mesh/api/apolloLink.ts b/packages/graphql-mesh/api/apolloLink.ts
@@ -1,38 +1,19 @@
-/* eslint-disable import/no-extraneous-dependencies */
-
-/**
- * This is a direct copy from
- * https://github.com/Urigo/graphql-mesh/blob/master/packages/apollo-link/src/index.ts but because
- * it throws an error we've created a local copy of it.
- *
- * https://github.com/apollographql/apollo-client/issues/9925
- * https://github.com/Urigo/graphql-mesh/issues/4196
- */
-
 import { ApolloLink, FetchResult, Observable, Operation, RequestHandler } from '@apollo/client/core'
-import { ExecuteMeshFn, SubscribeMeshFn } from '@graphql-mesh/runtime'
+import { ExecuteMeshFn, MeshInstance, SubscribeMeshFn } from '@graphql-mesh/runtime'
 import { isAsyncIterable } from '@graphql-tools/utils'
-import { getOperationAST } from 'graphql'
-
-export interface MeshApolloRequestHandlerOptions {
-  execute: ExecuteMeshFn
-  subscribe?: SubscribeMeshFn
-}
 
 const ROOT_VALUE = {}
-function createMeshApolloRequestHandler(options: MeshApolloRequestHandlerOptions): RequestHandler {
-  return function meshApolloRequestHandler(operation: Operation): Observable<FetchResult> {
-    const operationAst = getOperationAST(operation.query, operation.operationName)
-    if (!operationAst) {
-      throw new Error('GraphQL operation not found')
-    }
-    const operationFn =
-      operationAst.operation === 'subscription' && options.subscribe
-        ? options.subscribe
-        : options.execute
-    return new Observable((observer) => {
+
+function createMeshApolloRequestHandler(
+  mesh: MeshInstance | Promise<MeshInstance>,
+): RequestHandler {
+  return (operation: Operation): Observable<FetchResult> =>
+    new Observable((observer) => {
       Promise.resolve()
         .then(async () => {
+          // Create a new executor for each request
+          const operationFn: SubscribeMeshFn | ExecuteMeshFn = (await mesh).createExecutor({})
+
           const results = await operationFn(
             operation.query,
             operation.variables,
@@ -42,9 +23,7 @@ function createMeshApolloRequestHandler(options: MeshApolloRequestHandlerOptions
           )
           if (isAsyncIterable(results)) {
             for await (const result of results) {
-              if (observer.closed) {
-                return
-              }
+              if (observer.closed) return
               observer.next(result)
             }
             observer.complete()
@@ -54,16 +33,13 @@ function createMeshApolloRequestHandler(options: MeshApolloRequestHandlerOptions
           }
         })
         .catch((error) => {
-          if (!observer.closed) {
-            observer.error(error)
-          }
+          if (!observer.closed) observer.error(error)
         })
     })
-  }
 }
 
 export class MeshApolloLink extends ApolloLink {
-  constructor(options: MeshApolloRequestHandlerOptions) {
+  constructor(options: MeshInstance | Promise<MeshInstance>) {
     super(createMeshApolloRequestHandler(options))
   }
 }
diff --git a/packagesDev/next-config/src/withGraphCommerce.ts b/packagesDev/next-config/src/withGraphCommerce.ts
@@ -152,11 +152,6 @@ export function withGraphCommerce(nextConfig: NextConfig, cwd: string): NextConf
       // @lingui .po file support
       config.module?.rules?.push({ test: /\.po/, use: '@lingui/loader' })
 
-      config.experiments = {
-        layers: true,
-        topLevelAwait: true,
-      }
-
       config.snapshot = {
         ...(config.snapshot ?? {}),
         managedPaths: [
@@ -174,14 +169,6 @@ export function withGraphCommerce(nextConfig: NextConfig, cwd: string): NextConf
       }
 
       if (!config.resolve) config.resolve = {}
-      config.resolve.alias = {
-        ...config.resolve.alias,
-        '@mui/base': '@mui/base/modern',
-        '@mui/lab': '@mui/lab/modern',
-        '@mui/material': '@mui/material/modern',
-        '@mui/styled-engine': '@mui/styled-engine/modern',
-        '@mui/system': '@mui/system/modern',
-      }
 
       config.plugins.push(new InterceptorPlugin(graphcommerceConfig))