HomeGuidesAPI Reference

Findify React Connect Reference

Intro

Findify React Connect includes following providers:

  • SearchProvider
  • AutocompleteProvider
  • RecommendationProvider
  • SmartCollectionProvider

And these connectors, which binds to specific response field:

  • connectItems [items]
  • connectSuggestions [suggestions]
  • connectQuery [query]
  • connectFacets [facets]
  • connectBradcrumbs [meta.filters]
  • connectSort [meta.sort]
  • connectPagination [meta]

Provider props

apikey

string [required]

defaults

object [optional][default: {}]
Defaults prop behaves same as Agent.defaults(), what will set default request parameters, which will not be listen in query.

options

object [optional][default: {}]
This prop will be used to initialize new Agent, there sould be slot, debounce, or SDK config.

storeKey

string [optional][default: 'default']
By setting storeKey you will be able to use nested providers(eq: autocomplete inside search) and connect to specific one in connector without overriting items;

agent

Agent instance [optional]
If you want to handle changes and send requests outside the react app - this option is made for you! Just create a new Agent and it as a prop to the provider. note: The agent should be initialized with immutable: true to work correctly.

Connect

Connects are similar to connect from react-redux but mapStateToProps and dispatchers are encapsulated inside it. Each of connects specifically patches data from the response and adds new methods, to simplify your work with Findify. To override default behavior or add storeKey - you may call connector with an object it will return you a patched connector. eq: connectItems({ storeKey: '1' })(({ items ) =>
All of the connectors mixin in props:

  • update - this function is same as Agent.set()
  • meta - request meta data
  • analytics - the @findify/analytics instance to send events
    ...and also adding specific fields...

connectItems

items - The immutable Map of Records with onClick method, which will send analytics and redirect to item URL.

connectPagination

pages - Immutable Range of pages from 1...N;
current - The current page;
getPageProps(page) - Function which will return onClick and key for page;

connectSuggestions

suggestions - Immutable List of suggestions
getSuggestionProps(suggestions) - Function which will return onClick and key for suggestion;

connectQuery

query - List of current state

connectSort

sort - current sort, by default undefined
onChangeSort(field, order) - Set the sorting query

connectFacets

facets - Immutable List of Facets

  • Facet - Immutable Facet record, which includes resetValues and setValue(value) methods to modify selected filters
connectFacets({ facets }) => facets.map(facet => facet.resetValues()))
  • FacetValue - Immutable record with toggle method which will remove/or add this value to filters list
connectFacets({ facets }) => facets.map(facet => facet.get('values').map(value => value.toggle())))

connectBreadcrumbs

filters - Immutable List of selected filters

  • Filter - Immutable Filter record, which includes resetValues method to reset all values in this filter except default.
connectBreadcrumbs({ filters }) => filters.map(filter => filter.resetValues()))
  • FilterValue - Immutable record with resetValue method which will remove this value
connectFacets({ filters }) => filters.map(filter => filter.get('values').map(value => value.resetValue())))