Fix search result filters not working

vtex-apps · Jul 31, 2018 · 22bc6ba · 22bc6ba
1 parent e6f5f8e
commit 22bc6ba
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 14 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,6 +6,8 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
+### Fixed
+- Search result filters.
 
 ## [1.4.5] - 2018-07-30
 ### Fixed

diff --git a/react/ProductSearchContextProvider.js b/react/ProductSearchContextProvider.js
@@ -51,7 +51,7 @@ class ProductSearchContextProvider extends Component {
             <DataLayerApolloWrapper
               getData={this.getData}
               loading={
-                contextProps.state.loading || contextProps.searchQuery.loading
+                contextProps.loading || contextProps.searchQuery.loading
               }
             >
               {React.cloneElement(this.props.children, contextProps)}

diff --git a/react/components/SearchQueryContainer.js b/react/components/SearchQueryContainer.js
@@ -12,7 +12,9 @@ const DEFAULT_MAX_ITEMS_PER_PAGE = 1
 
 class SearchQueryContainer extends Component {
   state = {
-    maxItemsPerPage: DEFAULT_MAX_ITEMS_PER_PAGE,
+    variables: {
+      maxItemsPerPage: DEFAULT_MAX_ITEMS_PER_PAGE,
+    },
     /* Will be loading by default. The container will wait until the real data arrives */
     loading: true,
   }
@@ -30,11 +32,12 @@ class SearchQueryContainer extends Component {
         rest = '',
       },
     } = this.props
+    const { variables: { maxItemsPerPage } } = this.state
 
     const map = mapProps || createMap(params, rest)
     const page = pageProps ? parseInt(pageProps) : DEFAULT_PAGE
-    const from = (page - 1) * this.state.maxItemsPerPage
-    const to = from + this.state.maxItemsPerPage - 1
+    const from = (page - 1) * maxItemsPerPage
+    const to = from + maxItemsPerPage - 1
 
     const contextProps = {
       ...this.props,
@@ -49,25 +52,24 @@ class SearchQueryContainer extends Component {
       <Query
         query={searchQuery}
         variables={{
-          query: Object.values(params).join('/'),
+          query: Object.values(params).filter(s => s.length > 0).join('/'),
           map,
           rest,
           orderBy,
           from,
           to,
         }}
-        notifyOnNetworkStatusChange>
+        notifyOnNetworkStatusChange
+      >
         {searchQueryProps => (
           <SearchQueryContext.Provider
             value={{
-              state: {
-                ...this.state,
-                setContextVariables: variables =>
-                  this.setState({
-                    ...variables,
-                    /* When the real data arrives, isn't loading anymore */
-                    loading: false,
-                  }),
+              loading: this.state.loading,
+              setContextVariables: variables => {
+                this.setState({
+                  variables,
+                  loading: false,
+                })
               },
               ...contextProps,
               searchQuery: {