Refactoring and bug fixes

Author: webdevstar

locales/admin/en.json

@@ -65,9 +65,8 @@
   "products_preorder": "Pre-order",
   "products_inStock": "In stock",
   "products_stockStatus": "Stock status",
-  "products_onlyEnabled": "Only enabled",
-  "products_onlyDiscontinued": "Only discontinued",
-  "products_onlyOnSale": "Only on sale",
+  "products_discontinued": "Discontinued",
+  "products_onSale": "On sale",
   "products_search": "Search products",
   "products_aboutDelete": "{count} products is about to be permanently deleted. You can’t undo this action.",
   "products_regularPrice": "Regular price",

src/admin/client/layouts/products/index.js

@@ -6,7 +6,7 @@ import Categories from 'modules/product-categories/list';
 export default () => (
   <div className="row row--no-gutter col-full-height">
     <div className="col-xs-3 col--no-gutter scroll col-categories">
-      <Categories showAll={true} showAdd={false} opened={false}/>
+      <Categories showAll={true}/>
       <ProductsFilter />
     </div>
     <div className="col-xs-9 col--no-gutter scroll">

src/admin/client/lib/helper.js

@@ -1,4 +1,4 @@
-const formatNumber = (number = 0, settings) => {
+export const formatNumber = (number = 0, settings) => {
   const x = 3;
 
   const re = '\\d(?=(\\d{' + x + '})+' + (settings.decimal_number > 0
@@ -13,11 +13,16 @@ const formatNumber = (number = 0, settings) => {
 };
 
 const amountPattern = '{amount}';
-const formatCurrency = (number = 0, settings) => {
+export const formatCurrency = (number = 0, settings) => {
   return settings.currency_format.replace(amountPattern, formatNumber(number, settings));
 }
 
-module.exports = {
-  formatNumber,
-  formatCurrency
-};
+export const getThumbnailUrl = (originalUrl, width) => {
+  if(originalUrl && originalUrl.length > 0) {
+    const pos = originalUrl.lastIndexOf('/');
+    const thumbnailUrl = originalUrl.substring(0, pos) + `/${width}/` + originalUrl.substring(pos + 1);
+    return thumbnailUrl;
+  } else {
+    return '';
+  }
+}

src/admin/client/modules/customers/list/components/item.js

@@ -5,7 +5,7 @@ import { ListItem } from 'material-ui/List';
 import Divider from 'material-ui/Divider';
 import FontIcon from 'material-ui/FontIcon';
 import messages from 'lib/text'
-import helper from 'lib/helper'
+import * as helper from 'lib/helper'
 import style from './style.css'
 
 const CustomersListItem = ({ customer, onSelect, selected, settings }) => {

src/admin/client/modules/orders/list/components/item.js

@@ -5,7 +5,7 @@ import { ListItem } from 'material-ui/List';
 import Divider from 'material-ui/Divider';
 import FontIcon from 'material-ui/FontIcon';
 import messages from 'lib/text'
-import helper from 'lib/helper'
+import * as helper from 'lib/helper'
 import style from './style.css'
 import moment from 'moment';
 

src/admin/client/modules/product-categories/components/list.js

@@ -45,7 +45,7 @@ export default class Categories extends React.Component {
       nestedItems={this.getChildren(selectedId, allItems, item.id, opened)}
       leftIcon={<FontIcon className="material-icons">{item.enabled ? 'folder' : 'visibility_off'}</FontIcon>}
       onTouchTap={() => { this.props.onSelect(item.id) }}
-           />
+     />
   }
 
   getChildren(selectedId, allItems, id, opened){
@@ -62,10 +62,11 @@ export default class Categories extends React.Component {
     	selectedId,
     	items,
       onCreate,
-    	showAll,
-      showRoot,
-      showAdd,
-      opened = true
+    	showAll = false,
+      showRoot = false,
+      showAdd = false,
+      rootName = messages.productCategories_root,
+      opened = false
     } = this.props;
 
 
@@ -76,7 +77,7 @@ export default class Categories extends React.Component {
         <List>
           {showRoot &&
             <ListItem
-              primaryText={messages.productCategories_root}
+              primaryText={rootName}
               style={'root' === selectedId ? styles.selectedItem : styles.item}
               innerDivStyle={styles.innerItem}
               leftIcon={<FontIcon className="material-icons">home</FontIcon>}

src/admin/client/modules/products/actionTypes.js

@@ -10,11 +10,7 @@ export const PRODUCT_DETAIL_ERASE = 'PRODUCT_DETAIL_ERASE'
 export const PRODUCTS_MORE_REQUEST = 'PRODUCTS_MORE_REQUEST'
 export const PRODUCTS_MORE_RECEIVE = 'PRODUCTS_MORE_RECEIVE'
 
-export const PRODUCTS_FILTER_SET_SEARCH = 'PRODUCTS_FILTER_SET_SEARCH'
-export const PRODUCTS_FILTER_SET_ENABLED = 'PRODUCTS_FILTER_SET_ENABLED'
-export const PRODUCTS_FILTER_SET_DISCONTINUED = 'PRODUCTS_FILTER_SET_DISCONTINUED'
-export const PRODUCTS_FILTER_SET_ONSALE = 'PRODUCTS_FILTER_SET_ONSALE'
-export const PRODUCTS_FILTER_SET_STOCK = 'PRODUCTS_FILTER_SET_STOCK'
+export const PRODUCTS_SET_FILTER = 'PRODUCTS_SET_FILTER'
 
 export const PRODUCTS_SELECT = 'PRODUCTS_SELECT'
 export const PRODUCTS_DESELECT = 'PRODUCTS_DESELECT'

src/admin/client/modules/products/actions.js

@@ -42,17 +42,21 @@ function requestMoreProducts() {
   }
 }
 
-function receiveProductsMore(items) {
+function receiveProductsMore({ has_more, total_count, data }) {
   return {
     type: t.PRODUCTS_MORE_RECEIVE,
-    items
+    has_more,
+    total_count,
+    data
   }
 }
 
-function receiveProducts(items) {
+function receiveProducts({ has_more, total_count, data }) {
   return {
     type: t.PRODUCTS_RECEIVE,
-    items
+    has_more,
+    total_count,
+    data
   }
 }
 
@@ -89,38 +93,10 @@ export function selectAllProduct() {
   }
 }
 
-export function setFilterSearch(value) {
+export function setFilter(filter) {
   return {
-    type: t.PRODUCTS_FILTER_SET_SEARCH,
-    search: value
-  }
-}
-
-export function setFilterStock(value) {
-  return {
-    type: t.PRODUCTS_FILTER_SET_STOCK,
-    stock_status: value
-  }
-}
-
-export function setFilterEnabled(value) {
-  return {
-    type: t.PRODUCTS_FILTER_SET_ENABLED,
-    enabled: value
-  }
-}
-
-export function setFilterDiscontinued(value) {
-  return {
-    type: t.PRODUCTS_FILTER_SET_DISCONTINUED,
-    discontinued: value
-  }
-}
-
-export function setFilterOnSale(value) {
-  return {
-    type: t.PRODUCTS_FILTER_SET_ONSALE,
-    on_sale: value
+    type: t.PRODUCTS_SET_FILTER,
+    filter: filter
   }
 }
 
@@ -162,49 +138,49 @@ function successCreateProduct(id) {
   }
 }
 
-export function fetchProducts() {
-  return (dispatch, getState) => {
-    const state = getState();
-    if (!state.products.isFetching) {
-      dispatch(requestProducts());
-      dispatch(deselectAllProduct());
-
-      let filter = { limit: 20, fields: 'id,name,category_id,category_name,sku,images,enabled,discontinued,stock_status,stock_quantity,price,on_sale,regular_price' };
-      filter.search = state.products.filter_search;
+const getFilter = (state, offset = 0) => {
+  let filter = {
+    limit: 50,
+    fields: 'id,name,category_id,category_name,sku,images,enabled,discontinued,stock_status,stock_quantity,price,on_sale,regular_price',
+    search: state.products.filter.search,
+    offset: offset
+  }
 
-      if(state.products.filter_stock_status && state.products.filter_stock_status !== 'all') {
-        filter.stock_status = state.products.filter_stock_status;
-      }
+  if(state.productCategories.selectedId !== null && state.productCategories.selectedId !== 'all') {
+    filter.category_id = state.productCategories.selectedId;
+  }
 
-      if(state.productCategories.selectedId) {
-        filter.category_id = state.productCategories.selectedId;
-      }
+  if(state.products.filter.stockStatus !== null) {
+    filter.stock_status = state.products.filter.stockStatus;
+  }
 
-      if(state.products.filter_enabled) {
-        filter.enabled = true;
-      }
+  if(state.products.filter.enabled !== null) {
+    filter.enabled = state.products.filter.enabled;
+  }
 
-      if(state.products.filter_discontinued) {
-        filter.discontinued = true;
-      }
+  if(state.products.filter.discontinued !== null) {
+    filter.discontinued =  state.products.filter.discontinued;
+  }
 
-      if(state.products.filter_on_sale) {
-        filter.on_sale = true;
-      }
+  if(state.products.filter.onSale !== null) {
+    filter.on_sale = state.products.filter.onSale;
+  }
 
-      return api.products.list(filter)
-        .then(({status, json}) => {
-          let products = json.data;
+  return filter;
+}
 
-          products = product.sort((a,b) => (a.position - b.position ));
+export function fetchProducts() {
+  return (dispatch, getState) => {
+    const state = getState();
+    if (!state.products.loadingItems) {
+      dispatch(requestProducts());
+      dispatch(deselectAllProduct());
 
-          products.forEach((element, index, theArray) => {
-            if(theArray[index].name === '') {
-              theArray[index].name = `<${messages.draft}>`;
-            }
-          })
+      let filter = getFilter(state);
 
-          dispatch(receiveProducts(products))
+      return api.products.list(filter)
+        .then(({status, json}) => {
+          dispatch(receiveProducts(json))
         })
         .catch(error => {
             dispatch(receiveProductsError(error));
@@ -216,49 +192,19 @@ export function fetchProducts() {
 export function fetchMoreProducts() {
   return (dispatch, getState) => {
     const state = getState();
-    dispatch(requestMoreProducts());
-
-    let filter = { limit: 50, fields: 'id,name,category_id,category_name,sku,images,enabled,discontinued,stock_status,stock_quantity,price,on_sale,regular_price' };
-    filter.offset = state.products.items.length;
-    filter.search = state.products.filter_search;
-
-    if(state.products.filter_stock_status && state.products.filter_stock_status !== 'all') {
-      filter.stock_status = state.products.filter_stock_status;
-    }
+    if (!state.products.loadingItems) {
+      dispatch(requestMoreProducts());
 
-    if(state.productCategories.selectedId) {
-      filter.category_id = state.productCategories.selectedId;
-    }
-
-    if(state.products.filter_enabled) {
-      filter.enabled = true;
-    }
+      let filter = getFilter(state, state.products.items.length);
 
-    if(state.products.filter_discontinued) {
-      filter.discontinued = true;
-    }
-
-    if(state.products.filter_on_sale) {
-      filter.on_sale = true;
-    }
-
-    return api.products.list(filter)
-      .then(({status, json}) => {
-        let products = json.data;
-
-        products = products.sort((a,b) => (a.position - b.position ));
-
-        products.forEach((element, index, theArray) => {
-          if(theArray[index].name === '') {
-            theArray[index].name = `<${messages.draft}>`;
-          }
+      return api.products.list(filter)
+        .then(({status, json}) => {
+          dispatch(receiveProductsMore(json))
         })
-
-        dispatch(receiveProductsMore(products))
-      })
-      .catch(error => {
-          dispatch(receiveProductsError(error));
-      });
+        .catch(error => {
+            dispatch(receiveProductsError(error));
+        });
+    }
   }
 }