META-INF.resources.js.components.ObjectDetails.EntryDisplayContainer.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 {
	FormError,
	SingleSelect,
	stringUtils,
} from '@liferay/object-js-components-web';
import React, {useEffect, useMemo} from 'react';

interface EntryDisplayContainerProps {
	className?: string;
	errors: FormError;
	isLinkedObjectDefinition?: boolean;
	nonRelationshipObjectFieldsInfo: {
		label: LocalizedValue;
		name: string;
	}[];
	objectFields: ObjectField[];
	onSubmit?: (editedObjectDefinition?: Partial) => void;
	setValues: (values: Partial) => void;
	values: Partial;
}

export function EntryDisplayContainer({
	className,
	errors,
	isLinkedObjectDefinition,
	nonRelationshipObjectFieldsInfo,
	objectFields,
	onSubmit,
	setValues,
	values,
}: EntryDisplayContainerProps) {
	const titleFieldOptions = useMemo(() => {
		return nonRelationshipObjectFieldsInfo?.map(({label, name}) => {
			return {
				label: stringUtils.getLocalizableLabel({
					fallbackLabel: name,
					fallbackLanguageId:
						values.defaultLanguageId as Liferay.Language.Locale,
					labels: label,
				}),
				value: name,
			};
		});
	}, [nonRelationshipObjectFieldsInfo, values.defaultLanguageId]);

	useEffect(() => {
		const titleObjectField = objectFields.find(
			(objectField) => objectField.name === values.titleObjectFieldName
		);

		if (!titleObjectField) {
			const idField = objectFields.find((field) => field.name === 'id');

			setValues({titleObjectFieldName: idField?.name});
		}

		// eslint-disable-next-line react-hooks/exhaustive-deps
	}, []);

	return (
		
			className={className}
			disabled={isLinkedObjectDefinition}
			error={errors.titleObjectFieldId}
			id="lfr-objects__object-display-container-entry-title-field"
			items={titleFieldOptions}
			label={Liferay.Language.get('entry-title-field')}
			onSelectionChange={(itemKey) => {
				const field = objectFields.find(({name}) => name === itemKey);

				setValues({
					titleObjectFieldName: field?.name,
				});

				if (onSubmit) {
					onSubmit({
						...values,
						titleObjectFieldName: field?.name,
					});
				}
			}}
			selectedKey={values.titleObjectFieldName}
		/>
	);
}