Elastic Search Plugin

Storefront plugin config for elastic-search-specific search price data.

Disclaimer: This module depends on compatible plugin behavior being active in the consumer's Vendure backend instance. Configure the backend first, then register this plugin config in the storefront.

Purpose

Use this module when you want price range data (range, rangeWithTax) in search results for faceted filtering and UI sliders.

Features

• Extends search and searchField query payloads with elastic price range data
• Exposes VendureElasticSearchPlugin for DataProvider pluginConfigs
• Adds type augmentation for search input/filter price range contracts

Installation

npm

npm install @haus-storefront-react/vendure-plugin-configs

Yarn

yarn add @haus-storefront-react/vendure-plugin-configs

Note: This is not a public package. Contact the Haus Tech Team for access.

API Reference

Exports

• VendureElasticSearchPlugin

Basic Usage

Example 1: Register Plugin in Data Provider

Use this to register the elastic-search plugin in your provider pluginConfigs.

React

import { VendureElasticSearchPlugin } from '@haus-storefront-react/vendure-plugin-configs/elastic'

const pluginConfig = VendureElasticSearchPlugin

React Native

import { Text } from 'react-native'
import { VendureElasticSearchPlugin } from '@haus-storefront-react/vendure-plugin-configs/elastic'

const pluginConfig = VendureElasticSearchPlugin

export function PriceRangeLabel({ searchResult }) {
  return (
    <Text>
      {searchResult.prices.range.min} - {searchResult.prices.range.max}
    </Text>
  )
}

Example 2: Consume Plugin Functionality

Use this in search UI after the plugin has been registered.

React

export function PriceRangeLabel({ searchResult }) {
  return (
    <p>
      {searchResult.prices.range.min} - {searchResult.prices.range.max}
    </p>
  )
}

React Native

import { Text } from 'react-native'

export function PriceRangeLabel({ searchResult }) {
  return (
    <Text>
      {searchResult.prices.range.min} - {searchResult.prices.range.max}
    </Text>
  )
}

---

Made with ❤️ by Haus Tech Team