diff --git a/package.json b/package.json
index 55faae9a..56223727 100644
--- a/package.json
+++ b/package.json
@@ -71,8 +71,7 @@
"babel-polyfill": "^6.26.0",
"babel-runtime": "^6.26.0",
"react": "16.7.0",
- "react-dom": "16.7.0",
- "unbxd-search-core": "../search-JS-core"
+ "react-dom": "16.7.0"
},
"keywords": [
"searchmodule"
diff --git a/src/App.js b/src/App.js
index 3ed3087f..4a3e7bc3 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,5 +1,5 @@
import React, { Component } from 'react';
-import UnbxdSearch from 'unbxd-search-core';
+import UnbxdSearch from '@unbxd-ui/unbxd-search-core';
import { AppContextProvider } from './common/context';
import searchConfigurations from './config';
diff --git a/src/modules/Products/Products.js b/src/modules/Products/Products.js
index 7e59051a..3017b559 100644
--- a/src/modules/Products/Products.js
+++ b/src/modules/Products/Products.js
@@ -1,5 +1,5 @@
import React from 'react';
-import AppContext, { AppContextConsumer } from '../../common/context'
+import AppContext from '../../common/context'
import { ProductContextProvider } from './context'
import PropTypes from 'prop-types';
@@ -25,23 +25,13 @@ class Products extends React.PureComponent {
constructor(props) {
super(props);
- const { ZeroResultsComponent, perRow, pageSize,
- paginationType, productMap, productVariantMap, productViewTypes,
- heightDiffToTriggerNextPage } = this.props
+ const { productViewTypes } = this.props
//Lets fallback to grid view
const productViewType = getProductViewType(productViewTypes)[0];
this.state = {
- productViewTypes,
productViewType,
- ZeroResultsComponent,
- perRow,
- pageSize,
- paginationType,
- heightDiffToTriggerNextPage,
- productMap,
- productVariantMap
}
}
@@ -63,70 +53,75 @@ class Products extends React.PureComponent {
});
}
- getProps = () => {
- return { ...this.state, helpers: this.helpers }
+ getProductProps() {
+
+ const { unbxdCore } = this.context;
+ const { ZeroResultsComponent,
+ perRow,
+ pageSize,
+ paginationType,
+ productMap,
+ productVariantMap,
+ productViewTypes,
+ heightDiffToTriggerNextPage } = this.props
+
+ const getSearchResults = unbxdCore.getSearchResults.bind(unbxdCore);
+ const setPageStart = unbxdCore.setPageStart.bind(unbxdCore);
+ const getPaginationInfo = unbxdCore.getPaginationInfo.bind(unbxdCore);
+ const getResults = unbxdCore.getResults.bind(unbxdCore);
+
+ //Get next page method
+ const getNextPage = () => {
+
+ const { currentPage } = getPaginationInfo();
+ const newStart = currentPage === 0 ? pageSize : (currentPage * pageSize);
+ setPageStart(newStart);
+ getResults();
+ console.log("called getNextPage")
+ }
+
+ const onProductClick = (event) => {
+ console.log("Click event on product ", event.target.dataset.uniqueid)
+ }
+
+ //onClick for products
+ const getProductsProp = ({ onClick, ...props }) => ({
+ onClick: () => {
+ onProductClick();
+ onClick();
+ },
+ getSearchResults,
+ getNextPage,
+ ...props
+ })
+
+ const data = {
+ perRow,
+ paginationType, productMap, productVariantMap, productViewTypes,
+ heightDiffToTriggerNextPage, ...this.state
+ };
+ const helpers = {
+ ZeroResultsComponent,
+ onViewToggle: this.onViewToggle,
+ getProductsProp,
+ getNextPage,
+ onProductClick,
+ getSearchResults,
+ getNextPage
+ }
+ return { data, helpers }
+
}
render() {
-
- const { pageSize } = this.state;
-
- return (
- {({ unbxdCore }) => {
-
- const getSearchResults = unbxdCore.getSearchResults.bind(unbxdCore);
- const setPageStart = unbxdCore.setPageStart.bind(unbxdCore);
- const getPaginationInfo = unbxdCore.getPaginationInfo.bind(unbxdCore);
- const getResults = unbxdCore.getResults.bind(unbxdCore);
-
- //Get next page method
- const getNextPage = () => {
-
- const { currentPage } = getPaginationInfo();
- const newStart = currentPage === 0 ? pageSize : (currentPage * pageSize);
- setPageStart(newStart);
- getResults();
- console.log("called getNextPage")
- }
-
- const onProductClick = (event) => {
- console.log("Click event on product ", event.target.dataset.uniqueid)
- }
-
- //onClick for products
- const getProductsProp = ({ onClick, ...props }) => ({
- onClick: () => {
- onProductClick();
- onClick();
- },
- getSearchResults,
- getNextPage,
- ...props
- })
-
- const helpers = {
- onViewToggle: this.onViewToggle,
- getSearchResults,
- getNextPage,
- onProductClick
- }
-
- const getProps = () => ({ ...this.state, ...helpers })
-
- const DefaultRender =
-
-
-
-
- return (
- {conditionalRenderer(this.props.children, {
- state: this.state,
- getProductsProp,
- }, DefaultRender)}
- )
- }
- }
- )
+ const DefaultRender =
+
+
+
+
+ return (
+ {conditionalRenderer(this.props.children, this.getProductProps(), DefaultRender)}
+ )
}
}
diff --git a/src/modules/Products/ProductsView.js b/src/modules/Products/ProductsView.js
index 4839f4b3..53e08b9b 100644
--- a/src/modules/Products/ProductsView.js
+++ b/src/modules/Products/ProductsView.js
@@ -8,7 +8,10 @@ import ProductsWrapper from './ProductsWrapper';
const ProductsView = () => {
- return ({({ productViewType, getSearchResults, ZeroResultsComponent, ...props }) => {
+ return ({({ data, helpers }) => {
+
+ const { productViewType, productMap, perRow, productVariantMap, paginationType, heightDiffToTriggerNextPage } = data;
+ const { getSearchResults, ZeroResultsComponent, onProductClick, getNextPage } = helpers;
const { numberOfProducts = 0, products = [] } = getSearchResults() || {};
@@ -23,7 +26,17 @@ const ProductsView = () => {
return ;
}
- return ()
+ return ()
}}
);
diff --git a/src/modules/Products/ViewTypes.js b/src/modules/Products/ViewTypes.js
index fde62867..9deed8a8 100644
--- a/src/modules/Products/ViewTypes.js
+++ b/src/modules/Products/ViewTypes.js
@@ -5,7 +5,10 @@ import { productViewTypes as productViewTypesOptions } from './utils'
import { getProductViewType } from './utils'
const ViewTypes = () => {
- return ({({ productViewTypes, productViewType, onViewToggle }) => {
+ return ({({ data, helpers }) => {
+
+ const { productViewTypes, productViewType } = data;
+ const { onViewToggle } = helpers;
const validViewTypes = getProductViewType(productViewTypes);