Redux Search

Redux bindings for client side search with added web workers support for better performance.

Dependencies

React, Redux.

// Configuring the store

import { applyMiddleware, combineReducers, compose, createStore } from 'redux'  
import { reducer as searchReducer, reduxSearch } from '../src/index'

// Configure reducer to store state at state.search
// You can store it elsewhere but you will need to supply your own :searchStateSelector
const rootReducer = combineReducers({  
  search: searchReducer
  // Your other reducers go here...
})

// Compose :reduxSearch with other store enhancers
const store = compose(  
  applyMiddleware(...yourMiddleware),
  reduxSearch({
    resourceIndexes: {
      // Search configuration here (eg. search all Books by :title and :author)
      books: ['author', 'title']
    },
    resourceSelector: (resourceName, state) => {
      // Resource selector here (eg. get books collection)
      return state.resources.get(resourceName)
    }
  })
)(createStore)(rootReducer)

// Connecting a component

// Elsewhere, in a smart component module...
import { connect } from 'react-redux'  
import { createSelector } from 'reselect'  
import { createSearchAction, getSearchSelectors } from 'redux-search'

// :text is a selector that returns the text Books are currently filtered by
// :result is an Array of Book ids that match the current seach :text (or all Books if there is no search :text)
const {  
  text as searchText,
  result as bookIds
} = getSearchSelectors('books')

const selectors = createSelector(  
  [bookIds, books, text],
  (bookIds, books, text) => ({
    bookIds,
    books,
    searchText
  })
)

const actions = {  
  searchBooks: createSearchAction('books')
}

export default connect(selectors, actions)(YourConnectedComponent)