META-INF.resources.js.components.ObjectDetails.ScopeContainer.tsx Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of com.liferay.object.web
Liferay Object 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 {Option} from '@clayui/core';
import ClayDropDown from '@clayui/drop-down';
import {FormError, SingleSelect} from '@liferay/object-js-components-web';
import React, {useEffect, useState} from 'react';

import {Scope} from './EditObjectDetails';

const SCOPE_OPTIONS = [
	{
		label: Liferay.Language.get('company'),
		value: 'company',
	},
	{
		label: Liferay.Language.get('site'),
		value: 'site',
	},
];

interface ScopeContainerProps {
	className?: string;
	companies: Scope[];
	errors: FormError;
	hasUpdateObjectDefinitionPermission: boolean;
	isApproved: boolean;
	isLinkedObjectDefinition?: boolean;
	isRootDescendantNode: boolean;
	onSubmit?: (editedObjectDefinition?: Partial) => void;
	setValues: (values: Partial) => void;
	sites: Scope[];
	values: Partial;
}

export function ScopeContainer({
	className,
	companies,
	errors,
	hasUpdateObjectDefinitionPermission,
	isApproved,
	isLinkedObjectDefinition,
	isRootDescendantNode,
	onSubmit,
	setValues,
	sites,
	values,
}: ScopeContainerProps) {
	const [selectedPanelCategoryValue, setSelectedPanelCategoryValue] =
		useState('');

	const setPanelCategoryKey = (
		sites: Scope[],
		panelCategoryValue: string
	) => {
		let selectedPanelCategory: string = '';

		sites.find(({items}) =>
			items.find(({value}) => {
				if (value === panelCategoryValue) {
					selectedPanelCategory = value;

					return true;
				}
			})
		);

		setSelectedPanelCategoryValue(selectedPanelCategory);
	};

	useEffect(() => {
		setPanelCategoryKey(
			values.scope === 'company' ? companies : sites,
			values.panelCategoryKey as string
		);

		// eslint-disable-next-line react-hooks/exhaustive-deps
	}, [values.id, values.scope, companies, sites]);

	return (
		<>
			
				className={className}
				disabled={
					isApproved ||
					!hasUpdateObjectDefinitionPermission ||
					values.storageType === 'salesforce' ||
					isRootDescendantNode ||
					isLinkedObjectDefinition
				}
				error={errors.titleObjectFieldId}
				id="lfr-objects__object-scope-container-scope"
				items={SCOPE_OPTIONS}
				label={Liferay.Language.get('scope')}
				onSelectionChange={(value) => {
					setValues({
						panelCategoryKey: '',
						scope: value as string,
					});

					if (onSubmit) {
						onSubmit({
							...values,
							panelCategoryKey: '',
							scope: value as string,
						});
					}

					setSelectedPanelCategoryValue('');
				}}
				selectedKey={values.scope}
			/>

			 {
					setValues({
						panelCategoryKey: value as string,
					});

					if (onSubmit) {
						onSubmit({
							...values,
							panelCategoryKey: value as string,
						});
					}

					setSelectedPanelCategoryValue(value as string);
				}}
				selectedKey={selectedPanelCategoryValue}
			>
				{(group) => (
					
						{(item) => (
							
						)}
					
				)}
			
		
	);
}