PWA-970 Added new category selectors. Converted list component to be …

libraries/commerce/category/selectors/index.js

@@ -105,6 +105,17 @@ export const getCurrentCategoryChildCount = createSelector(
   category => (category ? category.childrenCount : null)
 );
 
+/**
+ * Returns true when the given category id contains children.
+ * @param {Object} state The application state.
+ * @param {Object} props The component props.
+ * @returns {boolean}
+ */
+export const hasChildren = createSelector(
+  getCurrentCategoryChildCount,
+  count => count > 0
+);
+
 /**
  * Retrieves the current categories collection from the state.
  * @param {Object} state The application state.
@@ -137,6 +148,17 @@ export const getCategoryProductCount = createSelector(
   }
 );
 
+/**
+ * Returns true when the given category id contains products.
+ * @param {Object} state The application state.
+ * @param {Object} props The component props.
+ * @returns {boolean}
+ */
+export const hasProducts = createSelector(
+  getCategoryProductCount,
+  count => count > 0
+);
+
 export const getChildCategoriesById = createSelector(
   getCategoriesState,
   getChildCategoriesState,

libraries/common/components/List/__snapshots__/spec.jsx.snap

@@ -2,7 +2,7 @@
 
 exports[`<List /> renders with children 1`] = `
 <ul
-  className="css-gkw1j5 "
+  className=""
 >
   <ListItem
     className={null}
@@ -24,6 +24,6 @@ exports[`<List /> renders with children 1`] = `
 
 exports[`<List /> renders without children 1`] = `
 <ul
-  className="css-gkw1j5 "
+  className=""
 />
 `;

libraries/common/components/List/index.jsx

@@ -1,42 +1,25 @@
-import React, { Component } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import ListItem from './components/Item';
-import styles from './style';
 
 /**
- * The list component.
- * @param {Object} props - The component props.
- * @param {React.Children} props.children - Some content to display inside.
+ * The List component.
+ * @param {Object} props The component props.
+ * @returns {JSX}
  */
-class List extends Component {
-  static Item = ListItem;
+const List = ({ children, className }) => (
+  <ul className={className}>{children}</ul>
+);
 
-  static propTypes = {
-    className: PropTypes.string,
-  };
+List.Item = ListItem;
 
-  static defaultProps = {
-    className: '',
-  };
+List.propTypes = {
+  children: PropTypes.node.isRequired,
+  className: PropTypes.oneOfType([PropTypes.string, PropTypes.shape()]),
+};
 
-  /**
-   * Composes the props.
-   * @returns {Object} The composed props.
-   */
-  getProps() {
-    return {
-      ...this.props,
-      className: `${styles} ${this.props.className}`,
-    };
-  }
-
-  /**
-   * Renders the component.
-   * @returns {JSX}
-   */
-  render() {
-    return React.createElement('ul', this.getProps());
-  }
-}
+List.defaultProps = {
+  className: '',
+};
 
 export default List;