@shopgate/engage/product/components/ProductProperties/Content.js

Shopgate's ENGAGE library.

import React, { useMemo } from 'react';
import PropTypes from 'prop-types';
import { isBeta } from '@shopgate/engage/core/helpers';
import { getGroupsFromProperties } from "./helpers/getGroupsFromProperties";
import GroupedProperties from "./GroupedProperties";
import Wrapper from "./Wrapper";
import Rows from "./Rows";
import { groupsContainer } from "./style";

/**
 * @param {Object} props The component props.
 * @returns {JSX}
 */
import { jsx as _jsx } from "react/jsx-runtime";
const Content = ({
  properties
}) => {
  const groups = useMemo(() => getGroupsFromProperties(properties), [properties]);
  if (!properties) {
    return null;
  }

  // Display the simple properties if no groups exist or if not in beta mode.
  if (!isBeta() || !groups || groups.length === 0) {
    return /*#__PURE__*/_jsx(Wrapper, {
      children: /*#__PURE__*/_jsx(Rows, {
        properties: properties
      })
    });
  }

  /*
    This feature is currently in BETA testing.
    It should only be used for approved BETA Client Projects
  */
  return /*#__PURE__*/_jsx("div", {
    className: `${groupsContainer} engage__product__product-properties`,
    children: /*#__PURE__*/_jsx(GroupedProperties, {
      groups: groups
    })
  });
};
Content.defaultProps = {
  properties: null
};
export default Content;