chore: add open telemetry to api

@generated/graphql/index.ts

@@ -16,69 +16,10 @@ export type Scalars = {
   Boolean: boolean
   Int: number
   Float: number
-  /**
-   * Example:
-   *
-   * ```json
-   * {
-   *   Color: 'Red', Size: '42'
-   * }
-   * ```
-   */
   ActiveVariations: any
-  /**
-   * Example:
-   *
-   * ```json
-   * {
-   *   Color: [
-   *     {
-   *       src: "https://storecomponents.vtexassets.com/...",
-   *       alt: "...",
-   *       label: "...",
-   *       value: "..."
-   *     },
-   *     {
-   *       src: "https://storecomponents.vtexassets.com/...",
-   *       alt: "...",
-   *       label: "...",
-   *       value: "..."
-   *     }
-   *   ],
-   *   Size: [
-   *     {
-   *       src: "https://storecomponents.vtexassets.com/...",
-   *       alt: "...",
-   *       label: "...",
-   *       value: "..."
-   *     }
-   *   ]
-   * }
-   * ```
-   */
   FormattedVariants: any
-  /** A string or the string representation of an object (a stringified object). */
   ObjectOrString: any
-  /**
-   * Example:
-   *
-   * ```json
-   * {
-   *   'Color-Red-Size-40': 'classic-shoes-37'
-   * }
-   * ```
-   */
   SlugsMap: any
-  /**
-   * Example:
-   *
-   * ```json
-   * {
-   *   Color: [ "Red", "Blue", "Green" ],
-   *   Size: [ "40", "41" ]
-   * }
-   * ```
-   */
   VariantsByName: any
 }
 
@@ -376,6 +317,11 @@ export type PickupStoreInfo = {
   isPickupStore: Maybe<Scalars['Boolean']>
 }
 
+export type ProductCluster = {
+  id: Maybe<Scalars['String']>
+  name: Maybe<Scalars['String']>
+}
+
 export type Query = {
   /** Returns information about all collections. */
   allCollections: StoreCollectionConnection
@@ -773,6 +719,7 @@ export type StoreProduct = {
   brand: StoreBrand
   /** List of items consisting of chain linked web pages, ending with the current page. */
   breadcrumbList: StoreBreadcrumbList
+  clusterHighlights: Maybe<Array<ProductCluster>>
   /** Product description. */
   description: Scalars['String']
   /** Global Trade Item Number. */
@@ -947,6 +894,7 @@ export type ProductSummary_ProductFragment = {
   id: string
   brand: { name: string; brandName: string }
   isVariantOf: { productGroupID: string; name: string }
+  clusterHighlights: Array<{ name: string | null; id: string | null }> | null
   image: Array<{ url: string; alternateName: string }>
   offers: {
     lowPrice: number
@@ -1269,6 +1217,10 @@ export type ProductsQueryQuery = {
           id: string
           brand: { name: string; brandName: string }
           isVariantOf: { productGroupID: string; name: string }
+          clusterHighlights: Array<{
+            name: string | null
+            id: string | null
+          }> | null
           image: Array<{ url: string; alternateName: string }>
           offers: {
             lowPrice: number
@@ -1303,6 +1255,10 @@ export type SearchSuggestionsQueryQuery = {
         id: string
         brand: { name: string; brandName: string }
         isVariantOf: { productGroupID: string; name: string }
+        clusterHighlights: Array<{
+          name: string | null
+          id: string | null
+        }> | null
         image: Array<{ url: string; alternateName: string }>
         offers: {
           lowPrice: number

@generated/graphql/persisted.json

@@ -5,8 +5,8 @@
   "ValidateCartMutation": "mutation ValidateCartMutation($cart: IStoreCart!, $session: IStoreSession!) {\n  validateCart(cart: $cart, session: $session) {\n    order {\n      orderNumber\n      acceptedOffer {\n        seller {\n          identifier\n        }\n        quantity\n        price\n        listPrice\n        itemOffered {\n          sku\n          name\n          image {\n            url\n            alternateName\n          }\n          brand {\n            name\n          }\n          isVariantOf {\n            productGroupID\n            name\n          }\n          gtin\n          additionalProperty {\n            propertyID\n            name\n            value\n            valueReference\n          }\n        }\n      }\n    }\n    messages {\n      text\n      status\n    }\n  }\n}\n",
   "SubscribeToNewsletter": "mutation SubscribeToNewsletter($data: IPersonNewsletter!) {\n  subscribeToNewsletter(data: $data) {\n    id\n  }\n}\n",
   "BrowserProductQuery": "query BrowserProductQuery($locator: [IStoreSelectedFacet!]!) {\n  product(locator: $locator) {\n    id: productID\n    sku\n    name\n    gtin\n    description\n    isVariantOf {\n      name\n      productGroupID\n      skuVariants {\n        activeVariations\n        slugsMap(dominantVariantName: \"Color\")\n        availableVariations(dominantVariantName: \"Color\")\n      }\n    }\n    image {\n      url\n      alternateName\n    }\n    brand {\n      name\n    }\n    offers {\n      lowPrice\n      offers {\n        availability\n        price\n        listPrice\n        seller {\n          identifier\n        }\n      }\n    }\n    breadcrumbList {\n      itemListElement {\n        item\n        name\n        position\n      }\n    }\n    additionalProperty {\n      propertyID\n      name\n      value\n      valueReference\n    }\n  }\n}\n",
-  "ProductsQuery": "query ProductsQuery($first: Int!, $after: String, $sort: StoreSort!, $term: String!, $selectedFacets: [IStoreSelectedFacet!]!) {\n  search(\n    first: $first\n    after: $after\n    sort: $sort\n    term: $term\n    selectedFacets: $selectedFacets\n  ) {\n    products {\n      pageInfo {\n        totalCount\n      }\n      edges {\n        node {\n          id: productID\n          slug\n          sku\n          brand {\n            brandName: name\n            name\n          }\n          name\n          gtin\n          isVariantOf {\n            productGroupID\n            name\n          }\n          image {\n            url\n            alternateName\n          }\n          offers {\n            lowPrice\n            offers {\n              availability\n              price\n              listPrice\n              quantity\n              seller {\n                identifier\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n",
-  "SearchSuggestionsQuery": "query SearchSuggestionsQuery($term: String!, $selectedFacets: [IStoreSelectedFacet!]) {\n  search(first: 5, term: $term, selectedFacets: $selectedFacets) {\n    suggestions {\n      terms {\n        value\n      }\n      products {\n        id: productID\n        slug\n        sku\n        brand {\n          brandName: name\n          name\n        }\n        name\n        gtin\n        isVariantOf {\n          productGroupID\n          name\n        }\n        image {\n          url\n          alternateName\n        }\n        offers {\n          lowPrice\n          offers {\n            availability\n            price\n            listPrice\n            quantity\n            seller {\n              identifier\n            }\n          }\n        }\n      }\n    }\n    products {\n      pageInfo {\n        totalCount\n      }\n    }\n    metadata {\n      isTermMisspelled\n      logicalOperator\n    }\n  }\n}\n",
+  "ProductsQuery": "query ProductsQuery($first: Int!, $after: String, $sort: StoreSort!, $term: String!, $selectedFacets: [IStoreSelectedFacet!]!) {\n  search(\n    first: $first\n    after: $after\n    sort: $sort\n    term: $term\n    selectedFacets: $selectedFacets\n  ) {\n    products {\n      pageInfo {\n        totalCount\n      }\n      edges {\n        node {\n          id: productID\n          slug\n          sku\n          brand {\n            brandName: name\n            name\n          }\n          name\n          gtin\n          isVariantOf {\n            productGroupID\n            name\n          }\n          clusterHighlights {\n            name\n            id\n          }\n          image {\n            url\n            alternateName\n          }\n          offers {\n            lowPrice\n            offers {\n              availability\n              price\n              listPrice\n              quantity\n              seller {\n                identifier\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n",
+  "SearchSuggestionsQuery": "query SearchSuggestionsQuery($term: String!, $selectedFacets: [IStoreSelectedFacet!]) {\n  search(first: 5, term: $term, selectedFacets: $selectedFacets) {\n    suggestions {\n      terms {\n        value\n      }\n      products {\n        id: productID\n        slug\n        sku\n        brand {\n          brandName: name\n          name\n        }\n        name\n        gtin\n        isVariantOf {\n          productGroupID\n          name\n        }\n        clusterHighlights {\n          name\n          id\n        }\n        image {\n          url\n          alternateName\n        }\n        offers {\n          lowPrice\n          offers {\n            availability\n            price\n            listPrice\n            quantity\n            seller {\n              identifier\n            }\n          }\n        }\n      }\n    }\n    products {\n      pageInfo {\n        totalCount\n      }\n    }\n    metadata {\n      isTermMisspelled\n      logicalOperator\n    }\n  }\n}\n",
   "TopSearchSuggestionsQuery": "query TopSearchSuggestionsQuery($term: String!, $selectedFacets: [IStoreSelectedFacet!]) {\n  search(first: 5, term: $term, selectedFacets: $selectedFacets) {\n    suggestions {\n      terms {\n        value\n      }\n    }\n  }\n}\n",
   "ValidateSession": "mutation ValidateSession($session: IStoreSession!, $search: String!) {\n  validateSession(session: $session, search: $search) {\n    locale\n    channel\n    country\n    postalCode\n    currency {\n      code\n      symbol\n    }\n    person {\n      id\n      email\n      givenName\n      familyName\n    }\n  }\n}\n",
   "ShippingSimulationQuery": "query ShippingSimulationQuery($postalCode: String!, $country: String!, $items: [IShippingItem!]!) {\n  shipping(items: $items, postalCode: $postalCode, country: $country) {\n    logisticsInfo {\n      slas {\n        carrier\n        price\n        shippingEstimate\n        localizedEstimates\n      }\n    }\n    address {\n      city\n      neighborhood\n    }\n  }\n}\n"

package.json

@@ -26,14 +26,24 @@
   },
   "dependencies": {
     "@builder.io/partytown": "^0.6.1",
-    "@envelop/core": "^1.2.0",
-    "@envelop/graphql-jit": "^1.1.1",
-    "@envelop/parser-cache": "^2.2.0",
-    "@envelop/validation-cache": "^2.2.0",
+    "@envelop/core": "^2",
+    "@envelop/graphql-jit": "^4",
+    "@envelop/opentelemetry": "^4.0.6",
+    "@envelop/parser-cache": "^4",
+    "@envelop/validation-cache": "^4",
     "@faststore/api": "^1.12.38",
     "@faststore/graphql-utils": "^1.11.8",
     "@faststore/sdk": "^1.11.8",
     "@faststore/ui": "^1.12.23",
+    "@opentelemetry/api-logs": "^0.39.0",
+    "@opentelemetry/exporter-logs-otlp-grpc": "^0.39.1",
+    "@opentelemetry/exporter-trace-otlp-grpc": "^0.38.0",
+    "@opentelemetry/instrumentation": "^0.38.0",
+    "@opentelemetry/instrumentation-graphql": "^0.34.0",
+    "@opentelemetry/instrumentation-http": "^0.38.0",
+    "@opentelemetry/resources": "^1.12.0",
+    "@opentelemetry/sdk-logs": "^0.39.0",
+    "@opentelemetry/sdk-trace-base": "^1.12.0",
     "@types/react": "^18.0.14",
     "@vtex/client-cms": "^0.2.12",
     "@vtex/tsconfig": "0.6.0",

src/components/product/ProductCard/ProductCard.tsx

@@ -142,7 +142,10 @@ export const fragment = gql`
       productGroupID
       name
     }
-
+    clusterHighlights {
+      name
+      id
+    }
     image {
       url
       alternateName

src/server/index.ts

@@ -9,10 +9,31 @@ import {
 import { useGraphQlJit } from '@envelop/graphql-jit'
 import { useParserCache } from '@envelop/parser-cache'
 import { useValidationCache } from '@envelop/validation-cache'
-import { getContextFactory, getSchema, isFastStoreError } from '@faststore/api'
+import {
+  getContextFactory,
+  getSchema,
+  getTypeDefs,
+  isFastStoreError,
+} from '@faststore/api'
 import { GraphQLError } from 'graphql'
+import { makeExecutableSchema, mergeSchemas } from '@graphql-tools/schema'
+import { mergeTypeDefs } from '@graphql-tools/merge'
 import type { Maybe, Options as APIOptions, CacheControl } from '@faststore/api'
+// Import the required OpenTelemetry libraries and plugins
+import {
+  BasicTracerProvider,
+  SimpleSpanProcessor,
+} from '@opentelemetry/sdk-trace-base'
+import { Resource } from '@opentelemetry/resources'
+import { OTLPTraceExporter } from '@opentelemetry/exporter-trace-otlp-grpc'
+import {
+  LoggerProvider,
+  SimpleLogRecordProcessor,
+  ConsoleLogRecordExporter,
+} from '@opentelemetry/sdk-logs'
+import { OTLPLogsExporter } from '@opentelemetry/exporter-logs-otlp-grpc'
 
+import { useOpenTelemetry } from './openTelemetry'
 import persisted from '../../@generated/graphql/persisted.json'
 import storeConfig from '../../store.config'
 
@@ -22,8 +43,93 @@ interface ExecuteOptions<V = Record<string, unknown>> {
   query?: string | null
 }
 
+const honeycombCollectorOptions = {
+  // url is optional and can be omitted - default is http://localhost:4317
+  url: 'opentelemetry-collector-beta.vtex.systems',
+}
+
+const openSearchCollectorOptions = {
+  // url is optional and can be omitted - default is http://localhost:4317
+  url: 'https://developer-logs.opentelemetry-collector.vtex.systems',
+}
+
+// Create a new tracer provider
+const tracerProvider = new BasicTracerProvider({
+  resource: new Resource({
+    'service.name': 'faststore-api',
+    'service.version': '1.12.38',
+    'service.name_and_version': '[email protected]',
+    platform: storeConfig.platform,
+    [`${storeConfig.platform}.account`]: storeConfig.api.storeId,
+    [`${storeConfig.platform}.workspace`]: storeConfig.api.workspace,
+    [`${storeConfig.platform}.environment`]: storeConfig.api.environment,
+  }),
+})
+
+const loggerProvider = new LoggerProvider({
+  resource: new Resource({
+    'service.name': 'faststore-api',
+    'service.version': '1.12.38',
+    'service.name_and_version': '[email protected]',
+    platform: storeConfig.platform,
+    [`${storeConfig.platform}.account`]: storeConfig.api.storeId,
+    [`${storeConfig.platform}.workspace`]: storeConfig.api.workspace,
+    [`${storeConfig.platform}.environment`]: storeConfig.api.environment,
+    index: 'faststore_beta_api',
+    search_index: 'faststore_beta_api',
+    'vtex.search_index': 'faststore_beta_api',
+  }),
+})
+
+// Create a new exporter
+const honeycombExporter = new OTLPTraceExporter(honeycombCollectorOptions)
+const openSearchExporter = new OTLPLogsExporter(openSearchCollectorOptions)
+
+// Set up a span processor to export spans to Honeycomb
+const honeyCombSpanProcessor = new SimpleSpanProcessor(honeycombExporter)
+const openSearchLogProcessor = new SimpleLogRecordProcessor(openSearchExporter)
+
+// Set up a span processor to export spans to Honeycomb
+const consoleLogExporter = new ConsoleLogRecordExporter()
+const consoleLogProcessor = new SimpleLogRecordProcessor(consoleLogExporter)
+
+// Set up a console exporter for debugging purposes
+// const consoleExporter = new ConsoleSpanExporter()
+// const debugProcessor = new SimpleSpanProcessor(consoleExporter)
+
+// Register the span processors with the tracer provider
+tracerProvider.addSpanProcessor(honeyCombSpanProcessor)
+// tracerProvider.addSpanProcessor(debugProcessor)
+
+loggerProvider.addLogRecordProcessor(openSearchLogProcessor)
+loggerProvider.addLogRecordProcessor(consoleLogProcessor)
+
+// Register the tracer provider with the OpenTelemetry API
+tracerProvider.register()
+
 const persistedQueries = new Map(Object.entries(persisted))
 
+// Creating type definitions
+const typeDefs = `
+  type ProductCluster {
+    id: String
+    name: String
+  }
+
+  extend type StoreProduct {
+    clusterHighlights: [ProductCluster!]
+  }
+`
+
+// Creating resolvers
+const resolvers = {
+  StoreProduct: {
+    clusterHighlights: () => {
+      throw new Error('This is my test error from OpenTelemetry')
+    },
+  },
+}
+
 const apiOptions: APIOptions = {
   platform: storeConfig.platform as APIOptions['platform'],
   account: storeConfig.api.storeId,
@@ -38,6 +144,19 @@ const apiOptions: APIOptions = {
 
 export const apiSchema = getSchema(apiOptions)
 
+const mergedTypeDefs = mergeTypeDefs([getTypeDefs(), typeDefs])
+
+const getMergedSchemas = async () =>
+  mergeSchemas({
+    schemas: [
+      await apiSchema,
+      makeExecutableSchema({
+        resolvers,
+        typeDefs: mergedTypeDefs,
+      }),
+    ],
+  })
+
 const apiContextFactory = getContextFactory(apiOptions)
 
 const formatError: FormatErrorHandler = (err) => {
@@ -53,8 +172,25 @@ const formatError: FormatErrorHandler = (err) => {
 const getEnvelop = async () =>
   envelop({
     plugins: [
-      useAsyncSchema(apiSchema),
+      useAsyncSchema(getMergedSchemas()),
       useExtendContext(apiContextFactory),
+      useOpenTelemetry(
+        {
+          resolvers: true, // Tracks resolvers calls, and tracks resolvers thrown errors
+          variables: false, // Includes the operation variables values as part of the metadata collected
+          result: false, // Includes execution result object as part of the metadata collected
+        },
+
+        // The @opentelemetry/sdk-trace-base was renamed from @opentelemetry/tracing but the
+        // envelop plugin doesn't support this change yet. This causes the class type to be incompatible,
+        // even if they are the same. https://github.com/n1ru4l/envelop/issues/1610
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        tracerProvider as any,
+        loggerProvider,
+        undefined,
+        undefined,
+        'faststore-api'
+      ),
       useMaskedErrors({ formatError }),
       useGraphQlJit(),
       useValidationCache(),