META-INF.resources.js.components.DiagramFooter.js Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of com.liferay.commerce.shop.by.diagram.web

Liferay Commerce Shop by Diagram Web

The newest version!

/**
 * 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 ClayButton, {ClayButtonWithIcon} from '@clayui/button';
import {ClaySelect} from '@clayui/form';
import ClayIcon from '@clayui/icon';
import {ManagementToolbar} from 'frontend-js-components-web';
import React, {useMemo} from 'react';

import {ZOOM_STEP, ZOOM_VALUES} from '../utilities/constants';

function DiagramFooter({
	chartInstance,
	currentZoom,
	expanded,
	updateCurrentZoom,
	updateExpanded,
}) {
	function _handleZoomUpdate(value) {
		chartInstance.current?.updateZoom(value);

		updateCurrentZoom(value);
	}

	const zoomValues = useMemo(() => {
		return ZOOM_VALUES.includes(currentZoom)
			? ZOOM_VALUES
			: ZOOM_VALUES.concat(currentZoom).sort();
	}, [currentZoom]);

	return (
		
			
				
					
						 updateExpanded(!expanded)}
						>
							
								
							

							{expanded
								? Liferay.Language.get('compress')
								: Liferay.Language.get('expand')}
						
					

					
						 {
								let newZoom = currentZoom - ZOOM_STEP;

								if (!ZOOM_VALUES.includes(currentZoom)) {
									newZoom =
										zoomValues[
											zoomValues.indexOf(currentZoom) - 1
										];
								}

								_handleZoomUpdate(newZoom);
							}}
							symbol="hr"
						/>
					

					
						 {
								_handleZoomUpdate(Number(event.target.value));
							}}
							value={currentZoom}
						>
							{zoomValues.map((value) => (
								
							))}
						
					

					
						=
								ZOOM_VALUES[ZOOM_VALUES.length - 1]
							}
							displayType="secondary"
							monospaced
							onClick={() => {
								let newZoom = currentZoom + ZOOM_STEP;

								if (!ZOOM_VALUES.includes(currentZoom)) {
									newZoom =
										zoomValues[
											zoomValues.indexOf(currentZoom) + 1
										];
								}

								_handleZoomUpdate(newZoom);
							}}
							symbol="plus"
						/>
					
				
			
		
	);
}

export default DiagramFooter;