feat: add advertisementPlacement param to search and some hooks

vtex · Jan 21, 2025 · 65c8866 · 65c8866
1 parent 16615e7
commit 65c8866
Show file tree

Hide file tree

Showing 9 changed files with 38 additions and 10 deletions.
diff --git a/packages/api/src/__generated__/schema.ts b/packages/api/src/__generated__/schema.ts
diff --git a/packages/api/src/typeDefs/query.graphql b/packages/api/src/typeDefs/query.graphql
@@ -250,6 +250,10 @@ type Query {
     Search advertisement products return in result.
     """
     sponsoredCount: Int
+    """
+    Search advertisement placement for products returned in the result.
+    """
+    advertisementPlacement: String
   ): StoreSearchResult!
     @cacheControl(scope: "public", sMaxAge: 120, staleWhileRevalidate: 3600)
 

diff --git a/packages/core/@generated/gql.ts b/packages/core/@generated/gql.ts
@@ -20,7 +20,7 @@ const documents = {
     types.ProductDetailsFragment_ProductFragmentDoc,
   '\n  fragment ProductSKUMatrixSidebarFragment_product on StoreProduct {\n    id: productID\n    isVariantOf {\n      name\n      productGroupID\n      skuVariants {\n        activeVariations\n        slugsMap\n        availableVariations\n        allVariantProducts {\n\t\t\t\t\tsku\n          name\n          image {\n            url\n            alternateName\n          }\n          offers {\n            highPrice\n            lowPrice\n            lowPriceWithTaxes\n            offerCount\n            priceCurrency\n            offers {\n              listPrice\n              listPriceWithTaxes\n              sellingPrice\n              priceCurrency\n              price\n              priceWithTaxes\n              priceValidUntil\n              itemCondition\n              availability\n              quantity\n            }\n          }\n          additionalProperty {\n            propertyID\n            value\n            name\n            valueReference\n          }\n        }\n      }\n    }\n  }\n':
     types.ProductSkuMatrixSidebarFragment_ProductFragmentDoc,
-  '\n  fragment ClientManyProducts on Query {\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n      }\n    }\n  }\n':
+  '\n  fragment ClientManyProducts on Query {\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n      advertisementPlacement: $advertisementPlacement\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n      }\n    }\n  }\n':
     types.ClientManyProductsFragmentDoc,
   '\n  fragment ClientProduct on Query {\n    product(locator: $locator) {\n      id: productID\n    }\n  }\n':
     types.ClientProductFragmentDoc,
@@ -46,7 +46,7 @@ const documents = {
     types.SubscribeToNewsletterDocument,
   '\n  query ClientAllVariantProductsQuery($locator: [IStoreSelectedFacet!]!) {\n      product(locator: $locator) {\n      ...ProductSKUMatrixSidebarFragment_product\n    }\n  }\n':
     types.ClientAllVariantProductsQueryDocument,
-  '\n  query ClientManyProductsQuery(\n    $first: Int!\n    $after: String\n    $sort: StoreSort!\n    $term: String!\n    $selectedFacets: [IStoreSelectedFacet!]!\n    $sponsoredCount: Int\n  ) {\n    ...ClientManyProducts\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n        edges {\n          node {\n            ...ProductSummary_product\n          }\n        }\n      }\n    }\n  }\n':
+  '\n  query ClientManyProductsQuery(\n    $first: Int!\n    $after: String\n    $sort: StoreSort!\n    $term: String!\n    $selectedFacets: [IStoreSelectedFacet!]!\n    $sponsoredCount: Int\n    $advertisementPlacement: String\n  ) {\n    ...ClientManyProducts\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n      advertisementPlacement: $advertisementPlacement\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n        edges {\n          node {\n            ...ProductSummary_product\n          }\n        }\n      }\n    }\n  }\n':
     types.ClientManyProductsQueryDocument,
   '\n  query ClientProductGalleryQuery(\n    $first: Int!\n    $after: String!\n    $sort: StoreSort!\n    $term: String!\n    $selectedFacets: [IStoreSelectedFacet!]!\n  ) {\n    ...ClientProductGallery\n    redirect(term: $term, selectedFacets: $selectedFacets) {\n      url\n    }\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      }\n      facets {\n        ...Filter_facets\n      }\n      metadata {\n        ...SearchEvent_metadata\n      }\n    }\n  }\n\n  fragment SearchEvent_metadata on SearchMetadata {\n    isTermMisspelled\n    logicalOperator\n    fuzzy\n  }\n':
     types.ClientProductGalleryQueryDocument,
@@ -90,7 +90,7 @@ export function gql(
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: '\n  fragment ClientManyProducts on Query {\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n      }\n    }\n  }\n'
+  source: '\n  fragment ClientManyProducts on Query {\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n      advertisementPlacement: $advertisementPlacement\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n      }\n    }\n  }\n'
 ): typeof import('./graphql').ClientManyProductsFragmentDoc
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
@@ -168,7 +168,7 @@ export function gql(
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function gql(
-  source: '\n  query ClientManyProductsQuery(\n    $first: Int!\n    $after: String\n    $sort: StoreSort!\n    $term: String!\n    $selectedFacets: [IStoreSelectedFacet!]!\n    $sponsoredCount: Int\n  ) {\n    ...ClientManyProducts\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n        edges {\n          node {\n            ...ProductSummary_product\n          }\n        }\n      }\n    }\n  }\n'
+  source: '\n  query ClientManyProductsQuery(\n    $first: Int!\n    $after: String\n    $sort: StoreSort!\n    $term: String!\n    $selectedFacets: [IStoreSelectedFacet!]!\n    $sponsoredCount: Int\n    $advertisementPlacement: String\n  ) {\n    ...ClientManyProducts\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n      advertisementPlacement: $advertisementPlacement\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n        edges {\n          node {\n            ...ProductSummary_product\n          }\n        }\n      }\n    }\n  }\n'
 ): typeof import('./graphql').ClientManyProductsQueryDocument
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.

diff --git a/packages/core/@generated/graphql.ts b/packages/core/@generated/graphql.ts
@@ -501,6 +501,7 @@ export type QueryRedirectArgs = {
 }
 
 export type QuerySearchArgs = {
+  advertisementPlacement: InputMaybe<Scalars['String']['input']>
   after: InputMaybe<Scalars['String']['input']>
   first: Scalars['Int']['input']
   selectedFacets: InputMaybe<Array<IStoreSelectedFacet>>
@@ -1529,6 +1530,7 @@ export type ClientManyProductsQueryQueryVariables = Exact<{
   term: Scalars['String']['input']
   selectedFacets: Array<IStoreSelectedFacet> | IStoreSelectedFacet
   sponsoredCount: InputMaybe<Scalars['Int']['input']>
+  advertisementPlacement: InputMaybe<Scalars['String']['input']>
 }>
 
 export type ClientManyProductsQueryQuery = {
@@ -2049,6 +2051,7 @@ export const ClientManyProductsFragmentDoc = new TypedDocumentString(
     term: $term
     selectedFacets: $selectedFacets
     sponsoredCount: $sponsoredCount
+    advertisementPlacement: $advertisementPlacement
   ) {
     products {
       pageInfo {
@@ -2262,7 +2265,7 @@ export const ClientAllVariantProductsQueryDocument = {
 export const ClientManyProductsQueryDocument = {
   __meta__: {
     operationName: 'ClientManyProductsQuery',
-    operationHash: '14148671fbf53498fad5c600ee87765920145019',
+    operationHash: 'dcff0fa900eb8ba4d3dae3f67e6d0253eaefe880',
   },
 } as unknown as TypedDocumentString<
   ClientManyProductsQueryQuery,

diff --git a/packages/core/src/customizations/src/fragments/ClientManyProducts.ts b/packages/core/src/customizations/src/fragments/ClientManyProducts.ts
@@ -9,7 +9,7 @@ export const fragment = gql(`
       term: $term
       selectedFacets: $selectedFacets
       sponsoredCount: $sponsoredCount
-
+      advertisementPlacement: $advertisementPlacement
     ) {
       products {
         pageInfo {

diff --git a/packages/core/src/sdk/product/useLocalizedVariables.ts b/packages/core/src/sdk/product/useLocalizedVariables.ts
@@ -13,6 +13,7 @@ export const useLocalizedVariables = ({
   term,
   selectedFacets,
   sponsoredCount,
+  advertisementPlacement,
 }: Partial<ClientManyProductsQueryQueryVariables>) => {
   const { channel, locale } = useSession()
 
@@ -30,6 +31,7 @@ export const useLocalizedVariables = ({
         { key: 'locale', value: locale },
       ],
       sponsoredCount: sponsoredCount ?? 3,
+      advertisementPlacement,
     }
   }, [
     selectedFacets,
@@ -40,5 +42,6 @@ export const useLocalizedVariables = ({
     channel,
     locale,
     sponsoredCount,
+    advertisementPlacement,
   ])
 }
diff --git a/packages/core/src/sdk/product/usePageProductsQuery.ts b/packages/core/src/sdk/product/usePageProductsQuery.ts
@@ -22,12 +22,16 @@ export const UseGalleryPageContext = createContext<
   return { data: null }
 })
 
-export const useGalleryPage = (page: number) => {
+export const useGalleryPage = (
+  page: number,
+  sponsoredCount?: number,
+  advertisementPlacement?: string
+) => {
   const useGalleryPageCallback = useContext(UseGalleryPageContext)
   if (!useGalleryPageCallback) {
     throw new Error('Missing UseGalleryPageContext on React tree')
   }
-  return useGalleryPageCallback(page)
+  return useGalleryPageCallback(page, sponsoredCount, advertisementPlacement)
 }
 
 export const query = gql(`
@@ -38,6 +42,7 @@ export const query = gql(`
     $term: String!
     $selectedFacets: [IStoreSelectedFacet!]!
     $sponsoredCount: Int
+    $advertisementPlacement: String
   ) {
     ...ClientManyProducts
     search(
@@ -47,6 +52,7 @@ export const query = gql(`
       term: $term
       selectedFacets: $selectedFacets
       sponsoredCount: $sponsoredCount
+      advertisementPlacement: $advertisementPlacement
     ) {
       products {
         pageInfo {
@@ -73,7 +79,11 @@ export const useCreateUseGalleryPage = () => {
   const pagesRef = useRef<ClientManyProductsQueryQuery[]>([])
   const pagesCache = useRef<string[]>([])
 
-  const useGalleryPage = useCallback(function useGalleryPage(page: number) {
+  const useGalleryPage = useCallback(function useGalleryPage(
+    page: number,
+    sponsoredCount?: number,
+    advertisementPlacement?: string
+  ) {
     const {
       state: { sort, term, selectedFacets },
       itemsPerPage,
@@ -85,6 +95,8 @@ export const useCreateUseGalleryPage = () => {
       sort,
       term: term ?? '',
       selectedFacets,
+      sponsoredCount,
+      advertisementPlacement,
     })
 
     const hasSameVariables =
@@ -129,7 +141,8 @@ export const useCreateUseGalleryPage = () => {
 
       return { data }
     }, [hasSameVariables, data, page])
-  }, [])
+  },
+  [])
 
   return useMemo(
     () => ({

diff --git a/packages/core/src/sdk/product/useProductsPrefetch.ts b/packages/core/src/sdk/product/useProductsPrefetch.ts
@@ -17,6 +17,7 @@ export const query = gql(`
     $term: String!
     $selectedFacets: [IStoreSelectedFacet!]!
     $sponsoredCount: Int
+    $advertisementPlacement: String
   ) {
     ...ClientManyProducts
     search(
@@ -26,6 +27,7 @@ export const query = gql(`
       term: $term
       selectedFacets: $selectedFacets
       sponsoredCount: $sponsoredCount
+      advertisementPlacement: $advertisementPlacement
     ) {
       products {
         pageInfo {

diff --git a/packages/core/src/sdk/product/useProductsQuery.ts b/packages/core/src/sdk/product/useProductsQuery.ts
@@ -16,6 +16,7 @@ export const query = gql(`
     $term: String!
     $selectedFacets: [IStoreSelectedFacet!]!
     $sponsoredCount: Int
+    $advertisementPlacement: String
   ) {
     ...ClientManyProducts
     search(
@@ -25,6 +26,7 @@ export const query = gql(`
       term: $term
       selectedFacets: $selectedFacets
       sponsoredCount: $sponsoredCount
+      advertisementPlacement: $advertisementPlacement
     ) {
       products {
         pageInfo {