META-INF.resources.components.mini_cart.CartItemViews.ItemInfoView.js Maven / Gradle / Ivy

Go to download
/**
 * SPDX-FileCopyrightText: (c) 2000 Liferay, Inc. https://liferay.com
 * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
 */

import ClayIcon from '@clayui/icon';
import ClayLabel from '@clayui/label';
import ClayPanel from '@clayui/panel';
import {ClayTooltipProvider} from '@clayui/tooltip';
import {sub} from 'frontend-js-web';
import PropTypes from 'prop-types';
import React, {useState} from 'react';

import {parseValue} from '../util/index';

function ItemInfoViewBundle({childItems, options}) {
	const [expanded, setExpanded] = useState(false);

	return options.length >= 1 ? (
		 {
				setExpanded(expanded);
			}}
			showCollapseIcon
		>
			
				
					{options.map((option, index) => {
						const {
							skuId,
							skuOptionName,
							skuOptionValueNames,
							value,
						} = option;

						const childItem = (childItems || []).find(
							(childItem) =>
								childItem.skuId === parseInt(skuId, 10)
						);

						const {name, quantity, skuUnitOfMeasure} =
							childItem || {};

						return name ? (
							
								
									{skuOptionName}
								

								
									
										
											{parseValue(skuOptionValueNames) ||
												parseValue(value)}
										

										
											{`(${quantity} \u00D7 ${name} ${
												skuUnitOfMeasure?.key || ''
											})`}
										
									
								
							
						) : (
							
								
									{skuOptionName}
								

								
									{parseValue(skuOptionValueNames) ||
										parseValue(value)}
								
							
						);
					})}
				
			
		
	) : (
		
			{childItems.map((item, index) => {
				const {name, quantity, skuUnitOfMeasure} = item;

				return (
					
						
							<>
								{quantity} × {name}
							
							<> {skuUnitOfMeasure?.key || ''}
						
					
				);
			})}
		
	);
}

function ItemInfoViewReplacement({replacedSku}) {
	return (
		
			
				{Liferay.Language.get('replacement')}
			

			
				
					
				
			
		
	);
}

function ItemInfoViewBase({name, sku}) {
	return (
		
			{name}

			{sku}
		
	);
}

function ItemInfoView({childItems = [], name, options = [], replacedSku, sku}) {
	const hasReplacement = !!replacedSku;

	return (
		<>
			

			{hasReplacement && (
				
			)}

			
		
	);
}

ItemInfoView.propTypes = {
	childItems: PropTypes.array,
	name: PropTypes.string.isRequired,
	options: PropTypes.array,
	sku: PropTypes.string.isRequired,
};

export default ItemInfoView;