From 2b61ef87f3182c6f47be1d25b6622b3ce97b1c4d Mon Sep 17 00:00:00 2001
From: Hiago Lucas Cardeal de Melo Silva <hcardealdemelo@gmail.com>
Date: Fri, 29 Nov 2024 09:46:00 -0300
Subject: [PATCH] add sponsoredCount-prop

---
 CHANGELOG.md                    | 4 ++++
 docs/README.md                  | 1 +
 react/components/SearchQuery.js | 8 ++++----
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 51534c5ab..3b367c060 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,8 +7,12 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+### Removed
+- `sponsoredProductsBehavior` prop which is deprecated
+
 ### Added
 
+- `sponsoredCount` prop
 - Shipping filter on filters section
 
 ### Fixed
diff --git a/docs/README.md b/docs/README.md
index 47f86aa32..add49532f 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -148,6 +148,7 @@ Check all props to configure your search data in the table below:
 | `installmentCriteria` | `enum` | Defines which price should be displayed when different installments are available. Possible values are: `MAX_WITHOUT_INTEREST` (displays the maximum installment option with no interest attached to it) or `MAX_WITH_INTEREST` (displays the maximum installment option whether it has interest attached to it or not). | `"MAX_WITHOUT_INTEREST"` |
 | `excludedPaymentSystems` | `string` | List of payment systems that should not be considered when displaying the installment options to users. This prop configuration only works if the `installmentCriteria` prop was also declared. In case it was not, all available payment systems will be displayed regardless. | `undefined` |
 | `includedPaymentSystems` | `string` | List of payment systems that should be considered when displaying the installment options to users. This prop configuration only works if the `installmentCriteria` prop was also declared. In case it was not, all available payment systems will be displayed regardless.| `undefined` |
+| `sponsoredCount` | `number` | Maximum amount of sponsored products.| `3` |
 
 > ℹ️ Pagination does not display results after page 50. You can configure it to display more products per page using the prop `maxItemsPerPage` by increasing the quantity of products on each page.
 
diff --git a/react/components/SearchQuery.js b/react/components/SearchQuery.js
index 7022f68ff..16cc70714 100644
--- a/react/components/SearchQuery.js
+++ b/react/components/SearchQuery.js
@@ -144,7 +144,7 @@ const useCorrectSearchStateVariables = (
   return result
 }
 
-const useQueries = (variables, facetsArgs, price) => {
+const useQueries = (variables, facetsArgs, price, sponsoredCount) => {
   const { getSettings, query: runtimeQuery } = useRuntime()
 
   const settings = getSettings('vtex.store')
@@ -157,7 +157,7 @@ const useQueries = (variables, facetsArgs, price) => {
       variant: getCookie('sp-variant'),
       advertisementOptions: {
         showSponsored: true,
-        sponsoredCount: 3,
+        sponsoredCount,
         advertisementPlacement: 'top_search',
         repeatSponsoredProducts: true,
       },
@@ -282,7 +282,7 @@ const SearchQuery = ({
   searchState: searchStateQuery,
   lazyItemsQuery: lazyItemsQueryProp,
   __unstableProductOriginVtex,
-  sponsoredProductsBehavior,
+  sponsoredCount = 3,
 }) => {
   const [selectedFacets, fullText] = buildSelectedFacetsAndFullText(
     query,
@@ -403,7 +403,7 @@ const SearchQuery = ({
     productSearchResult,
     facetsLoading,
     fetchMore,
-  } = useQueries(variables, facetsArgs, priceRange, sponsoredProductsBehavior)
+  } = useQueries(variables, facetsArgs, priceRange, sponsoredCount)
 
   const redirectUrl = data && data.productSearch && data.productSearch.redirect