Function useProductFilters

  • useProductFilters(): {
        filters: {
            field: string;
            filter: InputSearchTopLevelFilter;
            name: string;
            remove: () => void;
            value: string;
        }[];
        removeAll: () => void;
    }

  • Preact hook that import product facets state to the component.

    Should always be at the top of the component!

    Returns {
        filters: {
            field: string;
            filter: InputSearchTopLevelFilter;
            name: string;
            remove: () => void;
            value: string;
        }[];
        removeAll: () => void;
    }

    • filters: {
          field: string;
          filter: InputSearchTopLevelFilter;
          name: string;
          remove: () => void;
          value: string;
      }[]

      Selected filters array.

    • removeAll: () => void

      Should remove all selected filters.

    Example

    import { useProductFilters, useActions } from '@nosto/preact'

    export default () => {
        const { filters } = useProductFilters()
        const { toggleProductFilter } = useActions()

        return filters.map((filter) => <li>
            <button
                 title="Remove Filter"
                 onClick={(e) => {
                     e.preventDefault()
                     toggleProductFilter(
                         filter.field,
                         filter.value,
                         false
                     )
                 }}
             >
                {filter.filter}: {filter.value}{' '}
                <span>&#10005;</span>
             </button>
        </li>)
    }

Settings

Member Visibility