In some situations, such as B2B accounts, you may want to present custom search results for each of your customers. To this end, this tutorial will guide you on how to segment the search result page of your store.

Take the following example in which different results for the same search are obtained based on the customer's email.

This app only works on your store's final domain when the customer is logged in. If the customer navigates without authentication, the filter will not be inserted into their session. Note that, in the myvtex environment, the app always functions because authentication is enforced at all times.

If you are using the B2B Suite solution, the configuration described in this guide is not necessary, because the B2B Organizations app allows product collections to be assigned to organizations.

To create segmented search results, we'll create a new VTEX IO app from the vtex.search-segment-resolver boilerplate and customize it to establish our own segmentation rules.

1. Clone the vtex.search-segment-resolver app into your machine:

   
   

   _10

   git clone https://github.com/vtex-apps/search-segment-resolver

   
   

2. Open the search-segment-resolver project in any code editor of your preference.

3. Go to the manifest.json file and replace the vendor value with the name of your VTEX account.

4. Go to the node/resolvers folder and open the searchSegment.ts file.

   The segmentSearch function is responsible for providing a JSON array of facets. For example, if you want to segment the search by the shoes category, the segmentSearch function returns [{"key": "category-1", "value": "shoes"}].

5. Replace the searchSegment definition with your own segmentation rules. Take the following example in which we segmented the search result to filter by the 123collection for vtex.com.br emails and by the 456 collection otherwise:

   
   

   _10

   export const queries = {

   _10

   searchSegment: async (ctx: any, args: SearchSegmentInput, __: Context) => {

   _10

   const userEmail = args.userEmail

   _10

   const domain = userEmail.split('@')[1]

   _10

   _10

   return domain === 'vtex.com.br' ? [{ key: 'productClusterIds', value: '123' }] : [{ key: 'productClusterIds', value: '456' }]

   _10

   },

   _10

   }

   
   

   Notice that the searchSegment function receives the args variable, which has the SearchSegmentInput type:

   
   

   _10

   interface SearchSegmentInput {

   _10

   // User email

   _10

   userEmail?: string

   _10

   // Whether the user is authenticated or not

   _10

   isAuthenticated?: boolean

   _10

   // Array of selected facets (optionally you can control it by the session itself)

   _10

   selectedFacets?: SelectedFacet[]

   _10

   }

   
   

   ️Filtering by facets in the final domain without the customer’s authentication requires adding the facet to the public namespace, a configuration that this app does not handle by default. You need to ensure this step is completed manually by following the Sessions System guide if required.

6. Create a development workspace and link your app to test if your segmentation rules are working as expected.

7. Once you finish your tests, follow all the necessary steps to make your app publicly available before promoting it to master.