Merge #1231

1231: Fix facet search when using sortBy r=bidoubiwa a=bidoubiwa

# Pull Request

## Related issue
Fixes #1222

## What does this PR do?
Fixes a bug where, when you use the sort by widget and changes the default sorting by another one, the facet search would break.

The issue was that when sorting the name of the indexUid is formatted like this `indexName:attribute:sortOrder`, and instead of using only the `indexName` part to do the search request, it was using the whole string.


## PR checklist
Please check if your PR fulfills the following requirements:
- [x] Does this PR fix an existing issue, or have you listed the changes applied in the PR description (and why they are needed)?
- [x] Have you read the contributing guidelines?
- [x] Have you made sure that the title is accurate and descriptive of the changes?

Thank you so much for contributing to Meilisearch!


Co-authored-by: Charlotte Vermandel <[email protected]>

Author: meili-bors[bot]

.changeset/green-bottles-sing.md

@@ -0,0 +1,5 @@
+---
+"@meilisearch/instant-meilisearch": patch
+---
+
+Fixes bug where search on facets would fail when using the sortBy widget

packages/instant-meilisearch/src/client/instant-meilisearch-client.ts

@@ -146,8 +146,6 @@ export function instantMeiliSearch(
 
         const meilisearchSearchQuery = adaptSearchParams(searchContext)
 
-        const index = request.indexName
-
         const meilisearchRequest: any = {
           ...meilisearchSearchQuery,
           facetQuery: request.params.facetQuery,
@@ -157,7 +155,7 @@ export function instantMeiliSearch(
         delete meilisearchRequest.indexUid
 
         const meilisearchResponse = await meilisearchClient
-          .index(index)
+          .index(searchContext.indexUid)
           .searchForFacetValues(meilisearchRequest)
 
         const facetHits = meilisearchResponse.facetHits.map((facetHit) => ({

packages/instant-meilisearch/src/contexts/search-context.ts

@@ -66,7 +66,9 @@ export function createFacetSearchContext(
   options: InstantMeiliSearchOptions
 ): SearchContext {
   // Split index name and possible sorting rules
-  const [indexUid, ...sortByArray] = searchRequest.indexName.split(':')
+  const { indexUid, sortBy } = separateIndexFromSortRules(
+    searchRequest.indexName
+  )
   const { params: instantSearchParams } = searchRequest
 
   const paginationState = createPaginationState(
@@ -75,16 +77,15 @@ export function createFacetSearchContext(
     instantSearchParams?.page
   )
 
-  const sortState = splitSortString(sortByArray.join(':'))
-
   const searchContext: SearchContext = {
     ...options,
     ...instantSearchParams,
-    sort: sortState,
+    sort: splitSortString(sortBy),
     indexUid,
     pagination: paginationState,
     placeholderSearch: options.placeholderSearch !== false, // true by default
     keepZeroFacets: !!options.keepZeroFacets, // false by default
   }
+
   return searchContext
 }

playgrounds/local-react/cypress/integration/search-ui.spec.js

@@ -36,15 +36,26 @@ describe(`${playground} playground test`, () => {
     cy.get(HIT_ITEM_CLASS).eq(0).contains('9.99 $')
   })
 
-  it('Sort by recommendationCound ascending', () => {
+  it('Sort by recommendationCount ascending', () => {
     const select = `.ais-SortBy-select`
     cy.get(select)
       .select('games:recommendationCount:asc')
       .should('have.value', 'games:recommendationCount:asc')
     cy.wait(1000)
+    cy.contains('Most Recommended')
     cy.get(HIT_ITEM_CLASS).eq(0).contains('Deathmatch Classic')
   })
 
+  it('Facet search on genres when sorting by recommendationCount', () => {
+    cy.get('.left-panel')
+      .find('.ais-SearchBox-input')
+      .first()
+      .type('drama')
+      .should('have.value', 'drama')
+
+    cy.get('.left-panel .ais-RefinementList-labelText').eq(0).contains('Drama')
+  })
+
   it('Sort by default relevancy', () => {
     const select = `.ais-SortBy-select`
     cy.get(select).select('games')